fix: removed viewType from browser Settings Atom, converted to using path to identify pages

components/ViewToggle.tsx

@@ -2,30 +2,26 @@
 
 import { browserSettingsAtom, habitsAtom, settingsAtom } from '@/lib/atoms'
 import { HabitIcon, TaskIcon } from '@/lib/constants'
-import type { ViewType } from '@/lib/types'
 import { cn, isHabitDueToday } from '@/lib/utils'
 import { useAtom } from 'jotai'
 import { NotificationBadge } from './ui/notification-badge'
+import { usePathname, useRouter } from 'next/navigation'
 
 interface ViewToggleProps {
-  defaultView?: ViewType
   className?: string
 }
 
 export function ViewToggle({
-  defaultView = 'habits',
   className
 }: ViewToggleProps) {
   const [browserSettings, setBrowserSettings] = useAtom(browserSettingsAtom)
   const [habits] = useAtom(habitsAtom)
   const [settings] = useAtom(settingsAtom)
+  const pathname = usePathname();
+  const router = useRouter();
 
-  const handleViewChange = (checked: boolean) => {
-    const newView = checked ? 'tasks' : 'habits'
-    setBrowserSettings({
-      ...browserSettings,
-      viewType: newView,
-    })
+  const handleViewChange = () => {
+    router.push(pathname.includes("habits") ? "/tasks" : "/habits");
   }
 
   // Calculate due tasks count
@@ -37,10 +33,10 @@ export function ViewToggle({
     <div className={cn('inline-flex rounded-full bg-muted/50 h-8', className)}>
       <div className="relative flex gap-0.5 rounded-full bg-background p-0.5 h-full">
         <button
-          onClick={() => handleViewChange(false)}
+          onClick={handleViewChange}
           className={cn(
             'relative z-10 rounded-full px-4 py-2 text-sm font-medium transition-colors flex items-center gap-2',
-            browserSettings.viewType === 'habits' ? 'text-primary-foreground' : 'text-muted-foreground hover:text-foreground'
+            pathname.includes('habits') ? 'text-primary-foreground' : 'text-muted-foreground hover:text-foreground'
           )}
         >
           <HabitIcon className="h-4 w-4" />
@@ -49,14 +45,14 @@ export function ViewToggle({
         <NotificationBadge 
           label={dueTasksCount}
           show={dueTasksCount > 0}
-          variant={browserSettings.viewType === 'tasks' ? 'secondary' : 'default'}
+          variant={pathname.includes('tasks') ? 'secondary' : 'default'}
           className="shadow-md"
         >
           <button
-            onClick={() => handleViewChange(true)}
+            onClick={handleViewChange}
             className={cn(
               'relative z-10 rounded-full px-4 py-2 text-sm font-medium transition-colors flex items-center gap-2',
-              browserSettings.viewType === 'tasks' ? 'text-primary-foreground' : 'text-muted-foreground hover:text-foreground'
+              pathname.includes('tasks') ? 'text-primary-foreground' : 'text-muted-foreground hover:text-foreground'
             )}
           >
             <TaskIcon className="h-4 w-4" />
@@ -66,7 +62,7 @@ export function ViewToggle({
         <div
           className={cn(
             'absolute left-0.5 top-0.5 h-[calc(100%-0.25rem)] rounded-full bg-primary transition-transform',
-            browserSettings.viewType === 'habits' ? 'w-[calc(50%-0.125rem)]' : 'w-[calc(50%-0.125rem)] translate-x-[calc(100%+0.125rem)]'
+            pathname.includes('habits') ? 'w-[calc(50%-0.125rem)]' : 'w-[calc(50%-0.125rem)] translate-x-[calc(100%+0.125rem)]'
           )}
         />
       </div>