fix: toasts being rerendered + navbar create link + usercombobox scroll

apps/web/src/app/(protected)/settings/channel/[channelName]/page.client.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useState } from 'react';
+import { useState, useCallback } from 'react';
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { Badge } from '@/components/ui/badge';
@@ -81,6 +81,18 @@ export default function ChannelSettingsClient({
   const channelList = useOwnedChannels();
   const router = useRouter();
 
+  const handleStreamInfoActionComplete = useCallback((result: any) => {
+    if (result?.success) {
+      toast.success('Stream information updated');
+    }
+  }, []);
+
+  const handleChannelSettingsActionComplete = useCallback((result: any) => {
+    if (result?.success) {
+      toast.success('Channel settings updated successfully');
+    }
+  }, []);
+
   const copyStreamKey = async () => {
     if (streamKey) {
       await navigator.clipboard.writeText(streamKey);
@@ -293,11 +305,7 @@ export default function ChannelSettingsClient({
                 schemaName="updateChannelSettings"
                 action={updateChannelSettings}
                 submitText="Save Changes"
-                onActionComplete={(result: any) => {
-                  if (result?.success) {
-                    toast.success('Channel settings updated successfully');
-                  }
-                }}
+                onActionComplete={handleChannelSettingsActionComplete}
               />
 
               {false && isOwner && (
@@ -399,7 +407,7 @@ export default function ChannelSettingsClient({
                   <div className="space-y-4">
                     {channel.streamInfo.map((stream, index) => (
                       <UniversalForm
-                        key={`${stream.id}-${stream.username}-${index}`}
+                        key={stream.id}
                         fields={[
                           {
                             name: 'username',
@@ -423,11 +431,7 @@ export default function ChannelSettingsClient({
                         schemaName="streamInfoEdit"
                         action={editStreamInfo}
                         submitText="Update Stream Info"
-                        onActionComplete={(result: any) => {
-                          if (result?.success) {
-                            toast.success('Stream information updated');
-                          }
-                        }}
+                        onActionComplete={handleStreamInfoActionComplete}
                       />
                     ))}
                   </div>
@@ -637,6 +641,7 @@ function AddManagerDialog({
           }}
           filter={existingManagers}
           value={channel}
+          modal
         />
         <DialogFooter>
           <Button

apps/web/src/components/app/NavBar/NavBar.tsx

@@ -69,6 +69,9 @@ export default function Navbar(props: Props) {
                   <Link href={`/settings/follows`}>
                     <DropdownMenuItem className="cursor-pointer">Follows</DropdownMenuItem>
                   </Link>
+                  <Link href={`/create`}>
+                    <DropdownMenuItem className="cursor-pointer">Create channel</DropdownMenuItem>
+                  </Link>
                 </DropdownMenuGroup>
                 <DropdownMenuSeparator />
                 <DropdownMenuGroup>

apps/web/src/components/app/UserCombobox/UserCombobox.tsx

@@ -40,7 +40,7 @@ export function UserCombobox(props: Props) {
   if (!props.users && error) return <div>Error loading users</div>;
   if (!props.users && isLoading) return <div>Loading...</div>;
   return (
-    <Popover open={open} onOpenChange={setOpen}>
+    <Popover open={open} onOpenChange={setOpen} modal={props.modal}>
       <PopoverTrigger asChild>
         <Button
           variant="outline"
@@ -103,5 +103,6 @@ type Props = {
   users?: APIResponse;
   value?: string;
   filter?: string[];
+  modal?: boolean;
   onValueChange?: (value: string) => void;
 }