diff --git a/app/components/app/division/detail/list-cfg.ts b/app/components/app/division/detail/list-cfg.ts
index 235a20cc..15e7b7e9 100644
--- a/app/components/app/division/detail/list-cfg.ts
+++ b/app/components/app/division/detail/list-cfg.ts
@@ -33,8 +33,10 @@ export const config: Config = {
     },
     employee: (rec: unknown): unknown => {
       const recX = rec as DivisionPosition
-      const fullName =
-        `${recX.employee?.person.frontTitle} ${recX.employee?.person.name} ${recX.employee?.person.endTitle}`.trim()
+      const fullName = [recX.employee?.person.frontTitle, recX.employee?.person.name, recX.employee?.person.endTitle]
+        .filter(Boolean)
+        .join(' ')
+        .trim()
 
       return fullName || '-'
     },
diff --git a/app/components/app/division/list-cfg.ts b/app/components/app/division/list-cfg.ts
index 54ed06a6..2d7f93ba 100644
--- a/app/components/app/division/list-cfg.ts
+++ b/app/components/app/division/list-cfg.ts
@@ -3,17 +3,12 @@ import { defineAsyncComponent } from 'vue'
 
 type SmallDetailDto = any
 
-const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-ud.vue'))
+const action = defineAsyncComponent(() => import('~/components/pub/my-ui/data/dropdown-action-dud.vue'))
 
 export const config: Config = {
   cols: [{}, {}, {}, { width: 50 }],
 
-  headers: [[
-    { label: 'Kode' },
-    { label: 'Nama' },
-    { label: 'Divisi Induk' },
-    { label: '' },
-  ]],
+  headers: [[{ label: 'Kode' }, { label: 'Nama' }, { label: 'Divisi Induk' }, { label: '' }]],
 
   keys: ['code', 'name', 'parent', 'action'],
 
@@ -44,4 +39,4 @@ export const config: Config = {
   },
 
   htmls: {},
-}
\ No newline at end of file
+}
diff --git a/app/components/content/division/list.vue b/app/components/content/division/list.vue
index 9ccefc56..d9294491 100644
--- a/app/components/content/division/list.vue
+++ b/app/components/content/division/list.vue
@@ -13,7 +13,7 @@ import { toast } from '~/components/pub/ui/toast'
 // Types
 import { ActionEvents, type HeaderPrep } from '~/components/pub/my-ui/data/types'
 import { DivisionSchema, type DivisionFormData } from '~/schemas/division.schema'
-import type { Division } from "~/models/division"
+import type { Division } from '~/models/division'
 import type { TreeItem } from '~/models/_base'
 
 // Handlers
@@ -104,9 +104,13 @@ const getCurrentDivisionDetail = async (id: number | string) => {
 watch([recId, recAction], () => {
   switch (recAction.value) {
     case ActionEvents.showDetail:
-      getCurrentDivisionDetail(recId.value)
-      title.value = 'Detail Divisi'
-      isReadonly.value = true
+      navigateTo({
+        name: 'org-src-division-id',
+        params: {
+          id: Number(recId.value),
+        },
+      })
+
       break
     case ActionEvents.showEdit:
       getCurrentDivisionDetail(recId.value)
diff --git a/app/components/pub/my-ui/data/dropdown-action-dud.vue b/app/components/pub/my-ui/data/dropdown-action-dud.vue
index 71979c7c..dfcf1ada 100644
--- a/app/components/pub/my-ui/data/dropdown-action-dud.vue
+++ b/app/components/pub/my-ui/data/dropdown-action-dud.vue
@@ -2,9 +2,14 @@
 import type { LinkItem, ListItemDto } from './types'
 import { ActionEvents } from './types'
 
-const props = defineProps<{
+interface Props {
   rec: ListItemDto
-}>()
+  size?: 'default' | 'sm' | 'lg'
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 'lg',
+})
 
 const recId = inject<Ref<number>>('rec_id')!
 const recAction = inject<Ref<string>>('rec_action')!
@@ -58,7 +63,7 @@ function del() {
     <DropdownMenu>
       <DropdownMenuTrigger as-child>
         <SidebarMenuButton
-          size="lg"
+          :size="size"
           class="data-[state=open]:text-sidebar-accent-foreground data-[state=open]:bg-white dark:data-[state=open]:bg-slate-800"
         >
           <Icon