Turn off dev mode in production, work on mod pages

components/ModResult.vue

@@ -2,11 +2,7 @@
   <div class="result rows">
     <img
       class="result-icon"
-      :src="
+      :src="iconUrl ? iconUrl : 'https://cdn.modrinth.com/placeholder.png'"
-        iconUrl
-          ? iconUrl
-          : 'https://cdn.modrinth.com/file/modrinth/placeholder.png'
-      "
       :alt="name"
     />
     <div class="rows result-name-author">

layouts/default.vue

@@ -119,6 +119,28 @@
               </svg>
               <span>Analytics</span>
             </nuxt-link>
+            <nuxt-link
+              v-if="this.$auth.user.role === 'admin'"
+              to="/dashboard/admin"
+            >
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
+                <circle cx="12" cy="12" r="10"></circle>
+                <line x1="14.31" y1="8" x2="20.05" y2="17.94"></line>
+                <line x1="9.69" y1="8" x2="21.17" y2="8"></line>
+                <line x1="7.38" y1="12" x2="13.12" y2="2.06"></line>
+                <line x1="9.69" y1="16" x2="3.95" y2="6.06"></line>
+                <line x1="14.31" y1="16" x2="2.83" y2="16"></line>
+                <line x1="16.62" y1="12" x2="10.88" y2="21.94"></line>
+              </svg>
+              <span>Admin</span>
+            </nuxt-link>
           </section>
         </section>
         <div class="disclosure">

nuxt.config.js

@@ -43,7 +43,7 @@ export default {
       {
         hid: 'og:image',
         name: 'og:image',
-        content: 'https://cdn.modrinth.com/file/modrinth/modrinth.png',
+        content: 'https://cdn.modrinth.com/modrinth.png',
       },
 
       // Twitter
@@ -67,7 +67,7 @@ export default {
       {
         hid: 'twitter:image',
         name: 'twitter:image',
-        content: 'https://cdn.modrinth.com/file/modrinth/modrinth.png',
+        content: 'https://cdn.modrinth.com/modrinth.png',
       },
     ],
     link: [
@@ -96,7 +96,7 @@ export default {
   vue: {
     config: {
       productionTip: false,
-      devtools: true,
+      devtools: false,
     },
   },
 

package.json

@@ -17,10 +17,10 @@
     "@nuxtjs/dayjs": "^1.2.0",
     "@nuxtjs/robots": "^2.4.2",
     "@nuxtjs/sitemap": "^2.4.0",
-    "dompurify": "^2.1.1",
     "marked": "^1.2.0",
-    "nuxt": "^2.14.5",
+    "nuxt": "^2.14.7",
-    "vue-multiselect": "^2.1.6"
+    "vue-multiselect": "^2.1.6",
+    "xss": "^1.0.8"
   },
   "devDependencies": {
     "@nuxtjs/color-mode": "^1.1.1",
@@ -28,8 +28,8 @@
     "@nuxtjs/eslint-module": "^2.0.0",
     "@nuxtjs/svg": "^0.1.12",
     "babel-eslint": "^10.1.0",
-    "eslint": "^7.9.0",
+    "eslint": "^7.11.0",
-    "eslint-config-prettier": "^6.11.0",
+    "eslint-config-prettier": "^6.13.0",
     "eslint-plugin-nuxt": "^1.0.0",
     "eslint-plugin-prettier": "^3.1.4",
     "node-sass": "^4.14.1",

pages/mod/_id.vue

@@ -1,10 +1,30 @@
 <template>
-  <div>{{ JSON.stringify(mod) }}</div>
+  <div class="columns">
+    <div class="content column-grow-5">
+      <div class="mod-header">
+        <img
+          :src="
+            mod.icon_url
+              ? mod.icon_url
+              : 'https://cdn.modrinth.com/placeholder.png'
+          "
+          alt="mod-icon"
+        />
+      </div>
+      <div class="markdown-body" v-html="modBody"></div>
+    </div>
+    <section class="mod-info">
+      <h3>Mod Name</h3>
+    </section>
+  </div>
 </template>
 
 <script>
 import axios from 'axios'
 
+import xss from 'xss'
+import marked from 'marked'
+
 export default {
   auth: false,
   /*
@@ -41,12 +61,11 @@ export default {
     const mod = res.data
 
     res = await axios.get(mod.body_url)
-
+    const body = xss(marked(res.data))
-    console.log(res.data)
 
     return {
       mod,
-      modBody: res.data,
+      modBody: body,
     }
   },
 }

pages/mod/create.vue

@@ -13,7 +13,7 @@
             :src="
               previewImage
                 ? previewImage
-                : 'https://cdn.modrinth.com/file/modrinth/placeholder.png'
+                : 'https://cdn.modrinth.com/placeholder.png'
             "
             alt="preview-image"
           />
@@ -283,7 +283,7 @@
 import axios from 'axios'
 import Multiselect from 'vue-multiselect'
 
-import DOMPurify from 'dompurify'
+import xss from 'xss'
 import marked from 'marked'
 
 import ExitIcon from '~/assets/images/utils/exit.svg?inline'
@@ -434,7 +434,7 @@ export default {
       this.currentVersionIndex = -1
     },
     setMarkdownBody() {
-      this.compiledBody = DOMPurify.sanitize(marked(this.body))
+      this.compiledBody = xss(marked(this.body))
     },
     getFilesSelectedText(length, defaultText) {
       if (length === 0) {