mirror of
https://github.com/urosran/cally.git
synced 2025-07-16 01:56:16 +00:00
added Feedback page, added braindump backend
This commit is contained in:
@ -7,7 +7,7 @@ import {
|
||||
DrawerItemList,
|
||||
} from "@react-navigation/drawer";
|
||||
import { Button, View, Text, ButtonSize } from "react-native-ui-lib";
|
||||
import { ImageBackground, StyleSheet } from "react-native";
|
||||
import { Dimensions, ImageBackground, StyleSheet } from "react-native";
|
||||
import Feather from "@expo/vector-icons/Feather";
|
||||
import DrawerButton from "@/components/shared/DrawerButton";
|
||||
import {
|
||||
@ -30,6 +30,7 @@ import {
|
||||
toDosPageIndex,
|
||||
userSettingsView,
|
||||
} from "@/components/pages/calendar/atoms";
|
||||
import FeedbackNavIcon from "@/assets/svgs/FeedbackNavIcon";
|
||||
|
||||
export default function TabLayout() {
|
||||
const { mutateAsync: signOut } = useSignOut();
|
||||
@ -52,8 +53,8 @@ export default function TabLayout() {
|
||||
}}
|
||||
drawerContent={(props) => {
|
||||
return (
|
||||
<DrawerContentScrollView {...props} style={{ height: "100%" }}>
|
||||
<View centerV margin-30 row>
|
||||
<DrawerContentScrollView {...props} style={{}}>
|
||||
<View centerV marginH-30 marginT-20 marginB-20 row>
|
||||
<ImageBackground
|
||||
source={require("../../assets/images/splash.png")}
|
||||
style={{
|
||||
@ -98,6 +99,19 @@ export default function TabLayout() {
|
||||
}}
|
||||
icon={<NavGroceryIcon />}
|
||||
/>
|
||||
<DrawerButton
|
||||
color="#ea156d"
|
||||
title={"Feedback"}
|
||||
bgColor={"#fdedf4"}
|
||||
pressFunc={() => {
|
||||
props.navigation.navigate("feedback");
|
||||
setPageIndex(0);
|
||||
setToDosIndex(0);
|
||||
setUserView(true);
|
||||
setIsFamilyView(false);
|
||||
}}
|
||||
icon={<FeedbackNavIcon />}
|
||||
/>
|
||||
</View>
|
||||
<View style={{ flex: 1 }}>
|
||||
{/*<DrawerButton
|
||||
@ -177,9 +191,9 @@ export default function TabLayout() {
|
||||
<Button
|
||||
size={ButtonSize.large}
|
||||
marginH-30
|
||||
marginT-12
|
||||
paddingV-15
|
||||
style={{
|
||||
marginTop: "42%",
|
||||
backgroundColor: "transparent",
|
||||
borderWidth: 1.3,
|
||||
borderColor: "#fd1775",
|
||||
@ -243,6 +257,10 @@ export default function TabLayout() {
|
||||
title: "To-Dos",
|
||||
}}
|
||||
/>
|
||||
<Drawer.Screen
|
||||
name="feedback"
|
||||
options={{ drawerLabel: "Feedback", title: "Feedback" }}
|
||||
/>
|
||||
</Drawer>
|
||||
);
|
||||
}
|
||||
|
5
app/(auth)/feedback/_layout.tsx
Normal file
5
app/(auth)/feedback/_layout.tsx
Normal file
@ -0,0 +1,5 @@
|
||||
import {Stack} from "expo-router";
|
||||
|
||||
export default function StackLayout () {
|
||||
return <Stack screenOptions={{headerShown: false}}/>
|
||||
}
|
13
app/(auth)/feedback/index.tsx
Normal file
13
app/(auth)/feedback/index.tsx
Normal file
@ -0,0 +1,13 @@
|
||||
import FeedbackPage from "@/components/pages/feedback/FeedbackPage";
|
||||
import { FeedbackProvider } from "@/contexts/FeedbackContext";
|
||||
import { View } from "react-native-ui-lib";
|
||||
|
||||
export default function Screen() {
|
||||
return (
|
||||
<FeedbackProvider>
|
||||
<View>
|
||||
<FeedbackPage />
|
||||
</View>
|
||||
</FeedbackProvider>
|
||||
);
|
||||
}
|
20
assets/svgs/FeedbackNavIcon.tsx
Normal file
20
assets/svgs/FeedbackNavIcon.tsx
Normal file
@ -0,0 +1,20 @@
|
||||
import * as React from "react"
|
||||
import Svg, { SvgProps, Path } from "react-native-svg"
|
||||
const FeedbackNavIcon = (props: SvgProps) => (
|
||||
<Svg
|
||||
width={25}
|
||||
height={25}
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
{...props}
|
||||
>
|
||||
<Path
|
||||
stroke="#ea156d"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={1.5}
|
||||
d="M10.5 21H4a7.001 7.001 0 0 1 6-6.93m6.498 2.142c-.7-.78-1.867-.989-2.744-.275-.877.713-1 1.906-.311 2.75.388.476 1.312 1.311 2.042 1.948.347.302.52.453.73.515.178.053.387.053.566 0 .21-.061.382-.213.729-.515.73-.637 1.654-1.472 2.043-1.948.688-.844.58-2.044-.312-2.75-.892-.706-2.044-.504-2.743.275ZM15 7a4 4 0 1 1-8 0 4 4 0 0 1 8 0Z"
|
||||
/>
|
||||
</Svg>
|
||||
)
|
||||
export default FeedbackNavIcon
|
157
components/pages/feedback/AddFeedback.tsx
Normal file
157
components/pages/feedback/AddFeedback.tsx
Normal file
@ -0,0 +1,157 @@
|
||||
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, Platform, StyleSheet } from "react-native";
|
||||
|
||||
import DropModalIcon from "@/assets/svgs/DropModalIcon";
|
||||
import { useBrainDumpContext } from "@/contexts/DumpContext";
|
||||
import KeyboardManager from "react-native-keyboard-manager";
|
||||
import { useFeedbackContext } from "@/contexts/FeedbackContext";
|
||||
|
||||
interface IAddFeedbackProps {
|
||||
isVisible: boolean;
|
||||
setIsVisible: (value: boolean) => void;
|
||||
}
|
||||
|
||||
const AddFeedback = ({
|
||||
addFeedbackProps,
|
||||
}: {
|
||||
addFeedbackProps: IAddFeedbackProps;
|
||||
}) => {
|
||||
const { addFeedback } = useFeedbackContext();
|
||||
const [feedback, setFeedback] = useState<string>("");
|
||||
const [feedbackTitle, setFeedbackTitle] = useState<string>("");
|
||||
const { width } = Dimensions.get("screen");
|
||||
|
||||
const descriptionRef = useRef<TextFieldRef>(null);
|
||||
const titleRef = useRef<TextFieldRef>(null);
|
||||
|
||||
useEffect(() => {
|
||||
setFeedback("");
|
||||
}, [addFeedbackProps.isVisible]);
|
||||
|
||||
useEffect(() => {
|
||||
if (addFeedbackProps.isVisible) {
|
||||
setTimeout(() => {
|
||||
titleRef?.current?.focus();
|
||||
}, 500);
|
||||
}
|
||||
}, [addFeedbackProps.isVisible]);
|
||||
|
||||
useEffect(() => {
|
||||
if (Platform.OS === "ios") KeyboardManager.setEnableAutoToolbar(false);
|
||||
|
||||
setFeedbackTitle("");
|
||||
setFeedback("");
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
bottom={true}
|
||||
height={"90%"}
|
||||
width={width}
|
||||
panDirection={PanningDirectionsEnum.DOWN}
|
||||
onDismiss={() => addFeedbackProps.setIsVisible(false)}
|
||||
containerStyle={styles.dialogContainer}
|
||||
visible={addFeedbackProps.isVisible}
|
||||
>
|
||||
<View row spread style={styles.topBtns} marginB-20>
|
||||
<Button
|
||||
color="#05a8b6"
|
||||
label="Cancel"
|
||||
style={styles.topBtn}
|
||||
onPress={() => {
|
||||
addFeedbackProps.setIsVisible(false);
|
||||
}}
|
||||
/>
|
||||
<TouchableOpacity onPress={() => addFeedbackProps.setIsVisible(false)}>
|
||||
<DropModalIcon style={{ marginTop: 15 }} />
|
||||
</TouchableOpacity>
|
||||
<Button
|
||||
color="#05a8b6"
|
||||
label="Save"
|
||||
style={styles.topBtn}
|
||||
onPress={() => {
|
||||
addFeedback({
|
||||
id: 99,
|
||||
|
||||
title: feedbackTitle.trimEnd().trimStart(),
|
||||
|
||||
text: feedback.trimEnd().trimStart(),
|
||||
});
|
||||
addFeedbackProps.setIsVisible(false);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
<View marginH-20>
|
||||
<TextField
|
||||
value={feedbackTitle}
|
||||
ref={titleRef}
|
||||
placeholder="Set Title"
|
||||
text60R
|
||||
onChangeText={(text) => {
|
||||
setFeedbackTitle(text);
|
||||
}}
|
||||
onSubmitEditing={() => {
|
||||
descriptionRef.current?.focus();
|
||||
}}
|
||||
style={styles.title}
|
||||
blurOnSubmit={false}
|
||||
returnKeyType="next"
|
||||
/>
|
||||
<View height={2} backgroundColor="#b3b3b3" width={"100%"} marginB-20 />
|
||||
<TextField
|
||||
ref={descriptionRef}
|
||||
value={feedback}
|
||||
placeholder="Write Description"
|
||||
text70
|
||||
onChangeText={(text) => {
|
||||
setFeedback(text);
|
||||
}}
|
||||
style={styles.description}
|
||||
multiline
|
||||
numberOfLines={4}
|
||||
maxLength={255}
|
||||
onEndEditing={() => {
|
||||
descriptionRef.current?.blur();
|
||||
}}
|
||||
returnKeyType="done"
|
||||
/>
|
||||
</View>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
dialogContainer: {
|
||||
borderTopRightRadius: 15,
|
||||
borderTopLeftRadius: 15,
|
||||
backgroundColor: "white",
|
||||
padding: 0,
|
||||
paddingTop: 3,
|
||||
margin: 0,
|
||||
},
|
||||
topBtns: {},
|
||||
topBtn: {
|
||||
backgroundColor: "white",
|
||||
color: "#05a8b6",
|
||||
},
|
||||
title: {
|
||||
fontSize: 22,
|
||||
fontFamily: "Manrope_500Medium",
|
||||
},
|
||||
description: {
|
||||
fontFamily: "Manrope_400Regular",
|
||||
fontSize: 14,
|
||||
textAlignVertical: "top",
|
||||
},
|
||||
});
|
||||
|
||||
export default AddFeedback;
|
196
components/pages/feedback/EditFeedback.tsx
Normal file
196
components/pages/feedback/EditFeedback.tsx
Normal file
@ -0,0 +1,196 @@
|
||||
import React, { useEffect, useRef, useState } from "react";
|
||||
import {
|
||||
Button,
|
||||
Dialog,
|
||||
View,
|
||||
Text,
|
||||
TextField,
|
||||
TouchableOpacity,
|
||||
TextFieldRef,
|
||||
} from "react-native-ui-lib";
|
||||
import { Dimensions, StyleSheet } from "react-native";
|
||||
import { PanningDirectionsEnum } from "react-native-ui-lib/src/incubator/panView";
|
||||
import PenIcon from "@/assets/svgs/PenIcon";
|
||||
import BinIcon from "@/assets/svgs/BinIcon";
|
||||
import DropModalIcon from "@/assets/svgs/DropModalIcon";
|
||||
import CloseXIcon from "@/assets/svgs/CloseXIcon";
|
||||
import NavCalendarIcon from "@/assets/svgs/NavCalendarIcon";
|
||||
import NavToDosIcon from "@/assets/svgs/NavToDosIcon";
|
||||
import RemindersIcon from "@/assets/svgs/RemindersIcon";
|
||||
import MenuIcon from "@/assets/svgs/MenuIcon";
|
||||
import { IFeedback, useFeedbackContext } from "@/contexts/FeedbackContext";
|
||||
import FeedbackDialog from "./FeedbackDialog";
|
||||
|
||||
const EditFeedback = (props: {
|
||||
item: IFeedback;
|
||||
isVisible: boolean;
|
||||
setIsVisible: (value: boolean) => void;
|
||||
}) => {
|
||||
const { updateFeedback, deleteFeedback } = useFeedbackContext();
|
||||
const [text, setText] = useState<string>(props.item.text);
|
||||
const [modalVisible, setModalVisible] = useState<boolean>(false);
|
||||
const textRef = useRef<TextFieldRef>(null);
|
||||
|
||||
const { width } = Dimensions.get("screen");
|
||||
|
||||
useEffect(() => {
|
||||
setText(props.item.text);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (props.isVisible) {
|
||||
setTimeout(() => {
|
||||
textRef?.current?.focus();
|
||||
}, 500);
|
||||
}
|
||||
}, [props.isVisible]);
|
||||
|
||||
const showConfirmationDialog = () => {
|
||||
setModalVisible(true);
|
||||
};
|
||||
|
||||
const handleDeleteNote = () => {
|
||||
deleteFeedback(props.item.id);
|
||||
};
|
||||
|
||||
const hideConfirmationDialog = () => {
|
||||
setModalVisible(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
bottom={true}
|
||||
height={"90%"}
|
||||
width={width}
|
||||
panDirection={PanningDirectionsEnum.DOWN}
|
||||
onDismiss={() => props.setIsVisible(false)}
|
||||
containerStyle={{
|
||||
borderRadius: 15,
|
||||
borderBottomLeftRadius: 0,
|
||||
borderBottomRightRadius: 0,
|
||||
backgroundColor: "white",
|
||||
width: "100%",
|
||||
alignSelf: "stretch",
|
||||
padding: 10,
|
||||
paddingTop: 3,
|
||||
margin: 0,
|
||||
}}
|
||||
visible={props.isVisible}
|
||||
>
|
||||
<View center paddingT-8>
|
||||
<TouchableOpacity onPress={() => props.setIsVisible(false)}>
|
||||
<DropModalIcon />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
<View row spread paddingH-10 paddingB-15>
|
||||
<Button
|
||||
color="#05a8b6"
|
||||
style={styles.topBtn}
|
||||
iconSource={() => <CloseXIcon />}
|
||||
onPress={() => {
|
||||
props.setIsVisible(false);
|
||||
}}
|
||||
/>
|
||||
<View row>
|
||||
<Button
|
||||
style={styles.topBtn}
|
||||
marginR-10
|
||||
iconSource={() => <PenIcon />}
|
||||
onPress={() => {
|
||||
console.log("selview");
|
||||
updateFeedback(props.item.id, { text: text });
|
||||
props.setIsVisible(false);
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
style={styles.topBtn}
|
||||
marginL-5
|
||||
iconSource={() => <BinIcon />}
|
||||
onPress={() => {
|
||||
showConfirmationDialog();
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<View centerH>
|
||||
<Text style={styles.title}>{props.item.title} </Text>
|
||||
</View>
|
||||
<View style={styles.divider} />
|
||||
<View row gap-5 paddingR-20>
|
||||
<View paddingT-8 marginR-5>
|
||||
<MenuIcon width={20} height={12} />
|
||||
</View>
|
||||
<TextField
|
||||
textAlignVertical="top"
|
||||
multiline
|
||||
style={styles.description}
|
||||
placeholder="Add description"
|
||||
numberOfLines={3}
|
||||
value={text}
|
||||
onChangeText={(value) => {
|
||||
setText(value);
|
||||
}}
|
||||
ref={textRef}
|
||||
returnKeyType="done"
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.divider} />
|
||||
<FeedbackDialog
|
||||
visible={modalVisible}
|
||||
title={props.item.title}
|
||||
onDismiss={hideConfirmationDialog}
|
||||
onConfirm={handleDeleteNote}
|
||||
/>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
divider: { height: 1, backgroundColor: "#e4e4e4", marginVertical: 15 },
|
||||
gradient: {
|
||||
height: "25%",
|
||||
position: "absolute",
|
||||
bottom: 0,
|
||||
width: "100%",
|
||||
},
|
||||
buttonContainer: {
|
||||
position: "absolute",
|
||||
bottom: 25,
|
||||
width: "100%",
|
||||
},
|
||||
button: {
|
||||
backgroundColor: "rgb(253, 23, 117)",
|
||||
paddingVertical: 20,
|
||||
},
|
||||
topBtn: {
|
||||
backgroundColor: "white",
|
||||
color: "#05a8b6",
|
||||
marginTop: -3,
|
||||
},
|
||||
rotateSwitch: {
|
||||
marginLeft: 35,
|
||||
marginBottom: 10,
|
||||
marginTop: 25,
|
||||
},
|
||||
optionsReg: {
|
||||
fontSize: 16,
|
||||
fontFamily: "PlusJakartaSans_400Regular",
|
||||
},
|
||||
optionsBold: {
|
||||
fontSize: 16,
|
||||
fontFamily: "PlusJakartaSans_600SemiBold",
|
||||
},
|
||||
optionsIcon: {
|
||||
marginRight: 10,
|
||||
},
|
||||
title: {
|
||||
fontSize: 22,
|
||||
fontFamily: "Manrope_500Medium",
|
||||
},
|
||||
description: {
|
||||
fontFamily: "Manrope_400Regular",
|
||||
fontSize: 14,
|
||||
},
|
||||
});
|
||||
|
||||
export default EditFeedback;
|
50
components/pages/feedback/Feedback.tsx
Normal file
50
components/pages/feedback/Feedback.tsx
Normal file
@ -0,0 +1,50 @@
|
||||
import { View, Text } from "react-native-ui-lib";
|
||||
import React, { useState } from "react";
|
||||
import {
|
||||
TouchableWithoutFeedback,
|
||||
} from "react-native-gesture-handler";
|
||||
import { IFeedback } from "@/contexts/FeedbackContext";
|
||||
import EditFeedback from "./EditFeedback";
|
||||
|
||||
const Feedback = (props: { item: IFeedback }) => {
|
||||
const [isVisible, setIsVisible] = useState<boolean>(false);
|
||||
|
||||
return (
|
||||
<View>
|
||||
<TouchableWithoutFeedback onPress={() => setIsVisible(true)}>
|
||||
<View
|
||||
backgroundColor="white"
|
||||
marginV-5
|
||||
paddingH-13
|
||||
paddingV-10
|
||||
style={{ borderRadius: 15, elevation: 2 }}
|
||||
>
|
||||
<Text
|
||||
text70B
|
||||
style={{ fontSize: 15, fontFamily: "Manrope_600SemiBold" }}
|
||||
marginB-8
|
||||
>
|
||||
{props.item.title}
|
||||
</Text>
|
||||
<Text
|
||||
text70
|
||||
style={{
|
||||
fontSize: 13,
|
||||
fontFamily: "Manrope_400Regular",
|
||||
color: "#5c5c5c",
|
||||
}}
|
||||
>
|
||||
{props.item.text}
|
||||
</Text>
|
||||
</View>
|
||||
</TouchableWithoutFeedback>
|
||||
<EditFeedback
|
||||
item={props.item}
|
||||
isVisible={isVisible}
|
||||
setIsVisible={setIsVisible}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
export default Feedback;
|
81
components/pages/feedback/FeedbackDialog.tsx
Normal file
81
components/pages/feedback/FeedbackDialog.tsx
Normal file
@ -0,0 +1,81 @@
|
||||
import React from "react";
|
||||
import { Dialog, Button, Text, View } from "react-native-ui-lib";
|
||||
import { StyleSheet } from "react-native";
|
||||
|
||||
interface FeedbackDialogProps {
|
||||
visible: boolean;
|
||||
title: string;
|
||||
onDismiss: () => void;
|
||||
onConfirm: () => void;
|
||||
}
|
||||
|
||||
const FeedbackDialog: React.FC<FeedbackDialogProps> = ({
|
||||
visible,
|
||||
title,
|
||||
onDismiss,
|
||||
onConfirm,
|
||||
}) => {
|
||||
return (
|
||||
<Dialog
|
||||
visible={visible}
|
||||
onDismiss={onDismiss}
|
||||
containerStyle={styles.dialog}
|
||||
>
|
||||
<Text center style={styles.title}>
|
||||
Delete Note
|
||||
</Text>
|
||||
<View center>
|
||||
<Text style={styles.text} center>
|
||||
Are you sure you want to delete this feedback? {"\n\n"}
|
||||
<Text style={{ fontSize: 16, fontFamily: "PlusJakartaSans_700Bold" }}>
|
||||
{title}
|
||||
</Text>
|
||||
</Text>
|
||||
</View>
|
||||
<View row right gap-8>
|
||||
<Button
|
||||
label="Cancel"
|
||||
onPress={onDismiss}
|
||||
style={styles.cancelBtn}
|
||||
color="#999999"
|
||||
labelStyle={{ fontFamily: "Poppins_500Medium", fontSize: 13.53 }}
|
||||
/>
|
||||
<Button
|
||||
label="Yes"
|
||||
onPress={onConfirm}
|
||||
style={styles.confirmBtn}
|
||||
labelStyle={{ fontFamily: "PlusJakartaSans_500Medium" }}
|
||||
/>
|
||||
</View>
|
||||
</Dialog>
|
||||
);
|
||||
};
|
||||
|
||||
// Empty stylesheet for future styles
|
||||
const styles = StyleSheet.create({
|
||||
confirmBtn: {
|
||||
backgroundColor: "#ea156d",
|
||||
},
|
||||
cancelBtn: {
|
||||
backgroundColor: "white",
|
||||
},
|
||||
dialog: {
|
||||
backgroundColor: "white",
|
||||
paddingHorizontal: 25,
|
||||
paddingTop: 35,
|
||||
paddingBottom: 17,
|
||||
borderRadius: 20,
|
||||
},
|
||||
title: {
|
||||
fontFamily: "Manrope_600SemiBold",
|
||||
fontSize: 22,
|
||||
marginBottom: 20,
|
||||
},
|
||||
text: {
|
||||
fontFamily: "PlusJakartaSans_400Regular",
|
||||
fontSize: 16,
|
||||
marginBottom: 25,
|
||||
},
|
||||
});
|
||||
|
||||
export default FeedbackDialog;
|
35
components/pages/feedback/FeedbackList.tsx
Normal file
35
components/pages/feedback/FeedbackList.tsx
Normal file
@ -0,0 +1,35 @@
|
||||
import { View } from "react-native-ui-lib";
|
||||
import React from "react";
|
||||
import { FlatList } from "react-native";
|
||||
import { useFeedbackContext } from "@/contexts/FeedbackContext";
|
||||
import Feedback from "./Feedback";
|
||||
|
||||
const FeedbackList = (props: { searchText: string }) => {
|
||||
const { feedbacks } = useFeedbackContext();
|
||||
|
||||
const filteredBrainDumps =
|
||||
props.searchText.trim() === ""
|
||||
? feedbacks
|
||||
: feedbacks.filter(
|
||||
(item) =>
|
||||
item.title.toLowerCase().includes(props.searchText.toLowerCase()) ||
|
||||
item.text
|
||||
.toLowerCase()
|
||||
.includes(props.searchText.toLowerCase())
|
||||
);
|
||||
|
||||
return (
|
||||
<View marginB-70>
|
||||
<FlatList
|
||||
style={{ zIndex: -1 }}
|
||||
data={filteredBrainDumps}
|
||||
keyExtractor={(item) => item.title}
|
||||
renderItem={({ item }) => (
|
||||
<Feedback key={item.title} item={item} />
|
||||
)}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
export default FeedbackList;
|
120
components/pages/feedback/FeedbackPage.tsx
Normal file
120
components/pages/feedback/FeedbackPage.tsx
Normal file
@ -0,0 +1,120 @@
|
||||
import {Dimensions, ScrollView, StyleSheet} from "react-native";
|
||||
import React, {useState} from "react";
|
||||
import {Button, Text, TextField, View} from "react-native-ui-lib";
|
||||
import HeaderTemplate from "@/components/shared/HeaderTemplate";
|
||||
import {Feather, MaterialIcons} from "@expo/vector-icons";
|
||||
import LinearGradient from "react-native-linear-gradient";
|
||||
import PlusIcon from "@/assets/svgs/PlusIcon";
|
||||
import AddFeedback from "./AddFeedback";
|
||||
import FeedbackList from "./FeedbackList";
|
||||
|
||||
const FeedbackPage = () => {
|
||||
const [searchText, setSearchText] = useState<string>("");
|
||||
const [isAddVisible, setIsAddVisible] = useState<boolean>(false);
|
||||
|
||||
return (
|
||||
<View height={"100%"}>
|
||||
<View>
|
||||
<ScrollView
|
||||
showsVerticalScrollIndicator={false}
|
||||
showsHorizontalScrollIndicator={false}
|
||||
>
|
||||
<View marginH-25>
|
||||
<HeaderTemplate
|
||||
message={"Welcome to your Feedback!"}
|
||||
isWelcome={false}
|
||||
children={
|
||||
<Text
|
||||
style={{fontFamily: "Manrope_400Regular", fontSize: 14}}
|
||||
>
|
||||
Drop your feedback here, and{"\n"}organize it later.
|
||||
</Text>
|
||||
}
|
||||
/>
|
||||
<View>
|
||||
<View style={styles.searchField} centerV>
|
||||
<TextField
|
||||
value={searchText}
|
||||
onChangeText={(value) => {
|
||||
setSearchText(value);
|
||||
}}
|
||||
leadingAccessory={
|
||||
<Feather
|
||||
name="search"
|
||||
size={24}
|
||||
color="#9b9b9b"
|
||||
style={{paddingRight: 10}}
|
||||
/>
|
||||
}
|
||||
style={{
|
||||
fontFamily: "Manrope_500Medium",
|
||||
fontSize: 15,
|
||||
}}
|
||||
placeholder="Search your feedbacks..."
|
||||
/>
|
||||
</View>
|
||||
<FeedbackList searchText={searchText}/>
|
||||
</View>
|
||||
</View>
|
||||
</ScrollView>
|
||||
</View>
|
||||
<LinearGradient
|
||||
colors={["#f9f8f700", "#f9f8f7"]}
|
||||
locations={[0,1]}
|
||||
style={{
|
||||
position: "absolute",
|
||||
bottom: 0,
|
||||
height: 120,
|
||||
width: Dimensions.get("screen").width,
|
||||
justifyContent:'center',
|
||||
alignItems:"center"
|
||||
}}
|
||||
>
|
||||
<Button
|
||||
style={{
|
||||
height: 40,
|
||||
position: "relative",
|
||||
width: "90%",
|
||||
bottom: -10,
|
||||
borderRadius: 30,
|
||||
backgroundColor: "#fd1775",
|
||||
}}
|
||||
color="white"
|
||||
enableShadow
|
||||
onPress={() => {
|
||||
setIsAddVisible(true);
|
||||
}}
|
||||
>
|
||||
<View row centerV centerH>
|
||||
<PlusIcon />
|
||||
<Text
|
||||
white
|
||||
style={{fontSize: 16, fontFamily: "Manrope_600SemiBold", marginLeft: 5}}
|
||||
>
|
||||
New
|
||||
</Text>
|
||||
</View>
|
||||
</Button>
|
||||
</LinearGradient>
|
||||
<AddFeedback
|
||||
addFeedbackProps={{
|
||||
isVisible: isAddVisible,
|
||||
setIsVisible: setIsAddVisible,
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
searchField: {
|
||||
borderWidth: 0.7,
|
||||
borderColor: "#9b9b9b",
|
||||
borderRadius: 15,
|
||||
height: 42,
|
||||
paddingLeft: 10,
|
||||
marginVertical: 20,
|
||||
},
|
||||
});
|
||||
|
||||
export default FeedbackPage;
|
@ -1,183 +1,193 @@
|
||||
import {
|
||||
Button,
|
||||
ButtonSize,
|
||||
Colors,
|
||||
KeyboardAwareScrollView,
|
||||
LoaderScreen,
|
||||
Text,
|
||||
TextField,
|
||||
TextFieldRef,
|
||||
View,
|
||||
Button,
|
||||
ButtonSize,
|
||||
Colors,
|
||||
KeyboardAwareScrollView,
|
||||
LoaderScreen,
|
||||
Text,
|
||||
TextField,
|
||||
TextFieldRef,
|
||||
View,
|
||||
} from "react-native-ui-lib";
|
||||
import React, {useRef, useState} from "react";
|
||||
import {useSignIn} from "@/hooks/firebase/useSignIn";
|
||||
import {KeyboardAvoidingView, Platform, StyleSheet} from "react-native";
|
||||
import React, { useRef, useState } from "react";
|
||||
import { useSignIn } from "@/hooks/firebase/useSignIn";
|
||||
import { KeyboardAvoidingView, Platform, StyleSheet } from "react-native";
|
||||
import Toast from "react-native-toast-message";
|
||||
import KeyboardManager from "react-native-keyboard-manager";
|
||||
import {SafeAreaView} from "react-native-safe-area-context";
|
||||
import {useRouter} from "expo-router";
|
||||
import { SafeAreaView } from "react-native-safe-area-context";
|
||||
import { useRouter } from "expo-router";
|
||||
|
||||
KeyboardManager.setEnableAutoToolbar(true);
|
||||
if (Platform.OS === "ios") KeyboardManager.setEnableAutoToolbar(true);
|
||||
|
||||
const SignInPage = () => {
|
||||
const [email, setEmail] = useState<string>("");
|
||||
const [password, setPassword] = useState<string>("");
|
||||
const passwordRef = useRef<TextFieldRef>(null);
|
||||
const [email, setEmail] = useState<string>("");
|
||||
const [password, setPassword] = useState<string>("");
|
||||
const passwordRef = useRef<TextFieldRef>(null);
|
||||
|
||||
const {mutateAsync: signIn, error, isError, isLoading} = useSignIn();
|
||||
const { mutateAsync: signIn, error, isError, isLoading } = useSignIn();
|
||||
|
||||
const router = useRouter()
|
||||
const router = useRouter();
|
||||
|
||||
const handleSignIn = async () => {
|
||||
await signIn({email, password});
|
||||
if (!isError) {
|
||||
Toast.show({
|
||||
type: "success",
|
||||
text1: "Login successful!",
|
||||
});
|
||||
} else {
|
||||
Toast.show({
|
||||
type: "error",
|
||||
text1: "Error logging in",
|
||||
text2: `${error}`,
|
||||
});
|
||||
}
|
||||
};
|
||||
const handleSignIn = async () => {
|
||||
await signIn({ email, password });
|
||||
if (!isError) {
|
||||
Toast.show({
|
||||
type: "success",
|
||||
text1: "Login successful!",
|
||||
});
|
||||
} else {
|
||||
Toast.show({
|
||||
type: "error",
|
||||
text1: "Error logging in",
|
||||
text2: `${error}`,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<SafeAreaView style={{flex: 1}}>
|
||||
<KeyboardAwareScrollView contentContainerStyle={{flexGrow: 1}} enableOnAndroid>
|
||||
<View style={{flex: 1, padding: 21, paddingBottom: 45, paddingTop: "20%"}}>
|
||||
<View gap-13 width={"100%"} marginB-20>
|
||||
<Text style={{fontSize: 40, fontFamily: 'Manrope_600SemiBold'}}>
|
||||
Jump back into Cally
|
||||
</Text>
|
||||
<Text color={"#919191"} style={{fontSize: 20}}>
|
||||
Please enter your details.
|
||||
</Text>
|
||||
</View>
|
||||
return (
|
||||
<SafeAreaView style={{ flex: 1 }}>
|
||||
<KeyboardAwareScrollView
|
||||
contentContainerStyle={{ flexGrow: 1 }}
|
||||
enableOnAndroid
|
||||
>
|
||||
<View
|
||||
style={{ flex: 1, padding: 21, paddingBottom: 45, paddingTop: "20%" }}
|
||||
>
|
||||
<View gap-13 width={"100%"} marginB-20>
|
||||
<Text style={{ fontSize: 40, fontFamily: "Manrope_600SemiBold" }}>
|
||||
Jump back into Cally
|
||||
</Text>
|
||||
<Text color={"#919191"} style={{ fontSize: 20 }}>
|
||||
Please enter your details.
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
<KeyboardAvoidingView style={{width: "100%"}}
|
||||
contentContainerStyle={{justifyContent: "center"}}
|
||||
keyboardVerticalOffset={50}
|
||||
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
||||
>
|
||||
<TextField
|
||||
placeholder="Email"
|
||||
keyboardType={"email-address"}
|
||||
returnKeyType={"next"}
|
||||
textContentType={"emailAddress"}
|
||||
defaultValue={email}
|
||||
onChangeText={setEmail}
|
||||
style={styles.textfield}
|
||||
autoComplete={"email"}
|
||||
autoCorrect={false}
|
||||
onSubmitEditing={() => {
|
||||
// Move focus to the description field
|
||||
passwordRef.current?.focus();
|
||||
}}
|
||||
/>
|
||||
<TextField
|
||||
ref={passwordRef}
|
||||
placeholder="Password"
|
||||
textContentType={"oneTimeCode"}
|
||||
value={password}
|
||||
onChangeText={setPassword}
|
||||
secureTextEntry
|
||||
style={styles.textfield}
|
||||
autoCorrect={false}
|
||||
/>
|
||||
</KeyboardAvoidingView>
|
||||
<KeyboardAvoidingView
|
||||
style={{ width: "100%" }}
|
||||
contentContainerStyle={{ justifyContent: "center" }}
|
||||
keyboardVerticalOffset={50}
|
||||
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
||||
>
|
||||
<TextField
|
||||
placeholder="Email"
|
||||
keyboardType={"email-address"}
|
||||
returnKeyType={"next"}
|
||||
textContentType={"emailAddress"}
|
||||
defaultValue={email}
|
||||
onChangeText={setEmail}
|
||||
style={styles.textfield}
|
||||
autoComplete={"email"}
|
||||
autoCorrect={false}
|
||||
onSubmitEditing={() => {
|
||||
// Move focus to the description field
|
||||
passwordRef.current?.focus();
|
||||
}}
|
||||
/>
|
||||
<TextField
|
||||
ref={passwordRef}
|
||||
placeholder="Password"
|
||||
textContentType={"oneTimeCode"}
|
||||
value={password}
|
||||
onChangeText={setPassword}
|
||||
secureTextEntry
|
||||
style={styles.textfield}
|
||||
autoCorrect={false}
|
||||
/>
|
||||
</KeyboardAvoidingView>
|
||||
|
||||
<View flexG/>
|
||||
<View flexG />
|
||||
|
||||
<Button
|
||||
label="Log in"
|
||||
marginT-50
|
||||
labelStyle={{
|
||||
fontFamily: "PlusJakartaSans_600SemiBold",
|
||||
fontSize: 16,
|
||||
}}
|
||||
onPress={handleSignIn}
|
||||
style={{marginBottom: 20, height: 50}}
|
||||
backgroundColor="#fd1775"
|
||||
/>
|
||||
<Button
|
||||
label="Log in"
|
||||
marginT-50
|
||||
labelStyle={{
|
||||
fontFamily: "PlusJakartaSans_600SemiBold",
|
||||
fontSize: 16,
|
||||
}}
|
||||
onPress={handleSignIn}
|
||||
style={{ marginBottom: 20, height: 50 }}
|
||||
backgroundColor="#fd1775"
|
||||
/>
|
||||
|
||||
{isError && (
|
||||
<Text center style={{marginBottom: 20}}>{`${
|
||||
error?.toString()?.split("]")?.[1]
|
||||
}`}</Text>
|
||||
)}
|
||||
{isError && (
|
||||
<Text center style={{ marginBottom: 20 }}>{`${
|
||||
error?.toString()?.split("]")?.[1]
|
||||
}`}</Text>
|
||||
)}
|
||||
|
||||
<View row centerH marginB-5 gap-5>
|
||||
<Text style={styles.jakartaLight}>Don't have an account?</Text>
|
||||
<Button
|
||||
onPress={() => router.replace("/(unauth)/sign_up")}
|
||||
label="Sign Up"
|
||||
labelStyle={[
|
||||
styles.jakartaMedium,
|
||||
{textDecorationLine: "none", color: "#fd1575"},
|
||||
]}
|
||||
link
|
||||
size={ButtonSize.xSmall}
|
||||
padding-0
|
||||
margin-0
|
||||
text70
|
||||
left
|
||||
color="#fd1775"
|
||||
/>
|
||||
</View>
|
||||
<View row centerH marginB-5 gap-5>
|
||||
<Text style={styles.jakartaLight}>Don't have an account?</Text>
|
||||
<Button
|
||||
onPress={() => router.replace("/(unauth)/sign_up")}
|
||||
label="Sign Up"
|
||||
labelStyle={[
|
||||
styles.jakartaMedium,
|
||||
{ textDecorationLine: "none", color: "#fd1575" },
|
||||
]}
|
||||
link
|
||||
size={ButtonSize.xSmall}
|
||||
padding-0
|
||||
margin-0
|
||||
text70
|
||||
left
|
||||
color="#fd1775"
|
||||
/>
|
||||
</View>
|
||||
|
||||
{/*<View row centerH marginB-5 gap-5>*/}
|
||||
{/* <Text text70>Forgot your password?</Text>*/}
|
||||
{/* <Button*/}
|
||||
{/* onPress={() => router.replace("/(unauth)/sign_up")}*/}
|
||||
{/* label="Reset password"*/}
|
||||
{/* labelStyle={[*/}
|
||||
{/* styles.jakartaMedium,*/}
|
||||
{/* {textDecorationLine: "none", color: "#fd1575"},*/}
|
||||
{/* ]}*/}
|
||||
{/* link*/}
|
||||
{/* size={ButtonSize.xSmall}*/}
|
||||
{/* padding-0*/}
|
||||
{/* margin-0*/}
|
||||
{/* text70*/}
|
||||
{/* left*/}
|
||||
{/* avoidInnerPadding*/}
|
||||
{/* color="#fd1775"*/}
|
||||
{/* />*/}
|
||||
{/*</View>*/}
|
||||
{/*<View row centerH marginB-5 gap-5>*/}
|
||||
{/* <Text text70>Forgot your password?</Text>*/}
|
||||
{/* <Button*/}
|
||||
{/* onPress={() => router.replace("/(unauth)/sign_up")}*/}
|
||||
{/* label="Reset password"*/}
|
||||
{/* labelStyle={[*/}
|
||||
{/* styles.jakartaMedium,*/}
|
||||
{/* {textDecorationLine: "none", color: "#fd1575"},*/}
|
||||
{/* ]}*/}
|
||||
{/* link*/}
|
||||
{/* size={ButtonSize.xSmall}*/}
|
||||
{/* padding-0*/}
|
||||
{/* margin-0*/}
|
||||
{/* text70*/}
|
||||
{/* left*/}
|
||||
{/* avoidInnerPadding*/}
|
||||
{/* color="#fd1775"*/}
|
||||
{/* />*/}
|
||||
{/*</View>*/}
|
||||
|
||||
{isLoading && (
|
||||
<LoaderScreen overlay message={"Signing in..."} backgroundColor={Colors.white}
|
||||
color={Colors.grey40}/>
|
||||
)}
|
||||
</View>
|
||||
</KeyboardAwareScrollView>
|
||||
</SafeAreaView>
|
||||
);
|
||||
{isLoading && (
|
||||
<LoaderScreen
|
||||
overlay
|
||||
message={"Signing in..."}
|
||||
backgroundColor={Colors.white}
|
||||
color={Colors.grey40}
|
||||
/>
|
||||
)}
|
||||
</View>
|
||||
</KeyboardAwareScrollView>
|
||||
</SafeAreaView>
|
||||
);
|
||||
};
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
textfield: {
|
||||
backgroundColor: "white",
|
||||
marginVertical: 10,
|
||||
padding: 30,
|
||||
height: 45,
|
||||
borderRadius: 50,
|
||||
fontFamily: "PlusJakartaSans_300Light",
|
||||
},
|
||||
jakartaLight: {
|
||||
fontFamily: "PlusJakartaSans_300Light",
|
||||
fontSize: 16,
|
||||
color: "#484848",
|
||||
},
|
||||
jakartaMedium: {
|
||||
fontFamily: "PlusJakartaSans_500Medium",
|
||||
fontSize: 16,
|
||||
color: "#919191",
|
||||
textDecorationLine: "underline",
|
||||
},
|
||||
textfield: {
|
||||
backgroundColor: "white",
|
||||
marginVertical: 10,
|
||||
padding: 30,
|
||||
height: 45,
|
||||
borderRadius: 50,
|
||||
fontFamily: "PlusJakartaSans_300Light",
|
||||
},
|
||||
jakartaLight: {
|
||||
fontFamily: "PlusJakartaSans_300Light",
|
||||
fontSize: 16,
|
||||
color: "#484848",
|
||||
},
|
||||
jakartaMedium: {
|
||||
fontFamily: "PlusJakartaSans_500Medium",
|
||||
fontSize: 16,
|
||||
color: "#919191",
|
||||
textDecorationLine: "underline",
|
||||
},
|
||||
});
|
||||
|
||||
export default SignInPage;
|
||||
|
@ -1,260 +1,276 @@
|
||||
import React, {useRef, useState} from "react";
|
||||
import React, { useRef, useState } from "react";
|
||||
import {
|
||||
Button,
|
||||
ButtonSize,
|
||||
Checkbox,
|
||||
Colors,
|
||||
KeyboardAwareScrollView,
|
||||
LoaderScreen,
|
||||
Text,
|
||||
TextField,
|
||||
TextFieldRef,
|
||||
TouchableOpacity,
|
||||
View,
|
||||
Button,
|
||||
ButtonSize,
|
||||
Checkbox,
|
||||
Colors,
|
||||
KeyboardAwareScrollView,
|
||||
LoaderScreen,
|
||||
Text,
|
||||
TextField,
|
||||
TextFieldRef,
|
||||
TouchableOpacity,
|
||||
View,
|
||||
} from "react-native-ui-lib";
|
||||
import {useSignUp} from "@/hooks/firebase/useSignUp";
|
||||
import {KeyboardAvoidingView, StyleSheet} from "react-native";
|
||||
import {AntDesign} from "@expo/vector-icons";
|
||||
import { useSignUp } from "@/hooks/firebase/useSignUp";
|
||||
import { KeyboardAvoidingView, Platform, StyleSheet } from "react-native";
|
||||
import { AntDesign } from "@expo/vector-icons";
|
||||
import KeyboardManager from "react-native-keyboard-manager";
|
||||
import {SafeAreaView} from "react-native-safe-area-context";
|
||||
import {useRouter} from "expo-router";
|
||||
import { SafeAreaView } from "react-native-safe-area-context";
|
||||
import { useRouter } from "expo-router";
|
||||
|
||||
KeyboardManager.setEnableAutoToolbar(true);
|
||||
if (Platform.OS === "ios") KeyboardManager.setEnableAutoToolbar(true);
|
||||
|
||||
const SignUpPage = () => {
|
||||
const [email, setEmail] = useState<string>("");
|
||||
const [firstName, setFirstName] = useState<string>("");
|
||||
const [lastName, setLastName] = useState<string>("");
|
||||
const [password, setPassword] = useState<string>("");
|
||||
const [email, setEmail] = useState<string>("");
|
||||
const [firstName, setFirstName] = useState<string>("");
|
||||
const [lastName, setLastName] = useState<string>("");
|
||||
const [password, setPassword] = useState<string>("");
|
||||
|
||||
const [isPasswordVisible, setIsPasswordVisible] = useState<boolean>(false);
|
||||
const [allowFaceID, setAllowFaceID] = useState<boolean>(false);
|
||||
const [acceptTerms, setAcceptTerms] = useState<boolean>(false);
|
||||
const {mutateAsync: signUp, isLoading} = useSignUp();
|
||||
const [isPasswordVisible, setIsPasswordVisible] = useState<boolean>(false);
|
||||
const [allowFaceID, setAllowFaceID] = useState<boolean>(false);
|
||||
const [acceptTerms, setAcceptTerms] = useState<boolean>(false);
|
||||
const { mutateAsync: signUp, isLoading } = useSignUp();
|
||||
|
||||
const lnameRef = useRef<TextFieldRef>(null);
|
||||
const emailRef = useRef<TextFieldRef>(null);
|
||||
const passwordRef = useRef<TextFieldRef>(null);
|
||||
const lnameRef = useRef<TextFieldRef>(null);
|
||||
const emailRef = useRef<TextFieldRef>(null);
|
||||
const passwordRef = useRef<TextFieldRef>(null);
|
||||
|
||||
const router = useRouter()
|
||||
const router = useRouter();
|
||||
|
||||
const handleSignUp = async () => {
|
||||
await signUp({email, password, firstName, lastName});
|
||||
router.replace("/(unauth)/cal_sync")
|
||||
};
|
||||
const handleSignUp = async () => {
|
||||
await signUp({ email, password, firstName, lastName });
|
||||
router.replace("/(unauth)/cal_sync");
|
||||
};
|
||||
|
||||
return (
|
||||
<SafeAreaView style={{flex: 1}}>
|
||||
<KeyboardAwareScrollView contentContainerStyle={{flexGrow: 1}} enableOnAndroid>
|
||||
<View style={{flex: 1, padding: 21, paddingBottom: 45, paddingTop: "20%"}}>
|
||||
<View gap-13 width={"100%"} marginB-20>
|
||||
<Text style={{fontSize: 40, fontFamily: 'Manrope_600SemiBold'}}>
|
||||
Get started with Cally
|
||||
</Text>
|
||||
<Text color={"#919191"} style={{fontSize: 20}}>
|
||||
Please enter your details.
|
||||
</Text>
|
||||
</View>
|
||||
return (
|
||||
<SafeAreaView style={{ flex: 1 }}>
|
||||
<KeyboardAwareScrollView
|
||||
contentContainerStyle={{ flexGrow: 1 }}
|
||||
enableOnAndroid
|
||||
>
|
||||
<View
|
||||
style={{ flex: 1, padding: 21, paddingBottom: 45, paddingTop: "20%" }}
|
||||
>
|
||||
<View gap-13 width={"100%"} marginB-20>
|
||||
<Text style={{ fontSize: 40, fontFamily: "Manrope_600SemiBold" }}>
|
||||
Get started with Cally
|
||||
</Text>
|
||||
<Text color={"#919191"} style={{ fontSize: 20 }}>
|
||||
Please enter your details.
|
||||
</Text>
|
||||
</View>
|
||||
|
||||
<KeyboardAvoidingView style={{width: '100%'}}>
|
||||
<TextField
|
||||
marginT-30
|
||||
autoFocus
|
||||
placeholder="First name"
|
||||
value={firstName}
|
||||
onChangeText={setFirstName}
|
||||
style={styles.textfield}
|
||||
onSubmitEditing={() => {
|
||||
lnameRef.current?.focus();
|
||||
}}
|
||||
blurOnSubmit={false}
|
||||
accessibilityLabel="First name input"
|
||||
accessibilityHint="Enter your first name"
|
||||
accessible
|
||||
returnKeyType="next"
|
||||
textContentType="givenName"
|
||||
importantForAccessibility="yes"
|
||||
/>
|
||||
<TextField
|
||||
ref={lnameRef}
|
||||
placeholder="Last name"
|
||||
value={lastName}
|
||||
onChangeText={setLastName}
|
||||
style={styles.textfield}
|
||||
onSubmitEditing={() => {
|
||||
emailRef.current?.focus();
|
||||
}}
|
||||
blurOnSubmit={false}
|
||||
accessibilityLabel="Last name input"
|
||||
accessibilityHint="Enter your last name"
|
||||
accessible
|
||||
returnKeyType="next"
|
||||
textContentType="familyName"
|
||||
importantForAccessibility="yes"
|
||||
/>
|
||||
<TextField
|
||||
placeholder="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();
|
||||
}}
|
||||
/>
|
||||
<KeyboardAvoidingView style={{ width: "100%" }}>
|
||||
<TextField
|
||||
marginT-30
|
||||
autoFocus
|
||||
placeholder="First name"
|
||||
value={firstName}
|
||||
onChangeText={setFirstName}
|
||||
style={styles.textfield}
|
||||
onSubmitEditing={() => {
|
||||
lnameRef.current?.focus();
|
||||
}}
|
||||
blurOnSubmit={false}
|
||||
accessibilityLabel="First name input"
|
||||
accessibilityHint="Enter your first name"
|
||||
accessible
|
||||
returnKeyType="next"
|
||||
textContentType="givenName"
|
||||
importantForAccessibility="yes"
|
||||
/>
|
||||
<TextField
|
||||
ref={lnameRef}
|
||||
placeholder="Last name"
|
||||
value={lastName}
|
||||
onChangeText={setLastName}
|
||||
style={styles.textfield}
|
||||
onSubmitEditing={() => {
|
||||
emailRef.current?.focus();
|
||||
}}
|
||||
blurOnSubmit={false}
|
||||
accessibilityLabel="Last name input"
|
||||
accessibilityHint="Enter your last name"
|
||||
accessible
|
||||
returnKeyType="next"
|
||||
textContentType="familyName"
|
||||
importantForAccessibility="yes"
|
||||
/>
|
||||
<TextField
|
||||
placeholder="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();
|
||||
}}
|
||||
/>
|
||||
|
||||
<View
|
||||
centerV
|
||||
style={[styles.textfield, {padding: 0, paddingHorizontal: 30}]}
|
||||
>
|
||||
<TextField
|
||||
ref={passwordRef}
|
||||
placeholder="Password"
|
||||
style={styles.jakartaLight}
|
||||
value={password}
|
||||
onChangeText={setPassword}
|
||||
secureTextEntry={!isPasswordVisible}
|
||||
trailingAccessory={
|
||||
<TouchableOpacity
|
||||
onPress={() => setIsPasswordVisible(!isPasswordVisible)}
|
||||
>
|
||||
<AntDesign
|
||||
name={isPasswordVisible ? "eye" : "eyeo"}
|
||||
size={24}
|
||||
color="gray"
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
<View
|
||||
centerV
|
||||
style={[styles.textfield, { padding: 0, paddingHorizontal: 30 }]}
|
||||
>
|
||||
<TextField
|
||||
ref={passwordRef}
|
||||
placeholder="Password"
|
||||
style={styles.jakartaLight}
|
||||
value={password}
|
||||
onChangeText={setPassword}
|
||||
secureTextEntry={!isPasswordVisible}
|
||||
trailingAccessory={
|
||||
<TouchableOpacity
|
||||
onPress={() => setIsPasswordVisible(!isPasswordVisible)}
|
||||
>
|
||||
<AntDesign
|
||||
name={isPasswordVisible ? "eye" : "eyeo"}
|
||||
size={24}
|
||||
color="gray"
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
</KeyboardAvoidingView>
|
||||
|
||||
</KeyboardAvoidingView>
|
||||
<View gap-5 marginT-15>
|
||||
<View row centerV>
|
||||
<Checkbox
|
||||
style={[styles.check]}
|
||||
color="#919191"
|
||||
value={allowFaceID}
|
||||
onValueChange={(value) => {
|
||||
setAllowFaceID(value);
|
||||
}}
|
||||
/>
|
||||
<Text style={styles.jakartaLight} marginL-10>
|
||||
Allow FaceID for login in future
|
||||
</Text>
|
||||
</View>
|
||||
<View row centerV>
|
||||
<Checkbox
|
||||
style={styles.check}
|
||||
color="#919191"
|
||||
value={acceptTerms}
|
||||
onValueChange={(value) => setAcceptTerms(value)}
|
||||
/>
|
||||
<View row style={{ flexWrap: "wrap", marginLeft: 10 }}>
|
||||
<Text style={styles.jakartaLight}>I accept the</Text>
|
||||
<TouchableOpacity>
|
||||
<Text text90 style={styles.jakartaMedium}>
|
||||
{" "}
|
||||
terms and conditions
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
<Text style={styles.jakartaLight}> and </Text>
|
||||
<TouchableOpacity>
|
||||
<Text text90 style={styles.jakartaMedium}>
|
||||
{" "}
|
||||
privacy policy
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View gap-5 marginT-15>
|
||||
<View row centerV>
|
||||
<Checkbox
|
||||
style={[styles.check]}
|
||||
color="#919191"
|
||||
value={allowFaceID}
|
||||
onValueChange={(value) => {
|
||||
setAllowFaceID(value);
|
||||
}}
|
||||
/>
|
||||
<Text style={styles.jakartaLight} marginL-10>
|
||||
Allow FaceID for login in future
|
||||
</Text>
|
||||
</View>
|
||||
<View row centerV>
|
||||
<Checkbox
|
||||
style={styles.check}
|
||||
color="#919191"
|
||||
value={acceptTerms}
|
||||
onValueChange={(value) => setAcceptTerms(value)}
|
||||
/>
|
||||
<View row style={{flexWrap: "wrap", marginLeft: 10}}>
|
||||
<Text style={styles.jakartaLight}>
|
||||
I accept the
|
||||
</Text>
|
||||
<TouchableOpacity>
|
||||
<Text text90 style={styles.jakartaMedium}>
|
||||
{" "}
|
||||
terms and conditions
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
<Text style={styles.jakartaLight}> and </Text>
|
||||
<TouchableOpacity>
|
||||
<Text text90 style={styles.jakartaMedium}>
|
||||
{" "}
|
||||
privacy policy
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<View flexG style={{ minHeight: 50 }} />
|
||||
|
||||
<View flexG style={{minHeight: 50}}/>
|
||||
<View>
|
||||
<Button
|
||||
label="Register"
|
||||
disabled={!acceptTerms}
|
||||
labelStyle={{
|
||||
fontFamily: "PlusJakartaSans_600SemiBold",
|
||||
fontSize: 16,
|
||||
}}
|
||||
onPress={handleSignUp}
|
||||
backgroundColor={"#fd1775"}
|
||||
style={{ marginBottom: 0, height: 50 }}
|
||||
/>
|
||||
<View row centerH marginT-10 marginB-2 gap-5>
|
||||
<Text
|
||||
style={[
|
||||
styles.jakartaLight,
|
||||
{ fontSize: 16, color: "#484848" },
|
||||
]}
|
||||
center
|
||||
>
|
||||
Already have an account?
|
||||
</Text>
|
||||
|
||||
<View>
|
||||
<Button
|
||||
label="Register"
|
||||
disabled={!acceptTerms}
|
||||
labelStyle={{
|
||||
fontFamily: "PlusJakartaSans_600SemiBold",
|
||||
fontSize: 16,
|
||||
}}
|
||||
onPress={handleSignUp}
|
||||
backgroundColor={"#fd1775"}
|
||||
style={{marginBottom: 0, height: 50}}
|
||||
/>
|
||||
<View row centerH marginT-10 marginB-2 gap-5>
|
||||
<Text style={[styles.jakartaLight, {fontSize: 16, color: "#484848"}]} center>
|
||||
Already have an account?
|
||||
</Text>
|
||||
<Button
|
||||
label="Log in"
|
||||
labelStyle={[
|
||||
styles.jakartaMedium,
|
||||
{
|
||||
fontSize: 16,
|
||||
textDecorationLine: "none",
|
||||
color: "#fd1775",
|
||||
},
|
||||
]}
|
||||
flexS
|
||||
margin-0
|
||||
link
|
||||
color="#fd1775"
|
||||
size={ButtonSize.small}
|
||||
text70
|
||||
onPress={() => router.replace("/(unauth)/sign_in")}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</KeyboardAwareScrollView>
|
||||
|
||||
<Button
|
||||
label="Log in"
|
||||
labelStyle={[
|
||||
styles.jakartaMedium,
|
||||
{fontSize: 16, textDecorationLine: "none", color: "#fd1775"},
|
||||
]}
|
||||
flexS
|
||||
margin-0
|
||||
link
|
||||
color="#fd1775"
|
||||
size={ButtonSize.small}
|
||||
text70
|
||||
onPress={() => router.replace("/(unauth)/sign_in")}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</KeyboardAwareScrollView>
|
||||
|
||||
{isLoading && (
|
||||
<LoaderScreen overlay message={"Signing up..."} backgroundColor={Colors.white}
|
||||
color={Colors.grey40}/>
|
||||
)}
|
||||
</SafeAreaView>
|
||||
);
|
||||
{isLoading && (
|
||||
<LoaderScreen
|
||||
overlay
|
||||
message={"Signing up..."}
|
||||
backgroundColor={Colors.white}
|
||||
color={Colors.grey40}
|
||||
/>
|
||||
)}
|
||||
</SafeAreaView>
|
||||
);
|
||||
};
|
||||
|
||||
export default SignUpPage;
|
||||
|
||||
const styles = StyleSheet.create({
|
||||
textfield: {
|
||||
backgroundColor: "white",
|
||||
marginVertical: 8,
|
||||
padding: 30,
|
||||
height: 44,
|
||||
borderRadius: 50,
|
||||
fontFamily: "PlusJakartaSans_300Light",
|
||||
fontSize: 13,
|
||||
color: "#919191",
|
||||
},
|
||||
jakartaLight: {
|
||||
fontFamily: "PlusJakartaSans_300Light",
|
||||
fontSize: 13,
|
||||
color: "#919191",
|
||||
},
|
||||
jakartaMedium: {
|
||||
fontFamily: "PlusJakartaSans_500Medium",
|
||||
fontSize: 13,
|
||||
color: "#919191",
|
||||
textDecorationLine: "underline",
|
||||
},
|
||||
title: {fontFamily: "Manrope_600SemiBold", fontSize: 34, marginTop: 50},
|
||||
subtitle: {fontFamily: "PlusJakartaSans_400Regular", fontSize: 16},
|
||||
check: {
|
||||
borderRadius: 3,
|
||||
aspectRatio: 1,
|
||||
width: 18,
|
||||
color: "#919191",
|
||||
borderColor: "#919191",
|
||||
borderWidth: 1,
|
||||
},
|
||||
textfield: {
|
||||
backgroundColor: "white",
|
||||
marginVertical: 8,
|
||||
padding: 30,
|
||||
height: 44,
|
||||
borderRadius: 50,
|
||||
fontFamily: "PlusJakartaSans_300Light",
|
||||
fontSize: 13,
|
||||
color: "#919191",
|
||||
},
|
||||
jakartaLight: {
|
||||
fontFamily: "PlusJakartaSans_300Light",
|
||||
fontSize: 13,
|
||||
color: "#919191",
|
||||
},
|
||||
jakartaMedium: {
|
||||
fontFamily: "PlusJakartaSans_500Medium",
|
||||
fontSize: 13,
|
||||
color: "#919191",
|
||||
textDecorationLine: "underline",
|
||||
},
|
||||
title: { fontFamily: "Manrope_600SemiBold", fontSize: 34, marginTop: 50 },
|
||||
subtitle: { fontFamily: "PlusJakartaSans_400Regular", fontSize: 16 },
|
||||
check: {
|
||||
borderRadius: 3,
|
||||
aspectRatio: 1,
|
||||
width: 18,
|
||||
color: "#919191",
|
||||
borderColor: "#919191",
|
||||
borderWidth: 1,
|
||||
},
|
||||
});
|
||||
|
@ -1,5 +1,10 @@
|
||||
import { useCreateNote } from "@/hooks/firebase/useCreateNote";
|
||||
import { useDeleteNote } from "@/hooks/firebase/useDeleteNote";
|
||||
import { useGetNotes } from "@/hooks/firebase/useGetNotes";
|
||||
import { useUpdateNote } from "@/hooks/firebase/useUpdateNote";
|
||||
import { MaterialCommunityIcons } from "@expo/vector-icons";
|
||||
import { createContext, useContext, useState } from "react";
|
||||
import { create } from "react-test-renderer";
|
||||
|
||||
export interface IBrainDump {
|
||||
id: number;
|
||||
@ -8,7 +13,7 @@ export interface IBrainDump {
|
||||
}
|
||||
|
||||
interface IBrainDumpContext {
|
||||
brainDumps: IBrainDump[];
|
||||
brainDumps: IBrainDump[] | undefined;
|
||||
updateBrainDumpItem: (id: number, changes: Partial<IBrainDump>) => void;
|
||||
isAddingBrainDump: boolean;
|
||||
setIsAddingBrainDump: (value: boolean) => void;
|
||||
@ -23,70 +28,43 @@ const BrainDumpContext = createContext<IBrainDumpContext | undefined>(
|
||||
export const BrainDumpProvider: React.FC<{ children: React.ReactNode }> = ({
|
||||
children,
|
||||
}) => {
|
||||
const { data: brainDumps } = useGetNotes();
|
||||
const { mutate: deleteNote } = useDeleteNote();
|
||||
const { mutateAsync: createBrainDump } = useCreateNote();
|
||||
const { mutateAsync: updateNoteMutate } = useUpdateNote();
|
||||
|
||||
const [isAddingBrainDump, setIsAddingBrainDump] = useState<boolean>(false);
|
||||
const [brainDumps, setBrainDumps] = useState<IBrainDump[]>([
|
||||
{
|
||||
id: 0,
|
||||
title: "Favorite Weekend Activities",
|
||||
description:
|
||||
"What's something fun we can do together this weekend? Maybe a new game, a picnic?",
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
title: "What’s For Dinner",
|
||||
description:
|
||||
"What’s one meal you’d love to have for dinner this week?",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "The Best Thing About Today",
|
||||
description:
|
||||
"What was the highlight of your day? Let’s each take a moment to share something!",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "A Dream Vacation Spot",
|
||||
description:
|
||||
"If we could go anywhere in the world right now, where would it be? Everyone pick one dream destination and tell us why.",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: "Favorite Childhood Memory",
|
||||
description:
|
||||
"What’s a favorite memory from your childhood? Let’s take a trip down memory lane and share some of the moments that made us smile.",
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: "A New Family Tradition",
|
||||
description:
|
||||
"What’s one new tradition we could start as a family? Maybe a weekly movie night, a monthly game day, or a yearly family trip. Share your ideas!",
|
||||
},
|
||||
]);
|
||||
|
||||
const addBrainDump = (BrainDump: IBrainDump) => {
|
||||
setBrainDumps((prevBrainDumps) => [
|
||||
...prevBrainDumps,
|
||||
{
|
||||
...BrainDump,
|
||||
id: prevBrainDumps.length
|
||||
? prevBrainDumps[prevBrainDumps.length - 1].id + 1
|
||||
: 0,
|
||||
},
|
||||
]);
|
||||
createBrainDump(BrainDump);
|
||||
};
|
||||
|
||||
const updateBrainDumpItem = (id: number, changes: Partial<IBrainDump>) => {
|
||||
setBrainDumps((prevBrainDumps) =>
|
||||
prevBrainDumps.map((BrainDump) =>
|
||||
BrainDump.id === id ? { ...BrainDump, ...changes } : BrainDump
|
||||
)
|
||||
updateNoteMutate(
|
||||
{
|
||||
id: id,
|
||||
changes: changes,
|
||||
},
|
||||
{
|
||||
onSuccess: (data) => {
|
||||
console.log("Note updated successfully", data);
|
||||
},
|
||||
onError: (error) => {
|
||||
console.error("Failed to update note:", error);
|
||||
},
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
const deleteBrainDump = (id: number) => {
|
||||
setBrainDumps((prevBrainDumps) =>
|
||||
prevBrainDumps.filter((BrainDump) => BrainDump.id !== id)
|
||||
);
|
||||
deleteNote(id.toString(), {
|
||||
onSuccess: () => {
|
||||
console.log("Feedback deleted successfully");
|
||||
},
|
||||
onError: (error) => {
|
||||
console.error("Failed to delete feedback:", error);
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
@ -97,7 +75,7 @@ export const BrainDumpProvider: React.FC<{ children: React.ReactNode }> = ({
|
||||
isAddingBrainDump,
|
||||
setIsAddingBrainDump,
|
||||
addBrainDump,
|
||||
deleteBrainDump
|
||||
deleteBrainDump,
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
|
87
contexts/FeedbackContext.tsx
Normal file
87
contexts/FeedbackContext.tsx
Normal file
@ -0,0 +1,87 @@
|
||||
import { useCreateFeedback } from "@/hooks/firebase/useCreateFeedback";
|
||||
import { useDeleteFeedback } from "@/hooks/firebase/useDeleteFeedback";
|
||||
import { useGetFeedbacks } from "@/hooks/firebase/useGetFeedbacks";
|
||||
import { useUpdateFeedback } from "@/hooks/firebase/useUpdateFeedback";
|
||||
import { MaterialCommunityIcons } from "@expo/vector-icons";
|
||||
import { createContext, useContext, useState } from "react";
|
||||
|
||||
export interface IFeedback {
|
||||
id: number;
|
||||
title: string;
|
||||
text: string;
|
||||
}
|
||||
|
||||
interface IFeedbackContext {
|
||||
feedbacks: IFeedback[] | undefined;
|
||||
isAddingFeedback: boolean;
|
||||
setIsAddingFeedback: (value: boolean) => void;
|
||||
addFeedback: (BrainDump: IFeedback) => void;
|
||||
updateFeedback: (id: number, changes: Partial<IFeedback>) => void;
|
||||
deleteFeedback: (id: number) => void;
|
||||
}
|
||||
|
||||
const FeedbackContext = createContext<IFeedbackContext | undefined>(undefined);
|
||||
|
||||
export const FeedbackProvider: React.FC<{ children: React.ReactNode }> = ({
|
||||
children,
|
||||
}) => {
|
||||
const {
|
||||
mutateAsync: createFeedback,
|
||||
isLoading: isAdding,
|
||||
isError,
|
||||
} = useCreateFeedback();
|
||||
const { data: feedbacks } = useGetFeedbacks();
|
||||
const { mutate: deleteFeedbackMutate } = useDeleteFeedback();
|
||||
const { mutate: updateFeedbackMutate } = useUpdateFeedback();
|
||||
|
||||
const [isAddingFeedback, setIsAddingFeedback] = useState<boolean>(false);
|
||||
|
||||
const addFeedback = (Feedback: IFeedback) => {
|
||||
createFeedback({ title: Feedback.title, text: Feedback.text });
|
||||
};
|
||||
|
||||
const updateFeedback = (id: number, changes: Partial<IFeedback>) => {
|
||||
updateFeedbackMutate(
|
||||
{
|
||||
id: id,
|
||||
changes: changes,
|
||||
},
|
||||
{
|
||||
onSuccess: (data) => {
|
||||
console.log("Feedback updated successfully", data);
|
||||
},
|
||||
onError: (error) => {
|
||||
console.error("Failed to update feedback:", error);
|
||||
},
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
const deleteFeedback = (id: number) => {
|
||||
deleteFeedbackMutate(id.toString(), {
|
||||
onSuccess: () => {
|
||||
console.log("Feedback deleted successfully");
|
||||
},
|
||||
onError: (error) => {
|
||||
console.error("Failed to delete feedback:", error);
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<FeedbackContext.Provider
|
||||
value={{
|
||||
feedbacks,
|
||||
isAddingFeedback,
|
||||
setIsAddingFeedback,
|
||||
addFeedback,
|
||||
updateFeedback,
|
||||
deleteFeedback,
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
</FeedbackContext.Provider>
|
||||
);
|
||||
};
|
||||
|
||||
export const useFeedbackContext = () => useContext(FeedbackContext)!;
|
85
hooks/firebase/useCreateFeedback.ts
Normal file
85
hooks/firebase/useCreateFeedback.ts
Normal file
@ -0,0 +1,85 @@
|
||||
import {useAuthContext} from "@/contexts/AuthContext";
|
||||
import {useMutation, useQueryClient} from "react-query";
|
||||
import firestore from "@react-native-firebase/firestore";
|
||||
import { IFeedback } from "@/contexts/FeedbackContext";
|
||||
|
||||
export const useCreateFeedback = () => {
|
||||
const {user: currentUser, profileData} = useAuthContext()
|
||||
const queryClients = useQueryClient()
|
||||
|
||||
return useMutation({
|
||||
mutationKey: ["createFeedback"],
|
||||
mutationFn: async (feedback: Partial<IFeedback>) => {
|
||||
try {
|
||||
if (feedback.id) {
|
||||
const snapshot = await firestore()
|
||||
.collection("Feedbacks")
|
||||
.where("id", "==", feedback.id)
|
||||
.get();
|
||||
|
||||
if (!snapshot.empty) {
|
||||
const docId = snapshot.docs[0].id;
|
||||
await firestore()
|
||||
.collection("Feedbacks")
|
||||
.doc(docId)
|
||||
.set({
|
||||
...feedback,
|
||||
creatorId: currentUser?.uid,
|
||||
}, {merge: true});
|
||||
return;
|
||||
}
|
||||
}
|
||||
const newDoc = firestore().collection('Feedbacks').doc();
|
||||
await firestore()
|
||||
.collection("Feedbacks")
|
||||
.add({...feedback, id: newDoc.id, creatorId: currentUser?.uid});
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClients.invalidateQueries("feedbacks")
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export const useCreateFeedbacksFromProvider = () => {
|
||||
const { user: currentUser } = useAuthContext();
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
return useMutation({
|
||||
mutationKey: ["createFeedbacksFromProvider"],
|
||||
mutationFn: async (feedbackDataArray: Partial<IFeedback>[]) => {
|
||||
try {
|
||||
const promises = feedbackDataArray.map(async (feedbackData) => {
|
||||
console.log("Processing FeedbackData: ", feedbackData);
|
||||
|
||||
const snapshot = await firestore()
|
||||
.collection("Feedbacks")
|
||||
.where("id", "==", feedbackData.id)
|
||||
.get();
|
||||
|
||||
if (snapshot.empty) {
|
||||
return firestore()
|
||||
.collection("Feedbacks")
|
||||
.add({ ...feedbackData, creatorId: currentUser?.uid });
|
||||
} else {
|
||||
const docId = snapshot.docs[0].id;
|
||||
return firestore()
|
||||
.collection("Feedbacks")
|
||||
.doc(docId)
|
||||
.set({ ...feedbackData, creatorId: currentUser?.uid }, { merge: true });
|
||||
}
|
||||
});
|
||||
|
||||
await Promise.all(promises);
|
||||
|
||||
} catch (e) {
|
||||
console.error("Error creating/updating feedbacks: ", e);
|
||||
}
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries("feedbacks");
|
||||
}
|
||||
});
|
||||
};
|
91
hooks/firebase/useCreateNote.ts
Normal file
91
hooks/firebase/useCreateNote.ts
Normal file
@ -0,0 +1,91 @@
|
||||
import { useAuthContext } from "@/contexts/AuthContext";
|
||||
import { useMutation, useQueryClient } from "react-query";
|
||||
import firestore from "@react-native-firebase/firestore";
|
||||
import { IFeedback } from "@/contexts/FeedbackContext";
|
||||
import { IBrainDump } from "@/contexts/DumpContext";
|
||||
|
||||
export const useCreateNote = () => {
|
||||
const { user: currentUser, profileData } = useAuthContext();
|
||||
const queryClients = useQueryClient();
|
||||
|
||||
return useMutation({
|
||||
mutationKey: ["createNote"],
|
||||
mutationFn: async (note: Partial<IBrainDump>) => {
|
||||
try {
|
||||
if (note.id) {
|
||||
const snapshot = await firestore()
|
||||
.collection("BrainDumps")
|
||||
.where("id", "==", note.id)
|
||||
.get();
|
||||
|
||||
if (!snapshot.empty) {
|
||||
const docId = snapshot.docs[0].id;
|
||||
await firestore()
|
||||
.collection("BrainDumps")
|
||||
.doc(docId)
|
||||
.set(
|
||||
{
|
||||
...note,
|
||||
creatorId: currentUser?.uid,
|
||||
},
|
||||
{ merge: true }
|
||||
);
|
||||
return;
|
||||
}
|
||||
}
|
||||
const newDoc = firestore().collection("BrainDumps").doc();
|
||||
await firestore()
|
||||
.collection("BrainDumps")
|
||||
.add({ ...note, id: newDoc.id, creatorId: currentUser?.uid });
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClients.invalidateQueries("braindumps");
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
export const useCreateNotesFromProvider = () => {
|
||||
const { user: currentUser } = useAuthContext();
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
return useMutation({
|
||||
mutationKey: ["createNotesFromProvider"],
|
||||
mutationFn: async (noteDataArray: Partial<IFeedback>[]) => {
|
||||
try {
|
||||
const promises = noteDataArray.map(async (noteData) => {
|
||||
console.log("Processing NoteData: ", noteData);
|
||||
|
||||
const snapshot = await firestore()
|
||||
.collection("BrainDumps")
|
||||
.where("id", "==", noteData.id)
|
||||
.get();
|
||||
|
||||
if (snapshot.empty) {
|
||||
return firestore()
|
||||
.collection("BrainDumps")
|
||||
.add({ ...noteData, creatorId: currentUser?.uid });
|
||||
} else {
|
||||
const docId = snapshot.docs[0].id;
|
||||
return firestore()
|
||||
.collection("BrainDumps")
|
||||
.doc(docId)
|
||||
.set(
|
||||
{ ...noteData, creatorId: currentUser?.uid },
|
||||
{ merge: true }
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
await Promise.all(promises);
|
||||
} catch (e) {
|
||||
console.error("Error creating/updating braindumps: ", e);
|
||||
}
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries("braindumps");
|
||||
},
|
||||
});
|
||||
};
|
45
hooks/firebase/useDeleteFeedback.ts
Normal file
45
hooks/firebase/useDeleteFeedback.ts
Normal file
@ -0,0 +1,45 @@
|
||||
import {useAuthContext} from "@/contexts/AuthContext";
|
||||
import {useMutation, useQueryClient} from "react-query";
|
||||
import firestore from "@react-native-firebase/firestore";
|
||||
|
||||
export const useDeleteFeedback = () => {
|
||||
const { user: currentUser } = useAuthContext();
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
return useMutation({
|
||||
mutationKey: ["deleteFeedback"],
|
||||
mutationFn: async (feedbackId: string) => {
|
||||
try {
|
||||
// Find the document with matching id field
|
||||
const snapshot = await firestore()
|
||||
.collection("Feedbacks")
|
||||
.where("id", "==", feedbackId)
|
||||
.get();
|
||||
|
||||
if (snapshot.empty) {
|
||||
throw new Error("Feedback not found");
|
||||
}
|
||||
|
||||
// Get the first matching document
|
||||
const docId = snapshot.docs[0].id;
|
||||
|
||||
// Optional: Check if the current user is the creator
|
||||
const feedbackData = snapshot.docs[0].data();
|
||||
if (feedbackData.creatorId !== currentUser?.uid) {
|
||||
throw new Error(
|
||||
"Unauthorized: You can only delete your own feedback"
|
||||
);
|
||||
}
|
||||
|
||||
// Delete the document
|
||||
await firestore().collection("Feedbacks").doc(docId).delete();
|
||||
} catch (e) {
|
||||
console.error("Error deleting feedback: ", e);
|
||||
throw e; // Re-throw the error to be handled by the mutation
|
||||
}
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries("feedbacks");
|
||||
},
|
||||
});
|
||||
};
|
39
hooks/firebase/useDeleteNote.ts
Normal file
39
hooks/firebase/useDeleteNote.ts
Normal file
@ -0,0 +1,39 @@
|
||||
import { useAuthContext } from "@/contexts/AuthContext";
|
||||
import { useMutation, useQueryClient } from "react-query";
|
||||
import firestore from "@react-native-firebase/firestore";
|
||||
|
||||
export const useDeleteNote = () => {
|
||||
const { user: currentUser } = useAuthContext();
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
return useMutation({
|
||||
mutationKey: ["deleteNote"],
|
||||
mutationFn: async (noteId: string) => {
|
||||
try {
|
||||
const snapshot = await firestore()
|
||||
.collection("BrainDumps")
|
||||
.where("id", "==", noteId)
|
||||
.get();
|
||||
|
||||
if (snapshot.empty) {
|
||||
throw new Error("Note not found");
|
||||
}
|
||||
|
||||
const docId = snapshot.docs[0].id;
|
||||
|
||||
const noteData = snapshot.docs[0].data();
|
||||
if (noteData.creatorId !== currentUser?.uid) {
|
||||
throw new Error("Unauthorized: You can only delete your own Note");
|
||||
}
|
||||
|
||||
await firestore().collection("BrainDumps").doc(docId).delete();
|
||||
} catch (e) {
|
||||
console.error("Error deleting note: ", e);
|
||||
throw e;
|
||||
}
|
||||
},
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries("braindumps");
|
||||
},
|
||||
});
|
||||
};
|
28
hooks/firebase/useGetFeedbacks.ts
Normal file
28
hooks/firebase/useGetFeedbacks.ts
Normal file
@ -0,0 +1,28 @@
|
||||
import { useAuthContext } from "@/contexts/AuthContext";
|
||||
import { useQuery } from "react-query";
|
||||
import firestore from "@react-native-firebase/firestore";
|
||||
import { IFeedback } from "@/contexts/FeedbackContext";
|
||||
|
||||
export const useGetFeedbacks = () => {
|
||||
const { user: currentUser } = useAuthContext();
|
||||
|
||||
return useQuery<IFeedback[]>({
|
||||
queryKey: ["feedbacks", currentUser?.uid],
|
||||
queryFn: async () => {
|
||||
try {
|
||||
const snapshot = await firestore()
|
||||
.collection("Feedbacks")
|
||||
.where("creatorId", "==", currentUser?.uid)
|
||||
.get();
|
||||
|
||||
return snapshot.docs.map((doc) => ({
|
||||
...doc.data(),
|
||||
})) as IFeedback[];
|
||||
} catch (error) {
|
||||
console.error("Error fetching feedbacks:", error);
|
||||
throw error;
|
||||
}
|
||||
},
|
||||
enabled: !!currentUser?.uid, // Only run query if we have a user ID
|
||||
});
|
||||
};
|
28
hooks/firebase/useGetNotes.ts
Normal file
28
hooks/firebase/useGetNotes.ts
Normal file
@ -0,0 +1,28 @@
|
||||
import { useAuthContext } from "@/contexts/AuthContext";
|
||||
import { useQuery } from "react-query";
|
||||
import firestore from "@react-native-firebase/firestore";
|
||||
import { IBrainDump } from "@/contexts/DumpContext";
|
||||
|
||||
export const useGetNotes = () => {
|
||||
const { user: currentUser } = useAuthContext();
|
||||
|
||||
return useQuery<IBrainDump[]>({
|
||||
queryKey: ["braindumps", currentUser?.uid],
|
||||
queryFn: async () => {
|
||||
try {
|
||||
const snapshot = await firestore()
|
||||
.collection("BrainDumps")
|
||||
.where("creatorId", "==", currentUser?.uid)
|
||||
.get();
|
||||
|
||||
return snapshot.docs.map((doc) => ({
|
||||
...doc.data(),
|
||||
})) as IBrainDump[];
|
||||
} catch (error) {
|
||||
console.error("Error fetching braindumps:", error);
|
||||
throw error;
|
||||
}
|
||||
},
|
||||
enabled: !!currentUser?.uid,
|
||||
});
|
||||
};
|
65
hooks/firebase/useUpdateFeedback.ts
Normal file
65
hooks/firebase/useUpdateFeedback.ts
Normal file
@ -0,0 +1,65 @@
|
||||
import { useAuthContext } from "@/contexts/AuthContext";
|
||||
import { useMutation, useQueryClient } from "react-query";
|
||||
import firestore from "@react-native-firebase/firestore";
|
||||
import { IFeedback } from "@/contexts/FeedbackContext";
|
||||
|
||||
interface UpdateFeedbackParams {
|
||||
id: number;
|
||||
changes: Partial<IFeedback>;
|
||||
}
|
||||
|
||||
export const useUpdateFeedback = () => {
|
||||
const { user: currentUser } = useAuthContext();
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
return useMutation({
|
||||
mutationKey: ["updateFeedback"],
|
||||
mutationFn: async ({ id, changes }: UpdateFeedbackParams) => {
|
||||
try {
|
||||
const snapshot = await firestore()
|
||||
.collection("Feedbacks")
|
||||
.where("id", "==", id)
|
||||
.get();
|
||||
|
||||
if (snapshot.empty) {
|
||||
throw new Error("Feedback not found");
|
||||
}
|
||||
|
||||
const docId = snapshot.docs[0].id;
|
||||
const feedbackData = snapshot.docs[0].data();
|
||||
|
||||
if (feedbackData.creatorId !== currentUser?.uid) {
|
||||
throw new Error(
|
||||
"Unauthorized: You can only update your own feedback"
|
||||
);
|
||||
}
|
||||
|
||||
await firestore()
|
||||
.collection("Feedbacks")
|
||||
.doc(docId)
|
||||
.update({
|
||||
...changes,
|
||||
updatedAt: firestore.FieldValue.serverTimestamp(),
|
||||
lastModifiedBy: currentUser?.uid,
|
||||
});
|
||||
|
||||
return {
|
||||
id,
|
||||
...feedbackData,
|
||||
...changes,
|
||||
};
|
||||
} catch (e) {
|
||||
console.error("Error updating feedback: ", e);
|
||||
throw e;
|
||||
}
|
||||
},
|
||||
onSuccess: (updatedFeedback) => {
|
||||
queryClient.invalidateQueries("feedbacks");
|
||||
|
||||
queryClient.setQueryData(
|
||||
["feedback", updatedFeedback.id],
|
||||
updatedFeedback
|
||||
);
|
||||
},
|
||||
});
|
||||
};
|
65
hooks/firebase/useUpdateNote.ts
Normal file
65
hooks/firebase/useUpdateNote.ts
Normal file
@ -0,0 +1,65 @@
|
||||
import { useAuthContext } from "@/contexts/AuthContext";
|
||||
import { useMutation, useQueryClient } from "react-query";
|
||||
import firestore from "@react-native-firebase/firestore";
|
||||
import { IBrainDump } from "@/contexts/DumpContext";
|
||||
|
||||
interface UpdateNoteParams {
|
||||
id: number;
|
||||
changes: Partial<IBrainDump>;
|
||||
}
|
||||
|
||||
export const useUpdateNote = () => {
|
||||
const { user: currentUser } = useAuthContext();
|
||||
const queryClient = useQueryClient();
|
||||
|
||||
return useMutation({
|
||||
mutationKey: ["updateNote"],
|
||||
mutationFn: async ({ id, changes }: UpdateNoteParams) => {
|
||||
try {
|
||||
const snapshot = await firestore()
|
||||
.collection("BrainDumps")
|
||||
.where("id", "==", id)
|
||||
.get();
|
||||
|
||||
if (snapshot.empty) {
|
||||
throw new Error("Note not found");
|
||||
}
|
||||
|
||||
const docId = snapshot.docs[0].id;
|
||||
const noteData = snapshot.docs[0].data();
|
||||
|
||||
if (noteData.creatorId !== currentUser?.uid) {
|
||||
throw new Error(
|
||||
"Unauthorized: You can only update your own note"
|
||||
);
|
||||
}
|
||||
|
||||
await firestore()
|
||||
.collection("BrainDumps")
|
||||
.doc(docId)
|
||||
.update({
|
||||
...changes,
|
||||
updatedAt: firestore.FieldValue.serverTimestamp(),
|
||||
lastModifiedBy: currentUser?.uid,
|
||||
});
|
||||
|
||||
return {
|
||||
id,
|
||||
...noteData,
|
||||
...changes,
|
||||
};
|
||||
} catch (e) {
|
||||
console.error("Error updating note: ", e);
|
||||
throw e;
|
||||
}
|
||||
},
|
||||
onSuccess: (updatedNote) => {
|
||||
queryClient.invalidateQueries("braindumps");
|
||||
|
||||
queryClient.setQueryData(
|
||||
["feedback", updatedNote.id],
|
||||
updatedNote
|
||||
);
|
||||
},
|
||||
});
|
||||
};
|
Reference in New Issue
Block a user