Merge pull request #12358 from shubh1007/HomeRoute

Refactored HomePage route handler to fetch initClassInfo and getFacil…
learningequality · Jul 12, 2024 · 402f18e · 402f18e
2 parents 225e2a1 + 8863f3d
commit 402f18e
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 23 deletions.
diff --git a/kolibri/plugins/coach/assets/src/app.js b/kolibri/plugins/coach/assets/src/app.js
@@ -13,6 +13,7 @@ import GroupsPage from './views/plan/GroupsPage';
 import GroupMembersPage from './views/plan/GroupMembersPage';
 import GroupEnrollPage from './views/plan/GroupEnrollPage';
 import pages from './views/reports/allReportsPages';
+import HomeActivityPage from './views/home/HomeActivityPage';
 
 class CoachToolsModule extends KolibriApp {
   get stateSetters() {
@@ -84,6 +85,8 @@ class CoachToolsModule extends KolibriApp {
           GroupsPage.name,
           GroupMembersPage.name,
           GroupEnrollPage.name,
+          PageNames.HOME_PAGE,
+          HomeActivityPage.name,
         ].includes(to.name)
       ) {
         next();

diff --git a/kolibri/plugins/coach/assets/src/routes/index.js b/kolibri/plugins/coach/assets/src/routes/index.js
@@ -13,6 +13,16 @@ import reportRoutes from './reportRoutes';
 import planRoutes from './planRoutes';
 import { classIdParamRequiredGuard } from './utils';
 
+function showHomePage(toRoute) {
+  const initClassInfoPromise = store.dispatch('initClassInfo', toRoute.params.classId);
+  const getFacilitiesPromise =
+    store.getters.isSuperuser && store.state.core.facilities.length === 0
+      ? store.dispatch('getFacilities').catch(() => {})
+      : Promise.resolve();
+
+  return Promise.all([initClassInfoPromise, getFacilitiesPromise]);
+}
+
 export default [
   ...planRoutes,
   ...reportRoutes,
@@ -58,10 +68,11 @@ export default [
     name: PageNames.HOME_PAGE,
     path: '/:classId?/home',
     component: HomePage,
-    handler: (toRoute, fromRoute, next) => {
+    handler: async (toRoute, fromRoute, next) => {
       if (classIdParamRequiredGuard(toRoute, HomePage.name, next)) {
         return;
       }
+      await showHomePage(toRoute);
       store.dispatch('notLoading');
     },
     meta: {
@@ -71,7 +82,8 @@ export default [
   {
     path: '/:classId/home/activity',
     component: HomeActivityPage,
-    handler() {
+    handler: async (toRoute, fromRoute, next) => {
+      await showHomePage(toRoute);
       store.dispatch('notLoading');
     },
     meta: {

diff --git a/kolibri/plugins/coach/assets/src/views/plan/CreateExamPage/QuestionListPreview.vue b/kolibri/plugins/coach/assets/src/views/plan/CreateExamPage/QuestionListPreview.vue
@@ -79,17 +79,19 @@
             </h3>
           </template>
           <template #content>
-            <div v-show="isExpanded(index)">
+            <div
+              v-show="isExpanded(index)"
+              :style="{
+                backgroundColor: $themePalette.grey.v_100,
+              }"
+            >
               <ul class="question-list">
-                <li
-                  v-for="(question, i) in section.questions"
-                  :key="i"
-                >
+                <li v-for="(question, i) in section.questions">
                   <KButton
                     tabindex="0"
                     class="question-button"
                     appearance="basic-link"
-                    :class="[listItemClass, isSelected(question) ? selectedListItemClass : '']"
+                    :class="{ selected: isSelected(question) }"
                     :style="accordionStyleOverrides"
                     @click="handleQuestionChange(i, index)"
                   >
@@ -316,21 +318,6 @@
           textDecoration: 'none',
         };
       },
-      listItemClass() {
-        return this.$computedClass({
-          ':hover': {
-            backgroundColor: this.$themePalette.grey.v_100,
-          },
-        });
-      },
-      selectedListItemClass() {
-        return this.$computedClass({
-          backgroundColor: this.$themePalette.grey.v_100,
-          ':hover': {
-            backgroundColor: this.$themePalette.grey.v_200,
-          },
-        });
-      },
       resourceMissingText() {
         return this.coreString('resourceNotFoundOnDevice');
       },
@@ -425,6 +412,14 @@
     width: 100%;
     height: 100%;
     padding: 0.5em;
+
+    &:hover {
+      background-color: white;
+    }
+
+    &.selected {
+      background-color: white;
+    }
   }
 
 </style>