fix use serach

This commit is contained in:
2025-02-07 11:11:29 +08:00
parent e64b5a8d01
commit eac2367a1c
4 changed files with 35 additions and 56 deletions

View File

@@ -30,7 +30,7 @@ export async function GET(request: Request) {
const { searchParams } = new URL(request.url); const { searchParams } = new URL(request.url);
const search = searchParams.get("search"); const search = searchParams.get("search");
const page = searchParams.get("page"); const page = searchParams.get("page");
const takeData = 1; const takeData = 15;
const skipData = Number(page) * takeData - takeData; const skipData = Number(page) * takeData - takeData;
if (!page) { if (!page) {

View File

@@ -85,7 +85,7 @@ export default function HomeViewNew() {
<ActionIcon radius={"xl"} variant={"transparent"}> <ActionIcon radius={"xl"} variant={"transparent"}>
<IconUserSearch color={MainColor.white} /> <IconUserSearch color={MainColor.white} />
</ActionIcon> </ActionIcon>
) : dataUser && dataUser?.profile === undefined ? ( ) : dataUser?.profile === undefined ? (
<ActionIcon <ActionIcon
radius={"xl"} radius={"xl"}
variant={"transparent"} variant={"transparent"}
@@ -112,7 +112,7 @@ export default function HomeViewNew() {
<ActionIcon radius={"xl"} variant={"transparent"}> <ActionIcon radius={"xl"} variant={"transparent"}>
<IconBell color={MainColor.white} /> <IconBell color={MainColor.white} />
</ActionIcon> </ActionIcon>
) : dataUser && dataUser?.profile === undefined ? ( ) : dataUser?.profile === undefined ? (
<ActionIcon <ActionIcon
radius={"xl"} radius={"xl"}
variant={"transparent"} variant={"transparent"}

View File

@@ -0,0 +1,27 @@
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { Grid, Group, Stack } from "@mantine/core";
export function UserSearch_SkeletonView() {
return (
<>
<Stack>
{Array.from({ length: 2 }).map((e, i) => (
<Grid key={i}>
<Grid.Col span={2}>
<CustomSkeleton height={40} width={40} circle />
</Grid.Col>
<Grid.Col span={"auto"}>
<Stack>
<CustomSkeleton width={"80%"} height={20} />
<CustomSkeleton width={"40%"} height={15} />
</Stack>
</Grid.Col>
<Grid.Col span={2}>
<CustomSkeleton height={40} width={40} circle />
</Grid.Col>
</Grid>
))}
</Stack>
</>
);
}

View File

@@ -25,6 +25,7 @@ import { useRouter } from "next/navigation";
import { useState } from "react"; import { useState } from "react";
import { userSearch_getAllUser } from "../fun/get/get_all_user"; import { userSearch_getAllUser } from "../fun/get/get_all_user";
import { apiGetUserSearch } from "./api_fetch_user_search"; import { apiGetUserSearch } from "./api_fetch_user_search";
import { UserSearch_SkeletonView } from "./skeleton_view";
export function UserSearch_UiView() { export function UserSearch_UiView() {
const [data, setData] = useState<MODEL_USER[]>([]); const [data, setData] = useState<MODEL_USER[]>([]);
@@ -107,15 +108,15 @@ export function UserSearch_UiView() {
onChange={(val) => handleSearch(val.target.value)} onChange={(val) => handleSearch(val.target.value)}
// disabled={isLoading} // disabled={isLoading}
/> />
{!data && isLoading ? ( {!data.length && isLoading ? (
<CustomSkeleton height={40} width={"100%"} /> <UserSearch_SkeletonView />
) : ( ) : (
<Box > <Box>
{_.isEmpty(data) ? ( {_.isEmpty(data) ? (
<ComponentGlobal_IsEmptyData text="Pengguna tidak ditemukan" /> <ComponentGlobal_IsEmptyData text="Pengguna tidak ditemukan" />
) : ( ) : (
<ScrollOnly <ScrollOnly
height="5vh" height="84vh"
renderLoading={() => ( renderLoading={() => (
<Center mt={"lg"}> <Center mt={"lg"}>
<Loader color={"yellow"} /> <Loader color={"yellow"} />
@@ -170,61 +171,12 @@ function CardView({ data }: { data: MODEL_USER }) {
<Group position="right" align="center" h={"100%"}> <Group position="right" align="center" h={"100%"}>
<Center> <Center>
<ActionIcon variant="transparent"> <ActionIcon variant="transparent">
{/* PAKE LOADING */}
{/* {loading ? (
<ComponentGlobal_Loader />
) : (
<IconChevronRight color="white" />
)} */}
{/* GA PAKE LOADING */}
<IconChevronRight color="white" /> <IconChevronRight color="white" />
</ActionIcon> </ActionIcon>
</Center> </Center>
</Group> </Group>
</Grid.Col> </Grid.Col>
</Grid> </Grid>
{/* <Stack
spacing={"xs"}
c="white"
py={"xs"}
onClick={() => {
setLoading(true);
router.push(RouterProfile.katalogOLD + `${data?.Profile?.id}`);
}}
>
<Group position="apart" grow>
<Group position="left" bg={"blue"}>
<ComponentGlobal_LoaderAvatar
fileId={data.Profile.imageId as any}
imageSize="100"
/>
<Stack spacing={0}>
<Text fw={"bold"} lineClamp={1}>
{data?.Profile.name}d sdasd sdas
</Text>
<Text fz={"sm"} fs={"italic"}>
+{data?.nomor}
</Text>
</Stack>
</Group>
<Group position="right">
<Center>
<ActionIcon variant="transparent">
{loading ? (
<ComponentGlobal_Loader />
) : (
<IconChevronRight color="white" />
)}
</ActionIcon>
</Center>
</Group>
</Group>
</Stack> */}
</> </>
); );
} }