move to cloudflare workers (#1229)

* move to cloudflare workers

* remove junk

.gitignore

@@ -5,7 +5,9 @@ node_modules
 .cache
 .output
 .env
+.dev.vars
 dist
+.wrangler/
 
 generated/
 !.gitkeep

nuxt.config.ts

@@ -258,8 +258,10 @@ export default defineNuxtConfig({
     },
   },
   runtimeConfig: {
-    apiBaseUrl: process.env.BASE_URL ?? getApiUrl(),
+    // @ts-ignore
-    rateLimitKey: process.env.RATE_LIMIT_IGNORE_KEY,
+    apiBaseUrl: process.env.BASE_URL ?? globalThis.BASE_URL ?? getApiUrl(),
+    // @ts-ignore
+    rateLimitKey: process.env.RATE_LIMIT_IGNORE_KEY ?? globalThis.RATE_LIMIT_IGNORE_KEY,
     public: {
       apiBaseUrl: getApiUrl(),
       ariadneBaseUrl: getAriadneUrl(),
@@ -294,11 +296,13 @@ export default defineNuxtConfig({
 })
 
 function getApiUrl() {
-  return process.env.BROWSER_BASE_URL ?? STAGING_API_URL
+  // @ts-ignore
+  return process.env.BROWSER_BASE_URL ?? globalThis.BROWSER_BASE_URL ?? STAGING_API_URL
 }
 
 function getAriadneUrl() {
-  return process.env.BROWSER_ARIADNE_URL ?? STAGING_ARIADNE_URL
+  // @ts-ignore
+  return process.env.BROWSER_ARIADNE_URL ?? globalThis.BROWSER_ARIADNE_URL ?? STAGING_ARIADNE_URL
 }
 
 function getDomain() {

package.json

@@ -5,7 +5,7 @@
     "dev": "nuxi dev",
     "generate": "nuxi generate",
     "preview": "nuxi preview",
-    "postinstall": "nuxi prepare",
+    "postinstall": "nuxi prepare && patch-package",
     "lint:js": "eslint . --ext .js,.vue,.ts",
     "lint": "npm run lint:js && prettier --check .",
     "fix": "eslint . --fix --ext .js,.vue,.ts && prettier --write .",
@@ -33,7 +33,8 @@
     "typescript": "^5.0.4",
     "vite-plugin-eslint": "^1.8.1",
     "vite-svg-loader": "^4.0.0",
-    "vue-tsc": "^1.6.5"
+    "vue-tsc": "^1.6.5",
+    "patch-package": "^7.0.0"
   },
   "dependencies": {
     "@ltd/j-toml": "^1.38.0",

pages/search/[searchProjectType].vue

@@ -341,7 +341,7 @@
     </section>
   </div>
 </template>
-<script>
+<script setup>
 import { Multiselect } from 'vue-multiselect'
 import ProjectCard from '~/components/ui/ProjectCard.vue'
 import Pagination from '~/components/ui/Pagination.vue'
@@ -361,39 +361,9 @@ import ImageIcon from '~/assets/images/utils/image.svg'
 
 import Promotion from '~/components/ads/Promotion.vue'
 
-export default defineNuxtComponent({
+const sidebarMenuOpen = ref(false)
-  components: {
+const showAllLoaders = ref(false)
-    LogoAnimated,
-    Promotion,
-    ProjectCard,
-    Pagination,
-    Multiselect,
-    SearchFilter,
-    Checkbox,
-    ClientIcon,
-    ServerIcon,
-    SearchIcon,
-    ClearIcon,
-    FilterIcon,
-    GridIcon,
-    ListIcon,
-    ImageIcon,
-  },
-  data() {
-    return {
-      previousMaxResults: 20,
 
-      maxResultsForView: {
-        list: [5, 10, 15, 20, 50, 100],
-        grid: [6, 12, 18, 24, 48, 96],
-        gallery: [6, 10, 16, 20, 50, 100],
-      },
-
-      sidebarMenuOpen: false,
-      showAllLoaders: false,
-    }
-  },
-  setup() {
 const data = useNuxtApp()
 const route = useRoute()
 
@@ -491,7 +461,7 @@ export default defineNuxtComponent({
     const params = [`limit=${maxResults.value}`, `index=${sortType.value.name}`]
 
     if (query.value.length > 0) {
-          params.push(`query=${query.value.replace(/ /g, '+')}`)
+      params.push(`query=${encodeURIComponent(query.value.replace(/ /g, '+'))}`)
     }
 
     if (
@@ -511,9 +481,7 @@ export default defineNuxtComponent({
         formattedFacets.push(orFacets.value)
       } else if (projectType.value.id === 'plugin') {
         formattedFacets.push(
-              data.$tag.loaderData.allPluginLoaders.map(
+          data.$tag.loaderData.allPluginLoaders.map((x) => `categories:'${encodeURIComponent(x)}'`)
-                (x) => `categories:'${encodeURIComponent(x)}'`
-              )
         )
       } else if (projectType.value.id === 'mod') {
         formattedFacets.push(
@@ -521,9 +489,7 @@ export default defineNuxtComponent({
         )
       } else if (projectType.value.id === 'datapack') {
         formattedFacets.push(
-              data.$tag.loaderData.dataPackLoaders.map(
+          data.$tag.loaderData.dataPackLoaders.map((x) => `categories:'${encodeURIComponent(x)}'`)
-                (x) => `categories:'${encodeURIComponent(x)}'`
-              )
         )
       }
 
@@ -568,7 +534,7 @@ export default defineNuxtComponent({
         formattedFacets.push([`project_type:${projectType.value.actual}`])
       }
 
-          params.push(`facets=${JSON.stringify(formattedFacets)}`)
+      params.push(`facets=${encodeURIComponent(JSON.stringify(formattedFacets))}`)
     }
 
     const offset = (currentPage.value - 1) * maxResults.value
@@ -587,7 +553,7 @@ export default defineNuxtComponent({
     return `${base}${url}`
   },
   {
-        transform(hits) {
+    transform: (hits) => {
       noLoad.value = false
       return hits
     },
@@ -599,7 +565,7 @@ export default defineNuxtComponent({
   results.value ? Math.ceil(results.value.total_hits / results.value.limit) : 1
 )
 
-    const onSearchChange = (newPageNumber) => {
+function onSearchChange(newPageNumber) {
   noLoad.value = true
 
   currentPage.value = newPageNumber
@@ -617,7 +583,7 @@ export default defineNuxtComponent({
   }
 }
 
-    const getSearchUrl = (offset, useObj) => {
+function getSearchUrl(offset, useObj) {
   const queryItems = []
   const obj = {}
 
@@ -675,33 +641,10 @@ export default defineNuxtComponent({
   return useObj ? obj : url
 }
 
-    return {
+const categoriesMap = computed(() => {
-      query,
-      results,
-      facets,
-      orFacets,
-      selectedVersions,
-      onlyOpenSource,
-      showSnapshots,
-      selectedEnvironments,
-      sortTypes,
-      sortType,
-      maxResults,
-      currentPage,
-      pageCount,
-      projectType,
-      onSearchChange,
-      getSearchUrl,
-      searchLoading,
-      noLoad,
-      metaDescription,
-    }
-  },
-  computed: {
-    categoriesMap() {
   const categories = {}
 
-      for (const category of this.$sortedCategories) {
+  for (const category of data.$sortedCategories) {
     if (categories[category.header]) {
       categories[category.header].push(category)
     } else {
@@ -709,129 +652,138 @@ export default defineNuxtComponent({
     }
   }
 
-      const newVals = Object.keys(categories).reduce((obj, key) => {
+  return Object.keys(categories).reduce((obj, key) => {
     obj[key] = categories[key]
     return obj
   }, {})
+})
 
-      return newVals
+function clearFilters() {
-    },
+  for (const facet of [...facets.value]) {
-  },
+    toggleFacet(facet, true)
-  methods: {
-    clearFilters() {
-      for (const facet of [...this.facets]) {
-        this.toggleFacet(facet, true)
   }
-      for (const facet of [...this.orFacets]) {
+  for (const facet of [...orFacets.value]) {
-        this.toggleOrFacet(facet, true)
+    toggleOrFacet(facet, true)
   }
 
-      this.onlyOpenSource = false
+  onlyOpenSource.value = false
-      this.selectedVersions = []
+  selectedVersions.value = []
-      this.selectedEnvironments = []
+  selectedEnvironments.value = []
-      this.onSearchChange(1)
+  onSearchChange(1)
-    },
+}
-    toggleFacet(elementName, doNotSendRequest = false) {
+
-      const index = this.facets.indexOf(elementName)
+function toggleFacet(elementName, doNotSendRequest = false) {
+  const index = facets.value.indexOf(elementName)
 
   if (index !== -1) {
-        this.facets.splice(index, 1)
+    facets.value.splice(index, 1)
   } else {
-        this.facets.push(elementName)
+    facets.value.push(elementName)
   }
 
   if (!doNotSendRequest) {
-        this.onSearchChange(1)
+    onSearchChange(1)
   }
-    },
+}
-    toggleOrFacet(elementName, doNotSendRequest) {
+
-      const index = this.orFacets.indexOf(elementName)
+function toggleOrFacet(elementName, doNotSendRequest) {
+  const index = orFacets.value.indexOf(elementName)
   if (index !== -1) {
-        this.orFacets.splice(index, 1)
+    orFacets.value.splice(index, 1)
   } else {
     if (elementName === 'categories:purpur') {
-          if (!this.orFacets.includes('categories:paper')) {
+      if (!orFacets.value.includes('categories:paper')) {
-            this.orFacets.push('categories:paper')
+        orFacets.value.push('categories:paper')
       }
-          if (!this.orFacets.includes('categories:spigot')) {
+      if (!orFacets.value.includes('categories:spigot')) {
-            this.orFacets.push('categories:spigot')
+        orFacets.value.push('categories:spigot')
       }
-          if (!this.orFacets.includes('categories:bukkit')) {
+      if (!orFacets.value.includes('categories:bukkit')) {
-            this.orFacets.push('categories:bukkit')
+        orFacets.value.push('categories:bukkit')
       }
     } else if (elementName === 'categories:paper') {
-          if (!this.orFacets.includes('categories:spigot')) {
+      if (!orFacets.value.includes('categories:spigot')) {
-            this.orFacets.push('categories:spigot')
+        orFacets.value.push('categories:spigot')
       }
-          if (!this.orFacets.includes('categories:bukkit')) {
+      if (!orFacets.value.includes('categories:bukkit')) {
-            this.orFacets.push('categories:bukkit')
+        orFacets.value.push('categories:bukkit')
       }
     } else if (elementName === 'categories:spigot') {
-          if (!this.orFacets.includes('categories:bukkit')) {
+      if (!orFacets.value.includes('categories:bukkit')) {
-            this.orFacets.push('categories:bukkit')
+        orFacets.value.push('categories:bukkit')
       }
     } else if (elementName === 'categories:waterfall') {
-          if (!this.orFacets.includes('categories:bungeecord')) {
+      if (!orFacets.value.includes('categories:bungeecord')) {
-            this.orFacets.push('categories:bungeecord')
+        orFacets.value.push('categories:bungeecord')
       }
     }
-        this.orFacets.push(elementName)
+    orFacets.value.push(elementName)
   }
 
   if (!doNotSendRequest) {
-        this.onSearchChange(1)
+    onSearchChange(1)
   }
-    },
+}
-    toggleEnv(environment, sendRequest) {
+
-      const index = this.selectedEnvironments.indexOf(environment)
+function toggleEnv(environment, sendRequest) {
+  const index = selectedEnvironments.value.indexOf(environment)
   if (index !== -1) {
-        this.selectedEnvironments.splice(index, 1)
+    selectedEnvironments.value.splice(index, 1)
   } else {
-        this.selectedEnvironments.push(environment)
+    selectedEnvironments.value.push(environment)
   }
 
   if (!sendRequest) {
-        this.onSearchChange(1)
+    onSearchChange(1)
   }
-    },
+}
-    onSearchChangeToTop(newPageNumber) {
+
+function onSearchChangeToTop(newPageNumber) {
   if (process.client) {
     window.scrollTo({ top: 0, behavior: 'smooth' })
   }
 
-      this.onSearchChange(newPageNumber)
+  onSearchChange(newPageNumber)
-    },
+}
-    onMaxResultsChange(newPageNumber) {
+
+function cycleSearchDisplayMode() {
+  data.$cosmetics.searchDisplayMode[projectType.value.id] = data.$cycleValue(
+    data.$cosmetics.searchDisplayMode[projectType.value.id],
+    data.$tag.projectViewModes
+  )
+  saveCosmetics()
+  setClosestMaxResults()
+}
+
+const previousMaxResults = ref(20)
+const maxResultsForView = ref({
+  list: [5, 10, 15, 20, 50, 100],
+  grid: [6, 12, 18, 24, 48, 96],
+  gallery: [6, 10, 16, 20, 50, 100],
+})
+
+function onMaxResultsChange(newPageNumber) {
   newPageNumber = Math.max(
     1,
     Math.min(
-          Math.floor(newPageNumber / (this.maxResults / this.previousMaxResults)),
+      Math.floor(newPageNumber / (maxResults.value / previousMaxResults.value)),
-          this.pageCount
+      pageCount.value
     )
   )
-      this.previousMaxResults = this.maxResults
+  previousMaxResults.value = maxResults.value
-      this.onSearchChange(newPageNumber)
+  onSearchChange(newPageNumber)
-    },
+}
-    cycleSearchDisplayMode() {
+
-      this.$cosmetics.searchDisplayMode[this.projectType.id] = this.$cycleValue(
+function setClosestMaxResults() {
-        this.$cosmetics.searchDisplayMode[this.projectType.id],
+  const view = data.$cosmetics.searchDisplayMode[projectType.value.id]
-        this.$tag.projectViewModes
+  const maxResultsOptions = maxResultsForView.value[view] ?? [20]
-      )
+  const currentMax = maxResults.value
-      saveCosmetics()
-      this.setClosestMaxResults()
-    },
-    setClosestMaxResults() {
-      const view = this.$cosmetics.searchDisplayMode[this.projectType.id]
-      const maxResultsOptions = this.maxResultsForView[view] ?? [20]
-      const currentMax = this.maxResults
   if (!maxResultsOptions.includes(currentMax)) {
-        this.maxResults = maxResultsOptions.reduce(function (prev, curr) {
+    maxResults.value = maxResultsOptions.reduce(function (prev, curr) {
       return Math.abs(curr - currentMax) <= Math.abs(prev - currentMax) ? curr : prev
     })
   }
-    },
+}
-  },
-})
 </script>
 
 <style lang="scss" scoped>

wrangler.toml

@@ -0,0 +1,9 @@
+name = "knossos"
+main = "./.output/server/index.mjs"
+workers_dev = true
+compatibility_date = "2022-07-12"
+account_id = "9ddae624c98677d68d93df6e524a6061"
+node_compat = true
+
+[site]
+bucket = ".output/public"