Revert "Add expo-linear-gradient dependency and update related components."

app.json

@@ -40,8 +40,7 @@
         }
       ],
       "expo-asset",
-      "expo-font",
-      "expo-video"
+      "expo-font"
     ],
     "experiments": {
       "typedRoutes": true,

app/(tabs)/_layout.tsx

@@ -1,13 +1,12 @@
 import { Tabs } from "expo-router";
-import { StyleSheet, View } from "react-native";
+import { View } from "react-native";
 
 import { BottomTabBar } from "@/components/bottom-tab-bar";
 import { SearchOverlay } from "@/components/search/search-overlay";
-import { SPACE_SCREEN_BASE, SPACE_TAB_BAR_BG } from "@/constants/space-theme";
 
 export default function TabsLayout() {
   return (
-    <View style={styles.root}>
+    <View style={{ flex: 1 }}>
       <Tabs
         initialRouteName="explore"
         tabBar={(props) => <BottomTabBar {...props} />}
@@ -18,7 +17,7 @@ export default function TabsLayout() {
             left: 0,
             right: 0,
             bottom: 0,
-            backgroundColor: SPACE_TAB_BAR_BG,
+            backgroundColor: "transparent",
             borderTopWidth: 0,
             elevation: 0,
             shadowOpacity: 0,
@@ -35,10 +34,3 @@ export default function TabsLayout() {
     </View>
   );
 }
-
-const styles = StyleSheet.create({
-  root: {
-    flex: 1,
-    backgroundColor: SPACE_SCREEN_BASE,
-  },
-});

app/(tabs)/explore.tsx

@@ -1,11 +1,10 @@
 import { StatusBar } from "expo-status-bar";
 import { useEffect } from "react";
-import { StyleSheet, View } from "react-native";
+import { View } from "react-native";
 
 import { ExploreError } from "@/components/explore/explore-error";
 import { ExploreFeed } from "@/components/explore/explore-feed";
 import { ExploreLoading } from "@/components/explore/explore-loading";
-import { SavedSpaceBackground } from "@/components/saved/saved-space-background";
 import { useCountryFeedStore } from "@/store/use-country-feed-store";
 import { useSpatialContextStore } from "@/store/use-spatial-context-store";
 
@@ -69,9 +68,8 @@ export default function ExploreScreen() {
     countries.length > 0 || selectedRegion !== null || discoveryMode === "here";
 
   return (
-    <View style={styles.screen}>
+    <View className="flex-1 bg-midnight-navy">
       <StatusBar style="light" />
-      <SavedSpaceBackground />
 
       {showError ? (
         <ExploreError
@@ -94,10 +92,3 @@ export default function ExploreScreen() {
     </View>
   );
 }
-
-const styles = StyleSheet.create({
-  screen: {
-    flex: 1,
-    backgroundColor: "#0b132b",
-  },
-});

app/(tabs)/map.tsx

@@ -1,7 +1,7 @@
 import { Ionicons } from "@expo/vector-icons";
 import { useBottomTabBarHeight } from "@react-navigation/bottom-tabs";
 import { StatusBar } from "expo-status-bar";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 import {
   ActivityIndicator,
   Pressable,
@@ -21,19 +21,12 @@ import { MapDiscoveryChrome } from "@/components/map/map-discovery-chrome";
 import { MapOnboardingSheet } from "@/components/map/map-onboarding-sheet";
 import { MapRandomCountryHint } from "@/components/map/map-random-country-hint";
 import { MapRegionChrome } from "@/components/map/map-region-chrome";
-import { MapSearchResultsPanel } from "@/components/map/map-search-results-panel";
-import {
-  getMapSearchPanelTop,
-  MapTopChrome,
-} from "@/components/map/map-top-chrome";
+import { MapSearchRow } from "@/components/map/map-search-row";
 import { MapTopChromeScrim } from "@/components/map/map-top-chrome-scrim";
-import { WORLDLOOP_HEADER_TOP_PADDING } from "@/components/worldloop-header";
 import { continentDisplayLabel } from "@/constants/regions";
 import { useMapLogic } from "@/hooks/use-map-logic";
 import { resolveGlobeAutoRotateEnabled } from "@/lib/globe-rotation";
-import type { MapCluster } from "@/lib/map-clusters";
 import { openExploreHere, openExploreRegion } from "@/lib/open-explore-here";
-import { useSearchUiStore } from "@/store/use-search-ui-store";
 import { useSpatialContextStore } from "@/store/use-spatial-context-store";
 
 /** Preview card "back to continent" action — off until UX is finalized. */
@@ -48,9 +41,6 @@ export default function MapScreen() {
   const mapRef = useRef<MapCanvasHandle>(null);
 
   const map = useMapLogic(mapRef);
-  const isMapSearchOpen = useSearchUiStore(
-    (s) => s.isOpen && s.context === "map",
-  );
   const viewportCountryCount = useSpatialContextStore(
     (s) => s.viewportCountryCount,
   );
@@ -121,17 +111,6 @@ export default function MapScreen() {
   const discoveryChromeLabelMode = discoveryChromeFromRegionActive
     ? "region"
     : "viewport";
-  const handleMenuContinentSelect = useCallback(
-    (cluster: MapCluster) => {
-      if (map.focusedRegion === cluster.region) {
-        map.handleBackToContinent();
-        return;
-      }
-      map.requestContinentFocus(cluster);
-    },
-    [map],
-  );
-
   const discoveryChromeCount = discoveryChromeFromRegionActive
     ? regionCountryCount
     : viewportCountryCount;
@@ -204,24 +183,14 @@ export default function MapScreen() {
 
         {!previewOverlayActive ? (
           <>
-            <MapTopChromeScrim
-              paddingTop={insets.top + WORLDLOOP_HEADER_TOP_PADDING}
-              compact={isMapSearchOpen}
-            />
-            <View pointerEvents="box-none" style={{ zIndex: 1 }}>
-              <MapTopChrome
-                focusedRegion={map.focusedRegion}
-                clusters={map.clusters}
-                onSelectContinent={handleMenuContinentSelect}
-                onSelectWorld={map.handleBackToWorld}
-              />
+            <MapTopChromeScrim paddingTop={insets.top + 12} />
+            <View
+              pointerEvents="box-none"
+              className="gap-1.5"
+              style={{ paddingTop: insets.top + 12, zIndex: 1 }}
+            >
+              <MapSearchRow />
             </View>
-
-            {isMapSearchOpen ? (
-              <MapSearchResultsPanel
-                panelTop={getMapSearchPanelTop(insets.top)}
-              />
-            ) : null}
           </>
         ) : null}
 
@@ -311,15 +280,15 @@ export default function MapScreen() {
           />
         ) : null}
 
-        {map.randomCountryHint && !isMapSearchOpen ? (
+        {map.randomCountryHint ? (
           <MapRandomCountryHint
             country={map.randomCountryHint}
             bottom={randomHintBottom}
             onDismiss={() => map.setRandomCountryHint(null)}
           />
         ) : null}
 
-        {!previewOverlayActive && !isMapSearchOpen ? (
+        {!previewOverlayActive ? (
           <MapControls
             mapMode={map.mapMode}
             mapViewTransition={map.mapViewTransition}

app/(tabs)/profile.tsx

@@ -1,16 +1,6 @@
-import { router } from "expo-router";
-import { Pressable, ScrollView, Text, View } from "react-native";
-
-import { useOnboardingStore } from "@/store/use-onboarding-store";
+import { ScrollView, Text, View } from "react-native";
 
 export default function ProfileScreen() {
-  const resetOnboarding = useOnboardingStore((state) => state.resetOnboarding);
-
-  const handleOpenOnboarding = () => {
-    resetOnboarding();
-    router.replace("/onboarding");
-  };
-
   return (
     <ScrollView
       className="flex-1 bg-background"
@@ -21,19 +11,6 @@ export default function ProfileScreen() {
         <Text className="h2">Profile</Text>
         <Text className="body-md">Coming in a later lesson</Text>
       </View>
-
-      {__DEV__ ? (
-        <Pressable
-          accessibilityRole="button"
-          accessibilityLabel="View onboarding again"
-          onPress={handleOpenOnboarding}
-          className="mt-8 self-start"
-        >
-          <Text className="font-semibold text-sm text-ocean-blue">
-            View onboarding again
-          </Text>
-        </Pressable>
-      ) : null}
     </ScrollView>
   );
 }

app/(tabs)/saved.tsx

@@ -84,12 +84,12 @@ export default function SavedScreen() {
   );
 
   const isEmpty = mapCountries.length === 0;
+  const isMapView = !isEmpty && !selectedCountry;
   const selectedIndex = selectedCountry
     ? detailCountries.findIndex(
         (country) => country.name === selectedCountry.name,
       )
     : -1;
-  const isMapView = !isEmpty && selectedIndex < 0;
 
   return (
     <SafeAreaView style={styles.screen}>
@@ -109,7 +109,7 @@ export default function SavedScreen() {
               showExploreCta
             />
           </Animated.View>
-        ) : selectedIndex >= 0 ? (
+        ) : selectedCountry && selectedIndex >= 0 ? (
           <Animated.View
             entering={FadeIn.duration(320)}
             exiting={FadeOut.duration(200)}

app/_layout.tsx

@@ -34,7 +34,6 @@ export default function RootLayout() {
         }}
       >
         <Stack.Screen name="index" />
-        <Stack.Screen name="onboarding" />
         <Stack.Screen name="(tabs)" />
         <Stack.Screen name="country" options={{ headerShown: false }} />
         {__DEV__ ? <Stack.Screen name="dev" /> : null}

app/country/[name]/ai-explorer.tsx

@@ -15,11 +15,8 @@ import { focusCountryOnMap } from "@/lib/open-country-on-map";
  * Route: app/country/[name]/ai-explorer.tsx (stack modal, tab bar hidden).
  */
 export default function AIContentExplorerScreen() {
-  const { country, loading, refreshing, wikipedia, landmarks } =
-    useAiExplorerCountry();
-  const overviewLoading = refreshing && !wikipedia?.extract?.trim();
+  const { country, loading, wikipedia, landmarks } = useAiExplorerCountry();
   const images = getCountryImages(country);
-  const showPageLoader = loading && !country.name;
 
   const handleShowMap = useCallback(() => {
     focusCountryOnMap(country, "explore");
@@ -35,7 +32,7 @@ export default function AIContentExplorerScreen() {
         contentContainerStyle={styles.scrollContent}
         showsVerticalScrollIndicator={false}
       >
-        {showPageLoader ? (
+        {loading ? (
           <View style={styles.loadingWrap}>
             <ActivityIndicator size="large" color={AI_EXPLORER_THEME.primary} />
           </View>
@@ -45,7 +42,6 @@ export default function AIContentExplorerScreen() {
             images={images}
             wikipedia={wikipedia}
             landmarks={landmarks}
-            overviewLoading={overviewLoading}
             onBack={() => router.back()}
             onShowMap={handleShowMap}
           />

app/index.tsx

@@ -1,31 +1,5 @@
 import { Redirect } from "expo-router";
-import { useEffect, useState } from "react";
-
-import { useOnboardingStore } from "@/store/use-onboarding-store";
 
 export default function Index() {
-  const hasCompletedOnboarding = useOnboardingStore(
-    (state) => state.hasCompletedOnboarding,
-  );
-  const [hydrated, setHydrated] = useState(
-    useOnboardingStore.persist.hasHydrated(),
-  );
-
-  useEffect(() => {
-    if (hydrated) return;
-
-    return useOnboardingStore.persist.onFinishHydration(() => {
-      setHydrated(true);
-    });
-  }, [hydrated]);
-
-  if (!hydrated) {
-    return null;
-  }
-
-  if (!hasCompletedOnboarding) {
-    return <Redirect href="/onboarding" />;
-  }
-
   return <Redirect href="/(tabs)/explore" />;
 }

backend/src/controllers/profile.controller.ts

@@ -22,11 +22,8 @@ export async function getCountryProfile(
     const [wikipedia, landmarks] = await Promise.all([
       getWikipediaForCountry(withAi.name),
       getLandmarksForCountry(withAi.name, withAi.images ?? [], {
-        cca2: withAi.cca2,
-        countryName: withAi.name,
         capital: withAi.capital,
         latlng: withAi.latlng,
-        area: withAi.area,
       }),
     ]);
 

backend/src/services/cache.service.ts

@@ -51,7 +51,7 @@ export const cacheKeys = {
   ai: (name: string) => `ai:${name.toLowerCase()}`,
   news: (name: string) => `news:${name.trim().toLowerCase()}`,
   wikipedia: (name: string) => `wikipedia:${name.trim().toLowerCase()}`,
-  landmarks: (cca2: string) => `landmarks:v6:${cca2.trim().toUpperCase()}`,
+  landmarks: (name: string) => `landmarks:v4:${name.trim().toLowerCase()}`,
 } as const;
 
 let client: RedisClientType | null = null;