@vc-shell/framework 1.0.191 → 1.0.192

package/shared/modules/dynamic/index.ts

@@ -44,6 +44,7 @@ const register = (
     composables: { [key: string]: (...args: any[]) => any };
     json: DynamicSchema;
     options?: { router: any };
+    moduleUid: string;
   },
   appModuleContent:
     | {
@@ -73,7 +74,9 @@ const register = (
     name: bladeName,
     isWorkspace: "isWorkspace" in json.settings && json.settings.isWorkspace,
     menuItem: ("menuItem" in json.settings && json.settings.menuItem) ?? undefined,
+    moduleUid: args.moduleUid,
     routable: json.settings.routable ?? true,
+    composables: args.composables,
     setup: (props: ComponentProps<typeof bladeComponent>, ctx) =>
       (bladeComponent?.setup &&
         bladeComponent.setup(
@@ -146,6 +149,7 @@ export const createDynamicAppModule = (args: {
         notificationTemplates: args?.notificationTemplates,
         moduleComponents: args?.moduleComponents,
       };
+      const moduleUid = _.uniqueId("module_");
       Object.entries(schemaCopy).forEach(([, JsonSchema], index) => {
         const blade = register(
           {
@@ -154,6 +158,7 @@ export const createDynamicAppModule = (args: {
             composables: { ...args.composables },
             json: JsonSchema,
             options,
+            moduleUid,
           },
           index === 0 ? appModuleContent : undefined,
         );

package/shared/modules/dynamic/pages/dynamic-blade-form.vue

@@ -97,7 +97,6 @@ import { VcSelect } from "../../../../ui/components";
 import { useToolbarReducer } from "../composables/useToolbarReducer";
 import { useBeforeUnload } from "../../../../core/composables/useBeforeUnload";
 import * as _ from "lodash-es";
-import { IBladeToolbar } from "../../../../core/types";
 import { useNotifications } from "../../../../core/composables";
 import { notification } from "../../../components";
 
@@ -132,6 +131,9 @@ const { showConfirmation } = usePopup();
 
 const widgetsRefs = useTemplateRefsList<{ el: HTMLDivElement; component: ConcreteComponent }>();
 
+if (typeof props.composables?.[props.model?.settings?.composable ?? ""] === "undefined") {
+  throw new Error(`Composable ( ${props.model?.settings?.composable} ) is not defined`);
+}
 const { loading, item, validationState, scope, load, remove, saveChanges, bladeTitle } = props.composables
   ? (props.composables?.[props.model?.settings?.composable ?? ""]({ emit, props, mounted: useMounted() }) as UseDetails<
       Record<string, any>,
@@ -147,6 +149,7 @@ const { loading, item, validationState, scope, load, remove, saveChanges, bladeT
       saveChanges: undefined,
       bladeTitle: undefined,
     } as unknown as UseDetails<Record<string, any>, DetailsBaseBladeScope>);
+
 const { onBeforeClose } = useBladeNavigation();
 const title = ref();
 const isReady = ref(false);

package/shared/modules/dynamic/pages/dynamic-blade-list.vue

@@ -169,7 +169,7 @@ import { useFilterBuilder, useTableTemplates } from "../composables";
 import { useFunctions, useNotifications } from "../../../../core/composables";
 import { IActionBuilderResult, ITableColumns } from "../../../../core/types";
 import { useToolbarReducer } from "../composables/useToolbarReducer";
-import { notification, usePopup } from "../../../components";
+import { notification, useBladeNavigation, usePopup } from "../../../components";
 import { ListBaseBladeScope, ListBladeContext, UseList } from "../factories/types";
 import { IParentCallArgs } from "../../../index";
 import * as _ from "lodash-es";
@@ -252,6 +252,10 @@ const stateKey =
     throw new Error('Table id is not defined. Please provide "id" property in table schema');
   });
 
+if (typeof props.composables?.[props.model?.settings?.composable ?? ""] === "undefined") {
+  throw new Error(`Composable ( ${props.model?.settings?.composable} ) is not defined`);
+}
+
 const { load, remove, items, loading, pagination, query, scope } = props.composables
   ? (props.composables?.[props.model?.settings?.composable ?? ""]({
       emit,

package/ui/components/organisms/vc-app/_internal/vc-app-menu/_internal/vc-app-menu-item/_internal/vc-app-menu-link.vue

@@ -3,7 +3,7 @@
     class="vc-app-menu-item"
     :class="[
       {
-        'vc-app-menu-item_active': isActive(url ?? '') && !children?.length,
+        'vc-app-menu-item_active': isActive && !children?.length,
         'vc-app-menu-item_no-hover': !children?.length,
         'vc-app-menu-item_child-opened': isOpened,
       },
@@ -49,6 +49,7 @@
     >
       <router-link
         v-if="$hasAccess(nested.permissions!)"
+        v-slot="{ isExactActive }"
         :to="nested.url!"
         custom
       >
@@ -56,7 +57,7 @@
           :key="i"
           :class="[
             {
-              'vc-app-menu-item__child-item_active': isActive(nested.url!),
+              'vc-app-menu-item__child-item_active': isExactActive,
             },
             'vc-app-menu-item__child-item',
           ]"
@@ -80,6 +81,7 @@ export interface Props {
   icon: string;
   title?: string;
   url?: string;
+  isActive?: boolean;
 }
 
 export interface Emits {
@@ -112,19 +114,6 @@ function onMenuItemClick() {
     isOpened.value = !isOpened.value;
   }
 }
-
-const isActive = (url: string) => {
-  if (url) {
-    const splitted = url.split("/").filter((part) => part !== "");
-    const active = route.path.split("/").filter((part) => part !== "")[0] === splitted[0];
-
-    if (active && props.children?.length) {
-      isOpened.value = true;
-    }
-
-    return active;
-  } else return false;
-};
 </script>
 
 <style lang="scss">

package/ui/components/organisms/vc-app/_internal/vc-app-menu/_internal/vc-app-menu-item/vc-app-menu-item.vue

@@ -2,11 +2,13 @@
   <div>
     <template v-if="url">
       <router-link
+        v-slot="{ isExactActive }"
         :to="url"
         custom
       >
         <vc-app-menu-link
           v-if="isVisible"
+          :is-active="isExactActive"
           :sticky="sticky"
           :icon="icon ?? ''"
           :title="title ?? ''"

package/ui/components/organisms/vc-app/vc-app.vue

@@ -167,7 +167,14 @@ const onMenuItemClick = function (item: MenuItem) {
       true,
     );
   } else if (!item.routeId && item.url) {
-    router.push(item.url);
+    const menuRoute = router.getRoutes().find((r) => {
+      return "/" + r.path.split("/").filter((part) => part !== "")[1] === item.url || r.path === item.url;
+    });
+    if (typeof menuRoute === "undefined") {
+      openRoot();
+    } else {
+      router.replace({ name: menuRoute?.name, params: route.params });
+    }
   }
 };
 

package/ui/components/organisms/vc-table/vc-table.vue

@@ -382,7 +382,7 @@
             </div>
             <VcButton
               v-if="notfound?.action"
-              @click="notfound.clickHandler"
+              @click="notfound?.clickHandler"
             >
               {{ notfound.action }}
             </VcButton>
@@ -402,7 +402,7 @@
             </div>
             <VcButton
               v-if="empty?.action"
-              @click="empty.clickHandler"
+              @click="empty?.clickHandler"
             >
               {{ empty.action }}
             </VcButton>