Merge origin/main and resolve PR conflicts

Agent-Logs-Url: https://github.com/devsuoa/devsuoa-devs-sesa-beginner-hackathon-2026-hot-encoded/sessions/c3164bed-425e-4ce9-a0e9-757ae0b61413

Co-authored-by: emac129 <174770429+emac129@users.noreply.github.com>

Author: Copilot

.github/workflows/deploy.yml

@@ -28,6 +28,8 @@ jobs:
 
       - run: npm ci
       - run: npm run build
+        env:
+          VITE_GEMINI_API_KEY: ${{ secrets.VITE_GEMINI_API_KEY }}
 
       - uses: actions/configure-pages@v5
 

package-lock.json

@@ -10,6 +10,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "framer-motion": "^12.38.0",
     "lucide-react": "^1.8.0",
     "react": "^19.2.4",
     "react-dom": "^19.2.4",

package.json

@@ -4,10 +4,10 @@ import Preferences from './pages/Preferences';
 import Home from './pages/home/Home';
 import Explore from './pages/Explore';
 import Chat from './pages/Chat';
+import { RocketTransition } from './components/RocketTransition';
 
 function App() {
   const location = useLocation();
-  const hideExploreLink = location.pathname === '/' || location.pathname === '/preferences';
   const isHomePage = location.pathname === '/';
 
   return (
@@ -29,6 +29,8 @@ function App() {
           <Route path="/chat/:id" element={<Chat />} />
         </Routes>
       </main>
+
+      <RocketTransition />
     </div>
   );
 }

src/App.tsx

@@ -1,23 +1,23 @@
 import { useEffect } from 'react';
 import type { AlienProfile } from '../data/mockAliens';
-import { useNavigate } from 'react-router';
 import { Heart } from 'lucide-react';
+import { useRocketNav } from '../context/TransitionContext';
 
 interface MatchOverlayProps {
   alien: AlienProfile;
   userName: string;
 }
 
 export default function MatchOverlay({ alien, userName }: MatchOverlayProps) {
-  const navigate = useNavigate();
+  const triggerRocketNav = useRocketNav();
 
   useEffect(() => {
-    // Automatically redirect to chat after 3 seconds
+    // Trigger rocket navigation after 2 seconds (giving time to see the match)
     const timer = setTimeout(() => {
-      navigate(`/chat/${alien.id}`);
-    }, 3000);
+      triggerRocketNav(`/chat/${alien.id}`);
+    }, 2000);
     return () => clearTimeout(timer);
-  }, [navigate, alien.id]);
+  }, [triggerRocketNav, alien.id]);
 
   return (
     <div style={{

src/components/MatchOverlay.tsx

@@ -5,13 +5,14 @@ import { mockAliens } from '../data/mockAliens';
 import type { AlienProfile } from '../data/mockAliens';
 import { useAppContext } from '../context/AppContext';
 import ProfileModal from './ProfileModal';
-import MatchOverlay from './MatchOverlay';
+import { getCompatibility } from '../utils/compatibility';
+import { useRocketNav } from '../context/TransitionContext';
 
 export default function OrbitSystem() {
   const navigate = useNavigate();
   const { preferences, addMatch, matches } = useAppContext();
+  const triggerRocketNav = useRocketNav();
   const [selectedAlien, setSelectedAlien] = useState<AlienProfile | null>(null);
-  const [matchedAlien, setMatchedAlien] = useState<AlienProfile | null>(null);
   const [dismissedIds, setDismissedIds] = useState<Set<string>>(new Set());
   const [showBreakingAnim, setShowBreakingAnim] = useState(false);
   const [animStage, setAnimStage] = useState<'none' | 'heart' | 'break' | 'final'>('none');
@@ -30,6 +31,10 @@ export default function OrbitSystem() {
       !activeIds.includes(a.id)
     );
 
+    // Sort available aliens by compatibility descending, so the queue is ordered
+    // from highest match to lowest match. The next alien pulled will always be the highest remaining match.
+    available.sort((a, b) => getCompatibility(b, preferences) - getCompatibility(a, preferences));
+
     let changed = false;
     const newActiveIds = [...activeIds];
 
@@ -69,7 +74,7 @@ export default function OrbitSystem() {
   const handleMatch = (alien: AlienProfile) => {
     addMatch(alien);
     setSelectedAlien(null);
-    setMatchedAlien(alien);
+    triggerRocketNav(`/chat/${alien.id}`, { alienImg: alien.profilePic });
   };
 
   const handleDismiss = (alien: AlienProfile) => {
@@ -78,10 +83,28 @@ export default function OrbitSystem() {
       newSet.add(alien.id);
       return newSet;
     });
-    setSelectedAlien(null);
+
+    // Find the next available alien in activeIds
+    const currentIndex = activeIds.indexOf(alien.id);
+    let nextId = null;
+    if (currentIndex >= 0) {
+      for(let i=1; i<5; i++) {
+        const candidate = activeIds[(currentIndex + i) % 5];
+        if (candidate && candidate !== alien.id) {
+          nextId = candidate;
+          break;
+        }
+      }
+    }
+
+    if (nextId) {
+      const nextAlien = mockAliens.find(a => a.id === nextId);
+      setSelectedAlien(nextAlien || null);
+    } else {
+      setSelectedAlien(null);
+    }
   };
 
-  const visibleAliens = mockAliens.filter(a => activeIds.includes(a.id));
 
   return (
     <>
@@ -173,11 +196,12 @@ export default function OrbitSystem() {
         )}
 
         {/* Orbit Rings and Aliens */}
-        {activeIds.map((id, i) => {
-          if (!id) return null; // If no alien is available for this slot, don't render it
-
-          const alien = mockAliens.find(a => a.id === id);
-          if (!alien) return null;
+        {activeIds
+          .map(id => id ? mockAliens.find(a => a.id === id) : null)
+          .filter((a): a is AlienProfile => a !== null && a !== undefined)
+          // Sort by compatibility descending so the highest match is in the innermost track
+          .sort((a, b) => getCompatibility(b, preferences) - getCompatibility(a, preferences))
+          .map((alien, i) => {
 
           // Assign each slot to a distinct track (0 to 4)
           const rx = 120 + (i * 65);
@@ -291,12 +315,6 @@ export default function OrbitSystem() {
         />
       )}
 
-      {matchedAlien && (
-        <MatchOverlay
-          alien={matchedAlien}
-          userName={preferences.name || 'User'}
-        />
-      )}
     </>
   );
 }