refactor: clean up dead files, restructure nav, align QuickStartPage to monochrome

- Delete 6 unused files: ThemeToggle, themeStore, AppLayout-original,
  QuickStartPage-Enhanced, UpgradePrompt, SettingsPage
- Restructure Account/Settings navigation: merge Settings into Account page,
  make AccountSettingsPage the /account index, remove orphaned /account-settings route
- Remove "Settings" nav item (consolidated under Account)
- Add export preferences and team categories link to AccountSettingsPage
- Align QuickStartPage to monochrome design system: replace cyan/blue/violet
  accent colors with white opacity variants
- Replace non-functional search button with search spinner indicator

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Michael Chihlas
2026-02-10 17:46:35 -05:00
parent 89d343d49a
commit e5e5922097
11 changed files with 76 additions and 777 deletions

View File

@@ -1,16 +1,20 @@
import { useEffect, useState } from 'react'
import { Building2, Users, Mail, Crown, Loader2, AlertCircle, Check, X } from 'lucide-react'
import { Link } from 'react-router-dom'
import { Building2, Users, Mail, Crown, Loader2, AlertCircle, Check, X, Settings, FolderTree } from 'lucide-react'
import { accountsApi } from '@/api'
import type { Account, AccountMember, AccountInvite } from '@/types'
import { cn } from '@/lib/utils'
import { usePermissions } from '@/hooks/usePermissions'
import { useSubscription } from '@/hooks/useSubscription'
import { useAuthStore } from '@/store/authStore'
import { useUserPreferencesStore } from '@/store/userPreferencesStore'
import { CheckoutButton } from '@/components/subscription/CheckoutButton'
import { toast } from '@/lib/toast'
export function AccountSettingsPage() {
const { isAccountOwner } = usePermissions()
const { plan, limits, usage } = useSubscription()
const { defaultExportFormat, setDefaultExportFormat } = useUserPreferencesStore()
const subscription = useAuthStore((s) => s.subscription)
const [account, setAccount] = useState<Account | null>(null)
@@ -442,6 +446,60 @@ export function AccountSettingsPage() {
)}
</div>
)}
{/* Team Categories Link (owners only) */}
{isAccountOwner && (
<Link
to="/account/categories"
className="glass-card rounded-2xl p-4 sm:p-6 flex items-center justify-between group hover:border-white/20 transition-all"
>
<div className="flex items-center gap-3">
<FolderTree className="h-5 w-5 text-white/50" />
<div>
<h2 className="text-lg font-semibold text-white">Team Categories</h2>
<p className="text-sm text-white/40">Manage tree categories for your team</p>
</div>
</div>
<span className="text-white/30 group-hover:text-white transition-colors">&rarr;</span>
</Link>
)}
{/* Preferences Section */}
<div className="glass-card rounded-2xl p-4 sm:p-6">
<div className="flex items-center gap-2">
<Settings className="h-5 w-5 text-white/50" />
<h2 className="text-lg font-semibold text-white">Preferences</h2>
</div>
<div className="mt-4">
<label
htmlFor="export-format"
className="block text-sm font-medium text-white"
>
Default Export Format
</label>
<p className="text-sm text-white/40">
This format will be pre-selected when exporting sessions
</p>
<select
id="export-format"
value={defaultExportFormat}
onChange={(e) => {
setDefaultExportFormat(e.target.value as 'markdown' | 'text' | 'html')
toast.success('Preference saved')
}}
className={cn(
'mt-2 block w-full max-w-xs rounded-xl border border-white/10 bg-black/50 px-3 py-2',
'text-sm text-white',
'focus:border-white/30 focus:outline-none focus:ring-1 focus:ring-white/20'
)}
>
<option value="markdown">Markdown (.md)</option>
<option value="text">Plain Text (.txt)</option>
<option value="html">HTML (.html)</option>
</select>
</div>
</div>
</div>
</div>
)