Pre-generate homepage (#1699)

* Pregenerate homepage:

* fix lint

nuxt.config.ts

@@ -110,11 +110,9 @@ export default defineNuxtConfig({
         donationPlatforms?: any[]
         reportTypes?: any[]
       } = {}
-      let homePageProjects: any[] = []
 
       try {
         state = JSON.parse(await fs.readFile('./generated/state.json', 'utf8'))
-        homePageProjects = JSON.parse(await fs.readFile('./generated/homepage.json', 'utf8'))
       } catch {
         // File doesn't exist, create folder
         await fs.mkdir('./generated', { recursive: true })
@@ -127,8 +125,7 @@ export default defineNuxtConfig({
         state.lastGenerated &&
         new Date(state.lastGenerated).getTime() + TTL > new Date().getTime() &&
         // ...but only if the API URL is the same
-        state.apiUrl === API_URL &&
-        homePageProjects.length !== 0
+        state.apiUrl === API_URL
       ) {
         return
       }
@@ -143,25 +140,23 @@ export default defineNuxtConfig({
         },
       }
 
-      const [categories, loaders, gameVersions, donationPlatforms, reportTypes, projects] =
-        await Promise.all([
+      const [categories, loaders, gameVersions, donationPlatforms, reportTypes] = await Promise.all(
+        [
           $fetch(`${API_URL}tag/category`, headers),
           $fetch(`${API_URL}tag/loader`, headers),
           $fetch(`${API_URL}tag/game_version`, headers),
           $fetch(`${API_URL}tag/donation_platform`, headers),
           $fetch(`${API_URL}tag/report_type`, headers),
-          $fetch(`${API_URL}projects_random?count=40`, headers),
-        ])
+        ]
+      )
 
       state.categories = categories
       state.loaders = loaders
       state.gameVersions = gameVersions
       state.donationPlatforms = donationPlatforms
       state.reportTypes = reportTypes
-      homePageProjects = projects
 
       await fs.writeFile('./generated/state.json', JSON.stringify(state))
-      await fs.writeFile('./generated/homepage.json', JSON.stringify(homePageProjects))
 
       console.log('Tags generated!')
     },
@@ -374,6 +369,10 @@ export default defineNuxtConfig({
   devtools: {
     enabled: true,
   },
+  routeRules: {
+    '/': { prerender: true },
+    '/app': { prerender: true },
+  },
 })
 
 function getApiUrl() {

pages/app.vue

@@ -1,7 +1,6 @@
 <script setup>
 import { TrashIcon, SearchIcon, BoxIcon, SendIcon, EditIcon, DownloadIcon } from 'omorphia'
 import Avatar from '~/components/ui/Avatar.vue'
-import homepageProjects from '~/generated/homepage.json'
 import LogoAnimated from '~/components/brand/LogoAnimated.vue'
 import Badge from '~/components/ui/Badge.vue'
 import PrismIcon from '~/assets/images/external/prism.svg'
@@ -9,7 +8,6 @@ import ATLauncher from '~/assets/images/external/atlauncher.svg'
 import CurseForge from '~/assets/images/external/curseforge.svg'
 import Checkbox from '~/components/ui/Checkbox.vue'
 
-const val = Math.ceil(homepageProjects.length / 6)
 const os = ref(null)
 const macValue = ref(null)
 const downloadWindows = ref(null)
@@ -27,17 +25,23 @@ const macLinks = {
 
 let downloadLauncher
 
-const rows = shallowRef([
+const [{ data: rows }, { data: launcherUpdates }] = await Promise.all([
+  useAsyncData('projects', () => useBaseFetch('projects_random?count=40'), {
+    transform: (homepageProjects) => {
+      const val = Math.ceil(homepageProjects.length / 6)
+      return [
         homepageProjects.slice(0, val),
         homepageProjects.slice(val, val * 2),
         homepageProjects.slice(val * 2, val * 3),
         homepageProjects.slice(val * 3, val * 4),
         homepageProjects.slice(val * 4, val * 5),
-])
-
-const { data: launcherUpdates } = await useAsyncData('launcherUpdates', () =>
+      ]
+    },
+  }),
+  await useAsyncData('launcherUpdates', () =>
     $fetch('https://launcher-files.modrinth.com/updates.json')
-)
+  ),
+])
 
 macLinks.appleSilicon = launcherUpdates.value.platforms['darwin-aarch64'].install_urls[0]
 macLinks.intel = launcherUpdates.value.platforms['darwin-x86_64'].install_urls[0]

pages/index.vue

@@ -512,7 +512,6 @@ import PrismLauncherLogo from '~/assets/images/external/prism.svg'
 import ATLauncherLogo from '~/assets/images/external/atlauncher.svg'
 import Avatar from '~/components/ui/Avatar.vue'
 import ProjectCard from '~/components/ui/ProjectCard.vue'
-import homepageProjects from '~/generated/homepage.json'
 
 const searchQuery = ref('better')
 const sortType = ref('relevance')
@@ -520,15 +519,27 @@ const sortType = ref('relevance')
 const auth = await useAuth()
 const tags = useTags()
 
-const searchProjects = ref([])
-const notifications = ref([])
-const updateSearchProjects = async () => {}
-
-const val = Math.ceil(homepageProjects.length / 3)
-const rows = shallowRef([
-  homepageProjects.slice(0, val),
-  homepageProjects.slice(val, val * 2),
-  homepageProjects.slice(val * 2, val * 3),
+const [
+  { data: rows },
+  { data: searchProjects, refresh: updateSearchProjects },
+  { data: notifications },
+] = await Promise.all([
+  useAsyncData('projects', () => useBaseFetch('projects_random?count=40'), {
+    transform: (result) => {
+      const val = Math.ceil(result.length / 3)
+      return [result.slice(0, val), result.slice(val, val * 2), result.slice(val * 2, val * 3)]
+    },
+  }),
+  useAsyncData(
+    'demoSearchProjects',
+    () => useBaseFetch(`search?limit=3&query=${searchQuery.value}&index=${sortType.value}`),
+    {
+      transform: (result) => result.hits,
+    }
+  ),
+  useAsyncData('updatedProjects', () => useBaseFetch(`search?limit=3&query=&index=updated`), {
+    transform: (result) => result.hits,
+  }),
 ])
 </script>
 

pages/settings/account.vue

@@ -392,7 +392,6 @@
 <script setup>
 import {
   EditIcon,
-  UserIcon,
   SaveIcon,
   TrashIcon,
   PlusIcon,