fix use serach
This commit is contained in:
@@ -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) {
|
||||||
|
|||||||
@@ -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"}
|
||||||
|
|||||||
27
src/app_modules/user_search/component/skeleton_view.tsx
Normal file
27
src/app_modules/user_search/component/skeleton_view.tsx
Normal 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>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -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> */}
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user