grids

backend/routes/worlds.go

@@ -37,6 +37,7 @@ func InitWorldsRoutes() {
 		http.HandleFunc("/unfavorite-world-devnet", unfavoriteWorldDevnet)
 		http.HandleFunc("/place-world-pixel-devnet", placeWorldPixelDevnet)
 	}
+	http.HandleFunc("/get-all-worlds", getAllWorlds)
 }
 
 func InitWorldsStaticRoutes() {
@@ -751,3 +752,32 @@ func doesWorldNameExist(name string) (bool, error) {
 	}
 	return *exists, nil
 }
+
+func getAllWorlds(w http.ResponseWriter, r *http.Request) {
+	routeutils.SetupAccessHeaders(w)
+
+	query := `
+        SELECT 
+            worlds.*,
+            COALESCE(favorite_count, 0) AS favorites,
+            false as favorited
+        FROM 
+            worlds
+        LEFT JOIN (
+            SELECT 
+                world_id, 
+                COUNT(*) AS favorite_count
+            FROM 
+                worldfavorites
+            GROUP BY 
+                world_id
+        ) worldfavorites ON worlds.world_id = worldfavorites.world_id
+        ORDER BY worlds.world_id`
+
+	worlds, err := core.PostgresQueryJson[WorldData](query)
+	if err != nil {
+		routeutils.WriteErrorJson(w, http.StatusInternalServerError, "Failed to retrieve Worlds")
+		return
+	}
+	routeutils.WriteDataJson(w, string(worlds))
+}

frontend/src/App.js

@@ -27,7 +27,11 @@ import {
 } from './utils/Consts.js';
 import logo from './resources/logo.png';
 import canvasConfig from './configs/canvas.config.json';
-import { fetchWrapper, getTodaysStartTime } from './services/apiService.js';
+import {
+  fetchWrapper,
+  getTodaysStartTime,
+  getAllWorldsFn
+} from './services/apiService.js';
 import art_peace_abi from './contracts/art_peace.abi.json';
 import username_store_abi from './contracts/username_store.abi.json';
 import canvas_nft_abi from './contracts/canvas_nft.abi.json';
@@ -1156,6 +1160,24 @@ function App() {
     fetchPixelData();
   }, [overlayTemplate]);
 
+  const [allWorlds, setAllWorlds] = useState([]);
+
+  // Add useEffect to fetch all worlds
+  useEffect(() => {
+    const fetchAllWorlds = async () => {
+      try {
+        const response = await getAllWorldsFn();
+        if (response.data) {
+          setAllWorlds(response.data);
+        }
+      } catch (error) {
+        console.error('Error fetching worlds:', error);
+      }
+    };
+
+    fetchAllWorlds();
+  }, []); // Empty dependency array means this runs once on mount
+
   return (
     <div className='App'>
       <div className='App--background'>
@@ -1225,6 +1247,8 @@ function App() {
           setIsEraserMode={setIsEraserMode}
           clearExtraPixel={clearExtraPixel}
           setLastPlacedTime={setLastPlacedTime}
+          worlds={allWorlds}
+          setOpenedWorldId={setOpenedWorldId}
         />
         {(!isMobile || activeTab === tabs[0]) && (
           <div className='App__logo'>

frontend/src/services/apiService.js

@@ -188,3 +188,7 @@ export const getLikedNftsFn = async (params) => {
     `get-liked-nfts?address=${queryAddress}&page=${page}&pageLength=${pageLength}`
   );
 };
+
+export const getAllWorldsFn = async () => {
+  return await fetchWrapper('get-all-worlds');
+};