deskripsi
Fix: page event/id/deteil menjadi event/id/status Feature: Add screens/Event/AlertButtonStatusSection Add app/(application)/(user)/event/[id]/[status]/ # No Issue"
This commit is contained in:
@@ -4,14 +4,16 @@ import {
|
|||||||
DrawerCustom,
|
DrawerCustom,
|
||||||
Grid,
|
Grid,
|
||||||
MenuDrawerDynamicGrid,
|
MenuDrawerDynamicGrid,
|
||||||
|
Spacing,
|
||||||
StackCustom,
|
StackCustom,
|
||||||
TextCustom,
|
TextCustom,
|
||||||
ViewWrapper,
|
ViewWrapper
|
||||||
} from "@/components";
|
} from "@/components";
|
||||||
import { IMenuDrawerItem } from "@/components/_Interface/types";
|
import { IMenuDrawerItem } from "@/components/_Interface/types";
|
||||||
import LeftButtonCustom from "@/components/Button/BackButton";
|
import LeftButtonCustom from "@/components/Button/BackButton";
|
||||||
import { AccentColor } from "@/constants/color-palet";
|
import { AccentColor } from "@/constants/color-palet";
|
||||||
import { ICON_SIZE_MEDIUM } from "@/constants/constans-value";
|
import { ICON_SIZE_MEDIUM } from "@/constants/constans-value";
|
||||||
|
import Event_AlertButtonStatusSection from "@/screens/Event/AlertButtonStatusSection";
|
||||||
import Event_ButtonStatusSection from "@/screens/Event/ButtonStatusSection";
|
import Event_ButtonStatusSection from "@/screens/Event/ButtonStatusSection";
|
||||||
import { Ionicons } from "@expo/vector-icons";
|
import { Ionicons } from "@expo/vector-icons";
|
||||||
import { router, Stack, useLocalSearchParams } from "expo-router";
|
import { router, Stack, useLocalSearchParams } from "expo-router";
|
||||||
@@ -43,8 +45,10 @@ const listData = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
export default function EventDetail() {
|
export default function EventDetail() {
|
||||||
const { id, detail } = useLocalSearchParams();
|
const { id, status } = useLocalSearchParams();
|
||||||
const [openDrawer, setOpenDrawer] = useState(false);
|
const [openDrawer, setOpenDrawer] = useState(false);
|
||||||
|
const [openAlert, setOpenAlert] = useState(false);
|
||||||
|
const [openDeleteAlert, setOpenDeleteAlert] = useState(false);
|
||||||
|
|
||||||
const handlePress = (item: IMenuDrawerItem) => {
|
const handlePress = (item: IMenuDrawerItem) => {
|
||||||
console.log("PATH >> ", item.path);
|
console.log("PATH >> ", item.path);
|
||||||
@@ -52,7 +56,7 @@ export default function EventDetail() {
|
|||||||
setOpenDrawer(false);
|
setOpenDrawer(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
const drawerItemsDraftEvent = [
|
const drawerMenuDraftEvent = ({ id }: { id: string }) => [
|
||||||
{
|
{
|
||||||
icon: (
|
icon: (
|
||||||
<Ionicons
|
<Ionicons
|
||||||
@@ -70,10 +74,10 @@ export default function EventDetail() {
|
|||||||
<>
|
<>
|
||||||
<Stack.Screen
|
<Stack.Screen
|
||||||
options={{
|
options={{
|
||||||
title: `Detail ${detail === "publish" ? "" : detail}`,
|
title: `Detail ${status === "publish" ? "" : status}`,
|
||||||
headerLeft: () => <LeftButtonCustom />,
|
headerLeft: () => <LeftButtonCustom />,
|
||||||
headerRight: () =>
|
headerRight: () =>
|
||||||
detail === "draft" ? (
|
status === "draft" ? (
|
||||||
<DotButton onPress={() => setOpenDrawer(true)} />
|
<DotButton onPress={() => setOpenDrawer(true)} />
|
||||||
) : null,
|
) : null,
|
||||||
}}
|
}}
|
||||||
@@ -82,7 +86,7 @@ export default function EventDetail() {
|
|||||||
<BaseBox>
|
<BaseBox>
|
||||||
<StackCustom>
|
<StackCustom>
|
||||||
<TextCustom bold align="center" size="xlarge">
|
<TextCustom bold align="center" size="xlarge">
|
||||||
Judul event {id}
|
Judul event {status}
|
||||||
</TextCustom>
|
</TextCustom>
|
||||||
{listData.map((item, index) => (
|
{listData.map((item, index) => (
|
||||||
<Grid key={index}>
|
<Grid key={index}>
|
||||||
@@ -96,21 +100,34 @@ export default function EventDetail() {
|
|||||||
))}
|
))}
|
||||||
</StackCustom>
|
</StackCustom>
|
||||||
</BaseBox>
|
</BaseBox>
|
||||||
|
<Event_ButtonStatusSection
|
||||||
|
status={status as string}
|
||||||
|
onOpenAlert={setOpenAlert}
|
||||||
|
onOpenDeleteAlert={setOpenDeleteAlert}
|
||||||
|
/>
|
||||||
|
<Spacing />
|
||||||
</ViewWrapper>
|
</ViewWrapper>
|
||||||
|
|
||||||
{/* <Event_ButtonStatusSection detail={detail as string} /> */}
|
|
||||||
|
|
||||||
<DrawerCustom
|
<DrawerCustom
|
||||||
isVisible={openDrawer}
|
isVisible={openDrawer}
|
||||||
closeDrawer={() => setOpenDrawer(false)}
|
closeDrawer={() => setOpenDrawer(false)}
|
||||||
height={250}
|
height={250}
|
||||||
>
|
>
|
||||||
<MenuDrawerDynamicGrid
|
<MenuDrawerDynamicGrid
|
||||||
data={drawerItemsDraftEvent}
|
data={drawerMenuDraftEvent({ id: id as string })}
|
||||||
columns={4}
|
columns={4}
|
||||||
onPressItem={handlePress}
|
onPressItem={handlePress}
|
||||||
/>
|
/>
|
||||||
</DrawerCustom>
|
</DrawerCustom>
|
||||||
|
|
||||||
|
<Event_AlertButtonStatusSection
|
||||||
|
id={id as string}
|
||||||
|
status={status as string}
|
||||||
|
openAlert={openAlert}
|
||||||
|
setOpenAlert={setOpenAlert}
|
||||||
|
openDeleteAlert={openDeleteAlert}
|
||||||
|
setOpenDeleteAlert={setOpenDeleteAlert}
|
||||||
|
/>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
115
screens/Event/AlertButtonStatusSection.tsx
Normal file
115
screens/Event/AlertButtonStatusSection.tsx
Normal file
@@ -0,0 +1,115 @@
|
|||||||
|
import AlertCustom from "@/components/Alert/AlertCustom";
|
||||||
|
import { router } from "expo-router";
|
||||||
|
|
||||||
|
export default function Event_AlertButtonStatusSection({
|
||||||
|
id,
|
||||||
|
status,
|
||||||
|
openAlert,
|
||||||
|
setOpenAlert,
|
||||||
|
openDeleteAlert,
|
||||||
|
setOpenDeleteAlert,
|
||||||
|
}: {
|
||||||
|
id: string;
|
||||||
|
status: string;
|
||||||
|
openAlert: boolean;
|
||||||
|
setOpenAlert: (value: boolean) => void;
|
||||||
|
openDeleteAlert: boolean;
|
||||||
|
setOpenDeleteAlert: (value: boolean) => void;
|
||||||
|
}) {
|
||||||
|
// --- Alert untuk aksi berdasarkan status ---
|
||||||
|
const renderStatusAlert = () => {
|
||||||
|
switch (status) {
|
||||||
|
case "publish":
|
||||||
|
return <></>;
|
||||||
|
|
||||||
|
case "review":
|
||||||
|
return (
|
||||||
|
<AlertCustom
|
||||||
|
isVisible={openAlert}
|
||||||
|
title="Batalkan Review"
|
||||||
|
message="Apakah Anda yakin ingin membatalkan review?"
|
||||||
|
textLeft="Batal"
|
||||||
|
textRight="Ya"
|
||||||
|
colorRight="green"
|
||||||
|
onLeftPress={() => {
|
||||||
|
setOpenAlert(false);
|
||||||
|
}}
|
||||||
|
onRightPress={() => {
|
||||||
|
setOpenAlert(false);
|
||||||
|
router.back();
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
|
||||||
|
case "draft":
|
||||||
|
return (
|
||||||
|
<AlertCustom
|
||||||
|
isVisible={openAlert}
|
||||||
|
title="Ajukan Review ?"
|
||||||
|
message="Apakah Anda yakin ingin mengajukan review kembali?"
|
||||||
|
textLeft="Batal"
|
||||||
|
textRight="Ya"
|
||||||
|
colorRight="green"
|
||||||
|
onLeftPress={() => {
|
||||||
|
setOpenAlert(false);
|
||||||
|
router.back();
|
||||||
|
}}
|
||||||
|
onRightPress={() => {
|
||||||
|
setOpenAlert(false);
|
||||||
|
router.back();
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
|
||||||
|
case "reject":
|
||||||
|
return (
|
||||||
|
<AlertCustom
|
||||||
|
isVisible={openAlert}
|
||||||
|
title="Edit Kembali"
|
||||||
|
message="Apakah Anda yakin ingin mengedit kembali event ini?"
|
||||||
|
textLeft="Batal"
|
||||||
|
textRight="Ya"
|
||||||
|
colorRight="green"
|
||||||
|
onLeftPress={() => {
|
||||||
|
setOpenAlert(false);
|
||||||
|
router.back();
|
||||||
|
}}
|
||||||
|
onRightPress={() => {
|
||||||
|
setOpenAlert(false);
|
||||||
|
router.back();
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
|
||||||
|
default:
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{/* Alert berdasarkan status */}
|
||||||
|
{renderStatusAlert()}
|
||||||
|
|
||||||
|
{/* Alert untuk hapus - selalu muncul jika openDeleteAlert true */}
|
||||||
|
<AlertCustom
|
||||||
|
isVisible={openDeleteAlert}
|
||||||
|
title="Hapus Event"
|
||||||
|
message="Apakah Anda yakin ingin menghapus event ini?"
|
||||||
|
textLeft="Batal"
|
||||||
|
textRight="Ya, Hapus"
|
||||||
|
colorRight="red"
|
||||||
|
onLeftPress={() => {
|
||||||
|
setOpenDeleteAlert(false);
|
||||||
|
router.back();
|
||||||
|
}}
|
||||||
|
onRightPress={() => {
|
||||||
|
// Aksi hapus event
|
||||||
|
console.log("Menghapus event dengan ID:", id);
|
||||||
|
setOpenDeleteAlert(false);
|
||||||
|
router.back();
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -1,19 +1,76 @@
|
|||||||
import { ButtonCustom } from "@/components";
|
import { ButtonCustom, Grid } from "@/components";
|
||||||
import { View } from "react-native";
|
import { View } from "react-native";
|
||||||
|
|
||||||
export default function Event_ButtonStatusSection({
|
export default function Event_ButtonStatusSection({
|
||||||
detail,
|
status,
|
||||||
|
onOpenAlert,
|
||||||
|
onOpenDeleteAlert,
|
||||||
}: {
|
}: {
|
||||||
detail: string;
|
status: string;
|
||||||
|
onOpenAlert: (value: boolean) => void;
|
||||||
|
onOpenDeleteAlert: (value: boolean) => void;
|
||||||
}) {
|
}) {
|
||||||
return (
|
|
||||||
<>
|
const handleOpenAlert = () => {
|
||||||
{detail && detail === "draft" && (
|
onOpenAlert(true);
|
||||||
<View>
|
};
|
||||||
<ButtonCustom>Ajukan Review</ButtonCustom>
|
|
||||||
<ButtonCustom backgroundColor="red">Hapus</ButtonCustom>
|
const handleOpenDeleteAlert = () => {
|
||||||
</View>
|
onOpenDeleteAlert(true);
|
||||||
)}
|
};
|
||||||
</>
|
|
||||||
);
|
const DeleteButton = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<ButtonCustom backgroundColor="red" textColor="white" onPress={handleOpenDeleteAlert}>
|
||||||
|
Hapus
|
||||||
|
</ButtonCustom>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
switch (status) {
|
||||||
|
case "publish":
|
||||||
|
return <></>;
|
||||||
|
|
||||||
|
case "review":
|
||||||
|
return (
|
||||||
|
<ButtonCustom onPress={handleOpenAlert}>
|
||||||
|
Batalkan Review
|
||||||
|
</ButtonCustom>
|
||||||
|
);
|
||||||
|
|
||||||
|
case "draft":
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Grid>
|
||||||
|
<Grid.Col span={5}>
|
||||||
|
<ButtonCustom onPress={handleOpenAlert}>Ajukan Review</ButtonCustom>
|
||||||
|
</Grid.Col>
|
||||||
|
<Grid.Col span={2}>
|
||||||
|
<View />
|
||||||
|
</Grid.Col>
|
||||||
|
<Grid.Col span={5}>{DeleteButton()}</Grid.Col>
|
||||||
|
</Grid>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
|
||||||
|
case "reject":
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Grid>
|
||||||
|
<Grid.Col span={5}>
|
||||||
|
<ButtonCustom onPress={handleOpenAlert}>Edit Kembali</ButtonCustom>
|
||||||
|
</Grid.Col>
|
||||||
|
<Grid.Col span={2}>
|
||||||
|
<View />
|
||||||
|
</Grid.Col>
|
||||||
|
<Grid.Col span={5}>{DeleteButton()}</Grid.Col>
|
||||||
|
</Grid>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
|
||||||
|
default:
|
||||||
|
return <ButtonCustom disabled>Status Undifined</ButtonCustom>;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user