feat(datapack): add cancel button action + change view title

bimdata · Dec 7, 2021 · 8c1a6cb · 8c1a6cb
1 parent 3ea359a
commit 8c1a6cb
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 19 deletions.
diff --git a/src/components/specific/app/go-back-button/GoBackButton.vue b/src/components/specific/app/go-back-button/GoBackButton.vue
@@ -40,12 +40,9 @@ export default {
         target = { name: back, params: route.params };
       }
       // ---
-      else if (
-        (prev.name && !backRoutes) ||
-        (prev.name && backRoutes && backRoutes.includes(prev.name))
-      ) {
+      else if (prev.name && (!backRoutes || backRoutes.includes(prev.name))) {
         // If a previous route exists and `route.meta.backRoutes` is not defined
-        // or if a previous exists and is included in `route.meta.backRoutes`
+        // or if previous route is included in `route.meta.backRoutes`
         // => go to previous route
         target = prev;
       }

diff --git a/src/components/specific/subscriptions/datapack-form/DatapackForm.vue b/src/components/specific/subscriptions/datapack-form/DatapackForm.vue
@@ -36,7 +36,7 @@
         height="44px"
         fill
         radius
-        @click="() => {}"
+        @click="cancel"
       >
         {{ $t("DatapackForm.cancelButtonText") }}
       </BIMDataButton>
@@ -119,6 +119,7 @@
 
 <script>
 import { computed, inject, ref, watch } from "vue";
+import { useRouter } from "vue-router";
 import { usePaddle } from "@/composables/paddle.js";
 import { PRO_PLAN_STORAGE } from "@/config/subscription.js";
 import SIZE_UNIT from "@/config/size-unit.js";
@@ -149,6 +150,7 @@ export default {
   },
   emits: ["datapack-created", "datapack-updated"],
   setup(props, { emit }) {
+    const router = useRouter();
     const { getDatapackPrice } = usePaddle();
     const { createDatapack, updateDatapack } = useSubscriptions();
 
@@ -216,6 +218,10 @@ export default {
       }
     };
 
+    const cancel = () => {
+      router.back();
+    };
+
     return {
       // References
       baseSize,
@@ -229,6 +235,7 @@ export default {
       totalSizePercent,
       unitPrice,
       // Methods
+      cancel,
       decrement,
       formatBytes,
       increment,

diff --git a/src/i18n/lang/en.json b/src/i18n/lang/en.json
@@ -43,7 +43,7 @@
     "title": "Choose your plan"
   },
   "SubscriptionDatapack": {
-    "title": "Add DataPack",
+    "title": "Manage DataPack",
     "successNotification": "You now have {size} of storage in space {spaceName}"
   },
   "SubscriptionFree": {

diff --git a/src/i18n/lang/fr.json b/src/i18n/lang/fr.json
@@ -45,7 +45,7 @@
     "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
   },
   "SubscriptionDatapack": {
-    "title": "Ajout d'un DataPack",
+    "title": "Gérer mes DataPacks",
     "successNotification": "Vous disposez désormais de {size} dans l'espace {spaceName}"
   },
   "SubscriptionFree": {

diff --git a/src/router/index.js b/src/router/index.js
@@ -58,7 +58,8 @@ const {
   projectBoard,
   modelViewer,
   projectGroups,
-  groupBoard
+  groupBoard,
+  userSubscriptions
 } = routeNames;
 
 const routes = [
@@ -97,7 +98,8 @@ const routes = [
         name: spaceBoard,
         component: SpaceBoard,
         meta: {
-          back: userSpaces,
+          backRoutes: [userSpaces, userSubscriptions],
+          backDefault: userSpaces,
           guard: spaceBoardGuard,
           resolver: spaceBoardResolver
         }

diff --git a/src/views/subscription-datapack/SubscriptionDatapack.vue b/src/views/subscription-datapack/SubscriptionDatapack.vue
@@ -69,19 +69,15 @@ export default {
     const loading = ref(false);
     provide("loading", loading);
 
-    const selectedSpace = ref(currentSpace.value);
     const spaceInfo = ref({});
     const subscription = ref(null);
 
     const loadSpaceData = async space => {
       if (space && space.id) {
-        const info = await fetchSpaceInformation(space);
-        const sub = await loadSpaceSubscriptions(space).then(() =>
+        spaceInfo.value = await fetchSpaceInformation(space);
+        subscription.value = await loadSpaceSubscriptions(space).then(() =>
           getSpaceActiveSubscription(space)
         );
-        // This is needed to trigger reactive effects
-        spaceInfo.value = { ...info };
-        subscription.value = { ...sub };
       }
     };
 
@@ -91,7 +87,7 @@ export default {
           type: "success",
           title: t("Success"),
           message: t("SubscriptionDatapack.successNotification", {
-            spaceName: selectedSpace.value.name,
+            spaceName: currentSpace.value.name,
             size: formatBytes(size)
           })
         },
@@ -107,7 +103,7 @@ export default {
     };
 
     watch(
-      () => selectedSpace.value,
+      () => currentSpace.value,
       space => loadSpaceData(space),
       { immediate: true }
     );
@@ -118,7 +114,6 @@ export default {
       currentSpace,
       loading,
       organizations: userOrganizations,
-      selectedSpace,
       spaceInfo,
       subscription,
       // Methods