feat: add TeamPage component and remove TeamDialog for improved team management interface

This commit is contained in:
Anish Sarkar 2026-05-19 11:40:06 +05:30
parent 49e1395299
commit 3b168e987d
6 changed files with 28 additions and 48 deletions

View file

@ -0,0 +1,15 @@
import { TeamContent } from "./team-content";
export default async function TeamPage({
params,
}: {
params: Promise<{ search_space_id: string }>;
}) {
const { search_space_id } = await params;
return (
<div className="w-full select-none space-y-6">
<TeamContent searchSpaceId={Number(search_space_id)} />
</div>
);
}

View file

@ -307,9 +307,9 @@ export function AgentPermissionsContent() {
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectItem value="allow">Allow run without asking</SelectItem>
<SelectItem value="ask">Ask pause for approval</SelectItem>
<SelectItem value="deny">Deny block silently</SelectItem>
<SelectItem value="allow">Allow (run without asking)</SelectItem>
<SelectItem value="ask">Ask (pause for approval)</SelectItem>
<SelectItem value="deny">Deny (block silently)</SelectItem>
</SelectContent>
</Select>
<p className="text-[11px] text-muted-foreground">

View file

@ -285,8 +285,8 @@ export function AgentStatusContent() {
</AlertTitle>
<AlertDescription>
<p>
Showing a read-only mirror of the backend's <code>AgentFeatureFlags</code>. Flip an env
var and restart the backend to change a value.
Showing a read-only mirror of the backend's <code>AgentFeatureFlags</code>. Flip an
env var and restart the backend to change a value.
</p>
</AlertDescription>
</Alert>

View file

@ -1,5 +1,3 @@
import { atom } from "jotai";
export const teamDialogAtom = atom<boolean>(false);
export const announcementsDialogAtom = atom<boolean>(false);

View file

@ -11,7 +11,7 @@ import { toast } from "sonner";
import { currentThreadAtom, resetCurrentThreadAtom } from "@/atoms/chat/current-thread.atom";
import { documentsSidebarOpenAtom } from "@/atoms/documents/ui.atoms";
import { statusInboxItemsAtom } from "@/atoms/inbox/status-inbox.atom";
import { announcementsDialogAtom, teamDialogAtom } from "@/atoms/layout/dialogs.atom";
import { announcementsDialogAtom } from "@/atoms/layout/dialogs.atom";
import { rightPanelCollapsedAtom } from "@/atoms/layout/right-panel.atom";
import { deleteSearchSpaceMutationAtom } from "@/atoms/search-spaces/search-space-mutation.atoms";
import { searchSpacesAtom } from "@/atoms/search-spaces/search-space-query.atoms";
@ -19,7 +19,6 @@ import { removeChatTabAtom, syncChatTabAtom, type Tab } from "@/atoms/tabs/tabs.
import { currentUserAtom } from "@/atoms/user/user-query.atoms";
import { ActionLogDialog } from "@/components/agent-action-log/action-log-dialog";
import { AnnouncementsDialog } from "@/components/announcements/AnnouncementsDialog";
import { TeamDialog } from "@/components/settings/team-dialog";
import {
AlertDialog,
AlertDialogAction,
@ -375,7 +374,6 @@ export function LayoutDataProvider({ searchSpaceId, children }: LayoutDataProvid
setIsCreateSearchSpaceDialogOpen(true);
}, []);
const setTeamDialogOpen = useSetAtom(teamDialogAtom);
const setAnnouncementsDialog = useSetAtom(announcementsDialogAtom);
const handleUserSettings = useCallback(() => {
@ -566,8 +564,8 @@ export function LayoutDataProvider({ searchSpaceId, children }: LayoutDataProvid
}, [router, searchSpaceId]);
const handleManageMembers = useCallback(() => {
setTeamDialogOpen(true);
}, [setTeamDialogOpen]);
router.push(`/dashboard/${searchSpaceId}/team`);
}, [router, searchSpaceId]);
const handleLogout = useCallback(async () => {
try {
@ -661,11 +659,13 @@ export function LayoutDataProvider({ searchSpaceId, children }: LayoutDataProvid
const isChatPage = pathname?.includes("/new-chat") ?? false;
const isUserSettingsPage = pathname?.includes("/user-settings") === true;
const isSearchSpaceSettingsPage = pathname?.includes("/search-space-settings") === true;
const isTeamPage = pathname?.endsWith("/team") === true;
const useWorkspacePanel =
pathname?.endsWith("/buy-more") === true ||
pathname?.endsWith("/more-pages") === true ||
isUserSettingsPage ||
isSearchSpaceSettingsPage;
isSearchSpaceSettingsPage ||
isTeamPage;
return (
<>
@ -705,12 +705,12 @@ export function LayoutDataProvider({ searchSpaceId, children }: LayoutDataProvid
isChatPage={isChatPage}
useWorkspacePanel={useWorkspacePanel}
workspacePanelViewportClassName={
isUserSettingsPage || isSearchSpaceSettingsPage
isUserSettingsPage || isSearchSpaceSettingsPage || isTeamPage
? "items-start justify-center px-6 py-8 md:px-10 md:py-10"
: undefined
}
workspacePanelContentClassName={
isUserSettingsPage || isSearchSpaceSettingsPage ? "max-w-5xl" : undefined
isUserSettingsPage || isSearchSpaceSettingsPage || isTeamPage ? "max-w-5xl" : undefined
}
isLoadingChats={isLoadingThreads}
activeSlideoutPanel={activeSlideoutPanel}
@ -891,7 +891,6 @@ export function LayoutDataProvider({ searchSpaceId, children }: LayoutDataProvid
onOpenChange={setIsCreateSearchSpaceDialogOpen}
/>
<TeamDialog searchSpaceId={Number(searchSpaceId)} />
<AnnouncementsDialog />
{/* Agent action log + revert dialog */}

View file

@ -1,32 +0,0 @@
"use client";
import { useAtom } from "jotai";
import { useTranslations } from "next-intl";
import { TeamContent } from "@/app/dashboard/[search_space_id]/team/team-content";
import { teamDialogAtom } from "@/atoms/layout/dialogs.atom";
import { Dialog, DialogContent, DialogTitle } from "@/components/ui/dialog";
interface TeamDialogProps {
searchSpaceId: number;
}
export function TeamDialog({ searchSpaceId }: TeamDialogProps) {
const t = useTranslations("sidebar");
const [open, setOpen] = useAtom(teamDialogAtom);
return (
<Dialog open={open} onOpenChange={setOpen}>
<DialogContent
className="select-none max-w-[900px] w-[95vw] md:w-[90vw] h-[90vh] md:h-[80vh] max-h-[640px] flex flex-col p-0 gap-0 overflow-hidden [--card:var(--popover)]"
onOpenAutoFocus={(e) => e.preventDefault()}
>
<DialogTitle className="sr-only">{t("manage_members")}</DialogTitle>
<div className="flex-1 overflow-y-auto overflow-x-hidden">
<div className="px-6 md:px-8 py-6 min-w-0">
<TeamContent searchSpaceId={searchSpaceId} />
</div>
</div>
</DialogContent>
</Dialog>
);
}