@finema/finework-layer 0.0.13 → 0.0.14

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [0.0.14](https://gitlab.finema.co/finema/finework/finework-frontend-layer/compare/0.0.13...0.0.14) (2025-10-14)
+
+### Bug Fixes
+
+* **ui:** adjust responsive header height and padding ([000e5d7](https://gitlab.finema.co/finema/finework/finework-frontend-layer/commit/000e5d75d2779c5fd94354cf4426f5a9085af733))
+* **ui:** adjust responsive layout of admin header elements ([0c46820](https://gitlab.finema.co/finema/finework/finework-frontend-layer/commit/0c468205b498a1ff6c260eefd32b4e244a671f96))
+
 ## [0.0.13](https://gitlab.finema.co/finema/finework/finework-frontend-layer/compare/0.0.12...0.0.13) (2025-10-14)
 
 ### Features

package/app/components/Layout/Admin/Sidebar.vue

@@ -148,6 +148,7 @@
 import type { NavigationMenuItem } from '@nuxt/ui'
 import { computed } from 'vue'
 import { useRoute } from 'vue-router'
+import type { Permission, UserModule } from '#imports'
 import Navbar from './Apps.vue'
 
 defineEmits<{
@@ -218,9 +219,56 @@ const mappedItems = (items: NavigationMenuItem[]): NavigationMenuItem[] => {
   })
 }
 
+// filter items base on auth.hasPermission and nested children  , permissions: ['pmo:USER', 'pmo:ADMIN', 'pmo:SUPER']
+const filterItems = (items: NavigationMenuItem[]): NavigationMenuItem[] => {
+  return items.filter((item) => {
+    if (item.permissions && Array.isArray(item.permissions)) {
+      // permissions: ['pmo:USER', 'pmo:ADMIN', 'pmo:SUPER'] => module: 'pmo', permissions: ['USER', 'ADMIN', 'SUPER']
+      const permissionStrings = item.permissions as string[]
+
+      // Extract module from first permission (all should have same module)
+      const firstPermission = permissionStrings[0]
+
+      if (!firstPermission) {
+        return true
+      }
+
+      const [moduleStr] = firstPermission.split(':')
+
+      // Extract all permission levels
+      const permissionLevels = permissionStrings.map((p) => p.split(':')[1]) as Permission[]
+
+      return auth.hasPermission(moduleStr as UserModule, ...permissionLevels)
+    }
+
+    // Recursively filter children
+    if (item.children) {
+      const filteredChildren = filterItems(item.children as NavigationMenuItem[])
+
+      // Only include parent if it has visible children or no permission requirement
+      return filteredChildren.length > 0
+    }
+
+    return true
+  }).map((item) => {
+    // Apply filtering to children
+    if (item.children) {
+      return {
+        ...item,
+        children: filterItems(item.children as NavigationMenuItem[]),
+      }
+    }
+
+    return item
+  })
+}
+
 const navigationItems = computed<NavigationMenuItem[]>(() => {
+  // First filter items based on permissions
+  const filteredItems = filterItems(props.items)
+
   if (props.isGroup) {
-    return props.items.map((group) => {
+    return filteredItems.map((group) => {
       return {
         ...group,
         children: mappedItems(group.children as NavigationMenuItem[]),
@@ -228,6 +276,6 @@ const navigationItems = computed<NavigationMenuItem[]>(() => {
     })
   }
 
-  return mappedItems(props.items)
+  return mappedItems(filteredItems)
 })
 </script>

package/app/components/Layout/Admin/index.vue

@@ -25,8 +25,8 @@
     >
       <nav
         class="
-          fixed top-0 left-0 z-20 flex min-h-[72px] w-screen items-center
-          justify-between gap-4 bg-white px-5
+          fixed top-0 left-0 z-20 flex min-h-[64px] w-screen items-center justify-between
+          gap-4 bg-white px-5 lg:min-h-[72px]
           lg:justify-end
         "
         style="box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.04);"
@@ -75,8 +75,8 @@
               src="/logo-mini.png"
               alt="logo_mini_color"
               class="
-                h-[20px]
-                lg:hidden
+               w-[126px] min-w-[126px] lg:hidden
+                lg:w-[172px] lg:min-w-[172px]
               "
             />
           </NuxtLink>
@@ -97,7 +97,7 @@
           >
             <div class="relative flex cursor-pointer items-center gap-2">
               <div
-                class="flex flex-col justify-end text-right max-sm:hidden"
+                class="hidden flex-col justify-end text-right lg:flex"
               >
                 <p class="font-bold">
                   {{ auth.me.value?.display_name || auth.me.value?.full_name }}
@@ -119,7 +119,7 @@
           </DropdownMenu>
         </div>
       </nav>
-      <div class="w-full bg-gray-50 pt-[72px]">
+      <div class="w-full bg-gray-50 pt-[64px] lg:pt-[72px]">
         <main
           class="
             mx-auto min-h-full w-full flex-1 px-6 py-10 lg:px-8

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@finema/finework-layer",
   "type": "module",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "main": "./nuxt.config.ts",
   "scripts": {
     "dev": "nuxi dev .playground -o",