ammar/cally
1
0
Fork 0
mirror of https://github.com/urosran/cally.git synced 2025-07-15 09:45:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Small fixes

Browse Source
This commit is contained in:
Milan Paunovic
2024-10-31 21:28:23 +01:00
parent fda1287011
commit ca5df87f3d
5 changed files with 244 additions and 195 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
components/pages/brain_dump/AddBrainDump.tsx
View File

@ -1,18 +1,10 @@
import {
View,
Text,
Button,
TextField,
TextFieldRef,
TouchableOpacity,
} from "react-native-ui-lib";
import React, { useEffect, useState, useRef } from "react";
import { Dialog } from "react-native-ui-lib";
import { PanningDirectionsEnum } from "react-native-ui-lib/src/incubator/panView";
import { Dimensions, Keyboard, StyleSheet } from "react-native";
import {Button, Dialog, TextField, TextFieldRef, TouchableOpacity, View,} from "react-native-ui-lib";
import React, {useEffect, useRef, useState} from "react";
import {PanningDirectionsEnum} from "react-native-ui-lib/src/incubator/panView";
import {Dimensions, StyleSheet} from "react-native";
import DropModalIcon from "@/assets/svgs/DropModalIcon";
import { useBrainDumpContext } from "@/contexts/DumpContext";
import {useBrainDumpContext} from "@/contexts/DumpContext";
import KeyboardManager from "react-native-keyboard-manager";
@ -23,13 +15,13 @@ interface IAddBrainDumpProps {
const AddBrainDump = ({
addBrainDumpProps,
}: {
}: {
addBrainDumpProps: IAddBrainDumpProps;
}) => {
const { addBrainDump } = useBrainDumpContext();
const {addBrainDump} = useBrainDumpContext();
const [dumpTitle, setDumpTitle] = useState<string>("");
const [dumpDesc, setDumpDesc] = useState<string>("");
const { width } = Dimensions.get("screen");
const {width} = Dimensions.get("screen");
// Refs for the two TextFields
@ -42,14 +34,16 @@ const AddBrainDump = ({
}, [addBrainDumpProps.isVisible]);
useEffect(() => {
if (addBrainDumpProps.isVisible) {
setTimeout(() => {
titleRef?.current?.focus()
}, 500)
}, []);
}
}, [addBrainDumpProps.isVisible]);
useEffect(() => {
KeyboardManager.setEnableAutoToolbar(false);
},[])
}, [])
return (
<Dialog
@ -71,14 +65,18 @@ const AddBrainDump = ({
}}
/>
<TouchableOpacity onPress={() => addBrainDumpProps.setIsVisible(false)}>
<DropModalIcon style={{ marginTop: 15 }} />
<DropModalIcon style={{marginTop: 15}}/>
</TouchableOpacity>
<Button
color="#05a8b6"
label="Save"
style={styles.topBtn}
onPress={() => {
addBrainDump({ id: 99, title: dumpTitle.trimEnd().trimStart(), description: dumpDesc.trimEnd().trimStart() });
addBrainDump({
id: 99,
title: dumpTitle.trimEnd().trimStart(),
description: dumpDesc.trimEnd().trimStart()
});
addBrainDumpProps.setIsVisible(false);
}}
/>
@ -100,7 +98,7 @@ const AddBrainDump = ({
blurOnSubmit={false} // Keep the keyboard open when moving focus
returnKeyType="next"
/>
<View height={2} backgroundColor="#b3b3b3" width={"100%"} marginB-20 />
<View height={2} backgroundColor="#b3b3b3" width={"100%"} marginB-20/>
<TextField
ref={descriptionRef}
value={dumpDesc}

15
components/pages/brain_dump/MoveBrainDump.tsx
View File

@ -1,11 +1,11 @@
import React, { useEffect, useState } from "react";
import React, {useEffect, useRef, useState} from "react";
import {
Button,
Dialog,
View,
Text,
TextField,
TouchableOpacity,
TouchableOpacity, TextFieldRef,
} from "react-native-ui-lib";
import { Dimensions, StyleSheet } from "react-native";
import { PanningDirectionsEnum } from "react-native-ui-lib/src/incubator/panView";
@ -30,6 +30,7 @@ const MoveBrainDump = (props: {
props.item.description
);
const [modalVisible, setModalVisible] = useState<boolean>(false);
const descriptionRef = useRef<TextFieldRef>(null)
const { width } = Dimensions.get("screen");
@ -37,6 +38,14 @@ const MoveBrainDump = (props: {
updateBrainDumpItem(props.item.id, { description: description });
}, [description]);
useEffect(() => {
if (props.isVisible) {
setTimeout(() => {
descriptionRef?.current?.focus()
}, 500)
}
}, [props.isVisible]);
const showConfirmationDialog = () => {
setModalVisible(true);
};
@ -112,7 +121,6 @@ const MoveBrainDump = (props: {
<TextField
textAlignVertical="top"
multiline
autoFocus
fieldStyle={{
width: "94%",
}}
@ -123,6 +131,7 @@ const MoveBrainDump = (props: {
onChangeText={(value) => {
setDescription(value);
}}
ref={descriptionRef}
returnKeyType="default"
/>
</View>

36
components/pages/main/SignInPage.tsx
View File

@ -1,7 +1,16 @@
import {Button, ButtonSize, Dialog, Text, TextField, TextFieldRef, View,} from "react-native-ui-lib";
import {
Button,
ButtonSize, Colors,
Dialog,
KeyboardAwareScrollView, LoaderScreen, Modal,
Text,
TextField,
TextFieldRef,
View,
} from "react-native-ui-lib";
import React, {useRef, useState} from "react";
import {useSignIn} from "@/hooks/firebase/useSignIn";
import {StyleSheet} from "react-native";
import {KeyboardAvoidingView, Platform, StyleSheet} from "react-native";
import Toast from "react-native-toast-message";
import {useLoginWithQrCode} from "@/hooks/firebase/useLoginWithQrCode";
import {Camera, CameraView} from "expo-camera";
@ -19,8 +28,10 @@ const SignInPage = ({
const [showCameraDialog, setShowCameraDialog] = useState<boolean>(false);
const passwordRef = useRef<TextFieldRef>(null);
const {mutateAsync: signIn, error, isError} = useSignIn();
const {mutateAsync: signInWithQrCode} = useLoginWithQrCode();
const {mutateAsync: signIn, error, isError, isLoading: isSigninIn} = useSignIn();
const {mutateAsync: signInWithQrCode, isLoading: isQRCodeLoggingIn} = useLoginWithQrCode();
const isLoading = isSigninIn || isQRCodeLoggingIn
const handleSignIn = async () => {
await signIn({email, password});
@ -64,7 +75,12 @@ const SignInPage = ({
};
return (
<View padding-10 centerV height={"100%"}>
<View padding-10 centerV height={"100%%"} style={{justifyContent: "center"}}>
<KeyboardAvoidingView
contentContainerStyle={{ justifyContent:"center"}}
keyboardVerticalOffset={50}
behavior={Platform.OS === "ios" ? "padding" : "height"}
>
<TextField
placeholder="Email"
keyboardType={"email-address"}
@ -73,6 +89,8 @@ const SignInPage = ({
defaultValue={email}
onChangeText={setEmail}
style={styles.textfield}
autoComplete={"email"}
autoCorrect={false}
onSubmitEditing={() => {
// Move focus to the description field
passwordRef.current?.focus();
@ -111,6 +129,7 @@ const SignInPage = ({
style={{marginBottom: 20, height: 50}}
backgroundColor="#fd1775"
/>
{isError && (
<Text center style={{marginBottom: 20}}>{`${
error?.toString()?.split("]")?.[1]
@ -155,6 +174,7 @@ const SignInPage = ({
color="#fd1775"
/>
</View>
</KeyboardAvoidingView>
{/* Camera Dialog */}
<Dialog
@ -185,6 +205,12 @@ const SignInPage = ({
style={{margin: 10, marginBottom: 30}}
/>
</Dialog>
{isLoading && (
<LoaderScreen overlay message={"Signing in..."} backgroundColor={Colors.white} color={Colors.grey40}/>
)}
</View>
);
};

22
components/pages/main/SignUpPage.tsx
View File

@ -55,6 +55,12 @@ const SignUpPage = ({
lnameRef.current?.focus();
}}
blurOnSubmit={false}
accessibilityLabel="First name input"
accessibilityHint="Enter your first name"
accessible
returnKeyType="next"
textContentType="givenName"
importantForAccessibility="yes"
/>
<TextField
ref={lnameRef}
@ -66,17 +72,27 @@ const SignUpPage = ({
emailRef.current?.focus();
}}
blurOnSubmit={false}
accessibilityLabel="Last name input"
accessibilityHint="Enter your last name"
accessible
returnKeyType="next"
textContentType="familyName"
importantForAccessibility="yes"
/>
<TextField
ref={emailRef}
placeholder="Email"
value={email}
keyboardType={"email-address"}
returnKeyType={"next"}
textContentType={"emailAddress"}
defaultValue={email}
onChangeText={setEmail}
style={styles.textfield}
autoComplete={"email"}
autoCorrect={false}
ref={emailRef}
onSubmitEditing={() => {
passwordRef.current?.focus();
}}
blurOnSubmit={false}
/>
<View
centerV

2
components/pages/todos/AddChore.tsx
View File

@ -22,7 +22,7 @@ const AddChore = () => {
>
<View style={styles.buttonContainer}>
<Button
marginH-20
marginB-30
size={ButtonSize.large}
style={styles.button}
onPress={() => setIsVisible(!isVisible)}