From 5cbd63d70ca6ca4845f5122c201743c590017628 Mon Sep 17 00:00:00 2001
From: Christian Cueni <christian.cueni@iterativ.ch>
Date: Tue, 14 May 2024 10:45:28 +0200
Subject: [PATCH] Show loading spinner

---
 .../learningPath/learningPathPage/LearningPathPathView.vue  | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/client/src/pages/learningPath/learningPathPage/LearningPathPathView.vue b/client/src/pages/learningPath/learningPathPage/LearningPathPathView.vue
index 6fa2e82c..7150b719 100644
--- a/client/src/pages/learningPath/learningPathPage/LearningPathPathView.vue
+++ b/client/src/pages/learningPath/learningPathPage/LearningPathPathView.vue
@@ -4,6 +4,7 @@ import LearningPathScrollButton from "@/pages/learningPath/learningPathPage/Lear
 import { useScroll } from "@vueuse/core";
 import { ref } from "vue";
 import type { LearningContentWithCompletion, LearningPathType } from "@/types";
+import LoadingSpinner from "@/components/ui/LoadingSpinner.vue";
 
 const props = defineProps<{
   learningPath: LearningPathType | undefined;
@@ -35,7 +36,10 @@ const scrollLearnPathDiagram = (offset: number) => {
 </script>
 
 <template>
-  <div class="relative flex flex-row items-center">
+  <div v-if="!props.learningPath" class="m-8 flex justify-center">
+    <LoadingSpinner />
+  </div>
+  <div v-else class="relative flex flex-row items-center">
     <LearningPathScrollButton
       v-show="!arrivedState.left"
       direction="left"