Fixed settings stuff

src/app/api/profile/route.ts

@@ -19,7 +19,14 @@ export async function POST(req: NextRequest) {
       { status: StatusCodes.BAD_REQUEST }
     );
 
-  if (!username || !display_name || !avatar_url)
+  if (
+    !username ||
+    !display_name ||
+    avatar_url === undefined ||
+    avatar_url === null ||
+    node_address === undefined ||
+    node_address === null
+  )
     return NextResponse.json(
       {
         message:

src/components/Sidebar.tsx

@@ -36,6 +36,7 @@ import Link from "next/link";
 import { get, Response } from "@/lib/request";
 import { cn } from "@/lib/utils";
 import App from "@/types/app";
+import { ProfileSettings } from "@/types/settings";
 
 export default function AppSidebar({
   children,
@@ -201,7 +202,7 @@ export default function AppSidebar({
           </Dialog>
 
           <footer className="mt-auto">
-            <SettingsDialog />
+            <SettingsDialog profile={app.profile as ProfileSettings} />
           </footer>
         </div>
 
@@ -243,6 +244,7 @@ export default function AppSidebar({
                           ?.avatar_url || ""
                       }
                       key={id}
+                      app={app}
                     />
                   ))}
                 </>
@@ -256,6 +258,7 @@ export default function AppSidebar({
               id={app.profile?.id || "me"}
               avatar={app.profile?.avatar_url || ""}
               status="online"
+              app={app}
               settings
             />
           </footer>
@@ -283,12 +286,14 @@ function DMItem({
   avatar,
   status,
   settings,
+  app,
 }: {
   name: string;
   id: string;
   avatar: string;
   status: string;
   settings?: boolean;
+  app: App;
 }) {
   return (
     <Link
@@ -304,6 +309,7 @@ function DMItem({
         <SettingsDialog
           className="ml-auto w-7 h-7 p-0 flex items-center justify-center"
           tab="profile"
+          profile={app.profile as ProfileSettings}
         />
       )}
     </Link>
@@ -332,10 +338,12 @@ function ChannelIcon({ kind }: { kind: "text" | "voice" }) {
 
 function getUser(
   id: string,
-  userList: StringMap<UserProfile>,
-  setUserList: React.Dispatch<React.SetStateAction<StringMap<UserProfile>>>
+  userList: StringMap<UserProfile | null>,
+  setUserList: React.Dispatch<
+    React.SetStateAction<StringMap<UserProfile | null>>
+  >
 ) {
-  if (userList[id]) return userList[id];
+  if (userList[id] !== undefined) return userList[id];
 
   const onResponse = (res: Response<UserProfile>) => {
     setUserList((prev) => {
@@ -346,5 +354,10 @@ function getUser(
 
   get(`/api/profile/?id=${id}`, onResponse)
     ?.then(onResponse)
-    .catch((e) => {});
+    .catch((e) => {
+      setUserList((prev) => {
+        prev[id] = null;
+        return prev;
+      });
+    });
 }

src/components/settings/Settings.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import { useClientSettings } from "@/hooks/use-settings";
 import { setClientSettings } from "@/lib/clientSettings";
 import SettingSchema from "./SettingSchema";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
@@ -11,19 +10,20 @@ import {
   CLIENT_SCHEMA,
   ProfileSettings,
 } from "@/types/settings";
-import { useParams, useRouter, useSearchParams } from "next/navigation";
+import { useRouter } from "next/navigation";
 import axios from "axios";
+import { useClientSettings } from "@/hooks/use-settings";
+import { useState } from "react";
 
 export default function Settings({
   tab,
-  profileSettings,
-  setProfileSettings,
+  profileSettings: ps,
 }: {
   tab?: string;
   profileSettings: ProfileSettings;
-  setProfileSettings: React.Dispatch<React.SetStateAction<ProfileSettings>>;
 }) {
   const [settings, setSettings] = useClientSettings();
+  const [profileSettings, setProfileSettings] = useState<ProfileSettings>(ps);
   const router = useRouter();
 
   return (

src/components/settings/SettingsDialog.tsx

@@ -3,7 +3,6 @@ import { Button } from "../ui/button";
 import {
   Dialog,
   DialogContent,
-  DialogDescription,
   DialogHeader,
   DialogTitle,
   DialogTrigger,
@@ -11,18 +10,17 @@ import {
 import { cn } from "@/lib/utils";
 import Settings from "./Settings";
 import { ProfileSettings } from "@/types/settings";
-import { useProfileSettings } from "@/hooks/use-settings";
+import { useState } from "react";
 
 export default function SettingsDialog({
   className,
   tab,
+  profile,
 }: {
   className?: string;
   tab?: string;
-  profile?: ProfileSettings;
+  profile: ProfileSettings;
 }) {
-  const [profileSettings, setProfileSettings] = useProfileSettings();
-
   return (
     <Dialog>
       <DialogTrigger asChild>
@@ -41,11 +39,7 @@ export default function SettingsDialog({
         </DialogHeader>
 
         <div className="w-full">
-          <Settings
-            tab={tab}
-            profileSettings={profileSettings}
-            setProfileSettings={setProfileSettings}
-          />
+          <Settings tab={tab} profileSettings={profile} />
         </div>
       </DialogContent>
     </Dialog>

src/hooks/use-app.ts

@@ -6,7 +6,7 @@ import useUser, { UserProfile } from "./get-user";
 
 export default function useApp(): App {
   const node = useRef<WebSocket | null>(null);
-  const [profiles, setProfiles] = useState<StringMap<UserProfile>>({});
+  const [profiles, setProfiles] = useState<StringMap<UserProfile | null>>({});
   const { messages, addMessage } = useMessages();
   const [sidebarOpen, setSidebarOpen] = useState(true);
   const profile = useUser();

src/hooks/use-settings.ts

@@ -1,8 +1,7 @@
 "use client";
 
 import { defaultSettings, getClientSettings } from "@/lib/clientSettings";
-import { ProfileSettings, ClientSettings } from "@/types/settings";
-import axios from "axios";
+import { ClientSettings } from "@/types/settings";
 import { Dispatch, SetStateAction, useEffect, useState } from "react";
 
 export function useClientSettings(): [
@@ -17,30 +16,3 @@ export function useClientSettings(): [
 
   return [settings, setSettings];
 }
-
-export function useProfileSettings(): [
-  ProfileSettings,
-  Dispatch<SetStateAction<ProfileSettings>>
-] {
-  const [settings, setSettings] = useState<ProfileSettings>({
-    node_address: "",
-    username: "",
-    display_name: "",
-    avatar_url: "",
-  });
-
-  useEffect(() => {
-    async function fetchProfileSettings() {
-      try {
-        const res = await axios.get("/api/profile");
-        setSettings(res.data as ProfileSettings);
-      } catch (error) {
-        console.error("Failed to fetch profile settings:", error);
-      }
-    }
-
-    fetchProfileSettings();
-  }, []);
-
-  return [settings, setSettings];
-}

src/types/app.ts

@@ -9,8 +9,8 @@ export default interface App {
   node: RefObject<WebSocket | null>;
   profile: UserProfile | null;
 
-  profiles: StringMap<UserProfile>;
-  setProfiles: SetState<StringMap<UserProfile>>;
+  profiles: StringMap<UserProfile | null>;
+  setProfiles: SetState<StringMap<UserProfile | null>>;
 
   messages: Message[];
   addMessage: (v: Message) => void;