From 8d9b4c8c7d2dc13be477d284ae64c2d1259982a3 Mon Sep 17 00:00:00 2001
From: Kelani Tolulope <kelanik8@gmail.com>
Date: Mon, 25 Sep 2023 08:05:59 +0100
Subject: [PATCH] Add compose sidebar navigation improvements

---
 .../Namespaces/NamespaceSidebar.vue           | 16 +++++++++----
 .../src/views/Admin/Modules/Records/List.vue  | 24 +++++++++++++++----
 2 files changed, 32 insertions(+), 8 deletions(-)

diff --git a/client/web/compose/src/components/Namespaces/NamespaceSidebar.vue b/client/web/compose/src/components/Namespaces/NamespaceSidebar.vue
index 6876a7b3a5..a03957238a 100644
--- a/client/web/compose/src/components/Namespaces/NamespaceSidebar.vue
+++ b/client/web/compose/src/components/Namespaces/NamespaceSidebar.vue
@@ -119,12 +119,13 @@ import { NoID } from '@cortezaproject/corteza-js'
 import { components, filter } from '@cortezaproject/corteza-vue'
 import { Portal } from 'portal-vue'
 import { VueSelect } from 'vue-select'
+
 const { CSidebarNavItems, CInputSearch } = components
 
-const moduleWrap = (module) => {
+const moduleWrap = (module, pageName) => {
   return {
     page: {
-      name: 'admin.modules.edit',
+      name: pageName,
       pageID: `module-${module.moduleID}`,
       selfID: 'modules',
       rootSelfID: 'modules',
@@ -137,6 +138,7 @@ const moduleWrap = (module) => {
     },
   }
 }
+
 const chartWrap = (chart) => {
   return {
     page: {
@@ -230,6 +232,7 @@ export default {
       if (this.namespace) {
         // If on admin page, show admin pages. Otherwise show public pages
         const pages = [...(this.isAdminPage ? this.adminRoutes() : this.publicPageWrap(this.publicRoutes))]
+
         if (!this.query) {
           return pages
         }
@@ -347,6 +350,9 @@ export default {
     },
 
     adminRoutes () {
+      const routeName = this.$route.name
+      const pageName = routeName.startsWith('admin.modules.record') ? 'admin.modules.record.list' : 'admin.modules.edit'
+
       return [
         {
           page: {
@@ -358,7 +364,7 @@ export default {
           },
           children: [],
         },
-        ...this.modules.map(moduleWrap),
+        ...this.modules.map((m) => moduleWrap(m, pageName)),
         {
           page: {
             pageID: 'pages',
@@ -428,9 +434,11 @@ export default {
           iconSrc = `${this.$ComposeAPI.baseURL}${src}`
         }
 
+        const pageName = this.$route.name === 'admin.pages.edit' ? 'admin.pages.edit' : 'admin.pages.builder'
+
         return {
           page: {
-            name: 'admin.pages.builder',
+            name: pageName,
             pageID: `page-${pageID}`,
             selfID: selfID !== NoID ? `page-${selfID}` : 'pages',
             rootSelfID: 'pages',
diff --git a/client/web/compose/src/views/Admin/Modules/Records/List.vue b/client/web/compose/src/views/Admin/Modules/Records/List.vue
index 1cabef458e..023b92923e 100644
--- a/client/web/compose/src/views/Admin/Modules/Records/List.vue
+++ b/client/web/compose/src/views/Admin/Modules/Records/List.vue
@@ -76,8 +76,8 @@ export default {
     },
 
     module () {
-      if (this.$attrs.moduleID) {
-        return this.getModuleByID(this.$attrs.moduleID)
+      if (this.$route.params.moduleID) {
+        return this.getModuleByID(this.$route.params.moduleID)
       } else {
         return undefined
       }
@@ -102,8 +102,24 @@ export default {
     },
   },
 
+  watch: {
+    module: {
+      handler (module) {
+        if (module) {
+          const { meta = { ui: {} }, moduleID } = module || {}
+
+          let fields = ((meta.ui || {}).admin || {}).fields || []
+          fields = fields.length ? fields : module.fields
+
+          this.block.options.moduleID = moduleID
+          this.block.options.fields = fields
+        }
+      },
+    },
+  },
+
   created () {
-    const { meta = { ui: {} } } = this.module || {}
+    const { meta = { ui: {} }, moduleID } = this.module || {}
 
     let fields = ((meta.ui || {}).admin || {}).fields || []
     fields = fields.length ? fields : this.module.fields
@@ -112,7 +128,7 @@ export default {
     const block = new compose.PageBlockRecordList({
       blockIndex: 0,
       options: {
-        moduleID: this.$attrs.moduleID,
+        moduleID,
         fields,
         hideRecordReminderButton: true,
         hideRecordViewButton: true,