Merge branch 'next' of github.com:devforth/adminforth into next

Author: ivictbor

README.md

@@ -136,4 +136,4 @@ This will always run latest version of adminforth package.
 
 ## Star History
 
-[![Star History Chart](https://api.star-history.com/svg?repos=adminforth/adminforth&type=date&legend=top-left)](https://www.star-history.com/#adminforth/adminforth&type=date&legend=top-left)
+[![Star History Chart](https://api.star-history.com/svg?repos=devforth/adminforth&type=date&legend=top-left)](https://www.star-history.com/#devforth/adminforth&type=date&legend=top-left)

adminforth/documentation/docs/tutorial/03-Customization/10-menuConfiguration.md

@@ -278,3 +278,23 @@ auth: {
 This syntax can be use to get unique avatar for each user of hardcode avatar, but it makes more sense to use it with [upload plugin](https://adminforth.dev/docs/tutorial/Plugins/upload/#using-plugin-for-uploading-avatar)
 
 
+## Custom URL
+You can use the url property to override default navigation. This is useful for linking to pre-filtered lists or external sites.
+
+
+```ts title='./index.ts'
+
+menu: [
+    {
+      label: 'Posts',
+      icon: 'flowbite:book-open-outline',
+      resourceId: 'posts',
+      //diff-add
+      url: '/resource/aparts?filter__country__in=["DE"]',  
+      //diff-add
+      isOpenInNewTab: true // You can also add isOpenInNewTab: true to open the link in a new browser tab
+    },
+  ],
+
+```
+> 👆 Please note start internal URLs with a leading / to ensure correct routing.

adminforth/modules/codeInjector.ts

@@ -946,7 +946,7 @@ class CodeInjector implements ICodeInjector {
 
         // 🚫 Skip big files or files which might be dynamic
         if (file.name === 'node_modules' || file.name === 'dist' ||
-            file.name === 'i18n-messages.json' || file.name === 'i18n-empty.json') {
+            file.name === 'i18n-messages.json' || file.name === 'i18n-empty.json' || file.name === 'hashes.json') {
           return '';
         }
 
@@ -1037,7 +1037,7 @@ class CodeInjector implements ICodeInjector {
 
     const buildHash = await this.tryReadFile(path.join(serveDir, '.adminforth_build_hash'));
     const messagesHash = await this.tryReadFile(path.join(serveDir, '.adminforth_messages_hash'));
-    console.log({buildHash, sourcesHash});
+
     const skipBuild = buildHash === sourcesHash;
     const skipExtract = messagesHash === sourcesHash;
 
@@ -1072,7 +1072,7 @@ class CodeInjector implements ICodeInjector {
 
     if (!hotReload) {
       if (!skipBuild) {     
-        console.log(`🪲 Build cache miss, building SPA...`);
+        console.log(`🪲 Build cache miss or outdated, building SPA...`);
         let oldHashForFiles = null;
         try {
           oldHashForFiles = await fs.promises.readFile(path.join(this.spaTmpPath(), 'hashes.json'), 'utf-8');

adminforth/package.json

@@ -18,7 +18,7 @@
     "build": "rm -rf dist && tsc && pnpm prepareDist",
     "--comment-prepareDist": "-rl allows supply the spa without symlinks which allows to not include source code in the package",
     "prepareDist": "cp -rL spa dist/",
-    "rollout-doc": "cd documentation && pnpm build && pnpm run deploy",
+    "rollout-doc": "cd documentation && npm run build && npm run deploy",
     "docs": "typedoc",
     "--comment_postinstall": "postinstall executed after package installed in other project package and when we do pnpm i in the package",
     "postinstall": "node scripts/postinstall.js"  

adminforth/spa/src/components/MenuLink.vue

@@ -1,15 +1,14 @@
 <template>
   <RouterLink 
-      :to="{name: item.resourceId ? 'resource-list' : item.path, params: item.resourceId ? { resourceId: item.resourceId }: {}}" 
+      :to="item.url || { name: item.resourceId ? 'resource-list' : item.path, params: item.resourceId ? { resourceId: item.resourceId }: {}}" 
+      :target="item.isOpenInNewTab ? '_blank' : '_self'"
       class="af-menu-link flex group relative items-center w-full py-2 text-lightSidebarText dark:text-darkSidebarText rounded-default transition-all duration-200 ease-in-out" 
       :class="{ 
         'hover:bg-lightSidebarItemHover hover:text-lightSidebarTextHover dark:hover:bg-darkSidebarItemHover dark:hover:text-darkSidebarTextHover active:bg-lightSidebarActive dark:active:bg-darkSidebarHover': !['divider', 'gap', 'heading'].includes(item.type),
         'pl-6 pr-3.5': (isChild && !isSidebarIconOnly && !isSidebarHovering) || (isChild && isSidebarIconOnly && isSidebarHovering),
         'px-3.5 ': !isChild || (isSidebarIconOnly && !isSidebarHovering),
         'max-w-12': isSidebarIconOnly && !isSidebarHovering,
-        'bg-lightSidebarItemActive dark:bg-darkSidebarItemActive': item.resourceId ?
-        ($route.params.resourceId === item.resourceId && $route.name === 'resource-list') :
-        ($route.name === item.path)
+        'bg-lightSidebarItemActive dark:bg-darkSidebarItemActive': isItemActive(item)
       }"
   >
     <component v-if="item.icon" :is="getIcon(item.icon)" 
@@ -61,6 +60,21 @@ import { Tooltip } from '@/afcl';
 import { ref, watch, computed } from 'vue';
 import { useCoreStore } from '@/stores/core';
 import { IconFileImageOutline } from '@iconify-prerendered/vue-flowbite';
+import { useRoute } from 'vue-router';
+
+const route = useRoute();
+
+const isItemActive = (item: any) => {
+  if (item.url) {
+    return route.fullPath === item.url;
+  }
+
+  if (item.resourceId) {
+    return route.params.resourceId === item.resourceId && route.name === 'resource-list';
+  }
+
+  return route.name === item.path;
+};
 
 const props = defineProps(['item', 'isChild', 'isSidebarIconOnly', 'isSidebarHovering']);
 

adminforth/types/Common.ts

@@ -1122,6 +1122,8 @@ export interface AdminForthConfigMenuItem {
    * Item id will be automatically generated from hashed resourceId+Path+label
    */
   itemId?: string,  // todo move to runtime type
+  
+  url?: string
 }