Block editing username and avatar on DMs
This commit is contained in:
		
							
								
								
									
										28
									
								
								reminder-dashboard/src/components/Reminder/Avatar.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										28
									
								
								reminder-dashboard/src/components/Reminder/Avatar.tsx
									
									
									
									
									
										Normal 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>
 | 
				
			||||||
 | 
					    );
 | 
				
			||||||
 | 
					};
 | 
				
			||||||
@@ -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>
 | 
				
			||||||
};
 | 
					);
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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>
 | 
				
			||||||
    );
 | 
					    );
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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,
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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};
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -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
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user