logout button

src/blog/components/Profile.tsx

@@ -17,7 +17,7 @@ interface ProfileProps {
 }
 
 export default function Profile({ onBack }: ProfileProps) {
-  const { currentUser, loading, error, token, refreshAuthors, updateProfile } = useAuth();
+  const { currentUser, loading, error, logout, updateProfile } = useAuth();
   const [formData, setFormData] = React.useState({
     username: currentUser?.username || '',
     name: currentUser?.name || '',
@@ -56,6 +56,10 @@ export default function Profile({ onBack }: ProfileProps) {
     }
   };
 
+  const handleLogout = async () => {
+    logout()
+  }
+
   if (!currentUser) {
     return (
       <Box
@@ -161,6 +165,15 @@ export default function Profile({ onBack }: ProfileProps) {
       >
         {saving ? <CircularProgress size={24} color="inherit" /> : 'Save Changes'}
       </Button>
+      <Button
+        fullWidth
+        variant="contained"
+        color="error"
+        sx={{ mt: 3 }}
+        onClick={handleLogout}
+      >
+        Logout
+      </Button>
     </Box>
   );
 }