tooling: switch to Volar

Signed-off-by: Varun Patil <radialapps@gmail.com>

.vscode/settings.json

@@ -84,7 +84,6 @@
   "[vue]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
-  "vetur.experimental.templateInterpolationService": true,
   "[typescript]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },

README.md

@@ -59,7 +59,8 @@ Memories is a _batteries-included_ photo management solution for Nextcloud with
    - [PHP-CS-Fixer](https://marketplace.visualstudio.com/items?itemName=muuvmuuv.vscode-just-php-cs-fixer): For PHP formatting (alternatively, `make php-cs-fixer`)
    - [Psalm](https://marketplace.visualstudio.com/items?itemName=getpsalm.psalm-vscode-plugin): For PHP static analysis (alternatively, `make psalm`)
    - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode): For autoformatting Vue and Typescript
-   - [Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur): For Vue intellisense and static analysis
+   - [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar): For Vue intellisense and static analysis
+   - [Volar Typescript](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin): For Vue Typescript support
 
 ## 🤝 Support the project
 

src/components/admin/AdminMixin.ts

@@ -20,7 +20,8 @@ export default defineComponent({
 
   props: {
     status: {
-      type: Object as PropType<ISystemStatus>,
+      type: Object as PropType<ISystemStatus | null>,
+      default: null,
       required: false,
     },
     config: {

src/components/admin/sections/VideoTranscoder.vue

@@ -16,16 +16,16 @@
         <NcNoteCard :type="binaryStatusType(status.govod)">
           {{ binaryStatus('go-vod', status.govod) }}
         </NcNoteCard>
-      </template>
 
-      <NcCheckboxRadioSwitch
-        :disabled="!enableTranscoding"
-        :checked.sync="config['memories.vod.external']"
-        @update:checked="update('memories.vod.external')"
-        type="switch"
-      >
-        {{ t('memories', 'Enable external transcoder (go-vod {version})', { version: status?.govod_want }) }}
-      </NcCheckboxRadioSwitch>
+        <NcCheckboxRadioSwitch
+          :disabled="!enableTranscoding"
+          :checked.sync="config['memories.vod.external']"
+          @update:checked="update('memories.vod.external')"
+          type="switch"
+        >
+          {{ t('memories', 'Enable external transcoder (go-vod {version})', { version: status.govod_want }) }}
+        </NcCheckboxRadioSwitch>
+      </template>
 
       <NcTextField
         :disabled="!enableTranscoding"

src/components/top-matter/AlbumTopMatter.vue

@@ -41,7 +41,7 @@
       <NcActions :inline="isMobile ? 1 : 3">
         <NcActionButton
           :aria-label="t('memories', 'Create new album')"
-          @click="$refs.createModal.open(false)"
+          @click="$refs.createModal?.open(false)"
           close-after-click
           v-if="isAlbumList"
         >
@@ -50,7 +50,7 @@
         </NcActionButton>
         <NcActionButton
           :aria-label="t('memories', 'Share album')"
-          @click="$refs.shareModal.open(false)"
+          @click="$refs.shareModal?.open(false)"
           close-after-click
           v-if="canEditAlbum"
         >
@@ -68,7 +68,7 @@
         </NcActionButton>
         <NcActionButton
           :aria-label="t('memories', 'Edit album details')"
-          @click="$refs.createModal.open(true)"
+          @click="$refs.createModal?.open(true)"
           close-after-click
           v-if="canEditAlbum"
         >
@@ -77,7 +77,7 @@
         </NcActionButton>
         <NcActionButton
           :aria-label="t('memories', 'Remove album')"
-          @click="$refs.deleteModal.open()"
+          @click="$refs.deleteModal?.open()"
           close-after-click
           v-if="!isAlbumList"
         >

src/components/viewer/Viewer.vue

@@ -7,7 +7,7 @@
     @fullscreenchange="fullscreenChange"
     @keydown="keydown"
   >
-    <ImageEditor v-if="editorOpen" :photo="currentPhoto" @close="editorOpen = false" />
+    <ImageEditor v-if="editorOpen && currentPhoto" :photo="currentPhoto" @close="editorOpen = false" />
 
     <!-- Loading indicator -->
     <XLoadingIcon class="loading-icon centered" v-if="loading" />
@@ -90,7 +90,7 @@
             :aria-label="t('memories', 'Download')"
             @click="downloadCurrent"
             :close-after-click="true"
-            v-if="!this.initState.noDownload && !isLocal"
+            v-if="!initState.noDownload && !isLocal"
           >
             {{ t('memories', 'Download') }}
             <template #icon>
@@ -98,7 +98,7 @@
             </template>
           </NcActionButton>
           <NcActionButton
-            v-if="!this.initState.noDownload && currentPhoto?.liveid"
+            v-if="!initState.noDownload && currentPhoto?.liveid"
             :aria-label="t('memories', 'Download Video')"
             @click="downloadCurrentLiveVideo"
             :close-after-click="true"