Improved nav

src/app/server/[ip]/page.tsx

@@ -37,6 +37,7 @@ export default function Server() {
   );
 
   useEffect(() => {
+    app.setServer(server);
     const channelId = searchParams.get("ch");
     if (channelId) {
       app.setCurrentChannel(

src/components/app/SidebarChannels.tsx

@@ -21,6 +21,11 @@ export function ChannelItem({ channel, app }: { channel: Channel; app: App }) {
     <Card
       className="p-2 flex flex-row px-3 items-center gap-2 cursor-pointer hover:bg-accent"
       onClick={() => {
+        window.history.replaceState(
+          null,
+          "",
+          `/server/${app.server?.id}?ch=${channel.id}`
+        );
         app.setCurrentChannel(channel);
         app.setSidebarOpen(false);
       }}

src/hooks/use-app.ts

@@ -19,6 +19,7 @@ export default function useApp(): App {
   const [dms, setDms] = useState<UserProfile[]>([]);
   const [servers, setServers] = useState<StringMap<Server>>({});
   const [currentChannel, setCurrentChannel] = useState<Channel | null>(null);
+  const [server, setServer] = useState<Server>();
 
   useEffect(() => {
     const stored = Cookies.get("servers");
@@ -39,6 +40,8 @@ export default function useApp(): App {
   return {
     currentChannel,
     setCurrentChannel,
+    server,
+    setServer,
     servers,
     setServers,
     dms,

src/types/app.ts

@@ -10,6 +10,9 @@ export default interface App {
   node: RefObject<WebSocket | null>;
   profile: UserProfile | null;
 
+  server: Server | undefined;
+  setServer: SetState<Server | undefined>;
+
   clientSettings: ClientSettings;
   setClientSettings: SetState<ClientSettings>;