Admin App Infromation

Add:
- admin/app-information/sticker/

#### No Issue
This commit is contained in:
2025-08-07 15:44:22 +08:00
parent 88cf3321e1
commit 29377c0bb0
6 changed files with 401 additions and 8 deletions

View File

@@ -0,0 +1,80 @@
import {
BoxButtonOnFooter,
ButtonCenteredOnly,
ButtonCustom,
CheckboxCustom,
CheckboxGroup,
LandscapeFrameUploaded,
SelectCustom,
Spacing,
StackCustom,
TextCustom,
ViewWrapper,
} from "@/components";
import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
import { dummyMasterEmotions } from "@/lib/dummy-data/_master/emotions";
import { router } from "expo-router";
import { useState } from "react";
import { View } from "react-native";
export default function AdminAppInformation_StickerCreate() {
const [value, setValue] = useState<string | null>(null);
const [selectedEmotions, setSelectedEmotions] = useState<string[]>([]);
const buttonSubmit = (
<BoxButtonOnFooter>
<ButtonCustom onPress={() => router.back()}>Update</ButtonCustom>
</BoxButtonOnFooter>
);
return (
<>
<ViewWrapper footerComponent={buttonSubmit}>
<StackCustom>
<AdminBackButtonAntTitle title="Edit Stiker" />
<StackCustom gap={"xs"}>
<LandscapeFrameUploaded />
<ButtonCenteredOnly icon="upload" onPress={() => {}}>
Upload
</ButtonCenteredOnly>
<Spacing />
<SelectCustom
required
label="Jenis Kelamin"
data={[
{ label: "Laki-laki", value: "laki-laki" },
{ label: "Perempuan", value: "perempuan" },
]}
value={value}
onChange={(value) => setValue(value as string)}
/>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<TextCustom>Pilih Emosi Stiker</TextCustom>
<TextCustom color="red">*</TextCustom>
</View>
<Spacing height={10} />
<CheckboxGroup
value={selectedEmotions}
onChange={(value) => setSelectedEmotions(value as string[])}
>
<StackCustom>
{dummyMasterEmotions.map((e) => (
<CheckboxCustom
size={25}
key={e.id}
label={<TextCustom>{e.label}</TextCustom>}
valueKey={e.id}
/>
))}
</StackCustom>
</CheckboxGroup>
</StackCustom>
</StackCustom>
<Spacing />
</ViewWrapper>
</>
);
}

View File

@@ -0,0 +1,84 @@
import {
BoxButtonOnFooter,
ButtonCenteredOnly,
ButtonCustom,
CheckboxCustom,
CheckboxGroup,
LandscapeFrameUploaded,
SelectCustom,
Spacing,
StackCustom,
TextCustom,
ViewWrapper
} from "@/components";
import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
import { dummyMasterEmotions } from "@/lib/dummy-data/_master/emotions";
import { router } from "expo-router";
import { useState } from "react";
import { View } from "react-native";
export default function AdminAppInformation_StickerCreate() {
const [value, setValue] = useState<string | null>(null);
const [selectedEmotions, setSelectedEmotions] = useState<string[]>([]);
const buttonSubmit = (
<BoxButtonOnFooter>
<ButtonCustom
onPress={() => router.back()}
>
Tambah
</ButtonCustom>
</BoxButtonOnFooter>
);
return (
<>
<ViewWrapper footerComponent={buttonSubmit}>
<StackCustom>
<AdminBackButtonAntTitle title="Tambah Stiker" />
<StackCustom gap={"xs"}>
<LandscapeFrameUploaded />
<ButtonCenteredOnly icon="upload" onPress={() => {}}>
Upload
</ButtonCenteredOnly>
<Spacing />
<SelectCustom
required
label="Jenis Kelamin"
data={[
{ label: "Laki-laki", value: "laki-laki" },
{ label: "Perempuan", value: "perempuan" },
]}
value={value}
onChange={(value) => setValue(value as string)}
/>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<TextCustom>Pilih Emosi Stiker</TextCustom>
<TextCustom color="red">*</TextCustom>
</View>
<Spacing height={10} />
<CheckboxGroup
value={selectedEmotions}
onChange={(value) => setSelectedEmotions(value as string[])}
>
<StackCustom>
{dummyMasterEmotions.map((e) => (
<CheckboxCustom
size={25}
key={e.id}
label={<TextCustom>{e.label}</TextCustom>}
valueKey={e.id}
/>
))}
</StackCustom>
</CheckboxGroup>
</StackCustom>
</StackCustom>
<Spacing/>
</ViewWrapper>
</>
);
}

View File

@@ -1,4 +1,4 @@
import { AccentColor } from "@/constants/color-palet";
import { AccentColor, MainColor } from "@/constants/color-palet";
import { MaterialIcons } from "@expo/vector-icons"; // Bisa diganti dengan ikon lain
import React, { useContext } from "react";
import { Animated, Text, TouchableOpacity, View } from "react-native";
@@ -17,7 +17,7 @@ const CheckboxGroupContext =
// Tipe props
// Tambahkan prop baru: groupValueKey
interface CheckboxProps {
label?: string;
label?: string | React.ReactNode;
description?: string;
error?: string;
value?: boolean; // controlled value (untuk standalone)
@@ -39,7 +39,7 @@ const CheckboxCustom: React.FC<CheckboxProps> = ({
onChange,
disabled: propDisabled,
size = 20,
color = AccentColor.softblue,
color = MainColor.yellow,
style,
component,
valueKey,

View File

@@ -0,0 +1,123 @@
export const dummyMasterEmotions = [
{
id: 1,
label: "Senang",
value: "senang",
isActive: true,
createdAt: "2025-06-16T09:57:16.726Z",
updatedAt: "2025-06-16T09:57:16.726Z",
},
{
id: 2,
label: "Sedih",
value: "sedih",
isActive: true,
createdAt: "2025-06-16T09:57:16.730Z",
updatedAt: "2025-06-16T09:57:16.730Z",
},
{
id: 15,
label: "Takut",
value: "takut",
isActive: true,
createdAt: "2025-06-16T09:57:16.730Z",
updatedAt: "2025-06-16T09:57:16.730Z",
},
{
id: 6,
label: "Marah",
value: "marah",
isActive: true,
createdAt: "2025-06-16T09:57:16.730Z",
updatedAt: "2025-06-16T09:57:16.730Z",
},
{
id: 8,
label: "Terkejut",
value: "terkejut",
isActive: true,
createdAt: "2025-06-16T09:57:16.730Z",
updatedAt: "2025-06-16T09:57:16.730Z",
},
{
id: 14,
label: "Malas",
value: "malas",
isActive: true,
createdAt: "2025-06-16T09:57:16.730Z",
updatedAt: "2025-06-16T09:57:16.730Z",
},
{
id: 7,
label: "Penasaran",
value: "penasaran",
isActive: true,
createdAt: "2025-06-16T09:57:16.731Z",
updatedAt: "2025-06-16T09:57:16.731Z",
},
{
id: 3,
label: "Cinta",
value: "cinta",
isActive: true,
createdAt: "2025-06-16T09:57:16.731Z",
updatedAt: "2025-06-16T09:57:16.731Z",
},
{
id: 4,
label: "Bangga",
value: "bangga",
isActive: true,
createdAt: "2025-06-16T09:57:16.731Z",
updatedAt: "2025-06-16T09:57:16.731Z",
},
{
id: 5,
label: "Malu",
value: "malu",
isActive: true,
createdAt: "2025-06-16T09:57:16.731Z",
updatedAt: "2025-06-16T09:57:16.731Z",
},
{
id: 11,
label: "Kesal",
value: "kesal",
isActive: true,
createdAt: "2025-06-16T09:57:16.732Z",
updatedAt: "2025-06-16T09:57:16.732Z",
},
{
id: 9,
label: "Bingung",
value: "bingung",
isActive: true,
createdAt: "2025-06-16T09:57:16.732Z",
updatedAt: "2025-06-16T09:57:16.732Z",
},
{
id: 10,
label: "Kaget",
value: "kaget",
isActive: true,
createdAt: "2025-06-16T09:57:16.732Z",
updatedAt: "2025-06-16T09:57:16.732Z",
},
{
id: 12,
label: "Iri",
value: "iri",
isActive: true,
createdAt: "2025-06-16T09:57:16.732Z",
updatedAt: "2025-06-16T09:57:16.732Z",
},
{
id: 13,
label: "Lega",
value: "lega",
isActive: true,
createdAt: "2025-06-16T09:57:16.733Z",
updatedAt: "2025-06-16T09:57:16.733Z",
},
];

View File

@@ -1,9 +1,109 @@
import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
import { ActionIcon, Grid, StackCustom, TextCustom } from "@/components";
import { MainColor } from "@/constants/color-palet";
import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
import { FontAwesome5 } from "@expo/vector-icons";
import { Image } from "expo-image";
import { router } from "expo-router";
import { useState } from "react";
import { View } from "react-native";
import { Divider, Switch } from "react-native-paper";
export default function AdminAppInformation_StickerSection() {
const [value, setValue] = useState(false);
return (
<>
<AdminComp_BoxTitle title="Sticker" />
<Grid>
<Grid.Col span={3} style={{ alignItems: "center" }}>
<TextCustom bold>Aksi</TextCustom>
</Grid.Col>
<Grid.Col span={3} style={{ alignItems: "center" }}>
<TextCustom bold>Status</TextCustom>
</Grid.Col>
<Grid.Col span={6}>
<TextCustom bold align="center" >Stiker</TextCustom>
</Grid.Col>
</Grid>
<Divider />
<StackCustom>
{listSticker.map((e, i) => (
<View key={i}>
<Grid>
<Grid.Col
span={3}
style={{ alignItems: "center", justifyContent: "center" }}
>
<ActionIcon
icon={
<FontAwesome5
name="edit"
size={ICON_SIZE_BUTTON}
color="black"
/>
}
onPress={() => {
router.push(`/admin/app-information/sticker/${i}`);
}}
/>
</Grid.Col>
<Grid.Col
span={3}
style={{ alignItems: "center", justifyContent: "center" }}
>
<Switch
value={value}
onValueChange={() => {
setValue(!value);
}}
theme={{
colors: {
primary: MainColor.yellow,
},
}}
/>
</Grid.Col>
<Grid.Col span={6} style={{ justifyContent: "center", alignItems: "center" }}>
<Image source={e.path} style={{ width: 100, height: 100 }} />
</Grid.Col>
</Grid>
<Divider />
</View>
))}
</StackCustom>
</>
);
}
const listSticker = [
{
id: "1",
label: "Stiker 1",
value: "sticker 1",
path: "https://wibu-storage.wibudev.com/api/files/cmb0dkn5700bjbpnnwcfpzxpz",
},
{
id: "2",
label: "Stiker 2",
value: "sticker 2",
path: "https://wibu-storage.wibudev.com/api/files/cmb0djnya00bhbpnn8b2sfpg3",
},
{
id: "3",
label: "Stiker 3",
value: "sticker 3",
path: "https://wibu-storage.wibudev.com/api/files/cmb0dj0o400bfbpnn6hrfa71y",
},
{
id: "4",
label: "Stiker 4",
value: "sticker 4",
path: "https://wibu-storage.wibudev.com/api/files/cmb0d5rdb00abbpnnrbhxrxjz",
},
{
id: "5",
label: "Stiker 5",
value: "sticker 5",
path: "https://wibu-storage.wibudev.com/api/files/cmb0d4j5q00a9bpnn0qpxa0k4",
},
];

View File

@@ -32,7 +32,7 @@ export default function LoginView() {
// router.navigate("/verification");
// router.navigate(`/(application)/(user)/profile/${id}`);
// router.navigate("/(application)/(user)/home");
router.navigate("/(application)/(user)/home");
// router.navigate(`/(application)/profile/${id}/edit`);
// router.navigate(`/(application)/(user)/portofolio/${id}`)
// router.navigate(`/(application)/(image)/preview-image/${id}`);
@@ -40,7 +40,7 @@ export default function LoginView() {
// router.replace("/(application)/coba");
// router.navigate("/investment/(tabs)")1
// router.navigate("/crowdfunding")
router.navigate("/admin/dashboard")
// router.navigate("/admin/dashboard")
}
return (
@@ -78,9 +78,15 @@ export default function LoginView() {
placeholder="Masukkan nomor"
/>
<Spacing height={20} />
<Spacing />
<ButtonCustom onPress={handleLogin}>Login</ButtonCustom>
<Spacing />
<ButtonCustom onPress={() => router.navigate("/admin/dashboard")}>
Admin ( Delete Soon )
</ButtonCustom>
</View>
</ViewWrapper>
);