wibu/hipmi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Collaboration & Create Porotofolio

Browse Source
This commit is contained in:
nico
2025-01-05 15:53:41 +08:00
parent 18bd4efed1
commit b1573af1b8
29 changed files with 368 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/app_modules/colab/component/card_view/card_section_jumlah_partisipan.tsx
View File

@@ -1,5 +1,6 @@
"use client";
import { MainColor } from "@/app_modules/_global/color";
import { Card, Center, Divider, Grid, Stack, Text } from "@mantine/core";
export default function ComponentColab_JumlahPartisipan({
@@ -15,12 +16,12 @@ export default function ComponentColab_JumlahPartisipan({
<Center>
<Grid>
<Grid.Col span={"content"}>
<Text c={"white"} fz={"xs"} fw={"bold"}>
<Text c={MainColor.white} fz={"xs"} fw={"bold"}>
{jumlah?.length ? jumlah?.length : 0}
</Text>
</Grid.Col>
<Grid.Col span={"auto"}>
<Text c={"white"} fz={"xs"} fw={"bold"}>
<Text c={MainColor.white} fz={"xs"} fw={"bold"}>
Partisipan
</Text>
</Grid.Col>

8
src/app_modules/colab/component/card_view/crad_grup.tsx
View File

@@ -1,5 +1,5 @@
import { RouterColab } from "@/app/lib/router_hipmi/router_colab";
import { AccentColor } from "@/app_modules/_global/color/color_pallet";
import { AccentColor, MainColor } from "@/app_modules/_global/color/color_pallet";
import ComponentGlobal_Loader from "@/app_modules/_global/component/loader";
import { Paper, Grid, Stack, Center, Loader, Text } from "@mantine/core";
import { IconChevronRight } from "@tabler/icons-react";
@@ -17,7 +17,7 @@ export function ComponentColab_CardGrup({ data }: { data: any }) {
style={{
border: `2px solid ${AccentColor.blue}`,
backgroundColor: AccentColor.darkblue,
color: "white",
color: MainColor.white,
borderRadius: "10px",
marginBottom: "20px",
padding: "15px",
@@ -37,7 +37,7 @@ export function ComponentColab_CardGrup({ data }: { data: any }) {
<Text fw={"bold"} lineClamp={1}>
{data?.ProjectCollaboration_RoomChat?.name}
</Text>
<Text fz={"xs"} c={"white"}>
<Text fz={"xs"} >
{
data?.ProjectCollaboration_RoomChat
?.ProjectCollaboration_AnggotaRoomChat.length
@@ -51,7 +51,7 @@ export function ComponentColab_CardGrup({ data }: { data: any }) {
{data?.ProjectCollaboration_RoomChat?.id === idRoom ? (
<ComponentGlobal_Loader />
) : (
<IconChevronRight color="white" />
<IconChevronRight color={MainColor.white} />
)}
</Center>
</Grid.Col>

117
src/app_modules/colab/component/skeleton_view.tsx
View File

@@ -1,4 +1,5 @@
import { ComponentGlobal_CardStyles } from "@/app_modules/_global/component";
import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
import { Center, Grid, Group, Skeleton, Stack } from "@mantine/core";
export {
@@ -16,27 +17,27 @@ function Collaboration_SkeletonCreate() {
<>
<Stack px={"xl"} spacing={"md"}>
<Stack spacing={"xs"}>
<Skeleton height={15} width={50} />
<Skeleton height={40} />
<CustomSkeleton height={15} width={50} />
<CustomSkeleton height={40} />
</Stack>
<Stack spacing={"xs"}>
<Skeleton height={15} width={50} />
<Skeleton height={40} />
<CustomSkeleton height={15} width={50} />
<CustomSkeleton height={40} />
</Stack>
<Stack spacing={"xs"}>
<Skeleton height={15} width={50} />
<Skeleton height={40} />
<CustomSkeleton height={15} width={50} />
<CustomSkeleton height={40} />
</Stack>
<Stack spacing={"xs"}>
<Skeleton height={15} width={50} />
<Skeleton height={130} />
<CustomSkeleton height={15} width={50} />
<CustomSkeleton height={130} />
</Stack>
<Stack spacing={"xs"}>
<Skeleton height={15} width={50} />
<Skeleton height={130} />
<CustomSkeleton height={15} width={50} />
<CustomSkeleton height={130} />
</Stack>
<Skeleton mt={50} height={40} radius={"xl"} />
<CustomSkeleton mt={50} height={40} radius={"xl"} />
</Stack>
</>
);
@@ -50,45 +51,45 @@ function Collaboration_SkeletonBeranda() {
<Stack spacing={"xl"}>
<Grid align="center" gutter={"md"}>
<Grid.Col span={"content"}>
<Skeleton circle height={40} />
<CustomSkeleton circle height={40} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
{/* <Grid.Col span={3} offset={3}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col> */}
</Grid>
<Center>
<Skeleton height={15} w={200} />
<CustomSkeleton height={15} w={200} />
</Center>
<Grid align="center" gutter={"md"}>
<Grid.Col span={"content"}>
<Skeleton h={15} w={70} />
<CustomSkeleton h={15} w={70} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={15} w={200} />
<CustomSkeleton height={15} w={200} />
</Grid.Col>
</Grid>
<Grid align="center" gutter={"md"}>
<Grid.Col span={"content"}>
<Skeleton h={15} w={70} />
<CustomSkeleton h={15} w={70} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={15} w={200} />
<CustomSkeleton height={15} w={200} />
</Grid.Col>
</Grid>
<Stack spacing={"md"}>
<Skeleton height={15} w={150} />
<Skeleton height={15} w={"100%"} />
<Skeleton height={15} w={"100%"} />
<CustomSkeleton height={15} w={150} />
<CustomSkeleton height={15} w={"100%"} />
<CustomSkeleton height={15} w={"100%"} />
</Stack>
<Center>
<Skeleton height={15} w={100} />
<CustomSkeleton height={15} w={100} />
</Center>
</Stack>
</ComponentGlobal_CardStyles>
@@ -104,11 +105,11 @@ function Collaboration_SkeletonGrup() {
<ComponentGlobal_CardStyles marginBottom={"15px"} key={i}>
<Group position="apart">
<Stack>
<Skeleton h={15} w={100} />
<Skeleton h={15} w={50} />
<CustomSkeleton h={15} w={100} />
<CustomSkeleton h={15} w={50} />
</Stack>
<Skeleton circle height={20} />
<CustomSkeleton circle height={20} />
</Group>
</ComponentGlobal_CardStyles>
))}
@@ -123,38 +124,38 @@ function Collaboration_SkeletonDetail() {
<Stack spacing={"xl"}>
<Grid align="center" gutter={"md"}>
<Grid.Col span={"content"}>
<Skeleton circle height={40} />
<CustomSkeleton circle height={40} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
</Grid>
<Center>
<Skeleton height={20} w={200} />
<CustomSkeleton height={20} w={200} />
</Center>
<Grid align="center" gutter={"md"}>
<Grid.Col span={"content"}>
<Skeleton h={20} w={70} />
<CustomSkeleton h={20} w={70} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={200} />
<CustomSkeleton height={20} w={200} />
</Grid.Col>
</Grid>
<Grid align="center" gutter={"md"}>
<Grid.Col span={"content"}>
<Skeleton h={20} w={70} />
<CustomSkeleton h={20} w={70} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={200} />
<CustomSkeleton height={20} w={200} />
</Grid.Col>
</Grid>
<Skeleton height={20} w={100} />
<Skeleton height={20} w={"100%"} />
<Skeleton height={20} w={100} />
<Skeleton height={20} w={"100%"} />
<CustomSkeleton height={20} w={100} />
<CustomSkeleton height={20} w={"100%"} />
<CustomSkeleton height={20} w={100} />
<CustomSkeleton height={20} w={"100%"} />
</Stack>
</ComponentGlobal_CardStyles>
</>
@@ -168,16 +169,16 @@ function Collaboration_SkeletonListPrtisipanIsUser() {
<ComponentGlobal_CardStyles marginBottom={"0"}>
<Stack>
<Center>
<Skeleton h={20} w={100} />
<CustomSkeleton h={20} w={100} />
</Center>
{Array.from(new Array(2)).map((e, i) => (
<Grid align="center" gutter={"md"} key={i}>
<Grid.Col span={"content"}>
<Skeleton circle height={40} />
<CustomSkeleton circle height={40} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
</Grid>
))}
@@ -193,21 +194,21 @@ function Collaboration_SkeletonListPartisipan() {
<>
<Stack>
<Center>
<Skeleton h={40} w={150} radius={"xl"} />
<CustomSkeleton h={40} w={150} radius={"xl"} />
</Center>
<ComponentGlobal_CardStyles marginBottom={"0"}>
<Stack>
<Center>
<Skeleton h={20} w={100} />
<CustomSkeleton h={20} w={100} />
</Center>
{Array.from(new Array(2)).map((e, i) => (
<Grid align="center" gutter={"md"} key={i}>
<Grid.Col span={"content"}>
<Skeleton circle height={40} />
<CustomSkeleton circle height={40} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
</Grid>
))}
@@ -225,47 +226,47 @@ function Collaboration_SkeletonDetailInfoGroup() {
<ComponentGlobal_CardStyles marginBottom={"0"}>
<Stack spacing={"xl"}>
<Center>
<Skeleton height={20} w={200} />
<CustomSkeleton height={20} w={200} />
</Center>
<Grid align="center" gutter={"md"}>
<Grid.Col span={"content"}>
<Skeleton h={20} w={70} />
<CustomSkeleton h={20} w={70} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={200} />
<CustomSkeleton height={20} w={200} />
</Grid.Col>
</Grid>
<Grid align="center" gutter={"md"}>
<Grid.Col span={"content"}>
<Skeleton h={20} w={70} />
<CustomSkeleton h={20} w={70} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={200} />
<CustomSkeleton height={20} w={200} />
</Grid.Col>
</Grid>
<Skeleton height={20} w={100} />
<Skeleton height={20} w={"100%"} />
<Skeleton height={20} w={"100%"} />
<Skeleton height={20} w={100} />
<Skeleton height={20} w={"100%"} />
<Skeleton height={20} w={"100%"} />
<CustomSkeleton height={20} w={100} />
<CustomSkeleton height={20} w={"100%"} />
<CustomSkeleton height={20} w={"100%"} />
<CustomSkeleton height={20} w={100} />
<CustomSkeleton height={20} w={"100%"} />
<CustomSkeleton height={20} w={"100%"} />
</Stack>
</ComponentGlobal_CardStyles>
<ComponentGlobal_CardStyles marginBottom={"0"}>
<Stack>
<Skeleton h={20} w={100} />
<CustomSkeleton h={20} w={100} />
{Array.from(new Array(2)).map((e, i) => (
<Grid align="center" gutter={"md"} key={i}>
<Grid.Col span={"content"}>
<Skeleton circle height={40} />
<CustomSkeleton circle height={40} />
</Grid.Col>
<Grid.Col span={3}>
<Skeleton height={20} w={150} />
<CustomSkeleton height={20} w={150} />
</Grid.Col>
</Grid>
))}