Fix URL bug + Redundant call (#1110)

* Fix URL bug + Redundant call

* Fix prettier

composables/user.js

@@ -14,21 +14,18 @@ export const initUser = async () => {
   const user = {
     notifications: [],
     follows: [],
-    projects: [],
     lastUpdated: 0,
   }
 
   if (auth.user && auth.user.id) {
     try {
-      const [notifications, follows, projects] = await Promise.all([
+      const [notifications, follows] = await Promise.all([
         useBaseFetch(`user/${auth.user.id}/notifications`, auth.headers),
         useBaseFetch(`user/${auth.user.id}/follows`, auth.headers),
-        useBaseFetch(`user/${auth.user.id}/projects`, auth.headers),
       ])
 
       user.notifications = notifications
       user.follows = follows
-      user.projects = projects
       user.lastUpdated = Date.now()
     } catch (err) {
       console.error(err)

helpers/parse.js

@@ -56,6 +56,32 @@ export const configuredXss = new xss.FilterXSS({
       return name + '="' + xss.escapeAttrValue(value) + '"'
     }
   },
+  safeAttrValue(tag, name, value, _cssFilter) {
+    if (tag === 'img' && name === 'src') {
+      try {
+        const url = new URL(value)
+
+        const allowedHostnames = [
+          'imgur.com',
+          'i.imgur.com',
+          'cdn-raw.modrinth.com',
+          'cdn.modrinth.com',
+          'staging-cdn-raw.modrinth.com',
+          'staging-cdn.modrinth.com',
+          'github.com',
+          'raw.githubusercontent.com',
+          'img.shields.io',
+          'i.postimg.cc',
+        ]
+
+        if (!allowedHostnames.includes(url.hostname)) {
+          return `https://wsrv.nl/?url=${encodeURIComponent(value)}`
+        }
+      } catch (err) {}
+    }
+
+    return value
+  },
 })
 
 export const md = (options = {}) => {
@@ -94,45 +120,6 @@ export const md = (options = {}) => {
     return defaultLinkOpenRenderer(tokens, idx, options, env, self)
   }
 
-  const defaultImageRenderer =
-    md.renderer.rules.image ||
-    function (tokens, idx, options, _env, self) {
-      return self.renderToken(tokens, idx, options)
-    }
-
-  md.renderer.rules.image = function (tokens, idx, options, env, self) {
-    const token = tokens[idx]
-    const index = token.attrIndex('src')
-
-    if (index !== -1) {
-      const src = token.attrs[index][1]
-
-      try {
-        const url = new URL(src)
-
-        const allowedHostnames = [
-          'imgur.com',
-          'i.imgur.com',
-          'cdn-raw.modrinth.com',
-          'cdn.modrinth.com',
-          'staging-cdn-raw.modrinth.com',
-          'staging-cdn.modrinth.com',
-          'github.com',
-          'raw.githubusercontent.com',
-          'img.shields.io',
-          'i.postimg.cc',
-        ]
-
-        if (allowedHostnames.includes(url.hostname)) {
-          return defaultImageRenderer(tokens, idx, options, env, self)
-        }
-      } catch (err) {}
-      token.attrs[index][1] = `//wsrv.nl/?url=${encodeURIComponent(src)}`
-    }
-
-    return defaultImageRenderer(tokens, idx, options, env, self)
-  }
-
   return md
 }
 

package.json

@@ -8,7 +8,7 @@
     "postinstall": "nuxi prepare",
     "lint:js": "eslint --ext .js,.vue,.ts,.jsx,.tsx,.html,.vue .",
     "lint": "npm run lint:js && prettier --check .",
-    "fix": "eslint --fix --ext .js,.vue,.ts,.jsx,.tsx,.html,.vue ."
+    "fix": "eslint --fix --ext .js,.vue,.ts,.jsx,.tsx,.html,.vue . && prettier --write ."
   },
   "devDependencies": {
     "@nuxtjs/eslint-config-typescript": "^12.0.0",

pages/dashboard/index.vue

@@ -6,7 +6,7 @@
         <div class="grid-display__item">
           <div class="label">Total downloads</div>
           <div class="value">
-            {{ $formatNumber(user.projects.reduce((agg, x) => agg + x.downloads, 0)) }}
+            {{ $formatNumber(projects.reduce((agg, x) => agg + x.downloads, 0)) }}
           </div>
           <span
             >from
@@ -23,7 +23,7 @@
         <div class="grid-display__item">
           <div class="label">Total followers</div>
           <div class="value">
-            {{ $formatNumber(user.projects.reduce((agg, x) => agg + x.followers, 0)) }}
+            {{ $formatNumber(projects.reduce((agg, x) => agg + x.followers, 0)) }}
           </div>
           <span>
             <span
@@ -88,18 +88,19 @@ useHead({
 const auth = await useAuth()
 const app = useNuxtApp()
 
-const [raw] = await Promise.all([
+const [rawProjects, rawPayouts] = await Promise.all([
+  useBaseFetch(`user/${auth.value.user.id}/projects`, app.$defaultHeaders()),
   useBaseFetch(`user/${auth.value.user.id}/payouts`, app.$defaultHeaders()),
 ])
-const user = await useUser()
 
-const payouts = ref(raw)
+const projects = shallowRef(rawProjects)
+const payouts = ref(rawPayouts)
 const minWithdraw = ref(0.26)
 
 const downloadsProjectCount = computed(
-  () => user.value.projects.filter((project) => project.downloads > 0).length
+  () => projects.value.filter((project) => project.downloads > 0).length
 )
 const followersProjectCount = computed(
-  () => user.value.projects.filter((project) => project.followers > 0).length
+  () => projects.value.filter((project) => project.followers > 0).length
 )
 </script>