fix: add PendingContent in CorpusConfigCustom view

spraakbanken · Aug 20, 2024 · 9266168 · 9266168
1 parent 3d84ffd
commit 9266168
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -13,6 +13,10 @@ As this project is a user-facing application, the places in the semantic version
 
 ## [Unreleased]
 
+### Fixed
+
+- Show loading spinners on the custom config page
+
 ## [1.6.1] (2024-08-13)
 
 ### Added

diff --git a/src/corpus/config/CorpusConfigCustom.vue b/src/corpus/config/CorpusConfigCustom.vue
@@ -9,6 +9,7 @@ import LayoutBox from "@/components/LayoutBox.vue";
 import type { MinkResponse } from "@/api/api.types";
 import useMessenger from "@/message/messenger.composable";
 import SyntaxHighlight from "@/components/SyntaxHighlight.vue";
+import PendingContent from "@/spin/PendingContent.vue";
 
 const corpusId = useCorpusIdParam();
 const { config, uploadConfigRaw } = useConfig(corpusId);
@@ -46,12 +47,16 @@ async function upload(files: File[]) {
 
   <div class="flex flex-wrap gap-4">
     <LayoutBox class="w-96 grow" :title="$t('show')">
-      <SyntaxHighlight v-if="config" language="yaml" :code="config" />
+      <PendingContent :on="`corpus/${corpusId}/config`">
+        <SyntaxHighlight v-if="config" language="yaml" :code="config" />
+      </PendingContent>
     </LayoutBox>
 
     <LayoutBox class="w-96 grow" :title="$t('upload')">
       <HelpBox>{{ $t("config.custom.upload.help") }}</HelpBox>
-      <FileUpload :file-handler="upload" accept=".yaml,.yml" />
+      <PendingContent :on="`corpus/${corpusId}/config`" blocking>
+        <FileUpload :file-handler="upload" accept=".yaml,.yml" />
+      </PendingContent>
     </LayoutBox>
   </div>
 </template>