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 = ({
},
});
}
} 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";
import {
BusinessCategoryScreen,
EcosystemDetailScreen,
EcosystemListScreen,
EcosystemMapScreen,
RecommendedEcosystemScreen,
UserListScreen,
} from "../screens/ecosystem";
import CategoryEcosystemListScreen from "../screens/ecosystem/CategoryEcosystemListScreen";
const EcosystemStack = createNativeStackNavigator<EcosystemStackParamList>();
......@@ -36,7 +36,7 @@ const EcosystemStackNavigator = () => {
/>
<EcosystemStack.Screen
name="EcosystemList"
component={EcosystemListScreen}
component={CategoryEcosystemListScreen}
initialParams={{ headerTitle: "" }}
options={({ route }) => ({ title: route.params.headerTitle })}
/>
......
......@@ -72,19 +72,29 @@ export const signupUser = (
firstName: string,
lastName: string,
email: string,
password: string
password: string,
phone: string,
businessType: string
) => {
return async (dispatch: Dispatch<any>) => {
try {
const userAuth = await authService.signUpAuth(email, password);
const uid = userAuth.user.uid;
await userService.createUser(email, firstName, lastName, uid);
dispatch({
await userService.createUser(uid, {
firstName,
lastName,
email,
phone,
businessType,
pic: "",
});
return dispatch({
type: "SIGNUP",
payload: { email, firstName, lastName, id: uid },
payload: { email, firstName, lastName, id: uid, phone, businessType },
});
} catch (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 {
FlatList,
TouchableOpacity,
SafeAreaView,
Alert,
} from "react-native";
import Colors from "../constants/Colors";
import PlainForm from "../components/Forms/PlainForm";
......@@ -18,10 +19,16 @@ import Spacer from "../components/Spacer/Spacer";
import { ecosystemItem } from "../types/ListItems";
import { getCategoriesAsDdFormat } from "../helpers/ddConverter";
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 = ({
route,
}: CreateEcosystemStackScreenProps<"CreateEcosystemScreen">) => {
const nav = useNavigation();
const user = useUser();
const [ecosystemName, setEcosystemName] = useState("");
const [ecosystemDetails, setEcosystemDetails] = useState("");
const [ecosystemCategory, setEcosystemCategory] = useState("");
......@@ -33,6 +40,8 @@ const CreateEcosystemScreen = ({
const [ecosystemMainBusiness, setEcosystemMainBusiness] =
useState<ecosystemItem>({});
const [isSubmitting, setIsSubmitting] = useState(false);
// const handlePickImage = () => {
// setIsLoading(true);
// pickImage().then((res) => {
......@@ -51,7 +60,6 @@ const CreateEcosystemScreen = ({
});
useEffect(() => {
console.log("test");
if (route.params?.id && route.params?.name) {
switch (route.params?.forGroup) {
case "supplier":
......@@ -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 (
<SafeAreaView>
<FlatList
......@@ -491,10 +618,19 @@ const CreateEcosystemScreen = ({
/>
)}
<Spacer variant="xl" />
{isSubmitting && (
<ActivityIndicator
size={"large"}
animating={true}
/>
)}
<Spacer variant="xl" />
<MainButton
text="lanjut"
colors="primary"
onPress={() => {}}
onPress={() => {
handleSubmit();
}}
/>
<Spacer variant="xl" />
<Spacer variant="xl" />
......
......@@ -25,13 +25,12 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
const [password, setPassword] = useState("");
const [phoneNo, setPhoneNo] = useState("");
const [picked, setPicked] = useState("");
const dispatch = useAppDispatch();
const [categories, setCategories] = useState<IDD[]>([]);
useEffect(() => {
getCategoriesAsDdFormat().then((res) => setCategories(res));
});
const dispatch = useAppDispatch();
}, []);
const handleSubmit = () => {
if (
......@@ -42,7 +41,11 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
validateEmpty(password) &&
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 {
Alert.alert("Form Tidak Lengkap", "Silahkan isi form dengan benar");
}
......@@ -155,6 +158,7 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
<MainButton text="Daftar" colors="primary" onPress={handleSubmit} />
</View>
<Spacer variant="xl" />
<Spacer variant="xl" />
</ScrollView>
);
};
......@@ -163,6 +167,7 @@ const styles = StyleSheet.create({
container: {
padding: 24,
backgroundColor: Colors.background,
flex: 1,
},
titleText: {
fontSize: 32,
......
......@@ -61,6 +61,9 @@ const BusinessEcosystemScreen = () => {
onPress={() => {
nav.navigate("Ecosystem", {
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: {
padding: 24,
backgroundColor: Colors.background,
},
horizontalCard: {
paddingHorizontal: 4,
paddingTop: 2,
},
});
export default CategoryEcosystemListScreen;
......@@ -6,25 +6,26 @@ import SmallButton from "../../components/button/SmallButton";
import Spacer from "../../components/Spacer/Spacer";
import { MaterialIcons } from "@expo/vector-icons";
import Layout from "../../constants/Layout";
import { useNavigation } from "@react-navigation/core";
import { EcosystemStackScreenProps } from "../../types/navigation";
const EcosystemDetailScreen = () => {
const nav = useNavigation();
const EcosystemDetailScreen = ({
route,
}: EcosystemStackScreenProps<"EcosystemDetails">) => {
const { title, desc, image, member, rating } = route.params;
return (
<View style={styles.container}>
<View style={styles.imageWrapper}>
<Image
style={styles.image}
source={{
// uri: {image}
uri: "https://bsmedia.business-standard.com/_media/bs/img/article/2020-12/11/full/1607656152-0479.jpg",
uri: image,
}}
/>
</View>
<Spacer variant={"l"} />
<View style={styles.textWrapper}>
{/* <Text style={styles.title}>{Title}</Text> */}
<Text style={styles.title}>Petani Beras dan Gandum Jawa Tengah</Text>
<Text style={styles.title}>{title}</Text>
<Spacer variant={"l"} />
<SmallButton
text={"Lihat Peta Ekosistem"}
......@@ -38,8 +39,7 @@ const EcosystemDetailScreen = () => {
<View style={styles.bodyWrapper}>
<MaterialIcons name={"group"} style={styles.iconMember} size={30} />
<View style={styles.textWrapper}>
{/* <Text style={styles.iconText}>{member} Anggota</Text> */}
<Text style={styles.iconText}>350 Anggota</Text>
<Text style={styles.iconText}>{member} Anggota</Text>
</View>
</View>
<View style={styles.bodyWrapper}>
......@@ -47,18 +47,12 @@ const EcosystemDetailScreen = () => {
<View style={styles.textWrapper}>
{/* <Text style={styles.iconText}>{rate}</Text> */}
<Text style={styles.iconText}>4.7</Text>
<Text style={styles.iconText}>{rating}</Text>
</View>
</View>
</View>
<Spacer variant={"s"} />
<Text style={styles.textBody}>
{/* {content} */}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad
minim veniam, quis nostrud exercitation ullamco laboris nisi ut
aliquip.
</Text>
<Text style={styles.textBody}>{desc}</Text>
<Spacer variant={"xl"} />
<SmallButton
text={"Keluar dari Ekosistem"}
......
import React, { useEffect } from "react";
import { StyleSheet } from "react-native";
import { Text, View } from "../../components/Themed";
import React, { useEffect, useState } from "react";
import { StyleSheet, FlatList, ListRenderItem } from "react-native";
import { View } from "../../components/Themed";
import Colors from "../../constants/Colors";
import { EcosystemStackScreenProps } from "../../types/navigation";
import { LogBox } from "react-native";
import ecosystemService from "../../service/firestore/ecosystem";
import { useSelector } from "react-redux";
import { IUser } from "../../types/firestore/User";