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

Merge pull request 'Fix event' (#2) from event/22-jul-25 into main

Browse Source 
Reviewed-on: bip/hipmi-mobile#2
This commit is contained in:
bagasbanuna
2025-07-22 15:22:30 +08:00
parent 8f877137a3 81d86885f4
commit a370666e3f
22 changed files with 579 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/(application)/(user)/_layout.tsx
View File

@@ -100,6 +100,14 @@ export default function UserLayout() {
}}
/>
<Stack.Screen
name="event/[id]/list-of-participants"
options={{
title: "Daftar peserta",
headerLeft: () => <BackButton />,
}}
/>
{/* ========== Forum Section ========= */}
<Stack.Screen
name="forum/create"

6
app/(application)/(user)/event/(tabs)/_layout.tsx
View File

@@ -4,7 +4,7 @@ import { FontAwesome5, Ionicons } from "@expo/vector-icons";
import { Tabs } from "expo-router";
import { Platform, View } from "react-native";
export default function EventLayout() {
export default function EventTabsLayout() {
return (
<Tabs
screenOptions={{
@@ -46,7 +46,7 @@ export default function EventLayout() {
}}
/>
<Tabs.Screen
name="kontribusi"
name="contribution"
options={{
title: "Kontribusi",
tabBarIcon: ({ color }) => (
@@ -55,7 +55,7 @@ export default function EventLayout() {
}}
/>
<Tabs.Screen
name="riwayat"
name="history"
options={{
title: "Riwayat",
tabBarIcon: ({ color }) => (

17
app/(application)/(user)/event/(tabs)/kontribusi.tsx → app/(application)/(user)/event/(tabs)/contribution.tsx
View File

@@ -1,28 +1,25 @@
import {
AvatarCustom,
AvatarUsernameAndOtherComponent,
BaseBox,
BoxWithHeaderSection,
Grid,
StackCustom,
TextCustom,
ViewWrapper
} from "@/components";
import React from "react";
export default function Kontribusi() {
export default function EventContribution() {
return (
<ViewWrapper>
<ViewWrapper hideFooter>
{Array.from({ length: 10 }).map((_, index) => (
<BaseBox key={index} href={`/event/${index}/publish/detail-event`}>
<BoxWithHeaderSection key={index} href={`/event/${index}/contribution`}>
<StackCustom>
<AvatarUsernameAndOtherComponent
avatarHref={`/profile/${index}`}
rightComponent={
<TextCustom truncate>
{new Date().toDateString().split(" ")[2] +
", " +
new Date().toDateString().split(" ")[1] +
" " +
new Date().toDateString().split(" ")[3]}
{new Date().toLocaleDateString()}
</TextCustom>
}
/>
@@ -39,7 +36,7 @@ export default function Kontribusi() {
))}
</Grid>
</StackCustom>
</BaseBox>
</BoxWithHeaderSection>
))}
</ViewWrapper>
);

67
app/(application)/(user)/event/(tabs)/history.tsx Normal file
View File

@@ -0,0 +1,67 @@
import { ButtonCustom, Spacing, TextCustom } from "@/components";
import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
import { AccentColor, MainColor } from "@/constants/color-palet";
import Event_BoxPublishSection from "@/screens/Event/BoxPublishSection";
import { useState } from "react";
import { View } from "react-native";
export default function EventHistory() {
const [activeCategory, setActiveCategory] = useState<string | null>("all");
const handlePress = (item: any) => {
setActiveCategory(item);
// tambahkan logika lain seperti filter dsb.
};
const headerComponent = (
<View
style={{
flexDirection: "row",
alignItems: "center",
padding: 5,
backgroundColor: MainColor.soft_darkblue,
borderRadius: 50,
width: "100%",
}}
>
<ButtonCustom
backgroundColor={
activeCategory === "all" ? MainColor.yellow : AccentColor.blue
}
textColor={activeCategory === "all" ? MainColor.black : MainColor.white}
style={{ width: "49%" }}
onPress={() => handlePress("all")}
>
Semua Riwayat
</ButtonCustom>
<Spacing width={"2%"} />
<ButtonCustom
backgroundColor={
activeCategory === "main" ? MainColor.yellow : AccentColor.blue
}
textColor={
activeCategory === "main" ? MainColor.black : MainColor.white
}
style={{ width: "49%" }}
onPress={() => handlePress("main")}
>
Riwayat Saya
</ButtonCustom>
</View>
);
return (
<ViewWrapper headerComponent={headerComponent} hideFooter>
{Array.from({ length: 10 }).map((_, index) => (
<Event_BoxPublishSection
key={index.toString()}
id={index.toString()}
username={`Hisrory ${activeCategory === "main" ? "Saya" : "Semua"}`}
rightComponentAvatar={
<TextCustom>{new Date().toLocaleDateString()}</TextCustom>
}
/>
))}
</ViewWrapper>
);
}

30
app/(application)/(user)/event/(tabs)/index.tsx
View File

@@ -1,17 +1,9 @@
/* eslint-disable @typescript-eslint/no-unused-vars */
import {
AvatarUsernameAndOtherComponent,
BaseBox,
StackCustom,
TextCustom,
} from "@/components";
import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
import FloatingButton from "@/components/Button/FloatingButton";
import Event_BoxPublishSection from "@/screens/Event/BoxPublishSection";
import { router } from "expo-router";
export default function Event() {
const index = "test-id-event";
const status = "publish";
export default function EventBeranda() {
return (
<ViewWrapper
hideFooter
@@ -20,23 +12,7 @@ export default function Event() {
}
>
{Array.from({ length: 10 }).map((_, index) => (
<BaseBox key={index} href={`/event/${index}/${status}/detail-event`}>
<StackCustom gap={"xs"}>
<AvatarUsernameAndOtherComponent
avatarHref={`/profile/${index}`}
name="Lorem ipsum dolor sit"
/>
<TextCustom truncate bold>
Lorem ipsum dolor sit
</TextCustom>
<TextCustom truncate={2}>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro sed
doloremque tempora soluta. Dolorem ex quidem ipsum tempora, ipsa,
obcaecati quia suscipit numquam, voluptates commodi porro impedit
natus quos doloremque!
</TextCustom>
</StackCustom>
</BaseBox>
<Event_BoxPublishSection key={index} id={index.toString()} />
))}
</ViewWrapper>
);

11
app/(application)/(user)/event/(tabs)/riwayat.tsx
View File

@@ -1,11 +0,0 @@
import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
import { GStyles } from "@/styles/global-styles";
import { Text } from "react-native";
export default function Riwayat() {
return (
<ViewWrapper>
<Text style={GStyles.textLabel}>Riwayat</Text>
</ViewWrapper>
);
}

10
app/(application)/(user)/event/(tabs)/status.tsx
View File

@@ -1,15 +1,15 @@
import {
BaseBox,
BoxWithHeaderSection,
Grid,
ScrollableCustom,
StackCustom,
TextCustom,
TextCustom
} from "@/components";
import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
import { masterStatus } from "@/lib/dummy-data/_master/status";
import { useState } from "react";
export default function Status() {
export default function EventStatus() {
const id = "test-id-event";
const [activeCategory, setActiveCategory] = useState<string | null>(
@@ -35,7 +35,7 @@ export default function Status() {
return (
<ViewWrapper headerComponent={scrollComponent}>
<BaseBox href={`/event/${id}/${activeCategory}/detail-event`}>
<BoxWithHeaderSection href={`/event/${id}/${activeCategory}/detail-event`}>
<StackCustom gap={"xs"}>
<Grid>
<Grid.Col span={8}>
@@ -57,7 +57,7 @@ export default function Status() {
dolore optio porro!
</TextCustom>
</StackCustom>
</BaseBox>
</BoxWithHeaderSection>
</ViewWrapper>
);
}

2
app/(application)/(user)/event/[id]/[status]/detail-event.tsx
View File

@@ -17,7 +17,7 @@ import { menuDrawerDraftEvent } from "@/screens/Event/menuDrawerDraft";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useState } from "react";
export default function EventDetail() {
export default function EventDetailStatus() {
const { id, status } = useLocalSearchParams();
const [openDrawer, setOpenDrawer] = useState(false);
const [openAlert, setOpenAlert] = useState(false);

51
app/(application)/(user)/event/[id]/contribution.tsx Normal file
View File

@@ -0,0 +1,51 @@
import {
DotButton,
DrawerCustom,
MenuDrawerDynamicGrid,
ViewWrapper,
Spacing,
} from "@/components";
import { IMenuDrawerItem } from "@/components/_Interface/types";
import LeftButtonCustom from "@/components/Button/BackButton";
import Event_BoxDetailPublishSection from "@/screens/Event/BoxDetailPublishSection";
import { menuDrawerPublishEvent } from "@/screens/Event/menuDrawerPublish";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useState } from "react";
export default function EventDetailContribution() {
const { id } = useLocalSearchParams();
const [openDrawer, setOpenDrawer] = useState(false);
const handlePress = (item: IMenuDrawerItem) => {
console.log("PATH ", item.path);
router.navigate(item.path as any);
setOpenDrawer(false);
};
return (
<>
<Stack.Screen
options={{
title: `Detail kontribusi`,
headerLeft: () => <LeftButtonCustom />,
headerRight: () => <DotButton onPress={() => setOpenDrawer(true)} />,
}}
/>
<ViewWrapper>
<Event_BoxDetailPublishSection />
<Spacing />
</ViewWrapper>
<DrawerCustom
isVisible={openDrawer}
closeDrawer={() => setOpenDrawer(false)}
height={250}
>
<MenuDrawerDynamicGrid
data={menuDrawerPublishEvent({ id: id as string })}
columns={4}
onPressItem={handlePress}
/>
</DrawerCustom>
</>
);
}

100
app/(application)/(user)/event/[id]/edit.tsx
View File

@@ -1,11 +1,105 @@
import { StackCustom, TextCustom, ViewWrapper } from "@/components";
import {
ButtonCustom,
SelectCustom,
StackCustom,
TextAreaCustom,
TextInputCustom,
ViewWrapper,
} from "@/components";
import DateTimePickerCustom from "@/components/DateInput/DateTimePickerCustom";
import { masterTypeEvent } from "@/lib/dummy-data/event/master-type-event";
import { DateTimePickerEvent } from "@react-native-community/datetimepicker";
import { router } from "expo-router";
import React, { useState } from "react";
import { Platform } from "react-native";
export default function EventEdit() {
const [selectedDate, setSelectedDate] = useState<
Date | DateTimePickerEvent | null
>(null);
const [selectedEndDate, setSelectedEndDate] = useState<
Date | DateTimePickerEvent | null
>(null);
const handlerSubmit = () => {
try {
if (selectedDate) {
console.log("Tanggal yang dipilih:", selectedDate);
console.log(`ISO Format ${Platform.OS}:`, selectedDate.toString());
// Kirim ke API atau proses lanjutan
} else {
console.log("Tanggal belum dipilih");
}
if (selectedEndDate) {
console.log("Tanggal yang dipilih:", selectedEndDate);
console.log(`ISO Format ${Platform.OS}:`, selectedEndDate.toString());
// Kirim ke API atau proses lanjutan
} else {
console.log("Tanggal berakhir belum dipilih");
}
console.log("Data berhasil terupdate");
router.back()
} catch (error) {
console.log(error);
}
};
const buttonSubmit = (
<ButtonCustom title="Update" onPress={handlerSubmit} />
);
return (
<>
<ViewWrapper>
<StackCustom>
<TextCustom>Edit Event</TextCustom>
<StackCustom gap={"xs"}>
<TextInputCustom
placeholder="Masukkan nama event"
label="Nama Event"
required
/>
<SelectCustom
label="Tipe Event"
placeholder="Pilih tipe event"
data={masterTypeEvent}
onChange={(value) => console.log(value)}
/>
<TextInputCustom
label="Lokasi"
placeholder="Masukkan lokasi event"
required
/>
<DateTimePickerCustom
label="Tanggal & Waktu Mulai"
required
onChange={(date: Date) => {
setSelectedDate(date as any);
}}
value={selectedDate as any}
minimumDate={new Date(Date.now())}
/>
<DateTimePickerCustom
label="Tanggal & Waktu Berakhir"
required
onChange={(date: Date) => {
setSelectedEndDate(date as any);
}}
value={selectedEndDate as any}
/>
<TextAreaCustom
label="Deskripsi"
placeholder="Masukkan deskripsi event"
required
showCount
maxLength={100}
/>
{buttonSubmit}
</StackCustom>
</ViewWrapper>
</>

51
app/(application)/(user)/event/[id]/history.tsx Normal file
View File

@@ -0,0 +1,51 @@
import {
DotButton,
DrawerCustom,
MenuDrawerDynamicGrid,
ViewWrapper,
Spacing,
} from "@/components";
import { IMenuDrawerItem } from "@/components/_Interface/types";
import LeftButtonCustom from "@/components/Button/BackButton";
import Event_BoxDetailPublishSection from "@/screens/Event/BoxDetailPublishSection";
import { menuDrawerPublishEvent } from "@/screens/Event/menuDrawerPublish";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useState } from "react";
export default function EventDetailHistory() {
const { id } = useLocalSearchParams();
const [openDrawer, setOpenDrawer] = useState(false);
const handlePress = (item: IMenuDrawerItem) => {
console.log("PATH ", item.path);
router.navigate(item.path as any);
setOpenDrawer(false);
};
return (
<>
<Stack.Screen
options={{
title: `Detail riwayat`,
headerLeft: () => <LeftButtonCustom />,
headerRight: () => <DotButton onPress={() => setOpenDrawer(true)} />,
}}
/>
<ViewWrapper>
<Event_BoxDetailPublishSection />
<Spacing />
</ViewWrapper>
<DrawerCustom
isVisible={openDrawer}
closeDrawer={() => setOpenDrawer(false)}
height={250}
>
<MenuDrawerDynamicGrid
data={menuDrawerPublishEvent({ id: id as string })}
columns={4}
onPressItem={handlePress}
/>
</DrawerCustom>
</>
);
}

17
app/(application)/(user)/event/[id]/list-of-participants.tsx Normal file
View File

@@ -0,0 +1,17 @@
import {
AvatarUsernameAndOtherComponent,
BaseBox,
ViewWrapper,
} from "@/components";
export default function EventListOfParticipants() {
return (
<ViewWrapper>
{Array.from({ length: 10 }).map((_, index) => (
<BaseBox key={index} paddingBlock={0}>
<AvatarUsernameAndOtherComponent avatarHref={`/profile/${index}`} />
</BaseBox>
))}
</ViewWrapper>
);
}

64
app/(application)/(user)/event/[id]/publish.tsx Normal file
View File

@@ -0,0 +1,64 @@
import {
ButtonCustom,
DotButton,
DrawerCustom,
MenuDrawerDynamicGrid,
Spacing,
ViewWrapper
} from "@/components";
import { IMenuDrawerItem } from "@/components/_Interface/types";
import LeftButtonCustom from "@/components/Button/BackButton";
import Event_BoxDetailPublishSection from "@/screens/Event/BoxDetailPublishSection";
import { menuDrawerPublishEvent } from "@/screens/Event/menuDrawerPublish";
import { router, Stack, useLocalSearchParams } from "expo-router";
import { useState } from "react";
import { Alert } from "react-native";
export default function EventDetailPublish() {
const { id } = useLocalSearchParams();
const [openDrawer, setOpenDrawer] = useState(false);
const handlePress = (item: IMenuDrawerItem) => {
console.log("PATH ", item.path);
router.navigate(item.path as any);
setOpenDrawer(false);
};
const footerButton = (
<ButtonCustom
backgroundColor="green"
textColor="white"
onPress={() => Alert.alert("Anda berhasil join event ini")}
>
Join
</ButtonCustom>
);
return (
<>
<Stack.Screen
options={{
title: `Event publish`,
headerLeft: () => <LeftButtonCustom />,
headerRight: () => <DotButton onPress={() => setOpenDrawer(true)} />,
}}
/>
<ViewWrapper>
<Event_BoxDetailPublishSection footerButton={footerButton} />
<Spacing />
</ViewWrapper>
<DrawerCustom
isVisible={openDrawer}
closeDrawer={() => setOpenDrawer(false)}
height={250}
>
<MenuDrawerDynamicGrid
data={menuDrawerPublishEvent({ id: id as string })}
columns={4}
onPressItem={handlePress}
/>
</DrawerCustom>
</>
);
}

50
app/(application)/(user)/event/create.tsx
View File

@@ -1,15 +1,15 @@
import {
BoxButtonOnFooter,
ButtonCustom,
SelectCustom,
StackCustom,
TextAreaCustom,
TextInputCustom,
ViewWrapper,
ButtonCustom,
SelectCustom,
StackCustom,
TextAreaCustom,
TextInputCustom,
ViewWrapper,
} from "@/components";
import DateTimePickerCustom from "@/components/DateInput/DateTimePickerCustom";
import { masterTypeEvent } from "@/lib/dummy-data/event/master-type-event";
import { DateTimePickerEvent } from "@react-native-community/datetimepicker";
import { router } from "expo-router";
import React, { useState } from "react";
import { Platform } from "react-native";
@@ -23,25 +23,32 @@ export default function EventCreate() {
>(null);
const handlerSubmit = () => {
if (selectedDate) {
console.log("Tanggal yang dipilih:", selectedDate);
console.log(`ISO Format ${Platform.OS}:`, selectedDate.toString());
// Kirim ke API atau proses lanjutan
} else {
console.warn("Tanggal belum dipilih");
}
try {
if (selectedDate) {
console.log("Tanggal yang dipilih:", selectedDate);
console.log(`ISO Format ${Platform.OS}:`, selectedDate.toString());
// Kirim ke API atau proses lanjutan
} else {
console.log("Tanggal belum dipilih");
}
if (selectedEndDate) {
console.log("Tanggal yang dipilih:", selectedEndDate);
console.log(`ISO Format ${Platform.OS}:`, selectedEndDate.toString());
// Kirim ke API atau proses lanjutan
} else {
console.warn("Tanggal belum dipilih");
if (selectedEndDate) {
console.log("Tanggal yang dipilih:", selectedEndDate);
console.log(`ISO Format ${Platform.OS}:`, selectedEndDate.toString());
// Kirim ke API atau proses lanjutan
} else {
console.log("Tanggal berakhir belum dipilih");
}
console.log("Data berhasil disimpan");
router.navigate("/event/status");
} catch (error) {
console.log(error);
}
};
const buttonSubmit = (
<ButtonCustom title="Simpan" onPress={handlerSubmit} />
<ButtonCustom title="Simpan" onPress={handlerSubmit} />
// <BoxButtonOnFooter>
// </BoxButtonOnFooter>
);
@@ -96,7 +103,6 @@ export default function EventCreate() {
{buttonSubmit}
</StackCustom>
</ViewWrapper>
</>
);

12
components/Box/BaseBox.tsx
View File

@@ -1,16 +1,14 @@
import { AccentColor } from "@/constants/color-palet";
import {
PADDING_EXTRA_SMALL,
PADDING_MEDIUM,
PADDING_SMALL,
PADDING_SMALL
} from "@/constants/constans-value";
import { Href, router } from "expo-router";
import {
StyleProp,
TouchableHighlight,
TouchableOpacity,
View,
ViewStyle,
ViewStyle
} from "react-native";
interface BaseBoxProps {
@@ -20,6 +18,8 @@ interface BaseBoxProps {
onPress?: () => void;
marginBottom?: number;
padding?: number;
paddingTop?: number;
paddingBottom?: number;
paddingInline?: number;
paddingBlock?: number;
}
@@ -32,6 +32,8 @@ export default function BaseBox({
marginBottom = PADDING_MEDIUM,
paddingBlock = PADDING_MEDIUM,
paddingInline = PADDING_SMALL,
paddingTop = PADDING_MEDIUM,
paddingBottom = PADDING_MEDIUM,
}: BaseBoxProps) {
return (
@@ -49,6 +51,8 @@ export default function BaseBox({
marginBottom,
paddingBlock,
paddingInline,
paddingTop,
paddingBottom,
},
style,
]}

20
components/Box/BoxWithHeaderInformation.tsx Normal file
View File

@@ -0,0 +1,20 @@
import { Href } from "expo-router";
import BaseBox from "./BaseBox";
export default function BoxWithHeaderSection({
children,
href,
onPress,
}: {
children: React.ReactNode;
href?: Href;
onPress?: () => void;
}) {
return (
<>
<BaseBox href={href} onPress={onPress} paddingTop={5}>
{children}
</BaseBox>
</>
);
}

3
components/Scroll/ScrollCustom.tsx
View File

@@ -49,6 +49,9 @@ export default ScrollableCustom;
const styles = StyleSheet.create({
scrollView: {
backgroundColor: MainColor.soft_darkblue,
borderRadius: 50,
padding: 5,
// maxHeight: 50,
},
buttonContainer: {

6
components/_ShareComponent/Spacing.tsx
View File

@@ -3,12 +3,12 @@ import React from "react";
import { View } from "react-native";
interface SpacingProps {
width?: number;
height?: number;
width?: number | string;
height?: number | string;
}
const Spacing: React.FC<SpacingProps> = ({ width = 20, height = 20 }) => {
return <View style={{ height, width }} />;
return <View style={{ height: height as any, width: width as any }} />;
};
export default Spacing;

37
components/index.ts
View File

@@ -19,6 +19,7 @@ import Grid from "./Grid/GridCustom";
// Box
import BaseBox from "./Box/BaseBox";
import BoxButtonOnFooter from "./Box/BoxButtonOnFooter";
import BoxWithHeaderSection from "./Box/BoxWithHeaderInformation";
import InformationBox from "./Box/InformationBox";
// Stack
import StackCustom from "./Stack/StackCustom";
@@ -38,30 +39,35 @@ import ClickableCustom from "./Clickable/ClickableCustom";
// Scroll
import ScrollableCustom from "./Scroll/ScrollCustom";
// ShareComponent
import AvatarUsernameAndOtherComponent from "./_ShareComponent/AvataraAndOtherHeaderComponent";
import Spacing from "./_ShareComponent/Spacing";
import ViewWrapper from "./_ShareComponent/ViewWrapper";
import AvatarUsernameAndOtherComponent from "./_ShareComponent/AvataraAndOtherHeaderComponent";
export {
AlertCustom,
// Image
AvatarCustom,
LandscapeFrameUploaded,
// ShareComponent
AvatarUsernameAndOtherComponent, LeftButtonCustom as BackButton,
// Box
BaseBox,
BoxButtonOnFooter,
InformationBox,
BoxButtonOnFooter, BoxWithHeaderSection,
// Button
ButtonCenteredOnly,
ButtonCustom,
LeftButtonCustom as BackButton,
DotButton,
// Center
CenterCustom,
// Clickable
ClickableCustom,
// Divider
DividerCustom, DotButton,
// Drawer
DrawerCustom,
MenuDrawerDynamicGrid,
// Grid
Grid,
Grid, InformationBox, LandscapeFrameUploaded,
// Map
MapCustom,
MapCustom, MenuDrawerDynamicGrid,
// Scroll
ScrollableCustom,
// Select
SelectCustom,
// ShareComponent
@@ -75,15 +81,6 @@ export {
// TextInput
TextInputCustom,
// ViewWrapper
ViewWrapper,
// Divider
DividerCustom,
// Center
CenterCustom,
// Clickable
ClickableCustom,
// Scroll
ScrollableCustom,
// ShareComponent
AvatarUsernameAndOtherComponent,
ViewWrapper
};

61
screens/Event/BoxDetailPublishSection.tsx Normal file
View File

@@ -0,0 +1,61 @@
import {
BaseBox,
Grid,
StackCustom,
TextCustom
} from "@/components";
export default function Event_BoxDetailPublishSection({
footerButton,
}: {
footerButton?: React.ReactNode;
}) {
return (
<>
<BaseBox>
<StackCustom>
<TextCustom bold align="center" size="xlarge">
Judul event publish
</TextCustom>
{listData.map((item, index) => (
<Grid key={index}>
<Grid.Col span={4}>
<TextCustom bold>{item.title}</TextCustom>
</Grid.Col>
<Grid.Col span={8}>
<TextCustom>{item.value}</TextCustom>
</Grid.Col>
</Grid>
))}
</StackCustom>
</BaseBox>
{footerButton}
</>
);
}
const listData = [
{
title: "Lokasi",
value:
"Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur eveniet ab eum ducimus tempore a quia deserunt quisquam. Tempora, atque. Aperiam minima asperiores dicta perferendis quis adipisci, dolore optio porro!",
},
{
title: "Tipe Acara",
value: "Workshop",
},
{
title: "Tanggal Mulai",
value: "Senin, 18 Juli 2025, 10:00 WIB",
},
{
title: "Tanggal Berakhir",
value: "Selasa, 19 Juli 2025, 12:00 WIB",
},
{
title: "Deskripsi",
value:
"Lorem ipsum dolor sit amet consectetur adipisicing elit. Consectetur eveniet ab eum ducimus tempore a quia deserunt quisquam. Tempora, atque. Aperiam minima asperiores dicta perferendis quis adipisci, dolore optio porro!",
},
];

48
screens/Event/BoxPublishSection.tsx Normal file
View File

@@ -0,0 +1,48 @@
import {
AvatarUsernameAndOtherComponent,
BoxWithHeaderSection,
StackCustom,
TextCustom,
} from "@/components";
export default function Event_BoxPublishSection({
id,
title,
username,
description,
// Avatar
sourceAvatar,
rightComponentAvatar,
}: {
id: string;
title?: string;
username?: string;
description?: string;
// Avatar
sourceAvatar?: string;
rightComponentAvatar?: React.ReactNode;
}) {
return (
<>
<BoxWithHeaderSection href={`/event/${id}/history`}>
<StackCustom gap={"xs"}>
<AvatarUsernameAndOtherComponent
avatarHref={`/profile/${id}`}
name={username || "Lorem ipsum dolor sit"}
rightComponent={rightComponentAvatar}
avatar={sourceAvatar as any}
/>
<TextCustom truncate bold>
{title || "Lorem ipsum dolor sit"}
</TextCustom>
<TextCustom truncate={2}>
{description ||
"Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro sed doloremque tempora soluta. Dolorem ex quidem ipsum tempora, ipsa, obcaecati quia suscipit numquam, voluptates commodi porro impedit natus quos doloremque!"}
</TextCustom>
</StackCustom>
</BoxWithHeaderSection>
</>
);
}

17
screens/Event/menuDrawerPublish.tsx Normal file
View File

@@ -0,0 +1,17 @@
import { AccentColor } from "@/constants/color-palet";
import { ICON_SIZE_MEDIUM } from "@/constants/constans-value";
import { FontAwesome } from "@expo/vector-icons";
export const menuDrawerPublishEvent = ({ id }: { id: string }) => [
{
icon: (
<FontAwesome
name="users"
size={ICON_SIZE_MEDIUM}
color={AccentColor.white}
/>
),
label: "Daftar peserta",
path: `/(application)/(user)/event/${id}/list-of-participants`,
},
];