Fix: storage issue overwriting refresh on page.

Author: appo357

src/App.tsx

@@ -5,7 +5,6 @@ import Home from './pages/home/Home';
 import Explore from './pages/Explore';
 import Chat from './pages/Chat';
 import { RocketTransition } from './components/RocketTransition';
-import UserProfileWidget from './components/UserProfileWidget';
 
 function App() {
   const location = useLocation();
@@ -20,7 +19,6 @@ function App() {
           </Link>
         </div>
       )}
-      {!isHomePage && <UserProfileWidget />}
 
       <main className="main-content">
         <Routes>

src/context/AppContext.tsx

@@ -20,6 +20,7 @@ export interface UserPreferences {
 interface AppContextType {
   preferences: UserPreferences | null;
   setPreferences: (prefs: UserPreferences) => void;
+  clearPreferences: () => void;
   matches: AlienProfile[];
   addMatch: (alien: AlienProfile) => void;
 }
@@ -50,14 +51,21 @@ export const AppProvider = ({ children }: { children: ReactNode }) => {
     setPreferencesState(prefs);
   };
 
+  const clearPreferences = () => {
+    setPreferencesState(null);
+    setMatches([]);
+    localStorage.removeItem('aligned_preferences');
+    localStorage.removeItem('aligned_matches');
+  };
+
   const addMatch = (alien: AlienProfile) => {
     if (!matches.find(m => m.id === alien.id)) {
       setMatches([...matches, alien]);
     }
   };
 
   return (
-    <AppContext.Provider value={{ preferences, setPreferences, matches, addMatch }}>
+    <AppContext.Provider value={{ preferences, setPreferences, clearPreferences, matches, addMatch }}>
       {children}
     </AppContext.Provider>
   );

src/pages/home/Home.tsx

@@ -1,7 +1,16 @@
+import { useEffect } from 'react';
 import { Link } from 'react-router';
+import { useAppContext } from '../../context/AppContext';
 import styles from "./Home.module.css";
 
 function Home() {
+  const { clearPreferences } = useAppContext();
+
+  // Reset all user data when returning to the home page
+  useEffect(() => {
+    clearPreferences();
+  }, []);
+
   return (
     <div className={styles.homeContainer}>
       <img src={`${import.meta.env.BASE_URL}SSTRUK-logo.png?v=5`} alt="SSTRUK Logo" className={styles.logo} />