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

todo filtering, nanny shopping

Browse Source
This commit is contained in:
ivic00
2024-12-06 23:31:27 +01:00
parent 8526d79ba1
commit a17e0f1e22
7 changed files with 92 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/(auth)/_layout.tsx
View File

@ -111,18 +111,21 @@ export default function TabLayout() {
const showViewSwitch = ["calendar", "todos", "index"].includes( const showViewSwitch = ["calendar", "todos", "index"].includes(
route.name route.name
); );
const isCalendarPage = ["calendar", "index"].includes(route.name);
if (Device.deviceType !== DeviceType.TABLET || !showViewSwitch) { if (Device.deviceType !== DeviceType.TABLET || !showViewSwitch) {
return ( return isCalendarPage ? (
<View marginR-16> <View marginR-16>
<RefreshButton onRefresh={onRefresh} isSyncing={isSyncing} /> <RefreshButton onRefresh={onRefresh} isSyncing={isSyncing} />
</View> </View>
); ) : null;
} }
return ( return (
<View marginR-16 row> <View marginR-16 row centerV>
<RefreshButton onRefresh={onRefresh} isSyncing={isSyncing} /> {isCalendarPage && (
<View marginR-16><RefreshButton onRefresh={onRefresh} isSyncing={isSyncing} /></View>
)}
<MemoizedViewSwitch navigation={navigation} /> <MemoizedViewSwitch navigation={navigation} />
</View> </View>
); );

76
components/pages/(tablet_pages)/chores/SingleUserChoreList.tsx
View File

@ -15,7 +15,12 @@ import { UserProfile } from "@/hooks/firebase/types/profileTypes";
import { ScrollView } from "react-native-gesture-handler"; import { ScrollView } from "react-native-gesture-handler";
const groupToDosByDate = (toDos: IToDo[]) => { const groupToDosByDate = (toDos: IToDo[]) => {
let sortedTodos = toDos.sort((a, b) => a.date - b.date); let sortedTodos = toDos.sort((a, b) => {
const dateA = a.date === null ? new Date() : a.date;
const dateB = b.date === null ? new Date() : b.date;
return dateA - dateB;
});
return sortedTodos.reduce( return sortedTodos.reduce(
(groups, toDo) => { (groups, toDo) => {
let dateKey; let dateKey;
@ -34,9 +39,7 @@ const groupToDosByDate = (toDos: IToDo[]) => {
}); });
}; };
if (toDo.date === null) { if (toDo.date === null || isToday(toDo.date)) {
dateKey = "No Date";
} else if (isToday(toDo.date)) {
dateKey = "Today"; dateKey = "Today";
} else if (isTomorrow(toDo.date)) { } else if (isTomorrow(toDo.date)) {
dateKey = "Tomorrow"; dateKey = "Tomorrow";
@ -228,42 +231,47 @@ const SingleUserChoreList = ({ user }: { user: UserProfile }) => {
return ( return (
<View <View
marginB-402
marginT-10 marginT-10
paddingH-10
backgroundColor="#f9f8f7" backgroundColor="#f9f8f7"
style={{ minHeight: 800, borderRadius: 9.11 }} style={{
minHeight: 600,
maxHeight: 600,
borderRadius: 9.11,
overflow: "hidden",
}}
width={355} width={355}
> >
<ScrollView> <ScrollView showsVerticalScrollIndicator={false}>
{noDateToDos.length > 0 && ( <View paddingH-10 paddingB-90>
<View key="No Date"> {noDateToDos.length > 0 && (
<View row spread paddingH-19 marginB-12> <View key="No Date">
<Text <View row spread paddingH-19 marginB-12>
text70 <Text
style={{ text70
fontWeight: "bold", style={{
}} fontWeight: "bold",
> }}
Unscheduled >
</Text> Unscheduled
<AntDesign </Text>
name={expandNoDate ? "caretdown" : "caretright"} <AntDesign
size={24} name={expandNoDate ? "caretdown" : "caretright"}
color="#fd1575" size={24}
onPress={() => { color="#fd1575"
setExpandNoDate(!expandNoDate); onPress={() => {
}} setExpandNoDate(!expandNoDate);
/> }}
/>
</View>
{expandNoDate &&
noDateToDos
.sort((a, b) => Number(a.done) - Number(b.done))
.map((item) => <ToDoItem key={item.id} item={item} />)}
</View> </View>
{expandNoDate && )}
noDateToDos
.sort((a, b) => Number(a.done) - Number(b.done))
.map((item) => <ToDoItem key={item.id} item={item} />)}
</View>
)}
{datedToDos.map(renderTodoGroup)} {datedToDos.map(renderTodoGroup)}
</View>
</ScrollView> </ScrollView>
</View> </View>
); );

9
components/pages/(tablet_pages)/chores/TabletChoresPage.tsx
View File

@ -8,6 +8,7 @@ import { ImageBackground, StyleSheet } from "react-native";
import { colorMap } from "@/constants/colorMap"; import { colorMap } from "@/constants/colorMap";
import { ScrollView } from "react-native-gesture-handler"; import { ScrollView } from "react-native-gesture-handler";
import { ProfileType, useAuthContext } from "@/contexts/AuthContext"; import { ProfileType, useAuthContext } from "@/contexts/AuthContext";
import AddChore from "../../todos/AddChore";
const TabletChoresPage = () => { const TabletChoresPage = () => {
const {data: users} = useGetFamilyMembers(); const {data: users} = useGetFamilyMembers();
@ -98,6 +99,9 @@ const TabletChoresPage = () => {
))} ))}
</View> </View>
</ScrollView> </ScrollView>
<View style={styles.addBtn}>
<AddChore />
</View>
</TabletContainer> </TabletContainer>
); );
}; };
@ -113,6 +117,11 @@ const styles = StyleSheet.create({
fontSize: 22.43, fontSize: 22.43,
color: "#2c2c2c", color: "#2c2c2c",
}, },
addBtn: {
position: 'absolute',
bottom: 50,
right: 220
}
}); });
export default TabletChoresPage; export default TabletChoresPage;

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

@ -25,6 +25,7 @@ const GroceryItem = ({
const { profileData } = useAuthContext(); const { profileData } = useAuthContext();
const { data: creator } = useGetUserById(item.creatorId); const { data: creator } = useGetUserById(item.creatorId);
const isParent = profileData?.userType === ProfileType.PARENT; const isParent = profileData?.userType === ProfileType.PARENT;
const isCaregiver = profileData?.userType === ProfileType.CAREGIVER;
const [openFreqEdit, setOpenFreqEdit] = useState<boolean>(false); const [openFreqEdit, setOpenFreqEdit] = useState<boolean>(false);
const [isEditingTitle, setIsEditingTitle] = useState<boolean>(false); const [isEditingTitle, setIsEditingTitle] = useState<boolean>(false);
@ -36,7 +37,7 @@ const GroceryItem = ({
const closeEdit = () => setIsEditingTitle(false); const closeEdit = () => setIsEditingTitle(false);
const getInitials = (firstName: string, lastName: string) => { const getInitials = (firstName: string, lastName: string) => {
return `${firstName.charAt(0)}${lastName.charAt(0)}`; return `${firstName.charAt(0).toUpperCase()}${lastName.charAt(0).toUpperCase()}`;
}; };
return ( return (
@ -81,7 +82,7 @@ const GroceryItem = ({
/> />
) : ( ) : (
<View flex> <View flex>
{isParent ? ( {(isParent || isCaregiver) && !item.bought ? (
<TouchableOpacity onPress={() => setIsEditingTitle(true)}> <TouchableOpacity onPress={() => setIsEditingTitle(true)}>
<Text <Text
text70T text70T
@ -98,7 +99,7 @@ const GroceryItem = ({
) : ( ) : (
<Text <Text
text70T text70T
style={[styles.title, { color: item.bought ? "red" : "black" }]} style={[styles.title, { textDecorationLine: item.bought ? "line-through" : "none", }]}
> >
{item.title} {item.title}
</Text> </Text>
@ -108,7 +109,7 @@ const GroceryItem = ({
{!item.approved ? ( {!item.approved ? (
<View row centerV> <View row centerV>
{isParent && ( {isParent || isCaregiver && (
<> <>
<AntDesign <AntDesign
name="check" name="check"
@ -132,7 +133,7 @@ const GroceryItem = ({
</View> </View>
) : ( ) : (
!isEditingTitle && !isEditingTitle &&
isParent && ( (isParent || isCaregiver) && (
<Checkbox <Checkbox
value={item.bought} value={item.bought}
containerStyle={[styles.checkbox, { borderRadius: 50 }]} containerStyle={[styles.checkbox, { borderRadius: 50 }]}
@ -180,7 +181,7 @@ const GroceryItem = ({
width: 24.64, width: 24.64,
aspectRatio: 1, aspectRatio: 1,
marginRight: 8, marginRight: 8,
backgroundColor: "#ccc", backgroundColor: creator?.eventColor || "gray",
borderRadius: 100, borderRadius: 100,
justifyContent: "center", justifyContent: "center",
alignItems: "center", alignItems: "center",

2
components/pages/grocery/GroceryList.tsx
View File

@ -62,7 +62,7 @@ const GroceryList = ({onInputFocus}: {onInputFocus: (y: number) => void}) => {
id: "", id: "",
title: title, title: title,
category: category, category: category,
approved: profileData?.userType === ProfileType.PARENT, approved: profileData?.userType === ProfileType.PARENT || profileData?.userType === ProfileType.CAREGIVER,
recurring: false, recurring: false,
frequency: GroceryFrequency.Never, frequency: GroceryFrequency.Never,
bought: false, bought: false,

1
components/pages/todos/AddChoreDialog.tsx
View File

@ -138,6 +138,7 @@ const AddChoreDialog = (addChoreDialogProps: IAddChoreDialog) => {
padding: 0, padding: 0,
paddingTop: 4, paddingTop: 4,
margin: 0, margin: 0,
maxWidth: 600
}} }}
visible={addChoreDialogProps.isVisible} visible={addChoreDialogProps.isVisible}
> >

35
components/pages/todos/ToDosList.tsx
View File

@ -17,7 +17,12 @@ const FILTER_OPTIONS = {
}; };
const groupToDosByDate = (toDos: IToDo[]) => { const groupToDosByDate = (toDos: IToDo[]) => {
let sortedTodos = toDos.sort((a, b) => a.date - b.date); let sortedTodos = toDos.sort((a, b) => {
const dateA = a.date === null ? new Date() : a.date;
const dateB = b.date === null ? new Date() : b.date;
return dateA - dateB;
});
return sortedTodos.reduce( return sortedTodos.reduce(
(groups, toDo) => { (groups, toDo) => {
let dateKey; let dateKey;
@ -36,9 +41,15 @@ const groupToDosByDate = (toDos: IToDo[]) => {
}); });
}; };
if (toDo.date === null) { const isOverdue = (date: Date) => {
dateKey = "No Date"; const today = new Date();
} else if (isToday(toDo.date)) { today.setHours(0, 0, 0, 0);
return date < today;
};
if (isOverdue(toDo.date) && !toDo.done) {
dateKey = "Overdue";
} else if (toDo.date === null || isToday(toDo.date)) {
dateKey = "Today"; dateKey = "Today";
} else if (isTomorrow(toDo.date)) { } else if (isTomorrow(toDo.date)) {
dateKey = "Tomorrow"; dateKey = "Tomorrow";
@ -48,7 +59,8 @@ const groupToDosByDate = (toDos: IToDo[]) => {
dateKey = "Next 30 Days"; dateKey = "Next 30 Days";
subDateKey = format(toDo.date, "MMM d"); subDateKey = format(toDo.date, "MMM d");
} else { } else {
return groups; dateKey = "Later";
subDateKey = format(toDo.date, "MMM d, yyyy");
} }
if (!groups[dateKey]) { if (!groups[dateKey]) {
@ -58,7 +70,7 @@ const groupToDosByDate = (toDos: IToDo[]) => {
}; };
} }
if (dateKey === "Next 30 Days" && subDateKey) { if ((dateKey === "Next 30 Days" || dateKey === "Later") && subDateKey) {
if (!groups[dateKey].subgroups[subDateKey]) { if (!groups[dateKey].subgroups[subDateKey]) {
groups[dateKey].subgroups[subDateKey] = []; groups[dateKey].subgroups[subDateKey] = [];
} }
@ -138,14 +150,17 @@ const ToDosList = ({ isSettings }: { isSettings?: boolean }) => {
}; };
const noDateToDos = groupedToDos["No Date"]?.items || []; const noDateToDos = groupedToDos["No Date"]?.items || [];
const datedToDos = Object.keys(groupedToDos).filter( const datedToDos = Object.keys(groupedToDos)
(key) => key !== "No Date" .filter((key) => key !== "No Date")
); .sort((a, b) => {
const order = ["Overdue", "Today", "Tomorrow", "Next 7 Days", "Next 30 Days", "Later"];
return order.indexOf(a) - order.indexOf(b);
});
const renderTodoGroup = (dateKey: string) => { const renderTodoGroup = (dateKey: string) => {
const isExpanded = expandedGroups[dateKey] || false; const isExpanded = expandedGroups[dateKey] || false;
if (dateKey === "Next 30 Days") { if (dateKey === "Next 30 Days" || dateKey === "Later") {
const subgroups = Object.entries(groupedToDos[dateKey].subgroups).sort( const subgroups = Object.entries(groupedToDos[dateKey].subgroups).sort(
([dateA], [dateB]) => { ([dateA], [dateB]) => {
const dateAObj = new Date(dateA); const dateAObj = new Date(dateA);