Fix navigation for logged-out users

Fixes a bug where clicking on Profile Management, Notification Settings, or Security & Privacy in Settings while logged out resulted in a 404 error.

src/pages/Settings.tsx

@@ -1,3 +1,4 @@
+
 import React from 'react';
 import { useNavigate } from 'react-router-dom';
 import NavBar from '@/components/NavBar';
@@ -5,21 +6,30 @@ import SyncSettings from '@/components/SyncSettings';
 import { User, CreditCard, Bell, Lock, HelpCircle, LogOut, ChevronRight } from 'lucide-react';
 import { cn } from '@/lib/utils';
 import { useAuth } from '@/contexts/auth';
+import { useToast } from '@/hooks/use-toast';
 
 const SettingsOption = ({
   icon: Icon,
   label,
   description,
   onClick,
-  color = "text-neuro-income"
+  color = "text-neuro-income",
+  disabled = false
 }: {
   icon: React.ElementType;
   label: string;
   description?: string;
   onClick?: () => void;
   color?: string;
+  disabled?: boolean;
 }) => {
-  return <div className="neuro-flat p-4 transition-all duration-300 hover:shadow-neuro-convex cursor-pointer" onClick={onClick}>
+  return <div 
+    className={cn(
+      "neuro-flat p-4 transition-all duration-300 hover:shadow-neuro-convex", 
+      disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"
+    )} 
+    onClick={disabled ? undefined : onClick}
+  >
       <div className="flex items-center">
         <div className={cn("neuro-pressed p-3 rounded-full mr-4", color)}>
           <Icon size={20} />
@@ -36,12 +46,26 @@ const SettingsOption = ({
 const Settings = () => {
   const navigate = useNavigate();
   const { user, signOut } = useAuth();
+  const { toast } = useToast();
   
   const handleLogout = async () => {
     await signOut();
     navigate('/login');
   };
   
+  const handleProtectedRouteClick = (path: string, label: string) => {
+    if (!user) {
+      toast({
+        title: "로그인 필요",
+        description: `${label}에 접근하려면 로그인이 필요합니다.`,
+        variant: "destructive",
+      });
+      navigate('/login');
+    } else {
+      navigate(path);
+    }
+  };
+  
   return <div className="min-h-screen bg-neuro-background pb-24">
       <div className="max-w-md mx-auto px-6">
         {/* Header */}
@@ -73,15 +97,40 @@ const Settings = () => {
         {/* Settings Options */}
         <div className="space-y-4 mb-8">
           <h2 className="text-sm font-medium text-gray-500 mb-2 px-2">계정</h2>
-          <SettingsOption icon={User} label="프로필 관리" description="프로필 및 비밀번호 설정" onClick={() => navigate('/profile-management')} />
-          <SettingsOption icon={CreditCard} label="결제 방법" description="카드 및 은행 계좌 관리" onClick={() => navigate('/payment-methods')} />
-          <SettingsOption icon={Bell} label="알림 설정" description="앱 알림 및 리마인더" onClick={() => navigate('/notification-settings')} />
+          <SettingsOption 
+            icon={User} 
+            label="프로필 관리" 
+            description="프로필 및 비밀번호 설정" 
+            onClick={() => handleProtectedRouteClick('/profile', '프로필 관리')} 
+          />
+          <SettingsOption 
+            icon={CreditCard} 
+            label="결제 방법" 
+            description="카드 및 은행 계좌 관리" 
+            onClick={() => handleProtectedRouteClick('/payment-methods', '결제 방법')} 
+          />
+          <SettingsOption 
+            icon={Bell} 
+            label="알림 설정" 
+            description="앱 알림 및 리마인더" 
+            onClick={() => handleProtectedRouteClick('/notifications', '알림 설정')} 
+          />
         </div>
         
         <div className="space-y-4 mb-8">
           <h2 className="text-sm font-medium text-gray-500 mb-2 px-2">앱 설정</h2>
-          <SettingsOption icon={Lock} label="보안 및 개인정보" description="보안 및 데이터 설정" onClick={() => navigate('/security-privacy-settings')} />
-          <SettingsOption icon={HelpCircle} label="도움말 및 지원" description="FAQ 및 고객 지원" onClick={() => navigate('/help-support')} />
+          <SettingsOption 
+            icon={Lock} 
+            label="보안 및 개인정보" 
+            description="보안 및 데이터 설정" 
+            onClick={() => handleProtectedRouteClick('/security-privacy', '보안 및 개인정보')} 
+          />
+          <SettingsOption 
+            icon={HelpCircle} 
+            label="도움말 및 지원" 
+            description="FAQ 및 고객 지원" 
+            onClick={() => navigate('/help-support')} 
+          />
         </div>
         
         <div className="mt-8">