Block editing username and avatar on DMs

This commit is contained in:
jude
2024-03-10 19:43:57 +00:00
parent 3190738fc5
commit 63fc2cdcbc
7 changed files with 73 additions and 38 deletions

View File

@ -0,0 +1,28 @@
import { ImagePicker } from "./ImagePicker";
import { useReminder } from "./ReminderContext";
import { useGuild } from "../App/useGuild";
export const Avatar = () => {
const guild = useGuild();
const [reminder, setReminder] = useReminder();
return guild ? (
<ImagePicker
class="is-rounded avatar"
url={reminder.avatar || "/static/img/icon.png"}
alt="Image for discord avatar"
setImage={(url: string) => {
setReminder((reminder) => ({
...reminder,
avatar: url,
}));
}}
></ImagePicker>
) : (
<img
class="is-rounded avatar"
alt="Image for discord avatar"
src={"/static/img/icon.png"}
></img>
);
};

View File

@ -1,38 +1,23 @@
import { ImagePicker } from "./ImagePicker";
import { Username } from "./Username";
import { Content } from "./Content";
import { Embed } from "./Embed";
import { useReminder } from "./ReminderContext";
import { Avatar } from "./Avatar";
export const Message = () => {
const [reminder, setReminder] = useReminder();
return (
<div class="column discord-frame">
<article class="media">
<figure class="media-left">
<p class="image is-32x32 customizable">
<ImagePicker
class="is-rounded avatar"
url={reminder.avatar || "/static/img/icon.png"}
alt="Image for discord avatar"
setImage={(url: string) => {
setReminder((reminder) => ({
...reminder,
avatar: url,
}));
}}
></ImagePicker>
</p>
</figure>
<div class="media-content">
<div class="content">
<Username />
<Content />
<Embed />
</div>
export const Message = () => (
<div class="column discord-frame">
<article class="media">
<figure class="media-left">
<p class="image is-32x32 customizable">
<Avatar />
</p>
</figure>
<div class="media-content">
<div class="content">
<Username />
<Content />
<Embed />
</div>
</article>
</div>
);
};
</div>
</article>
</div>
);

View File

@ -1,9 +1,11 @@
import { useReminder } from "./ReminderContext";
import { useGuild } from "../App/useGuild";
export const Username = () => {
const guild = useGuild();
const [reminder, setReminder] = useReminder();
return (
return guild ? (
<div class="discord-message-header">
<label class="is-sr-only">Username Override</label>
<input
@ -20,5 +22,9 @@ export const Username = () => {
}}
></input>
</div>
) : (
<div class="discord-message-header">
<span class="discord-username">Reminder Bot</span>
</div>
);
};