From f19ef0be8ebe525c65e12d8f7ac287da80266c33 Mon Sep 17 00:00:00 2001
From: Allan Otodi Opeto <103313919+AllanOXDi@users.noreply.github.com>
Date: Thu, 6 Feb 2025 16:51:38 +0300
Subject: [PATCH] navigates to previous route

---
 .../src/composables/useFetchContentNode.js    |  5 +-
 .../PreviewContent.vue                        | 55 +++++++------------
 .../PreviewSelectedResources/index.vue        | 34 ++++++++----
 .../strings/searchAndFilterStrings.js         |  5 ++
 4 files changed, 50 insertions(+), 49 deletions(-)

diff --git a/kolibri/plugins/coach/assets/src/composables/useFetchContentNode.js b/kolibri/plugins/coach/assets/src/composables/useFetchContentNode.js
index 687db6fc5b..5da15d364b 100644
--- a/kolibri/plugins/coach/assets/src/composables/useFetchContentNode.js
+++ b/kolibri/plugins/coach/assets/src/composables/useFetchContentNode.js
@@ -1,4 +1,4 @@
-import { ref } from 'vue';
+import { ref, getCurrentInstance } from 'vue';
 import ContentNodeResource from 'kolibri-common/apiResources/ContentNodeResource';
 
 export default function useFetchContentNode(contentId) {
@@ -6,6 +6,7 @@ export default function useFetchContentNode(contentId) {
   const ancestors = ref([]);
   const questions = ref([]);
   const loading = ref(true);
+  const store = getCurrentInstance().proxy.$store;
 
   const fetchContentNode = async () => {
     ContentNodeResource.fetchModel({
@@ -25,7 +26,7 @@ export default function useFetchContentNode(contentId) {
         }
       })
       .catch(error => {
-        this.$store.dispatch('handleApiError', { error });
+        store.dispatch('handleApiError', { error });
       });
   };
 
diff --git a/kolibri/plugins/coach/assets/src/views/lessons/LessonSummaryPage/sidePanels/LessonResourceSelection/subPages/PreviewSelectedResources/PreviewContent.vue b/kolibri/plugins/coach/assets/src/views/lessons/LessonSummaryPage/sidePanels/LessonResourceSelection/subPages/PreviewSelectedResources/PreviewContent.vue
index 8d28b14858..e23fefe7ef 100644
--- a/kolibri/plugins/coach/assets/src/views/lessons/LessonSummaryPage/sidePanels/LessonResourceSelection/subPages/PreviewSelectedResources/PreviewContent.vue
+++ b/kolibri/plugins/coach/assets/src/views/lessons/LessonSummaryPage/sidePanels/LessonResourceSelection/subPages/PreviewSelectedResources/PreviewContent.vue
@@ -2,11 +2,9 @@
 
   <div>
     <div class="channel-header">
-      <div>
-        <h6>
-          {{ coreString('selectFromChannels') }}
-        </h6>
-      </div>
+      <p>
+        {{ coreString('selectFromChannels') }}
+      </p>
 
       <div>
         <template v-if="isSelected">
@@ -34,21 +32,18 @@
       :ancestors="[...ancestors, currentContentNode]"
       :channelsLink="channelsLink"
       :topicsLink="topicsLink"
-      class="align-breadcrumbs"
     />
 
-    <div class="title-class">
-      <h5>
-        <KLabeledIcon :label="currentContentNode.kind">
-          <template #icon>
-            <LearningActivityIcon :kind="learningActivities" />
-          </template>
-          <template>
-            {{ currentContentNode.title }}
-          </template>
-        </KLabeledIcon>
-      </h5>
-    </div>
+    <h2>
+      <KLabeledIcon :label="currentContentNode.kind">
+        <template #icon>
+          <LearningActivityIcon :kind="learningActivities" />
+        </template>
+        <template>
+          {{ currentContentNode.title }}
+        </template>
+      </KLabeledIcon>
+    </h2>
 
     <ContentArea
       :header="questionLabel(selectedQuestionIndex)"
@@ -128,6 +123,7 @@
         licenseDataHeader$,
         addedIndicator$,
         notAvailableLabel$,
+        minutes$,
       } = searchAndFilterStrings;
 
       return {
@@ -136,6 +132,7 @@
         copyrightHolderDataHeader$,
         addedIndicator$,
         notAvailableLabel$,
+        minutes$,
       };
     },
     props: {
@@ -223,14 +220,7 @@
         this.$emit('removeResource', this.currentContentNode);
       },
       getTime(seconds) {
-        return this.$tr('minutes', { value: Math.floor(seconds / 60) });
-      },
-    },
-    $trs: {
-      minutes: {
-        message: '{value, number, integer} {value, plural, one {minute} other {minutes}}',
-        context:
-          'Indicates time spent by learner on a specific activity. Only translate minute/minutes.',
+        return this.minutes$({ value: Math.floor(seconds / 60) });
       },
     },
   };
@@ -241,12 +231,11 @@
 <style lang="scss" scoped>
 
   .license-detail-style {
-    margin: 30px 0 32px;
+    margin-top: 10px;
   }
 
   /deep/ .content-renderer {
     position: relative;
-    top: -40px;
     max-height: 500px;
   }
 
@@ -256,14 +245,8 @@
     justify-content: space-between;
   }
 
-  .title-class {
-    position: relative;
-    top: -30px;
-  }
-
-  .align-breadcrumbs {
-    position: relative;
-    top: -35px;
+  .channel-header p {
+    font-weight: 600;
   }
 
 </style>
diff --git a/kolibri/plugins/coach/assets/src/views/lessons/LessonSummaryPage/sidePanels/LessonResourceSelection/subPages/PreviewSelectedResources/index.vue b/kolibri/plugins/coach/assets/src/views/lessons/LessonSummaryPage/sidePanels/LessonResourceSelection/subPages/PreviewSelectedResources/index.vue
index dd4c4d90e7..8bee699ab9 100644
--- a/kolibri/plugins/coach/assets/src/views/lessons/LessonSummaryPage/sidePanels/LessonResourceSelection/subPages/PreviewSelectedResources/index.vue
+++ b/kolibri/plugins/coach/assets/src/views/lessons/LessonSummaryPage/sidePanels/LessonResourceSelection/subPages/PreviewSelectedResources/index.vue
@@ -18,6 +18,7 @@
 
 <script>
 
+  import { getCurrentInstance, ref } from 'vue';
   import commonCoreStrings from 'kolibri/uiText/commonCoreStrings';
   import useFetchContentNode from '../../../../../../../composables/useFetchContentNode';
   import { coachStrings } from '../../../../../../common/commonCoachStrings';
@@ -31,17 +32,32 @@
     },
     mixins: [commonCoreStrings],
     setup(props) {
+      const previousRoute = ref(null);
+      const instance = getCurrentInstance();
+
       const { contentNode, ancestors, questions, loading } = useFetchContentNode(props.contentId);
       const { manageLessonResourcesTitle$ } = coachStrings;
 
       props.setTitle(manageLessonResourcesTitle$());
       props.setGoBack(null);
 
+      const routeBack = () => {
+        const backRoute = previousRoute.value?.name
+          ? previousRoute.value
+          : {
+            name: PageNames.LESSON_SELECT_RESOURCES_INDEX,
+          };
+        instance.proxy.$router.push(backRoute);
+      };
+
       return {
         contentNode,
         ancestors,
         questions,
         loading,
+        routeBack,
+        // eslint-disable-next-line vue/no-unused-properties
+        previousRoute,
       };
     },
     props: {
@@ -69,24 +85,20 @@
         }
         return false;
       },
-      routeBack() {
-        const { params, query } = this.$route;
-        return {
-          name: PageNames.LESSON_SELECT_RESOURCES_TOPIC_TREE,
-          params: params,
-          query: query,
-        };
-      },
+    },
+    beforeRouteEnter(to, from, next) {
+      next(vm => {
+        vm.previousRoute = from;
+      });
     },
     methods: {
       handleAddResource(content) {
-        this.routeBack;
+        this.routeBack();
         this.$emit('selectResources', [content]);
-        this.showSnackbarNotification('resourcesAddedWithCount', { count: 1 });
       },
       handleRemoveResource(content) {
+        this.routeBack();
         this.$emit('deselectResources', [content]);
-        this.showSnackbarNotification('resourcesRemovedWithCount', { count: 1 });
       },
     },
   };
diff --git a/packages/kolibri-common/strings/searchAndFilterStrings.js b/packages/kolibri-common/strings/searchAndFilterStrings.js
index c7a2d843da..e60564dc36 100644
--- a/packages/kolibri-common/strings/searchAndFilterStrings.js
+++ b/packages/kolibri-common/strings/searchAndFilterStrings.js
@@ -108,4 +108,9 @@ export const searchAndFilterStrings = createTranslator('SearchAndFilterStrings',
     message: 'Not available',
     context: 'Message that shows when the value of key is null',
   },
+  minutes: {
+    message: '{value, number, integer} {value, plural, one {minute} other {minutes}}',
+    context:
+      'Indicates time spent by learner on a specific activity. Only translate minute/minutes.',
+  },
 });