Fakultas Ilmu Komputer UI

Skip to content
GitLab
Commit f66691fc authored by Mohammad Faraz Abisha Mirza's avatar Mohammad Faraz Abisha Mirza Committed by angelin depthios
Browse files

PlainForm and IconForm Edit, DropdownForm Initialization, Spacer Props... 

PlainForm and IconForm Edit, DropdownForm Initialization, Spacer Props Addition and Edit, IconForm and Spacer Tests, Package Addition
parent 4eee1812
Show whitespace changes
Inline Side-by-side
src/screens/CategoryEcosystemListScreen.tsx 0 → 100644
View file @ f66691fc
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;
src/screens/EcosystemListScreen.tsx 0 → 100644
View file @ f66691fc
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 { IEcosystemList } from "../types/ecosystemList";
const EcosystemListScreen = () => {
const nav = useNavigation();
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}>
<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 EcosystemListScreen;
src/screens/auth/RegisterGoogleFacebookScreen.tsx
View file @ f66691fc
...@@ -108,7 +108,7 @@ const RegisterGoogleFacebookScreen = ({ ...@@ -108,7 +108,7 @@ const RegisterGoogleFacebookScreen = ({
</Text> </Text>
</View> </View>
<Spacer variant={"l"} /> <Spacer variant={"l"} />
<View style={styles.button}> <View style={styles.componentWrapper}>
<MainButton text="Daftar" colors="primary" onPress={() => {}} /> <MainButton text="Daftar" colors="primary" onPress={() => {}} />
</View> </View>
<Spacer variant={"xl"} /> <Spacer variant={"xl"} />
......
src/types/ecosystemList.ts 0 → 100644
View file @ f66691fc
export type IEcosystemList = {
variant: "terbaru" | "bergabung" | "populer";
};
src/types/firestore/ecosystem.ts 0 → 100644
View file @ f66691fc
export type IEcosystem = {
item: {
id?: string;
image: string;
member: string;
title: string;
rate: string;
};
};
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Excellence In Teamwork