refactor: convert settings page to separate view panels

- Replace scroll-based navigation with view switching
- Add useSettingsView hook for managing active panel state
- Extract Audio section into its own component
- Remove scroll-mt-6 classes and IDs from section components
- Update navigation config to reflect current sections
- Create barrel export for settings-view hooks

This improves performance by only rendering the active section
instead of all sections in a single scrollable container.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

apps/app/src/components/views/settings-view/hooks/use-settings-view.ts

@@ -0,0 +1,29 @@
+import { useState, useCallback } from "react";
+
+export type SettingsViewId =
+  | "api-keys"
+  | "claude"
+  | "appearance"
+  | "keyboard"
+  | "audio"
+  | "defaults"
+  | "danger";
+
+interface UseSettingsViewOptions {
+  initialView?: SettingsViewId;
+}
+
+export function useSettingsView({
+  initialView = "api-keys",
+}: UseSettingsViewOptions = {}) {
+  const [activeView, setActiveView] = useState<SettingsViewId>(initialView);
+
+  const navigateTo = useCallback((viewId: SettingsViewId) => {
+    setActiveView(viewId);
+  }, []);
+
+  return {
+    activeView,
+    navigateTo,
+  };
+}