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

View File

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

View File

@ -4,16 +4,19 @@ import { MobileSidebar } from "./MobileSidebar";
import { Brand } from "./Brand"; import { Brand } from "./Brand";
import { Wave } from "./Wave"; import { Wave } from "./Wave";
import { GuildEntry } from "./GuildEntry"; import { GuildEntry } from "./GuildEntry";
import { fetchUserGuilds, GuildInfo } from "../../api"; import { fetchUserGuilds, fetchUserInfo, GuildInfo } from "../../api";
import { TimezonePicker } from "../TimezonePicker"; import { TimezonePicker } from "../TimezonePicker";
import "./styles.scss"; import "./styles.scss";
import { Link, useLocation } from "wouter";
type ContentProps = { type ContentProps = {
guilds: GuildInfo[]; guilds: GuildInfo[];
}; };
const SidebarContent = ({ guilds }: ContentProps) => { const SidebarContent = ({ guilds }: ContentProps) => {
const guildEntries = guilds.map((guild) => <GuildEntry guild={guild}></GuildEntry>); const guildEntries = guilds.map((guild) => <GuildEntry guild={guild} />);
const [loc] = useLocation();
const { data: userInfo } = useQuery({ ...fetchUserInfo() });
return ( return (
<> <>
@ -22,6 +25,19 @@ const SidebarContent = ({ guilds }: ContentProps) => {
</a> </a>
<Wave /> <Wave />
<aside class="menu"> <aside class="menu">
<ul class="menu-list">
<li>
<Link
class={loc.startsWith("/@me") ? "is-active switch-pane" : "switch-pane"}
data-pane="guild"
href={"/@me/reminders"}
>
<>
<span class="guild-name">@{userInfo?.name || "unknown"}</span>
</>
</Link>
</li>
</ul>
<p class="menu-label">Servers</p> <p class="menu-label">Servers</p>
<ul class="menu-list guildList">{guildEntries}</ul> <ul class="menu-list guildList">{guildEntries}</ul>
<div <div

View File

@ -136,6 +136,7 @@ pub async fn initialize(
routes::dashboard::api::user::update_user_info, routes::dashboard::api::user::update_user_info,
routes::dashboard::api::user::get_user_guilds, routes::dashboard::api::user::get_user_guilds,
routes::dashboard::api::user::get_reminders, routes::dashboard::api::user::get_reminders,
routes::dashboard::api::user::edit_reminder,
routes::dashboard::api::user::create_user_reminder, routes::dashboard::api::user::create_user_reminder,
routes::dashboard::api::guild::get_guild_info, routes::dashboard::api::guild::get_guild_info,
routes::dashboard::api::guild::get_guild_channels, routes::dashboard::api::guild::get_guild_channels,

View File

@ -6,7 +6,6 @@ use rocket::{
serde::json::{json, Json}, serde::json::{json, Json},
State, State,
}; };
use serenity::client::Context;
use sqlx::{MySql, Pool}; use sqlx::{MySql, Pool};
use crate::routes::{dashboard::DeleteReminder, JsonResult}; use crate::routes::{dashboard::DeleteReminder, JsonResult};

View File

@ -57,7 +57,7 @@ pub async fn get_user_info(
let user_info = UserInfo { let user_info = UserInfo {
name: cookies name: cookies
.get_private("username") .get_private("username")
.map_or("DiscordUser#0000".to_string(), |c| c.value().to_string()), .map_or("Discord User".to_string(), |c| c.value().to_string()),
patreon: member_res.map_or(false, |member| { patreon: member_res.map_or(false, |member| {
member member
.roles .roles