Portofolio

#feat
- Create porto
- Edit Porto
- Upload gambar background profile
- List user
- Search user
## No issuue

src/app_modules/user_search/fun/get/get_list_user.ts

@@ -0,0 +1,24 @@
+"use server";
+
+import prisma from "@/app/lib/prisma";
+
+export async function UserSearch_getListUser() {
+  const data = await prisma.user.findMany({
+  
+    select: {
+      id: true,
+      username: true,
+      nomor: true,
+      active: true,
+      masterUserRoleId: true,
+      Profile: {
+        select: {
+          id: true,
+          name: true,
+          imagesId: true,
+        },
+      },
+    },
+  });
+  return data;
+}

src/app_modules/user_search/fun/search/fun_search_by_name.ts

@@ -0,0 +1,29 @@
+"use server";
+
+import prisma from "@/app/lib/prisma";
+import { useSearchParams } from "next/navigation";
+import { NextRequest } from "next/server";
+
+export async function UserSearch_searchByName(name: string) {
+  const data = await prisma.user.findMany({
+    where: {
+      Profile: {
+        name: {
+          contains: name,
+          mode: "insensitive",
+        },
+      },
+    },
+    take: 10,
+    select: {
+      id: true,
+      username: true,
+      nomor: true,
+      active: true,
+      masterUserRoleId: true,
+      Profile: true,
+    },
+  });
+
+  return data;
+}

src/app_modules/user_search/index.ts

@@ -0,0 +1,7 @@
+import UserSearch_MainView from "./main";
+import LayoutUserSearch_MainView from "./main/layout";
+
+export {
+    UserSearch_MainView,
+    LayoutUserSearch_MainView,
+}

src/app_modules/user_search/main/index.tsx

@@ -0,0 +1,82 @@
+"use client";
+
+import { RouterProfile } from "@/app/lib/router_hipmi/router_katalog";
+import { MODEL_USER } from "@/app_modules/home/model/interface";
+import {
+  ActionIcon,
+  Avatar,
+  Box,
+  Center,
+  Divider,
+  Grid,
+  Paper,
+  Stack,
+  Text,
+  TextInput,
+} from "@mantine/core";
+import { IconChevronRight, IconSearch } from "@tabler/icons-react";
+import { useState } from "react";
+import { UserSearch_searchByName } from "../fun/search/fun_search_by_name";
+import { useRouter } from "next/navigation";
+
+export default function UserSearch_MainView({
+  listUser,
+}: {
+  listUser: MODEL_USER[];
+}) {
+  const router = useRouter()
+  const [user, setUser] = useState(listUser);
+
+  async function onSearch(name: string) {
+    await UserSearch_searchByName(name).then((res) => setUser(res as any));
+  }
+  return (
+    <>
+      <Box>
+        {/* <pre>{JSON.stringify(user, null,2)}</pre>r */}
+        <Stack spacing={"md"}>
+          <TextInput
+            icon={<IconSearch size={20} />}
+            placeholder="Masukan nama pegguna"
+            onChange={(val) => onSearch(val.target.value)}
+          />
+          {user.map((e) => (
+            <Stack key={e.id} spacing={"xs"}>
+              <Grid>
+                <Grid.Col span={2}>
+                  <Avatar
+                    radius={"xl"}
+                    size={"lg"}
+                    src={
+                      RouterProfile.api_foto_profile + `${e.Profile.imagesId}`
+                    }
+                  />
+                </Grid.Col>
+                <Grid.Col span={"auto"}>
+                  <Stack spacing={0}>
+                    <Text fw={"bold"} truncate>
+                      {e.Profile.name}
+                    </Text>
+                    <Text fz={"sm"} fs={"italic"}>
+                      +{e.nomor}
+                    </Text>
+                  </Stack>
+                </Grid.Col>
+                <Grid.Col span={2}>
+                  <Center h={"100%"}>
+                    <ActionIcon variant="transparent"
+                    onClick={() => router.push(RouterProfile.katalog + `${e.Profile.id}`)}
+                    >
+                    <IconChevronRight />
+                    </ActionIcon>
+                  </Center>
+                </Grid.Col>
+              </Grid>
+              <Divider />
+            </Stack>
+          ))}
+        </Stack>
+      </Box>
+    </>
+  );
+}

src/app_modules/user_search/main/layout.tsx

@@ -0,0 +1,21 @@
+"use client";
+
+import ComponentGlobal_HeaderTamplate from "@/app_modules/component_global/header_tamplate";
+import { AppShell } from "@mantine/core";
+import React from "react";
+
+export default function LayoutUserSearch_MainView({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <>
+      <AppShell
+        header={<ComponentGlobal_HeaderTamplate title="Temukan Pengguna" />}
+      >
+        {children}
+      </AppShell>
+    </>
+  );
+}