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

upd: redesign

Browse Source 
Deskripsi:
- login dan konfirmasi kode otp
- firebase code env

No Issues
This commit is contained in:
amaliadwiy
2026-02-14 15:43:38 +08:00
parent 6ca935483a
commit 8c63c08bc3
16 changed files with 128 additions and 98 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
components/auth/viewLogin.tsx
View File

@@ -53,11 +53,10 @@ export default function ViewLogin({ onValidate }: Props) {
return (
<SafeAreaView style={{ flex: 1, backgroundColor: colors.background }}>
<StatusBar style={theme === 'dark' ? 'light' : 'dark'} translucent={false} backgroundColor={colors.background} />
<ToastCustom />
<View style={[Styles.p20, Styles.h100]}>
<View style={{ alignItems: "center", marginTop: 70, marginBottom: 50 }}>
<Image
source={require("../../assets/images/logo.png")}
source={theme === 'dark' ? require("../../assets/images/logo-dark.png") : require("../../assets/images/logo.png")}
style={[{ width: 300, height: 150 }]}
width={270}
height={110}
@@ -71,18 +70,28 @@ export default function ViewLogin({ onValidate }: Props) {
}}
type="numeric"
placeholder="XXX-XXX-XXXX"
round
itemLeft={<Text style={[Platform.OS === 'ios' && Styles.mt02]}>+62</Text>}
info="Kami akan mengirim kode verifikasi melalui WhatsApp, guna mengonfirmasikan nomor Anda." />
<ButtonForm
text="MASUK"
onPress={() => { handleCheckPhone() }}
disabled={disableLogin}
/>
<View style={[{ width: '50%', alignSelf: 'center' }]}>
<ButtonForm
text="MASUK"
onPress={() => { handleCheckPhone() }}
disabled={disableLogin}
/>
</View>
<View style={{ flex: 1 }} />
<View style={{ alignItems: 'center' }}>
<Image
source={theme === 'dark' ? require("../../assets/images/cogniti-dark.png") : require("../../assets/images/cogniti-light.png")}
style={{ width: 86, height: 27 }}
resizeMode="contain"
/>
</View>
</View>
{
loadingLogin && <ModalLoading isVisible={true} setVisible={setLoadingLogin} />
}
<ToastCustom position="bottom" />
</SafeAreaView>
)

34
components/auth/viewVerification.tsx
View File

@@ -5,7 +5,7 @@ import { useTheme } from "@/providers/ThemeProvider";
import AsyncStorage from "@react-native-async-storage/async-storage";
import { StatusBar } from "expo-status-bar";
import { useState } from "react";
import { Image, Platform, View } from "react-native";
import { Image, SafeAreaView, View } from "react-native";
import { OtpInput } from "react-native-otp-entry";
import Toast from 'react-native-toast-message';
import { ButtonForm } from "../buttonForm";
@@ -58,13 +58,12 @@ export default function ViewVerification({ phone, otp }: Props) {
}
return (
<>
<SafeAreaView style={{ flex: 1, backgroundColor: colors.background }}>
<StatusBar style={theme === 'dark' ? 'light' : 'dark'} translucent={false} backgroundColor={colors.background} />
<ToastCustom />
<View style={[Styles.wrapLogin, { backgroundColor: colors.background }]} >
<View style={[Styles.p20, Styles.h100]} >
<View style={{ alignItems: "center", marginTop: 70, marginBottom: 50 }}>
<Image
source={require("../../assets/images/logo.png")}
source={theme === 'dark' ? require("../../assets/images/logo-dark.png") : require("../../assets/images/logo.png")}
style={[{ width: 300, height: 150 }]}
width={270}
height={110}
@@ -90,14 +89,25 @@ export default function ViewVerification({ phone, otp }: Props) {
pinCodeTextStyle: { color: colors.text }
}}
/>
<ButtonForm
text="SUBMIT"
onPress={() => { onCheckOtp() }}
/>
<Text style={[Styles.textInformation, Styles.mt05, Styles.cDefault, { textAlign: 'center', color: colors.tint }]}>
Tidak Menerima kode verifikasi? <Text onPress={() => { resendOtp() }}>Kirim Ulang</Text>
<View style={[{ width: '50%', alignSelf: 'center' }]}>
<ButtonForm
text="SUBMIT"
onPress={() => { onCheckOtp() }}
/>
</View>
<Text style={[Styles.textInformation, Styles.mt05, { textAlign: 'center', color: colors.dimmed }]}>
Tidak Menerima kode verifikasi? <Text onPress={() => { resendOtp() }} style={[{ color: colors.tint }]}>Kirim Ulang</Text>
</Text>
<View style={{ flex: 1 }} />
<View style={[{ alignItems: 'center' }]}>
<Image
source={theme === 'dark' ? require("../../assets/images/cogniti-dark.png") : require("../../assets/images/cogniti-light.png")}
style={{ width: 86, height: 27 }}
resizeMode="contain"
/>
</View>
</View>
</>
<ToastCustom position="bottom" />
</SafeAreaView>
)
}