Skip to content

Commit c63c3a4

Browse files
nchopranchopra
committed
fix: refactor settings sidebar with home/settings navigation split
Separate the sidebar into a home view (notes + settings link) and a settings sub-view with back navigation. Update default route to /settings/notes, add legacy route mappings, and fix widget notification navigation paths.
1 parent 65130b0 commit c63c3a4

8 files changed

Lines changed: 92 additions & 43 deletions

File tree

‎apps/desktop/src/i18n/locales/en.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -364,7 +364,8 @@
364364
"community": "Community",
365365
"discordAlt": "Discord",
366366
"logoAlt": "Amical Logo",
367-
"brand": "Amical"
367+
"brand": "Amical",
368+
"backToHome": "Back to home"
368369
},
369370
"search": {
370371
"buttonLabel": "Search",

‎apps/desktop/src/i18n/locales/es.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -364,7 +364,8 @@
364364
"community": "Comunidad",
365365
"discordAlt": "Discord",
366366
"logoAlt": "Logo de Amical",
367-
"brand": "Amical"
367+
"brand": "Amical",
368+
"backToHome": "Volver al inicio"
368369
},
369370
"search": {
370371
"buttonLabel": "Buscar",

‎apps/desktop/src/i18n/locales/ja.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -364,7 +364,8 @@
364364
"community": "コミュニティ",
365365
"discordAlt": "Discord",
366366
"logoAlt": "Amical ロゴ",
367-
"brand": "Amical"
367+
"brand": "Amical",
368+
"backToHome": "ホームに戻る"
368369
},
369370
"search": {
370371
"buttonLabel": "検索",

‎apps/desktop/src/renderer/main/components/settings-sidebar.tsx‎

Lines changed: 59 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@ import * as React from "react";
22
import {
33
IconBookFilled,
44
IconBrandDiscordFilled,
5+
IconChevronLeft,
56
IconInfoCircle,
67
} from "@tabler/icons-react";
8+
import { Link, useLocation } from "@tanstack/react-router";
79
import { useTranslation } from "react-i18next";
810

911
import { NavMain } from "@/components/nav-main";
@@ -26,19 +28,22 @@ import {
2628
} from "@/utils/feature-flags";
2729
import { CommandSearchButton } from "./command-search-button";
2830
import { CreateNoteButton } from "./create-note-button";
29-
import { SETTINGS_NAV_ITEMS } from "../lib/settings-navigation";
31+
import { HOME_NAV_ITEMS, SETTINGS_NAV_ITEMS } from "../lib/settings-navigation";
3032

3133
export function SettingsSidebar({
3234
...props
3335
}: React.ComponentProps<typeof Sidebar>) {
3436
const { t } = useTranslation();
37+
const location = useLocation();
3538
const sidebarCtaFlag = useFeatureFlag(SIDEBAR_CTA_FEATURE_FLAG);
39+
const isHomeSidebar = location.pathname.startsWith("/settings/notes");
3640

3741
const sidebarCtaPayload = sidebarCtaFlag.enabled
3842
? parseSidebarCtaPayload(sidebarCtaFlag.payload)
3943
: null;
4044

41-
const navMain = SETTINGS_NAV_ITEMS.map(({ titleKey, url, icon }) => ({
45+
const navMainItems = isHomeSidebar ? HOME_NAV_ITEMS : SETTINGS_NAV_ITEMS;
46+
const navMain = navMainItems.map(({ titleKey, url, icon }) => ({
4247
title: t(titleKey),
4348
url,
4449
icon: typeof icon === "string" ? undefined : icon,
@@ -83,33 +88,59 @@ export function SettingsSidebar({
8388
className="h-[var(--titlebar-height)] shrink-0"
8489
style={{ WebkitAppRegion: "drag" } as React.CSSProperties}
8590
/>
86-
<SidebarHeader className="py-0 -mb-1">
87-
<SidebarMenu>
88-
<SidebarMenuItem>
89-
<SidebarMenuButton
90-
asChild
91-
className="data-[slot=sidebar-menu-button]:!p-1.5"
92-
>
93-
<div className="inline-flex items-center gap-2.5 font-semibold w-full">
94-
<img
95-
src="assets/logo.svg"
96-
alt={t("settings.sidebar.logoAlt")}
97-
className="!size-7"
98-
/>
99-
<span className="font-semibold">
100-
{t("settings.sidebar.brand")}
101-
</span>
91+
{isHomeSidebar ? (
92+
<SidebarHeader className="py-0 -mb-1">
93+
<SidebarMenu>
94+
<SidebarMenuItem>
95+
<SidebarMenuButton
96+
asChild
97+
className="data-[slot=sidebar-menu-button]:!p-1.5"
98+
>
99+
<div className="inline-flex items-center gap-2.5 font-semibold w-full">
100+
<img
101+
src="assets/logo.svg"
102+
alt={t("settings.sidebar.logoAlt")}
103+
className="!size-7"
104+
/>
105+
<span className="font-semibold">
106+
{t("settings.sidebar.brand")}
107+
</span>
108+
</div>
109+
</SidebarMenuButton>
110+
</SidebarMenuItem>
111+
<SidebarMenuItem>
112+
<CreateNoteButton />
113+
</SidebarMenuItem>
114+
<SidebarMenuItem>
115+
<CommandSearchButton />
116+
</SidebarMenuItem>
117+
</SidebarMenu>
118+
</SidebarHeader>
119+
) : (
120+
<SidebarHeader className="py-0 -mb-1">
121+
<SidebarMenu>
122+
<SidebarMenuItem>
123+
<SidebarMenuButton
124+
asChild
125+
className="data-[slot=sidebar-menu-button]:!p-1.5"
126+
>
127+
<Link
128+
to="/settings/notes"
129+
aria-label={t("settings.sidebar.backToHome")}
130+
>
131+
<IconChevronLeft />
132+
<span>{t("settings.sidebar.backToHome")}</span>
133+
</Link>
134+
</SidebarMenuButton>
135+
</SidebarMenuItem>
136+
<SidebarMenuItem>
137+
<div className="inline-flex items-center gap-2.5 w-full px-2 py-1.5 font-semibold">
138+
{t("menu.settings")}
102139
</div>
103-
</SidebarMenuButton>
104-
</SidebarMenuItem>
105-
<SidebarMenuItem>
106-
<CreateNoteButton />
107-
</SidebarMenuItem>
108-
<SidebarMenuItem>
109-
<CommandSearchButton />
110-
</SidebarMenuItem>
111-
</SidebarMenu>
112-
</SidebarHeader>
140+
</SidebarMenuItem>
141+
</SidebarMenu>
142+
</SidebarHeader>
143+
)}
113144
<SidebarContent>
114145
<NavMain items={navMain} />
115146
<NavSecondary items={navSecondary} className="mt-auto" />

‎apps/desktop/src/renderer/main/content.tsx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,14 @@ declare module "@tanstack/react-router" {
2626
const App: React.FC = () => {
2727
// Listen for navigation events from main process (e.g., from widget)
2828
useEffect(() => {
29+
const LEGACY_ROUTE_MAP: Record<string, string> = {
30+
"/history": "/settings/history",
31+
"/settings/account": "/settings/ai-models?tab=speech",
32+
};
33+
2934
const handleNavigate = (route: string) => {
30-
router.navigate({ to: route });
35+
const normalizedRoute = LEGACY_ROUTE_MAP[route] ?? route;
36+
router.navigate({ to: normalizedRoute });
3137
};
3238

3339
window.electronAPI?.on?.("navigate", handleNavigate);

‎apps/desktop/src/renderer/main/lib/settings-navigation.ts‎

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -11,22 +11,31 @@ import {
1111
type Icon,
1212
} from "@tabler/icons-react";
1313

14-
export interface SettingsNavItem {
14+
export interface SidebarNavItem {
1515
titleKey: string;
1616
url: string;
17-
descriptionKey: string;
1817
icon: Icon | string;
18+
}
19+
20+
export interface SettingsNavItem extends SidebarNavItem {
21+
descriptionKey: string;
1922
type: "settings";
2023
}
2124

22-
export const SETTINGS_NAV_ITEMS: SettingsNavItem[] = [
25+
export const HOME_NAV_ITEMS: SidebarNavItem[] = [
2326
{
2427
titleKey: "settings.nav.notes.title",
2528
url: "/settings/notes",
26-
descriptionKey: "settings.nav.notes.description",
2729
icon: IconNotes,
28-
type: "settings",
2930
},
31+
{
32+
titleKey: "menu.settings",
33+
url: "/settings/preferences",
34+
icon: IconSettings,
35+
},
36+
];
37+
38+
export const SETTINGS_NAV_ITEMS: SettingsNavItem[] = [
3039
{
3140
titleKey: "settings.nav.preferences.title",
3241
url: "/settings/preferences",

‎apps/desktop/src/renderer/main/routes/index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { createFileRoute, redirect } from "@tanstack/react-router";
33
export const Route = createFileRoute("/")({
44
beforeLoad: () => {
55
throw redirect({
6-
to: "/settings/history",
6+
to: "/settings/notes",
77
});
88
},
99
});

‎apps/desktop/src/types/widget-notification.ts‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ export const ERROR_CODE_CONFIG: Record<ErrorCode, WidgetNotificationConfig> = {
7676
subDescription: { key: "widget.notifications.recordingSaved" },
7777
primaryAction: {
7878
label: { key: "widget.notifications.action.logIn" },
79-
navigateTo: "/settings/account",
79+
navigateTo: "/settings/ai-models?tab=speech",
8080
},
8181
secondaryAction: {
8282
label: { key: "widget.notifications.action.support" },
@@ -92,7 +92,7 @@ export const ERROR_CODE_CONFIG: Record<ErrorCode, WidgetNotificationConfig> = {
9292
subDescription: { key: "widget.notifications.recordingSaved" },
9393
primaryAction: {
9494
label: { key: "widget.notifications.action.viewUsage" },
95-
navigateTo: "/settings/account",
95+
navigateTo: "/settings/ai-models?tab=speech",
9696
},
9797
secondaryAction: {
9898
label: { key: "widget.notifications.action.support" },
@@ -113,7 +113,7 @@ export const ERROR_CODE_CONFIG: Record<ErrorCode, WidgetNotificationConfig> = {
113113
},
114114
secondaryAction: {
115115
label: { key: "widget.notifications.action.viewHistory" },
116-
navigateTo: "/history",
116+
navigateTo: "/settings/history",
117117
},
118118
},
119119
[ErrorCodes.UNKNOWN]: {
@@ -122,7 +122,7 @@ export const ERROR_CODE_CONFIG: Record<ErrorCode, WidgetNotificationConfig> = {
122122
subDescription: { key: "widget.notifications.recordingSaved" },
123123
primaryAction: {
124124
label: { key: "widget.notifications.action.viewHistory" },
125-
navigateTo: "/history",
125+
navigateTo: "/settings/history",
126126
},
127127
secondaryAction: {
128128
label: { key: "widget.notifications.action.support" },
@@ -197,7 +197,7 @@ export const ERROR_CODE_CONFIG: Record<ErrorCode, WidgetNotificationConfig> = {
197197
subDescription: { key: "widget.notifications.recordingSaved" },
198198
primaryAction: {
199199
label: { key: "widget.notifications.action.viewHistory" },
200-
navigateTo: "/history",
200+
navigateTo: "/settings/history",
201201
},
202202
secondaryAction: {
203203
label: { key: "widget.notifications.action.support" },

0 commit comments

Comments
 (0)