Fakultas Ilmu Komputer UI

Commit 96decd10 authored by Doan Andreas Nathanael's avatar Doan Andreas Nathanael
Browse files

Merge branch 'PBI-1-Quiz_Result' into 'staging'

Dietela Quiz Result UI

See merge request !9
parents 694f5590 5db7e9d4
Pipeline #67429 failed with stages
in 30 minutes and 38 seconds
import React, { FC } from 'react';
import { View, Text } from 'react-native';
import { AutoImage, InfoCard, ResultCard } from 'components/core';
import { Section } from 'components/layout';
import { layoutStyles, typographyStyles } from 'styles';
import { styles } from '../styles';
import { status_berat_badan } from '../../../../../assets/images';
import { ScrollView } from 'react-native-gesture-handler';
const info = [
{
title: 'status kecukupan',
content: 'Asupan buah dan sayur sudah cukup ',
},
];
const KecukupanSayurBuah: FC = () => (
<View style={layoutStyles}>
<ScrollView>
<Text style={typographyStyles.headingLarge}>
Kecukupan Sayur dan Buah
</Text>
<Section>
<AutoImage source={status_berat_badan} ratio={0.5} />
</Section>
<Section>
<ResultCard status="healthy" infos={info} />
</Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Ini rekomendasi yang Dietela berikan untukmu:
</Text>
<InfoCard
content={
'Selamat! Kamu sudah memenuhi salah satu langkah menuju hidup sehat. Pertahankan untuk konsumsi setidaknya 2 porsi sayur & 3 porsi buah atau sebaliknya per hari ya. Pokoknya kalau di total kamu perlu 5 porsi buah dan sayur per sehari.'
}
/>
</Section>
<Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Berdasarkan jawaban kuis kamu:
</Text>
<InfoCard content="3 porsi sayur per hari" />
</Section>
</Section>
</ScrollView>
</View>
);
export default KecukupanSayurBuah;
import React from 'react';
import { render } from '@testing-library/react-native';
import MakanBesar from '.';
describe('MakanBesar', () => {
it('renders correctly', () => {
render(<MakanBesar />);
});
});
import React, { FC } from 'react';
import { View, Text } from 'react-native';
import { AutoImage, InfoCard, ResultCard } from 'components/core';
import { Section } from 'components/layout';
import { layoutStyles, typographyStyles } from 'styles';
import { styles } from '../styles';
import { status_berat_badan } from '../../../../../assets/images';
import { ScrollView } from 'react-native-gesture-handler';
const info = [
{
title: 'status makan besar',
content: 'Sudah baik',
},
];
const MakanBesar: FC = () => (
<View style={layoutStyles}>
<ScrollView>
<Text style={typographyStyles.headingLarge}>
Frekuensi Makan Besar dalam Sehari
</Text>
<Section>
<AutoImage source={status_berat_badan} ratio={0.5} />
</Section>
<Section>
<ResultCard status="healthy" infos={info} />
</Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Ini rekomendasi yang Dietela berikan untukmu:
</Text>
<InfoCard
content={
'Hmmm… Kenapa cuma makan besar 1 kali sehari? Makan besar cuma 1 kali dalam sehari berisiko membuat kamu makan berlebihan dan kekurangan zat gizi tertentu Lho! Yuk coba mulai diatur pola makannya, dengan merutinkan waktu makan agar metabolisme kamu lebih baik.'
}
/>
</Section>
<Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Berdasarkan jawaban kuis kamu:
</Text>
<InfoCard content="3 porsi sayur per hari" />
</Section>
</Section>
</ScrollView>
</View>
);
export default MakanBesar;
import React from 'react';
import { render } from '@testing-library/react-native';
import MakanCemilan from '.';
describe('MakanCemilan', () => {
it('renders correctly', () => {
render(<MakanCemilan />);
});
});
import React, { FC } from 'react';
import { View, Text } from 'react-native';
import { AutoImage, InfoCard, ResultCard } from 'components/core';
import { Section } from 'components/layout';
import { layoutStyles, typographyStyles } from 'styles';
import { styles } from '../styles';
import { status_berat_badan } from '../../../../../assets/images';
import { ScrollView } from 'react-native-gesture-handler';
const info = [
{
title: 'status makan besar',
content: 'Sudah baik',
},
];
const MakanCemilan: FC = () => (
<View style={layoutStyles}>
<ScrollView>
<Text style={typographyStyles.headingLarge}>
Frekuensi Makan Cemilan dalam Sehari
</Text>
<Section>
<AutoImage source={status_berat_badan} ratio={0.5} />
</Section>
<Section>
<ResultCard status="healthy" infos={info} />
</Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Ini rekomendasi yang Dietela berikan untukmu:
</Text>
<InfoCard
content={
'Yah kok gak ngemil? Makan cemilan itu penting untuk menjaga kadar gula darah kamu seharian, dengan ngemil gula darah seharian kamu bisa terkontrol sehingga mencegah lemas dan berkurangnya konsentrasi.'
}
/>
</Section>
<Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Berdasarkan jawaban kuis kamu:
</Text>
<InfoCard content="3 porsi sayur per hari" />
</Section>
</Section>
</ScrollView>
</View>
);
export default MakanCemilan;
import React from 'react';
import { render } from '@testing-library/react-native';
import MakanPagi from '.';
describe('MakanPagi', () => {
it('renders correctly', () => {
render(<MakanPagi />);
});
});
import React, { FC } from 'react';
import { View, Text } from 'react-native';
import { AutoImage, InfoCard, ResultCard } from 'components/core';
import { Section } from 'components/layout';
import { layoutStyles, typographyStyles } from 'styles';
import { styles } from '../styles';
import { status_berat_badan } from '../../../../../assets/images';
import { ScrollView } from 'react-native-gesture-handler';
const info = [
{
title: 'status makan pagi',
content: 'Sudah baik',
},
];
const MakanPagi: FC = () => (
<View style={layoutStyles}>
<ScrollView>
<Text style={typographyStyles.headingLarge}>Porsi Makan Pagi</Text>
<Section>
<AutoImage source={status_berat_badan} ratio={0.5} />
</Section>
<Section>
<ResultCard status="healthy" infos={info} />
</Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Ini rekomendasi yang Dietela berikan untukmu:
</Text>
<InfoCard
content={
'Sudah bagus nih, bisa mengisi perut di pagi hari, eittts, tapi artinya kamu perlu melengkapi asupan energi di siang sampai malam hari karena makan paginya cuma sedikit, kamu perlu pengaturan lebih spesifik lagi agak asupan energi kamu seimbang.'
}
/>
</Section>
<Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Berdasarkan jawaban kuis kamu:
</Text>
<InfoCard content="3 porsi sayur per hari" />
</Section>
</Section>
</ScrollView>
</View>
);
export default MakanPagi;
import React from 'react';
import { render } from '@testing-library/react-native';
import StatusBeratBadan from '.';
describe('StatusBeratBadan', () => {
it('renders correctly', () => {
render(<StatusBeratBadan />);
});
});
import React, { FC } from 'react';
import { View, Text } from 'react-native';
import { AutoImage, ResultCard, Statistic } from 'components/core';
import { Section } from 'components/layout';
import { layoutStyles, typographyStyles } from 'styles';
import { styles } from '../styles';
import { status_berat_badan } from '../../../../../assets/images';
import { ScrollView } from 'react-native-gesture-handler';
const info = [
{
title: 'Indeks massa tubuh',
content: '31.6',
},
{
title: 'Status',
content: 'Obesitas 2',
},
];
const StatusBeratBadan: FC = () => (
<View style={layoutStyles}>
<ScrollView>
<Text style={typographyStyles.headingLarge}>Status Berat Badan</Text>
<Section>
<AutoImage source={status_berat_badan} ratio={0.5} />
</Section>
<Section>
<ResultCard status="danger" infos={info} />
</Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Dihitung berdasarkan data:
</Text>
<View style={{ flexDirection: 'row' }}>
<View style={{ flex: 1 }}>
<Statistic title="berat badan" emote="⚖️" content="77 kg" />
</View>
<View style={{ flex: 1 }}>
<Statistic title="tinggi badan" emote="📐" content="156 cm" />
</View>
</View>
</Section>
<Section>
<Text style={[typographyStyles.bodySmall, styles.sectionHeader]}>
Untuk orang dengan tinggi 156 cm, berikut rentang berat badan yang
ideal:
</Text>
<View style={{ flexDirection: 'row' }}>
<View style={{ flex: 1 }}>
<Statistic title="minimal" emote="◀️" content="46.2 kg" />
</View>
<View style={{ flex: 1 }}>
<Statistic title="maksimal" emote="▶️" content="55.9 kg" />
</View>
</View>
<Text style={[typographyStyles.bodySmall, { marginTop: 8 }]}>
Usahakan berat badan kamu masuk ke rentang ideal, ya!
</Text>
</Section>
</ScrollView>
</View>
);
export default StatusBeratBadan;
export { default as StatusBeratBadan } from './StatusBeratBadan';
export { default as KebutuhanEnergiZatGizi } from './KebutuhanEnergiZatGizi';
export { default as KecukupanSayurBuah } from './KecukupanSayurBuah';
export { default as AsupanGGL } from './AsupanGGL';
export { default as MakanBesar } from './MakanBesar';
export { default as MakanCemilan } from './MakanCemilan';
export { default as MakanPagi } from './MakanPagi';
export { default as DetailEnergiSehari } from './DetailEnergiSehari';
export { default as AktivitasFisik } from './AktivitasFisik';
export const quizResult = {
statusGizi: {
kurang: {
display: 'Berat badan kurang',
status: 'warning',
},
normal: {
display: 'Normal',
status: 'healthy',
},
pre_obesitas: {
display: 'Pre-obesitas',
status: 'warning',
},
obesitas_1: {
display: 'Obesitas 1',
status: 'warning',
},
obesitas_2: {
display: 'Obesitas 2',
status: 'danger',
},
},
sayurBuah: {
kurang: {
display: 'Kurang makan sayur dan buah',
status: 'warning',
recommendation: `Yah.. asupan buah & sayur kamu masih kurang nih.\n\nYuk, cari solusi agar kamu bisa konsumsi setidaknya 2 porsi sayur & 3 porsi buah atau sebaliknya per hari.\n\nPokoknya kalau di total kamu perlu 5 porsi buah & sayur per hari.`,
},
cukup: {
display: 'Asupan sayur dan buah sudah cukup',
status: 'healthy',
recommendation: `Selamat! Kamu sudah memenuhi salah satu langkah menuju hidup sehat.\n\nPertahankan untuk konsumsi setidaknya 2 porsi sayur & 3 porsi buah atau sebaliknya per hari ya.\n\nPokoknya kalau di total kamu perlu 5 porsi buah dan sayur per sehari.`,
},
},
asupanGGL: {
cukup: {
display: 'Kurang makan sayur dan buah',
status: 'healthy',
recommendation: `Yah.. asupan buah & sayur kamu masih kurang nih.\n\nYuk, cari solusi agar kamu bisa konsumsi setidaknya 2 porsi sayur & 3 porsi buah atau sebaliknya per hari.\n\nPokoknya kalau di total kamu perlu 5 porsi buah & sayur per hari.`,
},
berlebih: {
display: 'Asupan sayur dan buah sudah cukup',
status: 'warning',
recommendation: `Selamat! Kamu sudah memenuhi salah satu langkah menuju hidup sehat.\n\nPertahankan untuk konsumsi setidaknya 2 porsi sayur & 3 porsi buah atau sebaliknya per hari ya.\n\nPokoknya kalau di total kamu perlu 5 porsi buah dan sayur per sehari.`,
},
},
};
import { StyleSheet } from 'react-native';
export const styles = StyleSheet.create({
view: {
flex: 1,
},
resultImage: {
width: '100%',
resizeMode: 'contain',
},
sectionHeader: {
marginBottom: 8,
},
});
import { StyleSheet } from 'react-native';
export const styles = StyleSheet.create({
view: {
flex: 1,
},
});
......@@ -1307,6 +1307,14 @@
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.3.tgz#2ab0d5da2e5815f94b0b9d4b95d1e5f243ab2ca7"
integrity sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==
"@types/react-native-snap-carousel@^3.8.2":
version "3.8.2"
resolved "https://registry.yarnpkg.com/@types/react-native-snap-carousel/-/react-native-snap-carousel-3.8.2.tgz#31fb91530198183c658db0d23935ca79850419f5"
integrity sha512-ItvLo19gQstxcir6wIXJxwohxdYj9t/lXv+MXfqhwMSYaR+Xa3vOP7b6TYQCe9GqDPH3sEgEg/uH6CLV+fhcWA==
dependencies:
"@types/react" "*"
"@types/react-native" "*"
"@types/react-native-vector-icons@^6.4.6":
version "6.4.6"
resolved "https://registry.yarnpkg.com/@types/react-native-vector-icons/-/react-native-vector-icons-6.4.6.tgz#848e3b14572def56212cafbf5cb1254b445bfb41"
......@@ -2390,6 +2398,11 @@ core-js-pure@^3.0.0:
resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.9.1.tgz#677b322267172bd490e4464696f790cbc355bec5"
integrity sha512-laz3Zx0avrw9a4QEIdmIblnVuJz8W51leY9iLThatCsFawWxC3sE4guASC78JbCin+DkwMpCdp1AVAuzL/GN7A==
core-js@^1.0.0:
version "1.2.7"
resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
integrity sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=
core-js@^2.4.1:
version "2.6.12"
resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.12.tgz#d9333dfa7b065e347cc5682219d6f690859cc2ec"
......@@ -3195,6 +3208,19 @@ fbjs-scripts@^1.1.0:
semver "^5.1.0"
through2 "^2.0.0"
fbjs@^0.8.4:
version "0.8.17"
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
integrity sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=
dependencies:
core-js "^1.0.0"
isomorphic-fetch "^2.1.1"
loose-envify "^1.0.0"
object-assign "^4.1.0"
promise "^7.1.1"
setimmediate "^1.0.5"
ua-parser-js "^0.7.18"
fbjs@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-1.0.0.tgz#52c215e0883a3c86af2a7a776ed51525ae8e0a5a"
......@@ -5972,7 +5998,7 @@ prompts@^2.0.1:
kleur "^3.0.3"
sisteransi "^1.0.5"
prop-types@^15.5.10, prop-types@^15.6.2, prop-types@^15.7.2:
prop-types@^15.5.10, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
version "15.7.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
......@@ -6029,6 +6055,14 @@ range-parser@~1.2.1:
resolved "https://registry.yarnpkg.com/range-parser/-/range-parser-1.2.1.tgz#3cf37023d199e1c24d1a55b84800c2f3e6468031"
integrity sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==
react-addons-shallow-compare@15.6.2:
version "15.6.2"
resolved "https://registry.yarnpkg.com/react-addons-shallow-compare/-/react-addons-shallow-compare-15.6.2.tgz#198a00b91fc37623db64a28fd17b596ba362702f"
integrity sha1-GYoAuR/DdiPbZKKP0XtZa6NicC8=
dependencies:
fbjs "^0.8.4"
object-assign "^4.1.0"
react-devtools-core@^4.6.0:
version "4.10.1"
resolved "https://registry.yarnpkg.com/react-devtools-core/-/react-devtools-core-4.10.1.tgz#6d57db291aeac9cc45ef9fb4636dd2ab97490daf"
......@@ -6073,6 +6107,11 @@ react-native-elements@^3.3.2:
react-native-ratings "^7.3.0"
react-native-size-matters "^0.3.1"
react-native-fullwidth-image@^0.1.3:
version "0.1.3"
resolved "https://registry.yarnpkg.com/react-native-fullwidth-image/-/react-native-fullwidth-image-0.1.3.tgz#ad4d712e7e504660628d01649437d4eab49731ea"
integrity sha512-nFe5EAEPlPaT1vw1abwnNmSZN9oLMzNXJAKKxeuWqPI9L7rGhXhpZH4KEBUzbqkk+58TjdT9d2bf070/GB4PGQ==
react-native-gesture-handler@^1.10.3:
version "1.10.3"
resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.10.3.tgz#942bbf2963bbf49fa79593600ee9d7b5dab3cfc0"
......@@ -6122,6 +6161,13 @@ react-native-size-matters@^0.3.1:
resolved "https://registry.yarnpkg.com/react-native-size-matters/-/react-native-size-matters-0.3.1.tgz#24d0cfc335a2c730f6d58bd7b43ea5a41be4b49f"
integrity sha512-mKOfBLIBFBcs9br1rlZDvxD5+mAl8Gfr5CounwJtxI6Z82rGrMO+Kgl9EIg3RMVf3G855a85YVqHJL2f5EDRlw==
react-native-snap-carousel@^3.9.1:
version "3.9.1"
resolved "https://registry.yarnpkg.com/react-native-snap-carousel/-/react-native-snap-carousel-3.9.1.tgz#6fd9bd8839546c2c6043a41d2035afbc6fe0443e"
integrity sha512-xWEGusacIgK1YaDXLi7Gao2+ISLoGPVEBR8fcMf4tOOJQufutlNwkoLu0l6B8Qgsrre0nTxoVZikRgGRDWlLaQ==
dependencies:
prop-types "^15.6.1"
react-addons-shallow-compare "15.6.2"
react-native-toast-message@^1.4.9:
version "1.4.9"
resolved "https://registry.yarnpkg.com/react-native-toast-message/-/react-native-toast-message-1.4.9.tgz#47f33ac312fe2aee5dbdd4ae14745fa0d354102e"
......
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