diff --git a/src/app_modules/job/_ui/ui_not_user_view_job.tsx b/src/app_modules/job/_ui/ui_not_user_view_job.tsx
index f7435e4e..236e9faf 100644
--- a/src/app_modules/job/_ui/ui_not_user_view_job.tsx
+++ b/src/app_modules/job/_ui/ui_not_user_view_job.tsx
@@ -1,21 +1,31 @@
 "use client";
 
-import {
-  UIGlobal_LayoutHeaderTamplate,
-  UIGlobal_LayoutTamplate,
-} from "@/app_modules/_global/ui";
+import { Component_Header } from "@/app_modules/_global/component/new/component_header";
+import UI_NewLayoutTamplate, {
+  UI_NewChildren,
+  UI_NewHeader,
+} from "@/app_modules/_global/ui/V2_layout_tamplate";
 import { Job_ViewNotUserJobVacany } from "../_view";
 
 export function Job_UiNotUserView({ data }: { data: any }) {
   return (
     <>
-      <UIGlobal_LayoutTamplate
+      {/* <UIGlobal_LayoutTamplate
         header={
           <UIGlobal_LayoutHeaderTamplate title="Job Vacancy" hideButtonLeft />
         }
       >
         <Job_ViewNotUserJobVacany data={data} />
-      </UIGlobal_LayoutTamplate>
+      </UIGlobal_LayoutTamplate> */}
+
+      <UI_NewLayoutTamplate>
+        <UI_NewHeader>
+          <Component_Header title="Job Vacancy" hideButtonLeft />
+        </UI_NewHeader>
+        <UI_NewChildren>
+          <Job_ViewNotUserJobVacany data={data} />
+        </UI_NewChildren>
+      </UI_NewLayoutTamplate>
     </>
   );
 }
diff --git a/src/app_modules/job/create/layout.tsx b/src/app_modules/job/create/layout.tsx
index 23240109..3de5f9d8 100644
--- a/src/app_modules/job/create/layout.tsx
+++ b/src/app_modules/job/create/layout.tsx
@@ -1,7 +1,10 @@
 "use client";
 
-import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { Component_Header } from "@/app_modules/_global/component/new/component_header";
+import UI_NewLayoutTamplate, {
+  UI_NewChildren,
+  UI_NewHeader,
+} from "@/app_modules/_global/ui/V2_layout_tamplate";
 import React from "react";
 
 export default function LayoutJob_Create({
@@ -11,11 +14,18 @@ export default function LayoutJob_Create({
 }) {
   return (
     <>
-      <UIGlobal_LayoutTamplate
+      {/* <UIGlobal_LayoutTamplate
         header={<UIGlobal_LayoutHeaderTamplate title="Tambah Job" />}
       >
         {children}
-      </UIGlobal_LayoutTamplate>
+      </UIGlobal_LayoutTamplate> */}
+
+      <UI_NewLayoutTamplate>
+        <UI_NewHeader>
+          <Component_Header title="Tambah Job" />
+        </UI_NewHeader>
+        <UI_NewChildren>{children}</UI_NewChildren>
+      </UI_NewLayoutTamplate>
     </>
   );
 }
diff --git a/src/app_modules/job/detail/arsip/layout.tsx b/src/app_modules/job/detail/arsip/layout.tsx
index 2b03dbb8..6c58d091 100644
--- a/src/app_modules/job/detail/arsip/layout.tsx
+++ b/src/app_modules/job/detail/arsip/layout.tsx
@@ -1,7 +1,7 @@
 "use client";
 
-import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { Component_Header } from "@/app_modules/_global/component/new/component_header";
+import UI_NewLayoutTamplate, { UI_NewChildren, UI_NewHeader } from "@/app_modules/_global/ui/V2_layout_tamplate";
 import React from "react";
 
 export default function LayoutJob_DetailArsip({
@@ -11,11 +11,18 @@ export default function LayoutJob_DetailArsip({
 }) {
   return (
     <>
-      <UIGlobal_LayoutTamplate
+      {/* <UIGlobal_LayoutTamplate
         header={<UIGlobal_LayoutHeaderTamplate title="Detail Arsip" />}
       >
         {children}
-      </UIGlobal_LayoutTamplate>
+      </UIGlobal_LayoutTamplate> */}
+
+      <UI_NewLayoutTamplate>
+        <UI_NewHeader>
+          <Component_Header title="Detail Arsip" />
+        </UI_NewHeader>
+        <UI_NewChildren>{children}</UI_NewChildren>
+      </UI_NewLayoutTamplate>
     </>
   );
 }
diff --git a/src/app_modules/job/detail/draft/layout.tsx b/src/app_modules/job/detail/draft/layout.tsx
index 10207816..339f9d84 100644
--- a/src/app_modules/job/detail/draft/layout.tsx
+++ b/src/app_modules/job/detail/draft/layout.tsx
@@ -1,12 +1,13 @@
 "use client";
 
-import { RouterJob } from "@/lib/router_hipmi/router_job";
+import { Component_Header } from "@/app_modules/_global/component/new/component_header";
 import UIGlobal_Drawer from "@/app_modules/_global/ui/ui_drawer";
-import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
-import {
-  ActionIcon
-} from "@mantine/core";
+import UI_NewLayoutTamplate, {
+  UI_NewChildren,
+  UI_NewHeader,
+} from "@/app_modules/_global/ui/V2_layout_tamplate";
+import { RouterJob } from "@/lib/router_hipmi/router_job";
+import { ActionIcon } from "@mantine/core";
 import { useDisclosure } from "@mantine/hooks";
 import { IconDotsVertical, IconEdit } from "@tabler/icons-react";
 import React from "react";
@@ -31,7 +32,7 @@ export default function LayoutJob_DetailDraft({
 
   return (
     <>
-      <UIGlobal_LayoutTamplate
+      {/* <UIGlobal_LayoutTamplate
         header={
           <UIGlobal_LayoutHeaderTamplate
             title="Detail Draft"
@@ -45,7 +46,21 @@ export default function LayoutJob_DetailDraft({
         }
       >
         {children}
-      </UIGlobal_LayoutTamplate>
+      </UIGlobal_LayoutTamplate> */}
+
+      <UI_NewLayoutTamplate>
+        <UI_NewHeader>
+          <Component_Header
+            title="Detail Draft"
+            iconRight={
+              <ActionIcon variant="transparent" onClick={() => open()}>
+                <IconDotsVertical color="white" />
+              </ActionIcon>
+            }
+          />
+        </UI_NewHeader>
+        <UI_NewChildren>{children}</UI_NewChildren>
+      </UI_NewLayoutTamplate>
 
       <UIGlobal_Drawer
         opened={opened}
diff --git a/src/app_modules/job/detail/main/layout.tsx b/src/app_modules/job/detail/main/layout.tsx
index 50f83045..156d3d3e 100644
--- a/src/app_modules/job/detail/main/layout.tsx
+++ b/src/app_modules/job/detail/main/layout.tsx
@@ -1,7 +1,10 @@
 "use client";
 
-import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { Component_Header } from "@/app_modules/_global/component/new/component_header";
+import UI_NewLayoutTamplate, {
+  UI_NewChildren,
+  UI_NewHeader,
+} from "@/app_modules/_global/ui/V2_layout_tamplate";
 import React from "react";
 
 export default function LayoutJob_MainDetail({
@@ -11,11 +14,18 @@ export default function LayoutJob_MainDetail({
 }) {
   return (
     <>
-      <UIGlobal_LayoutTamplate
+      {/* <UIGlobal_LayoutTamplate
         header={<UIGlobal_LayoutHeaderTamplate title="Detail Job" />}
       >
         {children}
-      </UIGlobal_LayoutTamplate>
+      </UIGlobal_LayoutTamplate> */}
+
+      <UI_NewLayoutTamplate>
+        <UI_NewHeader>
+          <Component_Header title="Detail Job" />
+        </UI_NewHeader>
+        <UI_NewChildren>{children}</UI_NewChildren>
+      </UI_NewLayoutTamplate>
     </>
   );
 }
diff --git a/src/app_modules/job/detail/publish/layout.tsx b/src/app_modules/job/detail/publish/layout.tsx
index a117c885..45f215a6 100644
--- a/src/app_modules/job/detail/publish/layout.tsx
+++ b/src/app_modules/job/detail/publish/layout.tsx
@@ -1,7 +1,10 @@
 "use client";
 
-import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { Component_Header } from "@/app_modules/_global/component/new/component_header";
+import UI_NewLayoutTamplate, {
+  UI_NewChildren,
+  UI_NewHeader,
+} from "@/app_modules/_global/ui/V2_layout_tamplate";
 import React from "react";
 
 export default function LayoutJob_DetailPublish({
@@ -11,11 +14,18 @@ export default function LayoutJob_DetailPublish({
 }) {
   return (
     <>
-      <UIGlobal_LayoutTamplate
+      {/* <UIGlobal_LayoutTamplate
         header={<UIGlobal_LayoutHeaderTamplate title="Detail Publish" />}
       >
         {children}
-      </UIGlobal_LayoutTamplate>
+      </UIGlobal_LayoutTamplate> */}
+
+      <UI_NewLayoutTamplate>
+        <UI_NewHeader>
+          <Component_Header title="Detail Publish" />
+        </UI_NewHeader>
+        <UI_NewChildren>{children}</UI_NewChildren>
+      </UI_NewLayoutTamplate>
     </>
   );
 }
diff --git a/src/app_modules/job/detail/reject/layout.tsx b/src/app_modules/job/detail/reject/layout.tsx
index 3c5d5fbd..1ae3d1b7 100644
--- a/src/app_modules/job/detail/reject/layout.tsx
+++ b/src/app_modules/job/detail/reject/layout.tsx
@@ -1,7 +1,10 @@
 "use client";
 
-import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { Component_Header } from "@/app_modules/_global/component/new/component_header";
+import UI_NewLayoutTamplate, {
+  UI_NewChildren,
+  UI_NewHeader,
+} from "@/app_modules/_global/ui/V2_layout_tamplate";
 import React from "react";
 
 export default function LayoutJob_DetailReject({
@@ -11,11 +14,18 @@ export default function LayoutJob_DetailReject({
 }) {
   return (
     <>
-      <UIGlobal_LayoutTamplate
+      {/* <UIGlobal_LayoutTamplate
         header={<UIGlobal_LayoutHeaderTamplate title="Detail Reject" />}
       >
         {children}
-      </UIGlobal_LayoutTamplate>
+      </UIGlobal_LayoutTamplate> */}
+
+      <UI_NewLayoutTamplate>
+        <UI_NewHeader>
+          <Component_Header title="Detail Reject" />
+        </UI_NewHeader>
+        <UI_NewChildren>{children}</UI_NewChildren>
+      </UI_NewLayoutTamplate>
     </>
   );
 }
diff --git a/src/app_modules/job/detail/review/layout.tsx b/src/app_modules/job/detail/review/layout.tsx
index 480a5495..10c267a0 100644
--- a/src/app_modules/job/detail/review/layout.tsx
+++ b/src/app_modules/job/detail/review/layout.tsx
@@ -1,7 +1,10 @@
 "use client";
 
-import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { Component_Header } from "@/app_modules/_global/component/new/component_header";
+import UI_NewLayoutTamplate, {
+  UI_NewChildren,
+  UI_NewHeader,
+} from "@/app_modules/_global/ui/V2_layout_tamplate";
 import React from "react";
 
 export default function LayoutJob_DetailReview({
@@ -11,11 +14,18 @@ export default function LayoutJob_DetailReview({
 }) {
   return (
     <>
-      <UIGlobal_LayoutTamplate
+      {/* <UIGlobal_LayoutTamplate
         header={<UIGlobal_LayoutHeaderTamplate title="Detail Review" />}
       >
         {children}
-      </UIGlobal_LayoutTamplate>
+      </UIGlobal_LayoutTamplate> */}
+
+      <UI_NewLayoutTamplate>
+        <UI_NewHeader>
+          <Component_Header title="Detail Review" />
+        </UI_NewHeader>
+        <UI_NewChildren>{children}</UI_NewChildren>
+      </UI_NewLayoutTamplate>
     </>
   );
 }
diff --git a/src/app_modules/job/edit/layout.tsx b/src/app_modules/job/edit/layout.tsx
index 2e9cb44b..b22e1c02 100644
--- a/src/app_modules/job/edit/layout.tsx
+++ b/src/app_modules/job/edit/layout.tsx
@@ -1,7 +1,10 @@
 "use client";
 
-import UIGlobal_LayoutHeaderTamplate from "@/app_modules/_global/ui/ui_header_tamplate";
-import UIGlobal_LayoutTamplate from "@/app_modules/_global/ui/ui_layout_tamplate";
+import { Component_Header } from "@/app_modules/_global/component/new/component_header";
+import UI_NewLayoutTamplate, {
+  UI_NewChildren,
+  UI_NewHeader,
+} from "@/app_modules/_global/ui/V2_layout_tamplate";
 import React from "react";
 
 export default function LayoutJob_Edit({
@@ -11,12 +14,18 @@ export default function LayoutJob_Edit({
 }) {
   return (
     <>
-      <UIGlobal_LayoutTamplate
+      {/* <UIGlobal_LayoutTamplate
         header={<UIGlobal_LayoutHeaderTamplate title="Edit Job" />}
       >
         {children}
-      </UIGlobal_LayoutTamplate>
+      </UIGlobal_LayoutTamplate> */}
 
+      <UI_NewLayoutTamplate>
+        <UI_NewHeader>
+          <Component_Header title="Edit Job" />
+        </UI_NewHeader>
+        <UI_NewChildren>{children}</UI_NewChildren>
+      </UI_NewLayoutTamplate>
     </>
   );
 }