feat: add isVisible callback for the settings pages

Author: yaroslav8765

adminforth/modules/restApi.ts

@@ -363,7 +363,13 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
 
         const announcementBadge: AnnouncementBadgeResponse = this.adminforth.config.customization.announcementBadge?.(adminUser);
 
-
+        const settingPages = []
+        for ( const settingPage of this.adminforth.config.auth.userMenuSettingsPages || [] ) {
+          if ( settingPage.isVisible ) {
+            const isVisible = await settingPage.isVisible( adminUser );
+            settingPages.push( { ...settingPage, isVisible } );
+          }
+        }
 
         const publicPart = {
           brandName: this.adminforth.config.customization.brandName,
@@ -378,7 +384,6 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
           singleTheme: this.adminforth.config.customization.singleTheme,
           customHeadItems: this.adminforth.config.customization.customHeadItems,
         }
-
         const loggedInPart = {
           showBrandNameInSidebar: this.adminforth.config.customization.showBrandNameInSidebar,
           showBrandLogoInSidebar: this.adminforth.config.customization.showBrandLogoInSidebar,
@@ -393,7 +398,7 @@ export default class AdminForthRestAPI implements IAdminForthRestAPI {
           announcementBadge,
           globalInjections: this.adminforth.config.customization.globalInjections,
           userFullnameField: this.adminforth.config.auth.userFullNameField,
-          settingPages: this.adminforth.config.auth.userMenuSettingsPages,
+          settingPages: settingPages,
         }
 
         // translate menu labels

adminforth/spa/src/components/UserMenuSettingsButton.vue

@@ -50,7 +50,7 @@ const showDropdown = ref(false);
 const props = defineProps(['meta', 'resource']);
 
 const options = computed(() => {
-  return coreStore.config?.settingPages?.map((page) => {
+  return coreStore.config?.settingPages?.filter(page => page.isVisible).map((page) => {
     return {
       pageLabel: page.pageLabel,
       slug: page.slug || null,

adminforth/spa/src/views/SettingsView.vue

@@ -1,17 +1,17 @@
 <template>
   <div class="mt-20 h-full w-full" :class="{ 'hidden': initialTabSet === false }">
-    <div v-if="!coreStore?.config?.settingPages || coreStore?.config?.settingPages.length === 0">
+    <div v-if="!coreStore?.config?.settingPages?.filter(page => page.isVisible) || coreStore?.config?.settingPages.length === 0">
       <p>{{ $t('No setting pages configured or still loading...') }}</p>
     </div>
       <VerticalTabs v-else ref="VerticalTabsRef" hideTabesWhenSingle v-model:active-tab="activeTab" @update:active-tab="setURL({slug: $event, pageLabel: ''})">
-      <template v-for="(c,i) in coreStore?.config?.settingPages" :key="`tab:${settingPageSlotName(c,i)}`" v-slot:['tab:'+c.slug]>
+      <template v-for="(c,i) in coreStore?.config?.settingPages.filter(page => page.isVisible)" :key="`tab:${settingPageSlotName(c,i)}`" v-slot:['tab:'+c.slug]>
         <div class="flex items-center justify-center whitespace-nowrap w-full px-4 gap-2" @click="setURL(c)">
           <component v-if="c.icon" :is="getIcon(c.icon)" class="w-5 h-5 group-hover:text-lightSidebarIconsHover transition duration-75 dark:group-hover:text-darkSidebarIconsHover dark:text-darkSidebarIcons" ></component>
           {{ c.pageLabel }}
         </div>
       </template>
 
-      <template v-for="(c,i) in coreStore?.config?.settingPages" :key="`${settingPageSlotName(c,i)}-content`" v-slot:[c.slug]>
+      <template v-for="(c,i) in coreStore?.config?.settingPages.filter(page => page.isVisible)" :key="`${settingPageSlotName(c,i)}-content`" v-slot:[c.slug]>
         <component 
           :is="getCustomComponent({file: c.component || ''})"
           :resource="coreStore.resource"

adminforth/types/Back.ts

@@ -1090,7 +1090,8 @@ export interface AdminForthInputConfig {
         icon?: string,
         pageLabel: string,
         slug?: string,
-        component: string
+        component: string,
+        isVisible?: (adminUser: AdminUser) => boolean,
       }[],
     },
 

adminforth/types/Common.ts

@@ -1140,6 +1140,7 @@ export interface AdminForthConfigForFrontend {
     pageLabel: string,
     slug?: string,
     component: string,
+    isVisible?: boolean
   }[],
 }