Update master with new auth (#1236)

* Begin UI for threads and moderation overhaul

* Hide close button on non-report threads

* Fix review age coloring

* Add project count

* Remove action buttons from queue page and add queued date to project page

* Hook up to actual data

* Remove unused icon

* Get up to 1000 projects in queue

* prettier

* more prettier

* Changed all the things

* lint

* rebuild

* Add omorphia

* Workaround formatjs bug in ThreadSummary.vue

* Fix notifications page on prod

* Fix a few notifications and threads bugs

* lockfile

* Fix duplicate button styles

* more fixes and polishing

* More fixes

* Remove legacy pages

* More bugfixes

* Add some error catching for reports and notifications

* More error handling

* fix lint

* Add inbox links

* Remove loading component and rename member header

* Rely on threads always existing

* Handle if project update notifs are not grouped

* oops

* Fix chips on notifications page

* Import ModalModeration

* finish threads

* New authentication (#1234)

* Initial new auth work

* more auth pages

* Finish most

* more

* fix on landing page

* Finish everything but PATs + Sessions

* fix threads merge bugs

* fix cf pages ssr

* fix most issues

* Finish authentication

* Fix merge

---------

Co-authored-by: triphora <emma@modrinth.com>
Co-authored-by: Jai A <jaiagr+gpg@pm.me>
Co-authored-by: Geometrically <18202329+Geometrically@users.noreply.github.com>

pages/moderation/index.vue

@@ -38,9 +38,5 @@ useHead({
   title: 'Staff overview - Modrinth',
 })
 
-const app = useNuxtApp()
-
-const { data: stats } = await useAsyncData('statistics', () =>
-  useBaseFetch('statistics', app.$defaultHeaders())
-)
+const { data: stats } = await useAsyncData('statistics', () => useBaseFetch('statistics'))
 </script>

pages/moderation/messages.vue

@@ -8,6 +8,7 @@
         :key="thread.id"
         :thread="thread"
         :link="getLink(thread)"
+        :auth="auth"
       />
     </section>
   </div>
@@ -19,11 +20,8 @@ useHead({
   title: 'Moderation inbox - Modrinth',
 })
 
-const app = useNuxtApp()
-
-const { data: inbox } = await useAsyncData('thread/inbox', () =>
-  useBaseFetch('thread/inbox', app.$defaultHeaders())
-)
+const auth = await useAuth()
+const { data: inbox } = await useAsyncData('thread/inbox', () => useBaseFetch('thread/inbox'))
 
 function getLink(thread) {
   if (thread.report_id) {

pages/moderation/report/[id].vue

@@ -1,5 +1,6 @@
 <template>
   <ReportView
+    :auth="auth"
     :report-id="route.params.id"
     :breadcrumbs-stack="[{ href: '/moderation/reports', label: 'Reports' }]"
   />
@@ -7,6 +8,7 @@
 <script setup>
 import ReportView from '~/components/ui/report/ReportView.vue'
 
+const auth = await useAuth()
 const route = useRoute()
 
 useHead({

pages/moderation/reports.vue

@@ -2,13 +2,14 @@
   <div>
     <section class="universal-card">
       <h2>Reports</h2>
-      <ReportsList moderation />
+      <ReportsList :auth="auth" moderation />
     </section>
   </div>
 </template>
 <script setup>
 import ReportsList from '~/components/ui/report/ReportsList.vue'
 
+const auth = await useAuth()
 useHead({
   title: 'Reports - Modrinth',
 })

pages/moderation/review.vue

@@ -103,7 +103,7 @@ const TIME_24H = 86400000
 const TIME_48H = TIME_24H * 2
 
 const { data: projects } = await useAsyncData('moderation/projects?count=1000', () =>
-  useBaseFetch('moderation/projects?count=1000', app.$defaultHeaders())
+  useBaseFetch('moderation/projects?count=1000')
 )
 const members = ref([])
 const projectType = ref('all')
@@ -145,37 +145,30 @@ const projectTypes = computed(() => {
 if (projects.value) {
   const teamIds = projects.value.map((x) => x.team)
 
-  await useAsyncData(
-    'teams?ids=' + JSON.stringify(teamIds),
-    () => useBaseFetch('teams?ids=' + JSON.stringify(teamIds), app.$defaultHeaders()),
-    {
-      transform: (result) => {
-        if (result) {
-          members.value = result
+  const url = `teams?ids=${encodeURIComponent(JSON.stringify(teamIds))}`
+  const { data: result } = await useAsyncData(url, () => useBaseFetch(url))
 
-          projects.value = projects.value.map((project) => {
-            project.owner = members.value
-              .flat()
-              .find((x) => x.team_id === project.team && x.role === 'Owner').user
-            project.age = project.queued ? now - app.$dayjs(project.queued) : Number.MAX_VALUE
-            project.age_warning = ''
-            if (project.age > TIME_24H * 2) {
-              project.age_warning = 'danger'
-            } else if (project.age > TIME_24H) {
-              project.age_warning = 'warning'
-            }
-            project.inferred_project_type = app.$getProjectTypeForUrl(
-              project.project_type,
-              project.loaders
-            )
-            return project
-          })
-        }
+  if (result.value) {
+    members.value = result.value
 
-        return result
-      },
-    }
-  )
+    projects.value = projects.value.map((project) => {
+      project.owner = members.value
+        .flat()
+        .find((x) => x.team_id === project.team && x.role === 'Owner').user
+      project.age = project.queued ? now - app.$dayjs(project.queued) : Number.MAX_VALUE
+      project.age_warning = ''
+      if (project.age > TIME_24H * 2) {
+        project.age_warning = 'danger'
+      } else if (project.age > TIME_24H) {
+        project.age_warning = 'warning'
+      }
+      project.inferred_project_type = app.$getProjectTypeForUrl(
+        project.project_type,
+        project.loaders
+      )
+      return project
+    })
+  }
 }
 </script>
 <style lang="scss" scoped>