public/assets/games/Games_Nintendo.csv

@@ -0,0 +1,2 @@
+Game Name,16 by 9 image,Boxart image
+Fire Emblem Engage,,https://image.nostr.build/f9f883f88c7d1abc38b98b0aa2394684e52e10171b621011f348034ab9973476.jpg

public/assets/games/Games_Other.csv

@@ -1,4 +1,4 @@
 Game Name,16 by 9 image,Boxart image
 Minecraft,,https://image.nostr.build/b75b2d3a7855370230f2976567e2d5f913a567c57ac61adfb60c7e1102f05117.jpg
-Vintage Story,,
+Vintage Story,,https://image.nostr.build/9efe683d339cc864032a99047ce26b2b5c19fab1ec4dcc6d4db96e2785c44eda.png
-Yandere Simulator,,
+Yandere Simulator,,https://image.nostr.build/54ba56b752bb9d411cbdc1d249fa0cb74c6062a305bcd0a70ecacb61b8d50030.png

public/assets/games/Games_Steam.csv

@@ -171052,7 +171052,7 @@ Race The Sun,,
 The Cat Lady,,
 Halfway,,
 Kingdom Wars 2: Battles,,
-A Hat in Time,,
+A Hat in Time,,https://image.nostr.build/c57f62758acbd80bfa05cd7ca11be73a490acb788967bb87bd08cc895c7638e4.jpg
 Stonehearth,,
 FOTONICA,,
 Fester Mudd: Curse of the Gold - Episode 1,,
@@ -200513,7 +200513,7 @@ Circuit Superstars,,
 Battle Aces,,
 Anime Collector: Evo,,
 琉隐九绝,,
-Hogwarts Legacy,,
+Hogwarts Legacy,,https://image.nostr.build/ad464ead9d4fd8a099d346dccc8ff2d12926498fd387632c15f6cc1629f4794f.jpg
 House Flipper 2,,
 For The King II,,
 God Edge,,
@@ -201749,7 +201749,7 @@ Nose Demo,,
 Summer Clover,,
 Super Fantasy Kingdom Playtest,,
 Automobilista 2 Beta - Dedicated Server,,
-Baldur's Gate 3,,
+Baldur's Gate 3,,https://image.nostr.build/cf27d232726e2408d1c85666044f6e082b306ce48bf88a53e8feb81c8086aa5c.jpg
 MultiVersus,,
 Geometry May. I swear it's a nice free game,,
 指尖沙场,,
@@ -202104,7 +202104,7 @@ Portal BAGLEY,,
 Metal Slug Tactics,,
 Time is Life,,
 Cairn,,
-Palworld,,
+Palworld,,https://image.nostr.build/2e0113739cb67fac76ef975309fcc5790f75e84c68c9e68806cc8d72693a6f30.jpg
 TerraTech Worlds Dedicated Server,,
 CyberTD,,
 Easy Red 2,,
@@ -202398,7 +202398,7 @@ Hidden Corgi Mansion Soundtrack,,
 Aarik and the Ruined Kingdom,,
 Rust - Staging Branch,,
 竹书纪年：三国志风云录,,
-Starfield,,
+Starfield,,https://image.nostr.build/057be1e9aa57b5724169f25ee01722a607e7bed38045e6bea743a85647ed0299.jpg
 Theatre of War,,
 isekizima: Ruins and Tails Journey Playtest,,
 Pet Shop Simulator,,
@@ -202716,7 +202716,7 @@ SunnySide,,
 Cloudbuilt,,
 LONESTAR,,
 Into the Emberlands - Supporter Pack,,
-Caravan Sandwitch,,https://s2.ezgif.com/tmp/ezgif-2-a4cdee2a97.jpg
+Caravan Sandwitch,,https://image.nostr.build/cb5597718bfa7e41c7bed29fcf65dd372d88872446bae0e6dab7532fb2e45acb.jpg
 Nine Sols,,
 Stardeus,,
 Keyboard Tennis Demo,,

src/constants.ts

@@ -15,7 +15,7 @@ export const LANDING_PAGE_DATA = {
   ],
   featuredGames: [
     'Persona 3 Reload',
-    'Caravan Sandwitch',
+    'Baldur\'s Gate 3',
     'Cyberpunk 2077',
     'ELDEN RING',
     'FINAL FANTASY VII REMAKE INTERGRADE'
@@ -112,6 +112,7 @@ export const REACTIONS = {
 // NOTE: there should be a corresponding CSV file in public/assets/games folder for each entry in the array
 export const GAME_FILES = [
   'Games_Itch.csv',
+  'Games_Nintendo.csv',
   'Games_Other.csv',
   'Games_Steam.csv'
 ]

src/pages/games.tsx

@@ -1,26 +1,65 @@
 import { PaginationWithPageNumbers } from 'components/Pagination'
 import { MAX_GAMES_PER_PAGE } from 'constants.ts'
-import { useGames } from 'hooks'
+import { useDidMount, useGames } from 'hooks'
-import { useRef, useState } from 'react'
+import { useMemo, useRef, useState } from 'react'
 import { GameCard } from '../components/GameCard'
 import '../styles/pagination.css'
 import '../styles/search.css'
 import '../styles/styles.css'
 import { createSearchParams, useNavigate } from 'react-router-dom'
 import { appRoutes } from 'routes'
+import { fetchMods } from 'utils'
 
 export const GamesPage = () => {
   const navigate = useNavigate()
   const searchTermRef = useRef<HTMLInputElement>(null)
   const games = useGames()
+  const [gamesWithMods, setGamesWithMods] = useState<string[]>([])
   const [currentPage, setCurrentPage] = useState(1)
 
+  useDidMount(() => {
+    fetchMods({ limit: 100 }).then((mods) => {
+      mods.sort((a, b) => b.published_at - a.published_at)
+
+      const gameNames = new Set<string>()
+
+      mods.map((mod) => gameNames.add(mod.game))
+      setGamesWithMods(Array.from(gameNames))
+    })
+  })
+
+  const sortedGames = useMemo(() => {
+    // Create a map for the order array, assigning each game name a rank based on its index.
+    const orderMap = new Map<string, number>()
+    gamesWithMods.forEach((gameName, index) => {
+      orderMap.set(gameName, index)
+    })
+
+    const gamesArray = [...games]
+
+    return gamesArray.sort((a, b) => {
+      const indexA = orderMap.get(a['Game Name'])
+      const indexB = orderMap.get(b['Game Name'])
+
+      // Games that are not in the order array should go after those that are in the array.
+      if (indexA !== undefined && indexB !== undefined) {
+        return indexA - indexB
+      } else if (indexA !== undefined) {
+        return -1 // a comes before b
+      } else if (indexB !== undefined) {
+        return 1 // b comes before a
+      } else {
+        return 0 // keep original order if neither is in the array
+      }
+    })
+  }, [games, gamesWithMods])
+
   // Pagination logic
-  const totalGames = games.length
+  const totalGames = sortedGames.length
   const totalPages = Math.ceil(totalGames / MAX_GAMES_PER_PAGE)
   const startIndex = (currentPage - 1) * MAX_GAMES_PER_PAGE
   const endIndex = startIndex + MAX_GAMES_PER_PAGE
-  const currentGames = games.slice(startIndex, endIndex)
+  const currentGames = sortedGames.slice(startIndex, endIndex)
 
   const handlePageChange = (page: number) => {
     if (page >= 1 && page <= totalPages) {