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

feature event

Browse Source 
deskripsi:
- resourcing component event
This commit is contained in:
Bagasbanuna02
2025-06-30 16:41:17 +08:00
parent 5577ef5d1e
commit d58304a146
14 changed files with 177 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
app/(application)/_layout.tsx
View File

@@ -1,4 +1,5 @@
import { AccentColor, MainColor } from "@/constants/color-palet";
import { Styles } from "@/styles/global-styles";
import { Ionicons } from "@expo/vector-icons";
import { router, Stack } from "expo-router";
@@ -7,16 +8,16 @@ export default function ApplicationLayout() {
<>
<Stack
screenOptions={{
headerStyle: { backgroundColor: MainColor.darkblue },
headerTitleStyle: { color: MainColor.yellow, fontWeight: "bold" },
headerStyle: Styles.headerStyle,
headerTitleStyle: Styles.headerTitleStyle,
headerTitleAlign: "center",
contentStyle: {
borderBottomColor: AccentColor.blue,
borderBottomWidth: 2,
},
headerLargeStyle: {
backgroundColor: MainColor.darkblue,
},
// headerLargeStyle: {
// backgroundColor: MainColor.darkblue,
// },
}}
>
<Stack.Screen
@@ -102,10 +103,26 @@ export default function ApplicationLayout() {
}}
/>
{/* Event */}
<Stack.Screen
name="event/index"
name="event/(tabs)"
options={{
title: "Event",
headerLeft: () => (
<Ionicons
name="arrow-back"
size={20}
color={MainColor.yellow}
onPress={() => router.push("/(application)/home")}
/>
),
}}
/>
<Stack.Screen
name="event/detail/[id]"
options={{
title: "Detail",
headerLeft: () => (
<Ionicons
name="arrow-back"
@@ -117,6 +134,7 @@ export default function ApplicationLayout() {
}}
/>
{/* User Search */}
<Stack.Screen
name="user-search/index"
options={{
@@ -132,6 +150,7 @@ export default function ApplicationLayout() {
}}
/>
{/* Notification */}
<Stack.Screen
name="notifications/index"
options={{

64
app/(application)/event/(tabs)/_layout.tsx Normal file
View File

@@ -0,0 +1,64 @@
import { MainColor } from "@/constants/color-palet";
import { FontAwesome5, Ionicons } from "@expo/vector-icons";
import { Tabs } from "expo-router";
export default function EventLayout() {
return (
<Tabs
screenOptions={{
headerShown: false,
tabBarActiveTintColor: MainColor.yellow,
tabBarInactiveTintColor: MainColor.white,
tabBarStyle: {
backgroundColor: MainColor.darkblue,
},
// tabBarButton: HapticTab,
// tabBarBackground: BlurTabBarBackground,
// tabBarStyle: Platform.select({
// ios: {
// // Use a transparent background on iOS to show the blur effect
// position: "absolute",
// },
// default: {},
// }),
}}
>
<Tabs.Screen
name="index"
options={{
title: "Home",
tabBarIcon: ({ color }) => (
<Ionicons size={20} name="home" color={color} />
),
}}
/>
<Tabs.Screen
name="status"
options={{
title: "Status",
tabBarIcon: ({ color }) => (
<Ionicons size={20} name="list" color={color} />
),
}}
/>
<Tabs.Screen
name="kontribusi"
options={{
title: "Kontribusi",
tabBarIcon: ({ color }) => (
<Ionicons size={20} name="extension-puzzle" color={color} />
),
}}
/>
<Tabs.Screen
name="riwayat"
options={{
title: "Riwayat",
tabBarIcon: ({ color }) => (
<FontAwesome5 size={20} name="history" color={color} />
),
}}
/>
</Tabs>
);
}

25
app/(application)/event/(tabs)/index.tsx Normal file
View File

@@ -0,0 +1,25 @@
import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
import { AccentColor, MainColor } from "@/constants/color-palet";
import { Styles } from "@/styles/global-styles";
import { router } from "expo-router";
import { Text, TouchableHighlight, View } from "react-native";
export default function Event() {
return (
<ViewWrapper>
<TouchableHighlight onPress={() => router.push("/event/detail/1")}>
<View
style={{
padding: 20,
backgroundColor: MainColor.darkblue,
borderRadius: 10,
borderColor: AccentColor.blue,
borderWidth: 1,
}}
>
<Text style={Styles.textLabel}>Event</Text>
</View>
</TouchableHighlight>
</ViewWrapper>
);
}

11
app/(application)/event/(tabs)/kontribusi.tsx Normal file
View File

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

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

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

11
app/(application)/event/(tabs)/status.tsx Normal file
View File

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

14
app/(application)/event/detail/[id].tsx Normal file
View File

@@ -0,0 +1,14 @@
import ViewWrapper from "@/components/_ShareComponent/ViewWrapper";
import { Styles } from "@/styles/global-styles";
import { useLocalSearchParams } from "expo-router";
import { Text } from "react-native";
export default function DetailEvent() {
const { id } = useLocalSearchParams();
console.log("id event >", id);
return (
<ViewWrapper>
<Text style={Styles.textLabel}>Detail Event {id}</Text>
</ViewWrapper>
);
}

9
app/(application)/event/index.tsx
View File

@@ -1,9 +0,0 @@
import { Text, View } from "react-native";
export default function Event() {
return (
<View>
<Text>Event</Text>
</View>
)
}

4
app/(application)/home.tsx
View File

@@ -1,9 +1,9 @@
import NewHomeView from "@/screens/Home/UiHome";
import UiHome from "@/screens/Home/UiHome";
export default function Application() {
return (
<>
<NewHomeView />
<UiHome />
</>
);
}

11
components/_Interface/types.ts
View File

@@ -1,6 +1,13 @@
import { Href } from "expo-router";
export { ITabs };
export { ICustomTab, ITabs };
interface ICustomTab {
icon: string;
label: string;
isActive: boolean;
onPress: () => void;
}
interface ITabs {
id: string;
@@ -9,5 +16,5 @@ interface ITabs {
label: string;
path: Href;
isActive: boolean;
disabled: boolean;
disabled?: boolean;
}

2
screens/Home/UiHome.tsx
View File

@@ -9,7 +9,7 @@ import TabSection from "./tabSection";
import { tabsHome } from "./tabsList";
import Home_FeatureSection from "./topFeatureSection";
export default function NewHomeView() {
export default function UiHome() {
const navigation = useNavigation();
useEffect(() => {

9
screens/Home/tabSection.tsx
View File

@@ -1,16 +1,11 @@
import { ITabs } from "@/components/_Interface/types";
import { ICustomTab, ITabs } from "@/components/_Interface/types";
import { Styles } from "@/styles/global-styles";
import { Ionicons } from "@expo/vector-icons";
import { router } from "expo-router";
import React from "react";
import { Text, TouchableOpacity, View } from "react-native";
interface ICustomTab {
icon: string;
label: string;
isActive: boolean;
onPress: () => void;
}
const CustomTab = ({ icon, label, isActive, onPress }: ICustomTab) => (
<TouchableOpacity
style={[Styles.tabItem, isActive && Styles.activeTab]}

2
screens/Home/topFeatureSection.tsx
View File

@@ -9,7 +9,7 @@ export default function Home_FeatureSection() {
<View style={stylesHome.gridContainer}>
<TouchableOpacity
style={stylesHome.gridItem}
onPress={() => router.push("/(application)/event")}
onPress={() => router.push("/(application)/event/(tabs)")}
>
<Ionicons name="analytics" size={48} color="white" />
<Text style={stylesHome.gridLabel}>Event</Text>

2
styles/global-styles.ts
View File

@@ -49,7 +49,7 @@ export const Styles = StyleSheet.create({
// Stack Header Style
headerStyle: {
backgroundColor: MainColor.darkblue,
backgroundColor: AccentColor.darkblue,
},
headerTitleStyle: {
color: MainColor.yellow,