refactor: upgrade to vue-showdown4

app/package.json

@@ -25,7 +25,7 @@
     "vue": "3.3.4",
     "vue-i18n": "^9.10.1",
     "vue-router": "^4.3.0",
-    "vue-showdown": "^2.4.1",
+    "vue-showdown": "^4.2.0",
     "vuex": "^4.1.0"
   },
   "devDependencies": {

app/src/components/globals/FormField.vue

@@ -36,7 +36,6 @@
         <VueShowdown
           v-if="description"
           :markdown="description"
-          flavor="github"
           :class="{
             ['alert p-1 px-2 alert-' + descriptionVariant]: descriptionVariant,
           }"

app/src/components/globals/formItems/MarkdownItem.vue

@@ -1,5 +1,5 @@
 <template>
-  <VueShowdown :markdown="label" flavor="github" />
+  <VueShowdown :markdown="label" />
 </template>
 
 <script>

app/src/components/globals/formItems/ReadOnlyAlertItem.vue

@@ -6,12 +6,7 @@
   >
     <YIcon :iname="icon_" class="mr-md-3 mb-md-0 mb-2" :variant="type" />
 
-    <VueShowdown
-      :markdown="label"
-      flavor="github"
-      tag="span"
-      class="markdown"
-    />
+    <VueShowdown :markdown="label" tag="span" class="markdown" />
   </BAlert>
 </template>
 

app/src/main.js

@@ -1,7 +1,7 @@
 import { createApp, configureCompat } from 'vue'
 import App from './App.vue'
 import BootstrapVue from 'bootstrap-vue'
-import VueShowdown from 'vue-showdown'
+import { VueShowdownPlugin } from 'vue-showdown'
 
 import store from './store'
 import router from './router'
@@ -29,7 +29,8 @@ app.use(BootstrapVue, {
   BBadge: { pill: true },
 })
 
-app.use(VueShowdown, {
+app.use(VueShowdownPlugin, {
+  flavor: 'github',
   options: {
     emoji: true,
   },

app/src/views/app/AppInfo.vue

@@ -32,7 +32,6 @@
         v-for="[name, notif] in app.doc.notifications.postInstall"
         :key="name"
         :markdown="notif"
-        flavor="github"
         :options="{ headerLevelStart: 4 }"
       />
     </YAlert>
@@ -64,7 +63,6 @@
         v-for="[name, notif] in app.doc.notifications.postUpgrade"
         :key="name"
         :markdown="notif"
-        flavor="github"
         :options="{ headerLevelStart: 4 }"
       />
     </YAlert>
@@ -118,7 +116,7 @@
         </a>
       </p>
 
-      <VueShowdown :markdown="app.description" flavor="github" />
+      <VueShowdown :markdown="app.description" />
     </section>
 
     <YAlert v-if="config_panel_err" class="mb-4" variant="danger" icon="bug">
@@ -279,7 +277,7 @@
             <YIcon iname="book" class="mr-2" />
             {{ name === 'admin' ? $t('app.doc.admin.title') : name }}
           </template>
-          <VueShowdown :markdown="content" flavor="github" />
+          <VueShowdown :markdown="content" />
         </BTab>
       </BTabs>
     </BCard>

app/src/views/app/AppInstall.vue

@@ -27,7 +27,7 @@
           </template>
         </p>
 
-        <VueShowdown :markdown="app.description" flavor="github" />
+        <VueShowdown :markdown="app.description" />
 
         <BImg
           v-if="app.screenshot"
@@ -120,11 +120,7 @@
           v-t="'app.install.problems.lowquality'"
         />
 
-        <VueShowdown
-          v-if="app.preInstall"
-          :markdown="app.preInstall"
-          flavor="github"
-        />
+        <VueShowdown v-if="app.preInstall" :markdown="app.preInstall" />
       </YAlert>
 
       <YAlert

app/src/views/update/SystemUpdate.vue

@@ -127,7 +127,6 @@
             <BCardBody>
               <VueShowdown
                 :markdown="notif"
-                flavor="github"
                 :options="{ headerLevelStart: 6 }"
               />
             </BCardBody>