Fakultas Ilmu Komputer UI

Commit 422a10d9 authored by Mohammad Faraz Abisha Mirza's avatar Mohammad Faraz Abisha Mirza
Browse files

Merge branch 'master' into 'ecosystem-map-screen'

# Conflicts:
#   src/screens/ecosystem/EcosystemDetailScreen.tsx
parents a7b63cc0 856f24c5
Pipeline #86283 passed with stage
in 9 minutes and 47 seconds
...@@ -48,6 +48,14 @@ const AlphabetGroupList = ({ ...@@ -48,6 +48,14 @@ const AlphabetGroupList = ({
}, },
}); });
} }
} else if (fromScreen === "BusinessEcosystem") {
nav.navigate("Ecosystem", {
screen: "EcosystemList",
params: {
headerTitle: item.value,
toFetch: item.key,
},
});
} }
}} }}
/> />
......
...@@ -5,11 +5,11 @@ import { EcosystemStackParamList } from "../types/navigation/EcosystemStack"; ...@@ -5,11 +5,11 @@ import { EcosystemStackParamList } from "../types/navigation/EcosystemStack";
import { import {
BusinessCategoryScreen, BusinessCategoryScreen,
EcosystemDetailScreen, EcosystemDetailScreen,
EcosystemListScreen,
EcosystemMapScreen, EcosystemMapScreen,
RecommendedEcosystemScreen, RecommendedEcosystemScreen,
UserListScreen, UserListScreen,
} from "../screens/ecosystem"; } from "../screens/ecosystem";
import CategoryEcosystemListScreen from "../screens/ecosystem/CategoryEcosystemListScreen";
const EcosystemStack = createNativeStackNavigator<EcosystemStackParamList>(); const EcosystemStack = createNativeStackNavigator<EcosystemStackParamList>();
...@@ -36,7 +36,7 @@ const EcosystemStackNavigator = () => { ...@@ -36,7 +36,7 @@ const EcosystemStackNavigator = () => {
/> />
<EcosystemStack.Screen <EcosystemStack.Screen
name="EcosystemList" name="EcosystemList"
component={EcosystemListScreen} component={CategoryEcosystemListScreen}
initialParams={{ headerTitle: "" }} initialParams={{ headerTitle: "" }}
options={({ route }) => ({ title: route.params.headerTitle })} options={({ route }) => ({ title: route.params.headerTitle })}
/> />
......
...@@ -72,19 +72,29 @@ export const signupUser = ( ...@@ -72,19 +72,29 @@ export const signupUser = (
firstName: string, firstName: string,
lastName: string, lastName: string,
email: string, email: string,
password: string password: string,
phone: string,
businessType: string
) => { ) => {
return async (dispatch: Dispatch<any>) => { return async (dispatch: Dispatch<any>) => {
try { try {
const userAuth = await authService.signUpAuth(email, password); const userAuth = await authService.signUpAuth(email, password);
const uid = userAuth.user.uid; const uid = userAuth.user.uid;
await userService.createUser(email, firstName, lastName, uid); await userService.createUser(uid, {
dispatch({ firstName,
lastName,
email,
phone,
businessType,
pic: "",
});
return dispatch({
type: "SIGNUP", type: "SIGNUP",
payload: { email, firstName, lastName, id: uid }, payload: { email, firstName, lastName, id: uid, phone, businessType },
}); });
} catch (e) { } catch (e) {
console.log(e); console.log(e);
return { error: e };
} }
}; };
}; };
import { FlatList, SafeAreaView, StyleSheet } from "react-native";
import React, { useState } from "react";
import HorizontalCards from "../components/Cards/HorizontalCards";
// import { useNavigation } from "@react-navigation/core";
import Colors from "../constants/Colors";
import { View } from "../components/Themed";
import Spacer from "../components/Spacer/Spacer";
// import { IEcosystem } from "../types/firestore/ecosystems";
import IconForm from "../components/Forms/IconForm";
const CategoryEcosystemListScreen = () => {
// const nav = useNavigation();
const [search, setSearch] = useState("");
const [
listData,
// setListData
] = useState([
{
id: "1",
image:
"https://asset.kompas.com/crops/O_Vgje1nMEqUCaDexq2UJdbyT14=/9x1:989x655/750x500/data/photo/2020/02/21/5e5008d10c825.jpg",
member: "100",
title: "Pengolahan Kerupuk",
rate: "5",
},
{
id: "2",
image:
"https://asset.kompas.com/crops/O_Vgje1nMEqUCaDexq2UJdbyT14=/9x1:989x655/750x500/data/photo/2020/02/21/5e5008d10c825.jpg",
member: "120",
title: "Pengolahan Kerupuk",
rate: "4.9",
},
{
id: "3",
image:
"https://asset.kompas.com/crops/O_Vgje1nMEqUCaDexq2UJdbyT14=/9x1:989x655/750x500/data/photo/2020/02/21/5e5008d10c825.jpg",
member: "130",
title: "Pengolahan Kerupuk",
rate: "5",
},
{
id: "4",
image:
"https://asset.kompas.com/crops/O_Vgje1nMEqUCaDexq2UJdbyT14=/9x1:989x655/750x500/data/photo/2020/02/21/5e5008d10c825.jpg",
member: "140",
title: "Pengolahan Kerupuk",
rate: "4.4",
},
{
id: "5",
image:
"https://asset.kompas.com/crops/O_Vgje1nMEqUCaDexq2UJdbyT14=/9x1:989x655/750x500/data/photo/2020/02/21/5e5008d10c825.jpg",
member: "100",
title: "Pengolahan Kerupuk",
rate: "4",
},
{
id: "6",
image:
"https://asset.kompas.com/crops/O_Vgje1nMEqUCaDexq2UJdbyT14=/9x1:989x655/750x500/data/photo/2020/02/21/5e5008d10c825.jpg",
member: "10",
title: "Pengolahan Kerupuk",
rate: "5",
},
]);
return (
<SafeAreaView style={styles.container}>
<View>
<IconForm
text={search}
setText={setSearch}
placeholder={"Cari di kategori ini"}
search
/>
</View>
<Spacer variant={"xl"} />
<FlatList
data={listData}
renderItem={({ item }) => {
return (
<View style={styles.horizontalCard}>
<HorizontalCards
image={item.image}
member={item.member}
title={item.title}
rate={item.rate}
onPress={null}
/>
</View>
);
}}
keyExtractor={(item) => item.id}
ItemSeparatorComponent={() => <Spacer variant={"l"} />}
showsVerticalScrollIndicator={false}
showsHorizontalScrollIndicator={false}
/>
</SafeAreaView>
);
};
const styles = StyleSheet.create({
container: {
padding: 24,
backgroundColor: Colors.background,
},
horizontalCard: {
paddingHorizontal: 4,
paddingTop: 2,
},
});
export default CategoryEcosystemListScreen;
...@@ -7,6 +7,7 @@ import { ...@@ -7,6 +7,7 @@ import {
FlatList, FlatList,
TouchableOpacity, TouchableOpacity,
SafeAreaView, SafeAreaView,
Alert,
} from "react-native"; } from "react-native";
import Colors from "../constants/Colors"; import Colors from "../constants/Colors";
import PlainForm from "../components/Forms/PlainForm"; import PlainForm from "../components/Forms/PlainForm";
...@@ -18,10 +19,16 @@ import Spacer from "../components/Spacer/Spacer"; ...@@ -18,10 +19,16 @@ import Spacer from "../components/Spacer/Spacer";
import { ecosystemItem } from "../types/ListItems"; import { ecosystemItem } from "../types/ListItems";
import { getCategoriesAsDdFormat } from "../helpers/ddConverter"; import { getCategoriesAsDdFormat } from "../helpers/ddConverter";
import { CreateEcosystemStackScreenProps } from "../types/navigation"; import { CreateEcosystemStackScreenProps } from "../types/navigation";
import { createEcosystem } from "../service/functions/createEcosystem";
import { useUser } from "../hooks/reduxHooks";
import { IEcosystemCategoryMember } from "../types/firestore/ecosystemCategoryMember";
import { IEcosystemMembership } from "../types/firestore/ecosystemMembership";
import { ActivityIndicator } from "react-native-paper";
const CreateEcosystemScreen = ({ const CreateEcosystemScreen = ({
route, route,
}: CreateEcosystemStackScreenProps<"CreateEcosystemScreen">) => { }: CreateEcosystemStackScreenProps<"CreateEcosystemScreen">) => {
const nav = useNavigation(); const nav = useNavigation();
const user = useUser();
const [ecosystemName, setEcosystemName] = useState(""); const [ecosystemName, setEcosystemName] = useState("");
const [ecosystemDetails, setEcosystemDetails] = useState(""); const [ecosystemDetails, setEcosystemDetails] = useState("");
const [ecosystemCategory, setEcosystemCategory] = useState(""); const [ecosystemCategory, setEcosystemCategory] = useState("");
...@@ -33,6 +40,8 @@ const CreateEcosystemScreen = ({ ...@@ -33,6 +40,8 @@ const CreateEcosystemScreen = ({
const [ecosystemMainBusiness, setEcosystemMainBusiness] = const [ecosystemMainBusiness, setEcosystemMainBusiness] =
useState<ecosystemItem>({}); useState<ecosystemItem>({});
const [isSubmitting, setIsSubmitting] = useState(false);
// const handlePickImage = () => { // const handlePickImage = () => {
// setIsLoading(true); // setIsLoading(true);
// pickImage().then((res) => { // pickImage().then((res) => {
...@@ -51,7 +60,6 @@ const CreateEcosystemScreen = ({ ...@@ -51,7 +60,6 @@ const CreateEcosystemScreen = ({
}); });
useEffect(() => { useEffect(() => {
console.log("test");
if (route.params?.id && route.params?.name) { if (route.params?.id && route.params?.name) {
switch (route.params?.forGroup) { switch (route.params?.forGroup) {
case "supplier": case "supplier":
...@@ -116,6 +124,125 @@ const CreateEcosystemScreen = ({ ...@@ -116,6 +124,125 @@ const CreateEcosystemScreen = ({
} }
}; };
const handleSubmit = async () => {
setIsSubmitting(true);
const ecosystemCategoryMembers: {
categoryMember: IEcosystemCategoryMember;
ecosystemMemberships: IEcosystemMembership[];
}[] = [];
const suppliers = Object.keys(ecosystemSupplier);
suppliers.forEach((categoryId) => {
const item = ecosystemSupplier[categoryId];
const member: IEcosystemCategoryMember = {
type: "supplier",
categoryId: categoryId,
};
const memberships: IEcosystemMembership[] = [];
Object.keys(item.members).forEach((userId) => {
memberships.push({
userId: userId,
});
});
ecosystemCategoryMembers.push({
categoryMember: member,
ecosystemMemberships: memberships,
});
});
const customer = Object.keys(ecosystemCustomer);
customer.forEach((categoryId) => {
const item = ecosystemCustomer[categoryId];
const member: IEcosystemCategoryMember = {
type: "customer",
categoryId: categoryId,
};
const memberships: IEcosystemMembership[] = [];
Object.keys(item.members).forEach((userId) => {
memberships.push({
userId: userId,
});
});
ecosystemCategoryMembers.push({
categoryMember: member,
ecosystemMemberships: memberships,
});
});
const support = Object.keys(ecosystemSupport);
support.forEach((categoryId) => {
const item = ecosystemSupport[categoryId];
const member: IEcosystemCategoryMember = {
type: "support",
categoryId: categoryId,
};
const memberships: IEcosystemMembership[] = [];
Object.keys(item.members).forEach((userId) => {
memberships.push({
userId: userId,
});
});
ecosystemCategoryMembers.push({
categoryMember: member,
ecosystemMemberships: memberships,
});
});
const mainBusiness = Object.keys(ecosystemMainBusiness);
mainBusiness.forEach((categoryId) => {
const item = ecosystemMainBusiness[categoryId];
const member: IEcosystemCategoryMember = {
type: "main",
categoryId: categoryId,
};
const memberships: IEcosystemMembership[] = [];
Object.keys(item.members).forEach((userId) => {
memberships.push({
userId: userId,
});
});
ecosystemCategoryMembers.push({
categoryMember: member,
ecosystemMemberships: memberships,
});
});
try {
const response = await createEcosystem({
ecosystem: {
name: ecosystemName,
description: ecosystemDetails,
followerCount: 0,
pic: "",
visibility: "public",
raters: 0,
rating: 0,
creatorId: user.id,
categoryId: ecosystemCategory,
},
ecosystemCategoryMembers: ecosystemCategoryMembers,
});
setIsSubmitting(false);
if (response.status === 200 || response.status === "200") {
nav.navigate("MainTab");
} else {
console.log(response);
Alert.alert("Error", "error creating new ecosystem");
}
} catch (e) {
setIsSubmitting(false);
console.log(e);
Alert.alert("Error", "error creating new ecosystem");
}
};
return ( return (
<SafeAreaView> <SafeAreaView>
<FlatList <FlatList
...@@ -491,10 +618,19 @@ const CreateEcosystemScreen = ({ ...@@ -491,10 +618,19 @@ const CreateEcosystemScreen = ({
/> />
)} )}
<Spacer variant="xl" /> <Spacer variant="xl" />
{isSubmitting && (
<ActivityIndicator
size={"large"}
animating={true}
/>
)}
<Spacer variant="xl" />
<MainButton <MainButton
text="lanjut" text="lanjut"
colors="primary" colors="primary"
onPress={() => {}} onPress={() => {
handleSubmit();
}}
/> />
<Spacer variant="xl" /> <Spacer variant="xl" />
<Spacer variant="xl" /> <Spacer variant="xl" />
......
...@@ -25,13 +25,12 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => { ...@@ -25,13 +25,12 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
const [password, setPassword] = useState(""); const [password, setPassword] = useState("");
const [phoneNo, setPhoneNo] = useState(""); const [phoneNo, setPhoneNo] = useState("");
const [picked, setPicked] = useState(""); const [picked, setPicked] = useState("");
const dispatch = useAppDispatch();
const [categories, setCategories] = useState<IDD[]>([]); const [categories, setCategories] = useState<IDD[]>([]);
useEffect(() => { useEffect(() => {
getCategoriesAsDdFormat().then((res) => setCategories(res)); getCategoriesAsDdFormat().then((res) => setCategories(res));
}); }, []);
const dispatch = useAppDispatch();
const handleSubmit = () => { const handleSubmit = () => {
if ( if (
...@@ -42,7 +41,11 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => { ...@@ -42,7 +41,11 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
validateEmpty(password) && validateEmpty(password) &&
validateEmpty(picked) validateEmpty(picked)
) { ) {
dispatch(signupUser(firstName, lastName, email, password)); // eslint-disable-next-line @typescript-eslint/no-unsafe-call
dispatch(
signupUser(firstName, lastName, email, password, phoneNo, picked)
).then(() => Alert.alert("Error", "Something went wrong"));
// .then((e: ActionErrorRes) => e.error && Alert.alert("Error", e.error));
} else { } else {
Alert.alert("Form Tidak Lengkap", "Silahkan isi form dengan benar"); Alert.alert("Form Tidak Lengkap", "Silahkan isi form dengan benar");
} }
...@@ -155,6 +158,7 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => { ...@@ -155,6 +158,7 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
<MainButton text="Daftar" colors="primary" onPress={handleSubmit} /> <MainButton text="Daftar" colors="primary" onPress={handleSubmit} />
</View> </View>
<Spacer variant="xl" /> <Spacer variant="xl" />
<Spacer variant="xl" />
</ScrollView> </ScrollView>
); );
}; };
...@@ -163,6 +167,7 @@ const styles = StyleSheet.create({ ...@@ -163,6 +167,7 @@ const styles = StyleSheet.create({
container: { container: {
padding: 24, padding: 24,
backgroundColor: Colors.background, backgroundColor: Colors.background,
flex: 1,
}, },
titleText: { titleText: {
fontSize: 32, fontSize: 32,
......
...@@ -61,6 +61,9 @@ const BusinessEcosystemScreen = () => { ...@@ -61,6 +61,9 @@ const BusinessEcosystemScreen = () => {
onPress={() => { onPress={() => {
nav.navigate("Ecosystem", { nav.navigate("Ecosystem", {
screen: "BusinessCategory", screen: "BusinessCategory",
params: {
fromScreen: "BusinessEcosystem",
},
}); });
}} }}
> >
......
import { FlatList, ScrollView, StyleSheet } from "react-native";
import React, { useEffect, useState } from "react";
import HorizontalCards from "../../components/Cards/HorizontalCards";
import { useNavigation } from "@react-navigation/core";
import Colors from "../../constants/Colors";
import { View } from "../../components/Themed";
import Spacer from "../../components/Spacer/Spacer";
import IconForm from "../../components/Forms/IconForm";
import { getByCategory } from "../../service/firestore/ecosystem/getByCategory";
import { IEcosystem } from "../../types/firestore/ecosystems";
import { EcosystemStackScreenProps } from "../../types/navigation";
const CategoryEcosystemListScreen = ({
route,
}: EcosystemStackScreenProps<"EcosystemList">) => {
const nav = useNavigation();
const { toFetch } = route.params;
const [search, setSearch] = useState("");
const [listData, setListData] = useState<IEcosystem[]>([]);
useEffect(() => {
getByCategory(toFetch).then((res) => setListData(res));
});
return (
<ScrollView style={styles.container}>
<View>
<IconForm
text={search}
setText={setSearch}
placeholder={"Cari di kategori ini"}
search
/>
</View>
<Spacer variant={"xl"} />
<FlatList
data={listData}
renderItem={({ item }) => {
return (
<View style={styles.horizontalCard}>
<HorizontalCards
image={item.pic}
member={item.followerCount.toString()}
title={item.name}
rate={item.rating.toString()}
onPress={() =>
nav.navigate("Ecosystem", {
screen: "EcosystemDetails",
params: {
headerTitle: item.name,
title: item.name,
desc: item.description,
image: item.pic,
member: item.followerCount.toString(),
rating: item.rating.toString(),
},
})
}
/>
</View>
);
}}
keyExtractor={(item) => item.id}
ItemSeparatorComponent={() => <Spacer variant={"l"} />}
showsVerticalScrollIndicator={false}
showsHorizontalScrollIndicator={false}
/>
</ScrollView>
);
};
const styles = StyleSheet.create({
container: {