diff --git a/components/form/article/generate-article-form.tsx b/components/form/article/generate-article-form.tsx
index 315b915..3aacaac 100644
--- a/components/form/article/generate-article-form.tsx
+++ b/components/form/article/generate-article-form.tsx
@@ -1,6 +1,6 @@
 "use client";
 import { error } from "@/config/swal";
-import { createArticle } from "@/service/article";
+import { createArticle, getArticleByCategory } from "@/service/article";
 import { zodResolver } from "@hookform/resolvers/zod";
 import {
   Button,
@@ -60,6 +60,17 @@ const dummyCategory = [
   },
 ];
 
+const TypeId = [
+  {
+    key: 1,
+    label: "Article",
+  },
+  {
+    key: 2,
+    label: "Magazine",
+  },
+];
+
 export default function GenerateArticleForm() {
   const animatedComponents = makeAnimated();
 
@@ -98,6 +109,9 @@ export default function GenerateArticleForm() {
 
   const [selectedGeneratedArticleId, setSelectedGeneratedArticleId] =
     useState<number>();
+  const [listCategory, setListCategory] = useState<
+    { id: number; label: string; value: number }[]
+  >([]);
 
   useEffect(() => {
     setCollectSingleArticleId(generatedArticleIdStore.singleArticle);
@@ -105,16 +119,28 @@ export default function GenerateArticleForm() {
     setCollectRewriteArticleId(generatedArticleIdStore.rewriteArticle);
   });
 
-  const TypeId = [
-    {
-      key: 1,
-      label: "Article",
-    },
-    {
-      key: 2,
-      label: "Magazine",
-    },
-  ];
+  useEffect(() => {
+    fetchCategory();
+  }, []);
+
+  const fetchCategory = async () => {
+    const res = await getArticleByCategory();
+    if (res?.data?.data) {
+      setupCategory(res?.data?.data);
+    }
+  };
+
+  const setupCategory = (data: any) => {
+    const temp = [];
+    for (const element of data) {
+      temp.push({
+        id: element.id,
+        label: element.title,
+        value: element.id,
+      });
+    }
+    setListCategory(temp);
+  };
 
   const handleImageChange = (event: ChangeEvent<HTMLInputElement>) => {
     if (event.target.files) {
@@ -153,7 +179,7 @@ export default function GenerateArticleForm() {
       title: title,
       typeId: parseInt(String(Array.from(article)[0])),
       slug: slug,
-      categoryId: 215,
+      categoryId: selectedCategory[0].id,
       tags: tags.join(","),
       description: content,
       htmlDescription: content,
@@ -306,7 +332,7 @@ export default function GenerateArticleForm() {
               isMulti={true}
               placeholder="Category ..."
               name="sub-module"
-              options={dummyCategory}
+              options={listCategory}
             />
             <div className="text-sm text-red-500">
               {(!selectedCategory || selectedCategory?.length < 1) && (
diff --git a/components/form/form-article.tsx b/components/form/form-article.tsx
index e8632ea..044dee5 100644
--- a/components/form/form-article.tsx
+++ b/components/form/form-article.tsx
@@ -1,6 +1,6 @@
 "use client";
 import { error } from "@/config/swal";
-import { createArticle } from "@/service/article";
+import { createArticle, getArticleByCategory } from "@/service/article";
 import { zodResolver } from "@hookform/resolvers/zod";
 import {
   Button,
@@ -72,10 +72,9 @@ export default function FormArticle() {
   const MySwal = withReactContent(Swal);
   const [selectedImages, setSelectedImages] = useState<File[]>([]);
   const [selectedCategory, setSelectedCategory] = useState<any>();
-
-  useEffect(() => {
-    console.log("selected", selectedCategory);
-  }, [selectedCategory]);
+  const [listCategory, setListCategory] = useState<
+    { id: number; label: string; value: number }[]
+  >([]);
 
   const formOptions = { resolver: zodResolver(articleSchema) };
   type MicroIssueSchema = z.infer<typeof articleSchema>;
@@ -98,6 +97,29 @@ export default function FormArticle() {
     },
   ];
 
+  useEffect(() => {
+    fetchCategory();
+  }, []);
+
+  const fetchCategory = async () => {
+    const res = await getArticleByCategory();
+    if (res?.data?.data) {
+      setupCategory(res?.data?.data);
+    }
+  };
+
+  const setupCategory = (data: any) => {
+    const temp = [];
+    for (const element of data) {
+      temp.push({
+        id: element.id,
+        label: element.title,
+        value: element.id,
+      });
+    }
+    setListCategory(temp);
+  };
+
   const handleImageChange = (event: ChangeEvent<HTMLInputElement>) => {
     if (event.target.files) {
       const files = Array.from(event.target.files);
@@ -146,7 +168,7 @@ export default function FormArticle() {
       title: title,
       typeId: parseInt(String(Array.from(article)[0])),
       slug: slug,
-      categoryId: 215,
+      categoryId: selectedCategory[0].id,
       oldId: 1,
       tags: tags.join(","),
       description: content,
@@ -250,7 +272,7 @@ export default function FormArticle() {
               isMulti={true}
               placeholder="Category ..."
               name="sub-module"
-              options={dummyCategory}
+              options={listCategory}
             />
             <div className="text-sm text-red-500">
               {(!selectedCategory || selectedCategory?.length < 1) && (
diff --git a/components/layout/navbar/NavbarHumas.tsx b/components/layout/navbar/NavbarHumas.tsx
index 6952632..352e403 100644
--- a/components/layout/navbar/NavbarHumas.tsx
+++ b/components/layout/navbar/NavbarHumas.tsx
@@ -382,9 +382,32 @@ export default function NavbarHumas() {
                 <ThemeSwitch />
               </div>
               {token ? (
-                <Button className="bg-[#DD8306]" onPress={onLogout}>
-                  Logout
-                </Button>
+                // <Button className="bg-[#DD8306]" onPress={onLogout}>
+                //   Logout
+                // </Button>
+                <Dropdown>
+                  <DropdownTrigger>
+                    <Button variant="bordered">Menu</Button>
+                  </DropdownTrigger>
+                  <DropdownMenu aria-label="Static Actions">
+                    <DropdownItem
+                      key="dashboard"
+                      onPress={() => router.push("/admin/dashboard")}
+                    >
+                      Dashboard
+                    </DropdownItem>
+                    <DropdownItem key="dashboard">Profile</DropdownItem>
+
+                    <DropdownItem
+                      key="logout"
+                      className="text-danger"
+                      color="danger"
+                      onPress={onLogout}
+                    >
+                      Logout
+                    </DropdownItem>
+                  </DropdownMenu>
+                </Dropdown>
               ) : (
                 <Link href="/auth">
                   <Button className="bg-[#DD8306]">Login</Button>
@@ -412,6 +435,12 @@ export default function NavbarHumas() {
                           <Button className="bg-[#DD8306]">Login</Button>
                         </Link>
                       )
+                    ) : item.key === "dashboard" ? (
+                      token && (
+                        <Link href="/admin/dashboard">
+                          <span>{item.label}</span>
+                        </Link>
+                      )
                     ) : (
                       <div
                         onClick={() => toggleDropdown(item.key)}
diff --git a/config/site.ts b/config/site.ts
index f16113b..a9f850e 100644
--- a/config/site.ts
+++ b/config/site.ts
@@ -122,6 +122,11 @@ export const siteConfig = {
       label: "Kontak",
       href: "/kontak-kami",
     },
+    {
+      key: "dashboard",
+      label: "Dashboard",
+      href: "/admin",
+    },
     {
       key: "login",
       label: "Login",
diff --git a/service/article.ts b/service/article.ts
index a6f3fce..b37fd2f 100644
--- a/service/article.ts
+++ b/service/article.ts
@@ -46,3 +46,10 @@ export async function getArticleById(id: any) {
 export async function deleteArticle(id: string) {
   return await httpDeleteInterceptor(`articles/${id}`);
 }
+
+export async function getArticleByCategory() {
+  const headers = {
+    "content-type": "application/json",
+  };
+  return await httpGet(`/article-categories?limit=50`, headers);
+}