diff --git a/src/module/home/view/view_search.tsx b/src/module/home/view/view_search.tsx
new file mode 100644
index 0000000..74d8054
--- /dev/null
+++ b/src/module/home/view/view_search.tsx
@@ -0,0 +1,57 @@
+"use client"
+import { LayoutNavbarNew, WARNA } from '@/module/_global';
+import { Box, TextInput } from '@mantine/core';
+import React, { useState } from 'react';
+import { HiMagnifyingGlass } from 'react-icons/hi2';
+import { funGetSearchAll } from '../lib/api_search';
+import { useShallowEffect } from '@mantine/hooks';
+
+export default function ViewSearch() {
+  const [search, setSearch] = useState('');
+  const [dataUser, setDataUser] = useState([]);
+  const [dataProject, setDataProject] = useState([]);
+  const [dataDivision, setDataDivision] = useState([]);
+
+  async function featchSearch() {
+    try {
+      const res = await funGetSearchAll('?search=' + search);
+      setDataUser(res.data.user);
+      setDataProject(res.data.project);
+      setDataDivision(res.data.division);
+    } catch (error) {
+      console.error(error)
+      throw new Error("Error")
+    }
+  }
+
+  useShallowEffect(() => {
+    featchSearch()
+  }, [search])
+
+  return (
+    <>
+      <LayoutNavbarNew back='/home' title='Pencarian' menu={<></>} />
+      <Box p={20}>
+        <TextInput
+          styles={{
+            input: {
+              color: WARNA.biruTua,
+              borderRadius: WARNA.biruTua,
+              borderColor: WARNA.biruTua,
+            },
+          }}
+          size="md"
+          radius={30}
+          leftSection={<HiMagnifyingGlass size={20} />}
+          placeholder="Pencarian"
+          onChange={(e) => setSearch(e.target.value)}
+        />
+        {/* <pre>{JSON.stringify(dataUser, null, 1)}</pre>
+        <pre>{JSON.stringify(dataProject, null, 1)}</pre>
+        <pre>{JSON.stringify(dataDivision, null, 1)}</pre> */}
+        
+      </Box>
+    </>
+  );
+}
+