From 8d19cd64cf6117d3f4306b94c5e4b6e65738e02b Mon Sep 17 00:00:00 2001 From: haikdc Date: Sat, 18 Apr 2026 19:14:26 -0700 Subject: [PATCH] =?UTF-8?q?[Haik]:=20refactor:=20migrate=20frontend=20from?= =?UTF-8?q?=20flat=20file=20structure=20to=20nested=20AppShell=20architect?= =?UTF-8?q?ure=20=E2=80=94=20moves=20DynamicIsland=20under=20TitleBar=20wi?= =?UTF-8?q?th=20CompactPill/ExpandedCard=20subgroups,=20consolidates=20Set?= =?UTF-8?q?tings=20and=20Commands=20pages=20into=20AppShell/components=20w?= =?UTF-8?q?ith=20dedicated=20components/hooks/shared=20dirs,=20relocates?= =?UTF-8?q?=20Layout=20pieces=20(Sidebar,=20TitleBar,=20UpdateBanner)=20as?= =?UTF-8?q?=20AppShell=20children,=20and=20updates=20Main.tsx=20import=20p?= =?UTF-8?q?ath?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/app/Main.tsx | 2 +- .../{Layout => AppShell}/AppShell.tsx | 8 +++---- .../components}/Settings/Settings.tsx | 8 +++---- .../components/CommandsTab/CommandsTab.tsx} | 8 +++---- .../components}/AtCommandsSection.tsx | 4 ++-- .../components}/ShortcutsSection.tsx | 4 ++-- .../components}/SlashCommandsSection.tsx | 4 ++-- .../components/shared}/CommandsHelpers.tsx | 0 .../components/shared}/commandsTypes.ts | 0 .../CommandsTab}/hooks/useCommands.tsx | 2 +- .../components/GeneralTab}/GeneralTab.tsx | 6 ++--- .../GeneralTab/components}/AboutSection.tsx | 0 .../components}/InterfaceSection.tsx | 2 +- .../components/ModelsTab}/ModelsTab.tsx | 4 ++-- .../components}/SubscriptionCard.tsx | 0 .../components}/SubscriptionCards.tsx | 0 .../components}/Settings/hooks/useSettings.ts | 0 .../components}/Sidebar.tsx | 0 .../TitleBar}/DynamicIsland/DynamicIsland.tsx | 8 +++---- .../components}/CompactActionablePill.tsx | 4 ++-- .../CompactPill/ActivityIndicator.tsx | 20 ++++++++++++++++ .../components/CompactPill}/CompactPill.tsx | 6 ++--- .../ExpandedCard}/AgentStatusRow.tsx | 4 ++-- .../ExpandedCard}/CompletedAgentsList.tsx | 2 +- .../components/ExpandedCard}/ExpandedCard.tsx | 2 +- .../components/ExpandedCard}/StatusDot.tsx | 23 +++---------------- .../DynamicIsland/components}/IdlePill.tsx | 2 +- .../hooks/useDynamicIslandActions.ts | 2 +- .../hooks/useDynamicIslandData.ts | 2 +- .../TitleBar}/DynamicIsland/islandTypes.ts | 0 .../components/TitleBar}/TitleBar.tsx | 2 +- .../components}/UpdateBanner.tsx | 0 .../hooks/useSidebarResize.ts | 0 .../hooks/useUpdateNotification.ts | 0 .../hooks/useUrlInterception.ts | 0 .../src/app/components/DynamicIsland/index.ts | 1 - 36 files changed, 66 insertions(+), 64 deletions(-) rename frontend/src/app/components/{Layout => AppShell}/AppShell.tsx (96%) rename frontend/src/app/{pages => components/AppShell/components}/Settings/Settings.tsx (96%) rename frontend/src/app/{pages/Commands/Commands.tsx => components/AppShell/components/Settings/components/CommandsTab/CommandsTab.tsx} (76%) rename frontend/src/app/{pages/Commands => components/AppShell/components/Settings/components/CommandsTab/components}/AtCommandsSection.tsx (96%) rename frontend/src/app/{pages/Commands => components/AppShell/components/Settings/components/CommandsTab/components}/ShortcutsSection.tsx (95%) rename frontend/src/app/{pages/Commands => components/AppShell/components/Settings/components/CommandsTab/components}/SlashCommandsSection.tsx (96%) rename frontend/src/app/{pages/Commands => components/AppShell/components/Settings/components/CommandsTab/components/shared}/CommandsHelpers.tsx (100%) rename frontend/src/app/{pages/Commands => components/AppShell/components/Settings/components/CommandsTab/components/shared}/commandsTypes.ts (100%) rename frontend/src/app/{pages/Commands => components/AppShell/components/Settings/components/CommandsTab}/hooks/useCommands.tsx (98%) rename frontend/src/app/{pages/Settings => components/AppShell/components/Settings/components/GeneralTab}/GeneralTab.tsx (97%) rename frontend/src/app/{pages/Settings => components/AppShell/components/Settings/components/GeneralTab/components}/AboutSection.tsx (100%) rename frontend/src/app/{pages/Settings => components/AppShell/components/Settings/components/GeneralTab/components}/InterfaceSection.tsx (99%) rename frontend/src/app/{pages/Settings => components/AppShell/components/Settings/components/ModelsTab}/ModelsTab.tsx (96%) rename frontend/src/app/{pages/Settings => components/AppShell/components/Settings/components/ModelsTab/components}/SubscriptionCard.tsx (100%) rename frontend/src/app/{pages/Settings => components/AppShell/components/Settings/components/ModelsTab/components}/SubscriptionCards.tsx (100%) rename frontend/src/app/{pages => components/AppShell/components}/Settings/hooks/useSettings.ts (100%) rename frontend/src/app/components/{Layout => AppShell/components}/Sidebar.tsx (100%) rename frontend/src/app/components/{ => AppShell/components/TitleBar}/DynamicIsland/DynamicIsland.tsx (94%) rename frontend/src/app/components/{DynamicIsland => AppShell/components/TitleBar/DynamicIsland/components}/CompactActionablePill.tsx (95%) create mode 100644 frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactPill/ActivityIndicator.tsx rename frontend/src/app/components/{DynamicIsland => AppShell/components/TitleBar/DynamicIsland/components/CompactPill}/CompactPill.tsx (82%) rename frontend/src/app/components/{DynamicIsland => AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard}/AgentStatusRow.tsx (92%) rename frontend/src/app/components/{DynamicIsland => AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard}/CompletedAgentsList.tsx (95%) rename frontend/src/app/components/{DynamicIsland => AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard}/ExpandedCard.tsx (98%) rename frontend/src/app/components/{DynamicIsland => AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard}/StatusDot.tsx (58%) rename frontend/src/app/components/{DynamicIsland => AppShell/components/TitleBar/DynamicIsland/components}/IdlePill.tsx (91%) rename frontend/src/app/components/{ => AppShell/components/TitleBar}/DynamicIsland/hooks/useDynamicIslandActions.ts (96%) rename frontend/src/app/components/{ => AppShell/components/TitleBar}/DynamicIsland/hooks/useDynamicIslandData.ts (97%) rename frontend/src/app/components/{ => AppShell/components/TitleBar}/DynamicIsland/islandTypes.ts (100%) rename frontend/src/app/components/{Layout => AppShell/components/TitleBar}/TitleBar.tsx (97%) rename frontend/src/app/components/{Layout => AppShell/components}/UpdateBanner.tsx (100%) rename frontend/src/app/components/{Layout => AppShell}/hooks/useSidebarResize.ts (100%) rename frontend/src/app/components/{Layout => AppShell}/hooks/useUpdateNotification.ts (100%) rename frontend/src/app/components/{Layout => AppShell}/hooks/useUrlInterception.ts (100%) delete mode 100644 frontend/src/app/components/DynamicIsland/index.ts diff --git a/frontend/src/app/Main.tsx b/frontend/src/app/Main.tsx index 03000715..bf38ef91 100644 --- a/frontend/src/app/Main.tsx +++ b/frontend/src/app/Main.tsx @@ -14,7 +14,7 @@ import { setUpdateDownloaded, setUpdateError, } from '@/shared/state/updateSlice'; -import AppShell from './components/Layout/AppShell'; +import AppShell from './components/AppShell/AppShell'; import Dashboard from './pages/Dashboard/Dashboard'; import DashboardSelection from './pages/DashboardSelection/DashboardSelection'; import Skills from './pages/Skills/Skills'; diff --git a/frontend/src/app/components/Layout/AppShell.tsx b/frontend/src/app/components/AppShell/AppShell.tsx similarity index 96% rename from frontend/src/app/components/Layout/AppShell.tsx rename to frontend/src/app/components/AppShell/AppShell.tsx index d52c3849..035e3934 100644 --- a/frontend/src/app/components/Layout/AppShell.tsx +++ b/frontend/src/app/components/AppShell/AppShell.tsx @@ -6,7 +6,7 @@ import Snackbar from '@mui/material/Snackbar'; import Alert from '@mui/material/Alert'; import RestartAltIcon from '@mui/icons-material/RestartAlt'; import SystemUpdateAltIcon from '@mui/icons-material/SystemUpdateAlt'; -import Settings from '@/app/pages/Settings/Settings'; +import Settings from './components/Settings/Settings'; import { useAppDispatch, useAppSelector } from '@/shared/hooks'; import { LIST_DASHBOARDS } from '@/shared/backend-bridge/apps/dashboards'; import { LIST_APPS } from '@/shared/backend-bridge/apps/app_builder'; @@ -14,9 +14,9 @@ import { useClaudeTokens } from '@/shared/styles/ThemeContext'; import { useUpdateNotification } from './hooks/useUpdateNotification'; import { useSidebarResize } from './hooks/useSidebarResize'; import { useUrlInterception } from './hooks/useUrlInterception'; -import TitleBar from './TitleBar'; -import Sidebar from './Sidebar'; -import UpdateBanner from './UpdateBanner'; +import TitleBar from './components/TitleBar/TitleBar'; +import Sidebar from './components/Sidebar'; +import UpdateBanner from './components/UpdateBanner'; const AppShell: React.FC = () => { const c = useClaudeTokens(); diff --git a/frontend/src/app/pages/Settings/Settings.tsx b/frontend/src/app/components/AppShell/components/Settings/Settings.tsx similarity index 96% rename from frontend/src/app/pages/Settings/Settings.tsx rename to frontend/src/app/components/AppShell/components/Settings/Settings.tsx index ca5887ef..8739e5ea 100644 --- a/frontend/src/app/pages/Settings/Settings.tsx +++ b/frontend/src/app/components/AppShell/components/Settings/Settings.tsx @@ -13,10 +13,10 @@ import Snackbar from '@mui/material/Snackbar'; import Alert from '@mui/material/Alert'; import SaveIcon from '@mui/icons-material/Save'; import CloseIcon from '@mui/icons-material/Close'; -import { CommandsContent } from '@/app/pages/Commands/Commands'; +import { CommandsTab } from './components/CommandsTab/CommandsTab'; import { useSettings } from './hooks/useSettings'; -import GeneralTab from './GeneralTab'; -import ModelsTab from './ModelsTab'; +import GeneralTab from './components/GeneralTab/GeneralTab'; +import ModelsTab from './components/ModelsTab/ModelsTab'; const Settings: React.FC = () => { const s = useSettings(); @@ -93,7 +93,7 @@ const Settings: React.FC = () => { ) : ( - + )} diff --git a/frontend/src/app/pages/Commands/Commands.tsx b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/CommandsTab.tsx similarity index 76% rename from frontend/src/app/pages/Commands/Commands.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/CommandsTab.tsx index 5cc04f8f..17daaa2f 100644 --- a/frontend/src/app/pages/Commands/Commands.tsx +++ b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/CommandsTab.tsx @@ -2,11 +2,11 @@ import React from 'react'; import Box from '@mui/material/Box'; import { useClaudeTokens } from '@/shared/styles/ThemeContext'; import { useCommands } from './hooks/useCommands'; -import SlashCommandsSection from './SlashCommandsSection'; -import AtCommandsSection from './AtCommandsSection'; -import ShortcutsSection from './ShortcutsSection'; +import SlashCommandsSection from './components/SlashCommandsSection'; +import AtCommandsSection from './components/AtCommandsSection'; +import ShortcutsSection from './components/ShortcutsSection'; -export const CommandsContent: React.FC = () => { +export const CommandsTab: React.FC = () => { const c = useClaudeTokens(); const { slashCommands, atCommands, modesMap, navShortcuts, actionShortcuts } = useCommands(); diff --git a/frontend/src/app/pages/Commands/AtCommandsSection.tsx b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/AtCommandsSection.tsx similarity index 96% rename from frontend/src/app/pages/Commands/AtCommandsSection.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/AtCommandsSection.tsx index 708930e7..5e3b813b 100644 --- a/frontend/src/app/pages/Commands/AtCommandsSection.tsx +++ b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/AtCommandsSection.tsx @@ -3,8 +3,8 @@ import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; import Chip from '@mui/material/Chip'; import AlternateEmailIcon from '@mui/icons-material/AlternateEmail'; -import { SectionHeader } from './CommandsHelpers'; -import { AtCommand } from './commandsTypes'; +import { SectionHeader } from './shared/CommandsHelpers'; +import { AtCommand } from './shared/commandsTypes'; interface AtCommandsSectionProps { atCommands: AtCommand[]; diff --git a/frontend/src/app/pages/Commands/ShortcutsSection.tsx b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/ShortcutsSection.tsx similarity index 95% rename from frontend/src/app/pages/Commands/ShortcutsSection.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/ShortcutsSection.tsx index 92311e10..a924a565 100644 --- a/frontend/src/app/pages/Commands/ShortcutsSection.tsx +++ b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/ShortcutsSection.tsx @@ -2,8 +2,8 @@ import React from 'react'; import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; import KeyboardIcon from '@mui/icons-material/Keyboard'; -import { KeyBadge, SectionHeader } from './CommandsHelpers'; -import { Shortcut, SHORTCUTS } from './commandsTypes'; +import { KeyBadge, SectionHeader } from './shared/CommandsHelpers'; +import { Shortcut, SHORTCUTS } from './shared/commandsTypes'; interface ShortcutsSectionProps { navShortcuts: Shortcut[]; diff --git a/frontend/src/app/pages/Commands/SlashCommandsSection.tsx b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/SlashCommandsSection.tsx similarity index 96% rename from frontend/src/app/pages/Commands/SlashCommandsSection.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/SlashCommandsSection.tsx index 724ae618..aa054768 100644 --- a/frontend/src/app/pages/Commands/SlashCommandsSection.tsx +++ b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/SlashCommandsSection.tsx @@ -5,8 +5,8 @@ import Chip from '@mui/material/Chip'; import PsychologyIcon from '@mui/icons-material/Psychology'; import SmartToyOutlinedIcon from '@mui/icons-material/SmartToyOutlined'; import TerminalIcon from '@mui/icons-material/Terminal'; -import { SectionHeader } from './CommandsHelpers'; -import { SlashCommand } from './commandsTypes'; +import { SectionHeader } from './shared/CommandsHelpers'; +import { SlashCommand } from './shared/commandsTypes'; interface SlashCommandsSectionProps { slashCommands: SlashCommand[]; diff --git a/frontend/src/app/pages/Commands/CommandsHelpers.tsx b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/shared/CommandsHelpers.tsx similarity index 100% rename from frontend/src/app/pages/Commands/CommandsHelpers.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/shared/CommandsHelpers.tsx diff --git a/frontend/src/app/pages/Commands/commandsTypes.ts b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/shared/commandsTypes.ts similarity index 100% rename from frontend/src/app/pages/Commands/commandsTypes.ts rename to frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/components/shared/commandsTypes.ts diff --git a/frontend/src/app/pages/Commands/hooks/useCommands.tsx b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/hooks/useCommands.tsx similarity index 98% rename from frontend/src/app/pages/Commands/hooks/useCommands.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/hooks/useCommands.tsx index 07e932ac..40a86808 100644 --- a/frontend/src/app/pages/Commands/hooks/useCommands.tsx +++ b/frontend/src/app/components/AppShell/components/Settings/components/CommandsTab/hooks/useCommands.tsx @@ -9,7 +9,7 @@ import { getToolGroupIcon } from '@/app/pages/_shared/getToolGroupIcon'; import { LIST_APPS } from '@/shared/backend-bridge/apps/app_builder'; import { LIST_SKILLS } from '@/shared/backend-bridge/apps/skills'; import { LIST_MODES } from '@/shared/state/modesSlice'; -import { SlashCommand, AtCommand, SHORTCUTS } from '../commandsTypes'; +import { SlashCommand, AtCommand, SHORTCUTS } from '../components/shared/commandsTypes'; export function useCommands() { const dispatch = useAppDispatch(); diff --git a/frontend/src/app/pages/Settings/GeneralTab.tsx b/frontend/src/app/components/AppShell/components/Settings/components/GeneralTab/GeneralTab.tsx similarity index 97% rename from frontend/src/app/pages/Settings/GeneralTab.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/GeneralTab/GeneralTab.tsx index 2567bf97..1106ebbc 100644 --- a/frontend/src/app/pages/Settings/GeneralTab.tsx +++ b/frontend/src/app/components/AppShell/components/Settings/components/GeneralTab/GeneralTab.tsx @@ -12,9 +12,9 @@ import LanguageIcon from '@mui/icons-material/Language'; import RestartAltIcon from '@mui/icons-material/RestartAlt'; import { RESET_SYSTEM_PROMPT } from '@/shared/backend-bridge/apps/settings'; import { DEFAULT_SYSTEM_PROMPT } from '@/shared/state/settingsSlice'; -import InterfaceSection from './InterfaceSection'; -import AboutSection from './AboutSection'; -import type { UseSettingsReturn } from './hooks/useSettings'; +import InterfaceSection from './components/InterfaceSection'; +import AboutSection from './components/AboutSection'; +import type { UseSettingsReturn } from '../../hooks/useSettings'; const GeneralTab: React.FC<{ s: UseSettingsReturn }> = ({ s }) => { const { form, setForm, c, dispatch, modesList, browseFolder, diff --git a/frontend/src/app/pages/Settings/AboutSection.tsx b/frontend/src/app/components/AppShell/components/Settings/components/GeneralTab/components/AboutSection.tsx similarity index 100% rename from frontend/src/app/pages/Settings/AboutSection.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/GeneralTab/components/AboutSection.tsx diff --git a/frontend/src/app/pages/Settings/InterfaceSection.tsx b/frontend/src/app/components/AppShell/components/Settings/components/GeneralTab/components/InterfaceSection.tsx similarity index 99% rename from frontend/src/app/pages/Settings/InterfaceSection.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/GeneralTab/components/InterfaceSection.tsx index 0b4012e4..96fc672c 100644 --- a/frontend/src/app/pages/Settings/InterfaceSection.tsx +++ b/frontend/src/app/components/AppShell/components/Settings/components/GeneralTab/components/InterfaceSection.tsx @@ -8,7 +8,7 @@ import ToggleButtonGroup from '@mui/material/ToggleButtonGroup'; import LightModeIcon from '@mui/icons-material/LightMode'; import DarkModeIcon from '@mui/icons-material/DarkMode'; import KeyboardIcon from '@mui/icons-material/Keyboard'; -import type { UseSettingsReturn } from './hooks/useSettings'; +import type { UseSettingsReturn } from '../../../hooks/useSettings'; const InterfaceSection: React.FC<{ s: UseSettingsReturn }> = ({ s }) => { const { form, setForm, c, recordingShortcut, setRecordingShortcut, diff --git a/frontend/src/app/pages/Settings/ModelsTab.tsx b/frontend/src/app/components/AppShell/components/Settings/components/ModelsTab/ModelsTab.tsx similarity index 96% rename from frontend/src/app/pages/Settings/ModelsTab.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/ModelsTab/ModelsTab.tsx index 65a22190..7ca72fc1 100644 --- a/frontend/src/app/pages/Settings/ModelsTab.tsx +++ b/frontend/src/app/components/AppShell/components/Settings/components/ModelsTab/ModelsTab.tsx @@ -7,8 +7,8 @@ import InputAdornment from '@mui/material/InputAdornment'; import VisibilityIcon from '@mui/icons-material/Visibility'; import VisibilityOffIcon from '@mui/icons-material/VisibilityOff'; import OpenInNewIcon from '@mui/icons-material/OpenInNew'; -import SubscriptionCards from './SubscriptionCards'; -import type { UseSettingsReturn } from './hooks/useSettings'; +import SubscriptionCards from './components/SubscriptionCards'; +import type { UseSettingsReturn } from '../../hooks/useSettings'; const ModelsTab: React.FC<{ s: UseSettingsReturn }> = ({ s }) => { const { c, form, setForm, showApiKey, setShowApiKey, fieldSx, labelSx, descSx } = s; diff --git a/frontend/src/app/pages/Settings/SubscriptionCard.tsx b/frontend/src/app/components/AppShell/components/Settings/components/ModelsTab/components/SubscriptionCard.tsx similarity index 100% rename from frontend/src/app/pages/Settings/SubscriptionCard.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/ModelsTab/components/SubscriptionCard.tsx diff --git a/frontend/src/app/pages/Settings/SubscriptionCards.tsx b/frontend/src/app/components/AppShell/components/Settings/components/ModelsTab/components/SubscriptionCards.tsx similarity index 100% rename from frontend/src/app/pages/Settings/SubscriptionCards.tsx rename to frontend/src/app/components/AppShell/components/Settings/components/ModelsTab/components/SubscriptionCards.tsx diff --git a/frontend/src/app/pages/Settings/hooks/useSettings.ts b/frontend/src/app/components/AppShell/components/Settings/hooks/useSettings.ts similarity index 100% rename from frontend/src/app/pages/Settings/hooks/useSettings.ts rename to frontend/src/app/components/AppShell/components/Settings/hooks/useSettings.ts diff --git a/frontend/src/app/components/Layout/Sidebar.tsx b/frontend/src/app/components/AppShell/components/Sidebar.tsx similarity index 100% rename from frontend/src/app/components/Layout/Sidebar.tsx rename to frontend/src/app/components/AppShell/components/Sidebar.tsx diff --git a/frontend/src/app/components/DynamicIsland/DynamicIsland.tsx b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/DynamicIsland.tsx similarity index 94% rename from frontend/src/app/components/DynamicIsland/DynamicIsland.tsx rename to frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/DynamicIsland.tsx index cd3bfa8d..543dae3c 100644 --- a/frontend/src/app/components/DynamicIsland/DynamicIsland.tsx +++ b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/DynamicIsland.tsx @@ -2,10 +2,10 @@ import React, { useMemo, useRef } from 'react'; import { motion, AnimatePresence } from 'framer-motion'; import { useClaudeTokens } from '@/shared/styles/ThemeContext'; import { SPRING_LAYOUT, SPRING_BOUNCE } from './islandTypes'; -import { IdlePill } from './IdlePill'; -import { CompactPill } from './CompactPill'; -import { CompactActionablePill } from './CompactActionablePill'; -import { ExpandedCard } from './ExpandedCard'; +import { IdlePill } from './components/IdlePill'; +import { CompactPill } from './components/CompactPill/CompactPill'; +import { CompactActionablePill } from './components/CompactActionablePill'; +import { ExpandedCard } from './components/ExpandedCard/ExpandedCard'; import { useDynamicIslandData } from './hooks/useDynamicIslandData'; import { useDynamicIslandActions } from './hooks/useDynamicIslandActions'; diff --git a/frontend/src/app/components/DynamicIsland/CompactActionablePill.tsx b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactActionablePill.tsx similarity index 95% rename from frontend/src/app/components/DynamicIsland/CompactActionablePill.tsx rename to frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactActionablePill.tsx index bd660894..dfb333c8 100644 --- a/frontend/src/app/components/DynamicIsland/CompactActionablePill.tsx +++ b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactActionablePill.tsx @@ -10,8 +10,8 @@ import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; import { motion } from 'framer-motion'; import { parseMcpToolName } from '@/app/pages/AgentChat/toolkit/approvalToolkit/utils'; import { useMcpToolMeta } from '@/app/pages/AgentChat/toolkit/approvalToolkit/utils/useMcpToolMeta'; -import { SPRING_BOUNCE } from './islandTypes'; -import type { ClaudeTokens } from './islandTypes'; +import { SPRING_BOUNCE } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; +import type { ClaudeTokens } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; import type { ApprovalRequest } from '@/shared/state/agentsSlice'; import { Terminal, FileText, FilePen, Search, MessageCircleQuestion, Wrench } from 'lucide-react'; diff --git a/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactPill/ActivityIndicator.tsx b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactPill/ActivityIndicator.tsx new file mode 100644 index 00000000..c0b10352 --- /dev/null +++ b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactPill/ActivityIndicator.tsx @@ -0,0 +1,20 @@ +import React from 'react'; +import Box from '@mui/material/Box'; +import type { ClaudeTokens } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; + +export const ActivityIndicator: React.FC<{ c: ClaudeTokens }> = ({ c }) => ( + +); diff --git a/frontend/src/app/components/DynamicIsland/CompactPill.tsx b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactPill/CompactPill.tsx similarity index 82% rename from frontend/src/app/components/DynamicIsland/CompactPill.tsx rename to frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactPill/CompactPill.tsx index 5623c774..4716d272 100644 --- a/frontend/src/app/components/DynamicIsland/CompactPill.tsx +++ b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/CompactPill/CompactPill.tsx @@ -2,9 +2,9 @@ import React from 'react'; import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; import { motion } from 'framer-motion'; -import { ActivityIndicator } from './StatusDot'; -import { SPRING_BOUNCE } from './islandTypes'; -import type { ClaudeTokens } from './islandTypes'; +import { ActivityIndicator } from './ActivityIndicator'; +import { SPRING_BOUNCE } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; +import type { ClaudeTokens } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; export const CompactPill: React.FC<{ c: ClaudeTokens; diff --git a/frontend/src/app/components/DynamicIsland/AgentStatusRow.tsx b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/AgentStatusRow.tsx similarity index 92% rename from frontend/src/app/components/DynamicIsland/AgentStatusRow.tsx rename to frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/AgentStatusRow.tsx index 510b91fd..206209fd 100644 --- a/frontend/src/app/components/DynamicIsland/AgentStatusRow.tsx +++ b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/AgentStatusRow.tsx @@ -6,8 +6,8 @@ import Tooltip from '@mui/material/Tooltip'; import StopCircleOutlinedIcon from '@mui/icons-material/StopCircleOutlined'; import CloseIcon from '@mui/icons-material/Close'; import { StatusDot } from './StatusDot'; -import { STATUS_CONFIG } from './islandTypes'; -import type { ClaudeTokens, TrackedAgent } from './islandTypes'; +import { STATUS_CONFIG } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; +import type { ClaudeTokens, TrackedAgent } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; export const AgentStatusRow: React.FC<{ agent: TrackedAgent; diff --git a/frontend/src/app/components/DynamicIsland/CompletedAgentsList.tsx b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/CompletedAgentsList.tsx similarity index 95% rename from frontend/src/app/components/DynamicIsland/CompletedAgentsList.tsx rename to frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/CompletedAgentsList.tsx index 1ef4ee63..86b8b8da 100644 --- a/frontend/src/app/components/DynamicIsland/CompletedAgentsList.tsx +++ b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/CompletedAgentsList.tsx @@ -6,7 +6,7 @@ import Collapse from '@mui/material/Collapse'; import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; import ExpandLessIcon from '@mui/icons-material/ExpandLess'; import { AgentStatusRow } from './AgentStatusRow'; -import type { ClaudeTokens, TrackedAgent } from './islandTypes'; +import type { ClaudeTokens, TrackedAgent } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; export const CompletedAgentsList: React.FC<{ c: ClaudeTokens; diff --git a/frontend/src/app/components/DynamicIsland/ExpandedCard.tsx b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/ExpandedCard.tsx similarity index 98% rename from frontend/src/app/components/DynamicIsland/ExpandedCard.tsx rename to frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/ExpandedCard.tsx index 6fbc4dc6..bd7dcbe0 100644 --- a/frontend/src/app/components/DynamicIsland/ExpandedCard.tsx +++ b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/ExpandedCard.tsx @@ -8,7 +8,7 @@ import { ApprovalRouter } from '@/app/pages/AgentChat/toolkit/approvalToolkit/Ap import { BatchApprovalWrapper } from '@/app/pages/AgentChat/toolkit/approvalToolkit/BatchApprovalWrapper'; import { AgentStatusRow } from './AgentStatusRow'; import { CompletedAgentsList } from './CompletedAgentsList'; -import type { ClaudeTokens, SessionApprovalGroup, TrackedAgent } from './islandTypes'; +import type { ClaudeTokens, SessionApprovalGroup, TrackedAgent } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; export const ExpandedCard: React.FC<{ c: ClaudeTokens; diff --git a/frontend/src/app/components/DynamicIsland/StatusDot.tsx b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/StatusDot.tsx similarity index 58% rename from frontend/src/app/components/DynamicIsland/StatusDot.tsx rename to frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/StatusDot.tsx index f6625bde..77a7d2d8 100644 --- a/frontend/src/app/components/DynamicIsland/StatusDot.tsx +++ b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/ExpandedCard/StatusDot.tsx @@ -1,7 +1,7 @@ import React from 'react'; import Box from '@mui/material/Box'; -import { STATUS_CONFIG } from './islandTypes'; -import type { ClaudeTokens } from './islandTypes'; +import { STATUS_CONFIG } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; +import type { ClaudeTokens } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; export const StatusDot: React.FC<{ status: string; c: ClaudeTokens }> = ({ status, c }) => { const cfg = STATUS_CONFIG[status]; @@ -26,21 +26,4 @@ export const StatusDot: React.FC<{ status: string; c: ClaudeTokens }> = ({ statu }} /> ); -}; - -export const ActivityIndicator: React.FC<{ c: ClaudeTokens }> = ({ c }) => ( - -); +}; \ No newline at end of file diff --git a/frontend/src/app/components/DynamicIsland/IdlePill.tsx b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/IdlePill.tsx similarity index 91% rename from frontend/src/app/components/DynamicIsland/IdlePill.tsx rename to frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/IdlePill.tsx index b04d25d5..5b5e6917 100644 --- a/frontend/src/app/components/DynamicIsland/IdlePill.tsx +++ b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/components/IdlePill.tsx @@ -4,7 +4,7 @@ import Typography from '@mui/material/Typography'; import Tooltip from '@mui/material/Tooltip'; import SearchIcon from '@mui/icons-material/Search'; import { motion } from 'framer-motion'; -import type { ClaudeTokens } from './islandTypes'; +import type { ClaudeTokens } from '@/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes'; export const IdlePill: React.FC<{ c: ClaudeTokens }> = ({ c }) => ( state.agents.sessions); diff --git a/frontend/src/app/components/DynamicIsland/islandTypes.ts b/frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes.ts similarity index 100% rename from frontend/src/app/components/DynamicIsland/islandTypes.ts rename to frontend/src/app/components/AppShell/components/TitleBar/DynamicIsland/islandTypes.ts diff --git a/frontend/src/app/components/Layout/TitleBar.tsx b/frontend/src/app/components/AppShell/components/TitleBar/TitleBar.tsx similarity index 97% rename from frontend/src/app/components/Layout/TitleBar.tsx rename to frontend/src/app/components/AppShell/components/TitleBar/TitleBar.tsx index edb14bd5..36369525 100644 --- a/frontend/src/app/components/Layout/TitleBar.tsx +++ b/frontend/src/app/components/AppShell/components/TitleBar/TitleBar.tsx @@ -7,7 +7,7 @@ import Tooltip from '@mui/material/Tooltip'; import ViewSidebarOutlinedIcon from '@mui/icons-material/ViewSidebarOutlined'; import ArrowBackOutlinedIcon from '@mui/icons-material/ArrowBackOutlined'; import ArrowForwardOutlinedIcon from '@mui/icons-material/ArrowForwardOutlined'; -import DynamicIsland from '@/app/components/DynamicIsland'; +import DynamicIsland from './DynamicIsland/DynamicIsland'; import { useClaudeTokens } from '@/shared/styles/ThemeContext'; interface TitleBarProps { diff --git a/frontend/src/app/components/Layout/UpdateBanner.tsx b/frontend/src/app/components/AppShell/components/UpdateBanner.tsx similarity index 100% rename from frontend/src/app/components/Layout/UpdateBanner.tsx rename to frontend/src/app/components/AppShell/components/UpdateBanner.tsx diff --git a/frontend/src/app/components/Layout/hooks/useSidebarResize.ts b/frontend/src/app/components/AppShell/hooks/useSidebarResize.ts similarity index 100% rename from frontend/src/app/components/Layout/hooks/useSidebarResize.ts rename to frontend/src/app/components/AppShell/hooks/useSidebarResize.ts diff --git a/frontend/src/app/components/Layout/hooks/useUpdateNotification.ts b/frontend/src/app/components/AppShell/hooks/useUpdateNotification.ts similarity index 100% rename from frontend/src/app/components/Layout/hooks/useUpdateNotification.ts rename to frontend/src/app/components/AppShell/hooks/useUpdateNotification.ts diff --git a/frontend/src/app/components/Layout/hooks/useUrlInterception.ts b/frontend/src/app/components/AppShell/hooks/useUrlInterception.ts similarity index 100% rename from frontend/src/app/components/Layout/hooks/useUrlInterception.ts rename to frontend/src/app/components/AppShell/hooks/useUrlInterception.ts diff --git a/frontend/src/app/components/DynamicIsland/index.ts b/frontend/src/app/components/DynamicIsland/index.ts deleted file mode 100644 index be56269a..00000000 --- a/frontend/src/app/components/DynamicIsland/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default } from './DynamicIsland';