@agent-native/dispatch 0.13.0 → 0.13.2

package/src/components/layout/Layout.tsx

@@ -36,7 +36,6 @@ import {
   IconPuzzle,
   IconSettings,
   IconShieldCheck,
-  IconUsersGroup,
 } from "@tabler/icons-react";
 import {
   useEffect,
@@ -215,13 +214,6 @@ const OPERATIONS_NAV_ITEMS = [
     icon: IconSettings,
     section: "operations",
   },
-  {
-    id: "team",
-    to: "/team",
-    label: "Team",
-    icon: IconUsersGroup,
-    section: "operations",
-  },
 ] as const satisfies readonly DispatchNavItem[];
 
 const EMPTY_NAV_ITEMS: readonly DispatchNavItem[] = [];
@@ -804,7 +796,9 @@ export function Layout({
     </div>
   );
   const content = isChatRoute ? (
-    appContent
+    <div className="agent-layout-main-surface flex min-w-0 flex-1 overflow-hidden">
+      {appContent}
+    </div>
   ) : (
     <AgentSidebar
       position="right"
@@ -822,8 +816,8 @@ export function Layout({
 
   return (
     <HeaderActionsProvider>
-      <div className="flex h-screen w-full overflow-hidden bg-background">
-        <aside className="hidden lg:flex w-64 shrink-0 flex-col border-e bg-sidebar text-sidebar-foreground">
+      <div className="agent-layout-shell flex h-screen w-full overflow-hidden bg-background">
+        <aside className="agent-layout-left-drawer hidden lg:flex w-64 shrink-0 flex-col border-e bg-sidebar text-sidebar-foreground">
           <NavContent extensions={extensions} />
         </aside>
 

package/src/hooks/use-navigation-state.ts

@@ -219,7 +219,7 @@ function resolveView(
   if (pathname.startsWith("/audit")) return "audit";
   if (pathname.startsWith("/dreams")) return "dreams";
   if (pathname.startsWith("/thread-debug")) return "thread-debug";
-  if (pathname.startsWith("/team")) return "team";
+  if (pathname.startsWith("/team")) return "settings";
   return "overview";
 }
 
@@ -271,7 +271,7 @@ function resolvePath(
     case "threads":
       return "/thread-debug";
     case "team":
-      return "/team";
+      return "/settings#team";
     case "extensions":
       return command?.extensionId
         ? `/extensions/${encodeURIComponent(command.extensionId)}`

package/src/routes/pages/settings.tsx

@@ -1,8 +1,11 @@
 import {
+  ChangelogSettingsCard,
   LanguagePicker,
+  SettingsTabsPage,
   openAgentSettings,
   useT,
 } from "@agent-native/core/client";
+import { TeamPage } from "@agent-native/core/client/org";
 import { Link } from "react-router";
 
 import { DispatchShell } from "@/components/dispatch-shell";
@@ -16,6 +19,8 @@ import {
 } from "@/components/ui/card";
 import { Label } from "@/components/ui/label";
 
+import changelog from "../../../CHANGELOG.md?raw";
+
 export function meta() {
   return [{ title: "Settings - Dispatch" }];
 }
@@ -28,55 +33,73 @@ export default function SettingsRoute() {
       title={t("settings.title")}
       description={t("settings.description")}
     >
-      <div className="mx-auto w-full max-w-3xl space-y-6">
-        <Card>
-          <CardHeader>
-            <CardTitle className="text-base">
-              {t("settings.languageTitle")}
-            </CardTitle>
-            <CardDescription>
-              {t("settings.languageDescription")}
-            </CardDescription>
-          </CardHeader>
-          <CardContent className="max-w-xs space-y-1.5">
-            <Label>{t("settings.languageLabel")}</Label>
-            <LanguagePicker label={t("settings.languageLabel")} />
-          </CardContent>
-        </Card>
+      <SettingsTabsPage
+        general={
+          <div className="mx-auto w-full max-w-3xl space-y-6">
+            <Card>
+              <CardHeader>
+                <CardTitle className="text-base">
+                  {t("settings.languageTitle")}
+                </CardTitle>
+                <CardDescription>
+                  {t("settings.languageDescription")}
+                </CardDescription>
+              </CardHeader>
+              <CardContent className="max-w-xs space-y-1.5">
+                <Label>{t("settings.languageLabel")}</Label>
+                <LanguagePicker label={t("settings.languageLabel")} />
+              </CardContent>
+            </Card>
 
-        <Card>
-          <CardHeader>
-            <CardTitle className="text-base">
-              {t("settings.workspaceTitle")}
-            </CardTitle>
-            <CardDescription>
-              {t("settings.workspaceDescription")}
-            </CardDescription>
-          </CardHeader>
-          <CardContent className="flex flex-wrap gap-2">
-            <Button variant="outline" asChild>
-              <Link to="/team">{t("settings.openTeamSettings")}</Link>
-            </Button>
-            <Button variant="outline" asChild>
-              <Link to="/workspace">{t("settings.openResourceSettings")}</Link>
-            </Button>
-          </CardContent>
-        </Card>
+            <Card>
+              <CardHeader>
+                <CardTitle className="text-base">
+                  {t("settings.workspaceTitle")}
+                </CardTitle>
+                <CardDescription>
+                  {t("settings.workspaceDescription")}
+                </CardDescription>
+              </CardHeader>
+              <CardContent>
+                <Button variant="outline" asChild>
+                  <Link to="/workspace">
+                    {t("settings.openResourceSettings")}
+                  </Link>
+                </Button>
+              </CardContent>
+            </Card>
 
-        <Card>
-          <CardHeader>
-            <CardTitle className="text-base">
-              {t("settings.agentTitle")}
-            </CardTitle>
-            <CardDescription>{t("settings.agentDescription")}</CardDescription>
-          </CardHeader>
-          <CardContent>
-            <Button variant="outline" onClick={() => openAgentSettings()}>
-              {t("settings.openAgentSettings")}
-            </Button>
-          </CardContent>
-        </Card>
-      </div>
+            <Card>
+              <CardHeader>
+                <CardTitle className="text-base">
+                  {t("settings.agentTitle")}
+                </CardTitle>
+                <CardDescription>
+                  {t("settings.agentDescription")}
+                </CardDescription>
+              </CardHeader>
+              <CardContent>
+                <Button variant="outline" onClick={() => openAgentSettings()}>
+                  {t("settings.openAgentSettings")}
+                </Button>
+              </CardContent>
+            </Card>
+          </div>
+        }
+        team={
+          <div className="mx-auto w-full max-w-3xl">
+            <TeamPage
+              showTitle={false}
+              createOrgDescription="Set up a team to share dispatch destinations and approvals with your colleagues."
+            />
+          </div>
+        }
+        whatsNew={
+          <div className="mx-auto w-full max-w-3xl">
+            <ChangelogSettingsCard markdown={changelog} />
+          </div>
+        }
+      />
     </DispatchShell>
   );
 }

package/src/routes/pages/team.tsx

@@ -1,24 +1,9 @@
-import { TeamPage } from "@agent-native/core/client/org";
-
-import { DispatchShell } from "@/components/dispatch-shell";
+import { Navigate } from "react-router";
 
 export function meta() {
   return [{ title: "Team — Dispatch" }];
 }
 
 export default function TeamRoute() {
-  return (
-    <TeamPage
-      title="Team"
-      createOrgDescription="Set up a team to share dispatch destinations and approvals with your colleagues."
-      layout={(children) => (
-        <DispatchShell
-          title="Team"
-          description="Workspace membership and approval ownership."
-        >
-          {children}
-        </DispatchShell>
-      )}
-    />
-  );
+  return <Navigate to="/settings#team" replace />;
 }