ammar/cally
1
0
Fork 0
mirror of https://github.com/urosran/cally.git synced 2025-11-26 16:34:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

- Fixed issue with grocery edit not closing, reverted to the category resolving solution(fuzzy search categories), added check button for saving the grocery after editing, made code improvemnets around the groceries page

Browse Source
This commit is contained in:
Dejan
2024-10-27 18:23:29 +01:00
parent 3187844b50
commit e863b0c38e
2 changed files with 128 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
components/pages/grocery/EditGroceryItem.tsx
View File

@ -6,6 +6,7 @@ import { Dropdown } from "react-native-element-dropdown";
import CloseXIcon from "@/assets/svgs/CloseXIcon";
import { StyleSheet } from "react-native";
import DropdownIcon from "@/assets/svgs/DropdownIcon";
import {AntDesign} from "@expo/vector-icons";
interface IEditGrocery {
id?: string;
@ -14,7 +15,7 @@ interface IEditGrocery {
setTitle: (value: string) => void;
setCategory?: (category: GroceryCategory) => void;
setSubmit?: (value: boolean) => void;
closeEdit?: (value: boolean) => void;
closeEdit?: () => void;
handleEditSubmit?: Function;
}
@ -56,8 +57,22 @@ const EditGroceryItem = ({ editGrocery }: { editGrocery: IEditGrocery }) => {
value={editGrocery.title}
onChangeText={(value) => {
editGrocery.setTitle(value);
let groceryCategory = fuzzyMatchGroceryCategory(value);
if (editGrocery.setCategory) {
editGrocery.setCategory(groceryCategory);
}
}}
onSubmitEditing={() => {
maxLength={25}
/>
<View row centerV>
<AntDesign
name="check"
size={24}
style={{
color: "green",
marginRight: 15,
}}
onPress={() => {
if (editGrocery.setSubmit) {
editGrocery.setSubmit(true);
}
@ -69,17 +84,19 @@ const EditGroceryItem = ({ editGrocery }: { editGrocery: IEditGrocery }) => {
});
}
if (editGrocery.closeEdit) {
editGrocery.closeEdit(false);
editGrocery.closeEdit();
}
}}
maxLength={25}
/>
<CloseXIcon
onPress={() => {
if (editGrocery.closeEdit) editGrocery.closeEdit(false);
if (editGrocery.closeEdit) {
editGrocery.closeEdit();
}
}}
/>
</View>
</View>
<Dropdown
style={{marginTop: 15}}
data={groceryCategoryOptions}
@ -88,9 +105,7 @@ const EditGroceryItem = ({ editGrocery }: { editGrocery: IEditGrocery }) => {
labelField="label"
valueField="value"
value={
editGrocery.category == GroceryCategory.None
? null
: editGrocery.category
editGrocery.category
}
iconColor="white"
activeColor={"#fd1775"}
@ -114,8 +129,7 @@ const EditGroceryItem = ({ editGrocery }: { editGrocery: IEditGrocery }) => {
id: editGrocery.id,
category: item.value,
});
console.log("kategorija vo diropdown: " + item.value);
if (editGrocery.closeEdit) editGrocery.closeEdit(false);
if (editGrocery.closeEdit) editGrocery.closeEdit();
} else {
if (editGrocery.setCategory) {
editGrocery.setCategory(item.value);

59
components/pages/grocery/GroceryItem.tsx
View File

@ -23,12 +23,14 @@ const GroceryItem = ({
const [openFreqEdit, setOpenFreqEdit] = useState<boolean>(false);
const [isEditingTitle, setIsEditingTitle] = useState<boolean>(false);
const [newTitle, setNewTitle] = useState<string>("");
const [category, setCategory] = useState<GroceryCategory>(
GroceryCategory.None
);
const [newTitle, setNewTitle] = useState<string>(item.title ?? "");
const [category, setCategory] = useState<GroceryCategory>(item.category ?? GroceryCategory.None);
const [itemCreator, setItemCreator] = useState<UserProfile>(null);
const closeEdit = () => {
setIsEditingTitle(false);
}
const handleTitleChange = (newTitle: string) => {
updateGroceryItem({ id: item?.id, title: newTitle });
};
@ -38,7 +40,6 @@ const GroceryItem = ({
};
useEffect(() => {
setNewTitle(item.title);
console.log(item);
getItemCreator(item?.creatorId);
}, []);
@ -81,9 +82,21 @@ const GroceryItem = ({
setOpenFreqEdit(false);
}}
/>
{!isEditingTitle ? (
{isEditingTitle ?
<EditGroceryItem
editGrocery={{
id: item.id,
title: newTitle,
category: category,
setTitle: setNewTitle,
setCategory: setCategory,
closeEdit: closeEdit,
handleEditSubmit: updateGroceryItem,
}}
/> :
<View>
{ isParent ? <TouchableOpacity onPress={() => setIsEditingTitle(true)}>
{isParent ?
<TouchableOpacity onPress={() => setIsEditingTitle(true)}>
<Text text70T black style={styles.title}>
{item.title}
</Text>
@ -93,40 +106,27 @@ const GroceryItem = ({
</Text>
}
</View>
) : (
<EditGroceryItem
editGrocery={{
id: item.id,
title: newTitle,
category: item.category,
setTitle: setNewTitle,
setCategory: setCategory,
closeEdit: setIsEditingTitle,
handleEditSubmit: updateGroceryItem,
}}
/>
)}
}
{!item.approved ? (
<View row centerV marginB-10>
{isParent && <><AntDesign
{isParent &&
<>
<AntDesign
name="check"
size={24}
style={{
color: "green",
marginRight: 15,
}}
onPress={() => {
isParent ? handleItemApproved(item.id, { approved: true }) : null
}}
onPress={isParent ? () => handleItemApproved(item.id, { approved: true }) : null}
/>
<AntDesign
name="close"
size={24}
style={{ color: "red" }}
onPress={() => {
isParent ? handleItemApproved(item.id, { approved: false }) : null
}}
/> </>}
onPress={isParent ? () => handleItemApproved(item.id, { approved: false }) : null}
/>
</>}
</View>
) : (
!isEditingTitle && (
@ -158,7 +158,8 @@ const GroceryItem = ({
borderRadius: 22,
overflow: "hidden",
}}
/> : <View
/> :
<View
style={{
position: "relative",
width: 24.64,