fix: show the version footer in the settings sidebar only with advanced settings on

components/settings/__tests__/settings-section-links.test.tsx

@@ -22,7 +22,11 @@ vi.mock('@/hooks/use-config', () => ({ useConfig: () => ({ appName: 'Mail', stal
 vi.mock('@/components/layout/navigation-rail', () => ({ NavigationRail: () => null }));
 vi.mock('@/components/layout/sidebar-apps-modal', () => ({ SidebarAppsModal: () => null }));
 vi.mock('@/components/plugins/app-top-banner-slot', () => ({ AppTopBannerSlot: () => null }));
-vi.mock('@/components/settings/appearance-settings', () => ({ AppearanceSettings: () => <div>appearance pane</div> }));
+vi.mock('@/components/settings/about-data-settings', () => ({
+  AboutDataSettings: () => null,
+  AboutFooter: () => <div data-testid="about-footer" />,
+}));
+vi.mock('@/components/settings/appearance-settings',() => ({ AppearanceSettings: () => <div>appearance pane</div> }));
 vi.mock('@/components/settings/organize-settings', () => ({
   OrganizeSettings: () => (
     <div>
@@ -111,4 +115,11 @@ describe('settings section links', () => {
     await waitFor(() => expect(useSettingsStore.getState().showAdvancedSettings).toBe(true), { timeout: 3000 });
     await waitFor(() => expect(scrolled).toContain('downloads'));
   });
+
+  it('shows the version footer in the sidebar only with Advanced on', () => {
+    render(<SettingsApp />);
+    expect(screen.queryByTestId('about-footer')).toBeNull();
+    fireEvent.click(screen.getByTestId('settings-advanced-switch'));
+    expect(screen.getByTestId('about-footer')).toBeInTheDocument();
+  });
 });

components/settings/settings-app.tsx

@@ -373,6 +373,7 @@ export function SettingsApp({ linkSegments: routeSegments }: SettingsAppProps =
   // plugins/themes/sidebar apps).
   const touchScreen = useMediaQuery('(pointer: coarse)');
   const mountainViewLayout = useSettingsStore((s) => s.interfaceLayout === 'mountain-view');
+  const showAdvanced = useSettingsStore((s) => s.showAdvancedSettings);
   const multiAccount = useAccountStore((s) => s.accounts.length > 0);
   const { tabSearchHaystacks, tabSubResults } = useMemo(() => {
     const haystacks: Partial<Record<Tab, string>> = {};
@@ -1032,7 +1033,7 @@ export function SettingsApp({ linkSegments: routeSegments }: SettingsAppProps =
 
           <div className="border-t border-border px-2 py-2">
             <AdvancedSettingsSwitch />
-            <AboutFooter />
+            {showAdvanced && <AboutFooter />}
           </div>
           <div className="border-t border-border px-5 py-3">
             <button
@@ -1197,7 +1198,7 @@ export function SettingsApp({ linkSegments: routeSegments }: SettingsAppProps =
         </div>
         <div className="border-t border-border px-1 py-1">
           <AdvancedSettingsSwitch />
-          <AboutFooter />
+          {showAdvanced && <AboutFooter />}
         </div>
       </div>