From e9745683748ac5ecfdf704607441a3204d8c5516 Mon Sep 17 00:00:00 2001 From: Mo Tarbin Date: Sat, 10 Aug 2024 02:08:49 -0400 Subject: Update Fetcher.jsx to include UpdateChoreAssignee function and ChoreCard.jsx to handle assignee change --- src/views/Chores/ChoreCard.jsx | 23 ++++++++++++++++------- 1 file changed, 16 insertions(+), 7 deletions(-) (limited to 'src/views/Chores') diff --git a/src/views/Chores/ChoreCard.jsx b/src/views/Chores/ChoreCard.jsx index 97e407a..fdf025e 100644 --- a/src/views/Chores/ChoreCard.jsx +++ b/src/views/Chores/ChoreCard.jsx @@ -39,7 +39,7 @@ import moment from 'moment' import React, { useEffect } from 'react' import { useNavigate } from 'react-router-dom' import { API_URL } from '../../Config' -import { MarkChoreComplete, SkipChore } from '../../utils/Fetcher' +import { MarkChoreComplete, SkipChore, UpdateChoreAssignee } from '../../utils/Fetcher' import { Fetch } from '../../utils/TokenManager' import ConfirmationModal from '../Modals/Inputs/ConfirmationModal' import DateModal from '../Modals/Inputs/DateModal' @@ -219,7 +219,16 @@ const ChoreCard = ({ }) } const handleAssigneChange = assigneeId => { - // TODO: Implement assignee change + UpdateChoreAssignee(chore.id, assigneeId).then(response => { + if (response.ok) { + response.json().then(data => { + const newChore = data.res + onChoreUpdate(newChore, 'assigned') + }) + } + } + ) + } const handleCompleteWithNote = note => { Fetch(`${API_URL}/chores/${chore.id}/do`, { @@ -547,10 +556,6 @@ const ChoreCard = ({ Delegate to someone else - - - Complete as someone else - { @@ -620,10 +625,14 @@ const ChoreCard = ({ options={performers} displayKey='displayName' title={`Delegate to someone else`} + placeholder={'Select a performer'} onClose={() => { setIsChangeAssigneeModalOpen(false) }} - onSave={handleAssigneChange} + onSave={(selected)=>{ + handleAssigneChange(selected.id) + } + } /> Date: Sun, 1 Sep 2024 14:11:08 -0400 Subject: Add CookiePermissionSnackbar component to Landing page, Better UI to selected dates --- src/views/Chores/ChoreCard.jsx | 40 ++++++++++++++++++++++++++++++---------- 1 file changed, 30 insertions(+), 10 deletions(-) (limited to 'src/views/Chores') diff --git a/src/views/Chores/ChoreCard.jsx b/src/views/Chores/ChoreCard.jsx index fdf025e..29ee933 100644 --- a/src/views/Chores/ChoreCard.jsx +++ b/src/views/Chores/ChoreCard.jsx @@ -3,7 +3,6 @@ import { Check, Delete, Edit, - HowToReg, KeyboardDoubleArrowUp, LocalOffer, ManageSearch, @@ -39,7 +38,11 @@ import moment from 'moment' import React, { useEffect } from 'react' import { useNavigate } from 'react-router-dom' import { API_URL } from '../../Config' -import { MarkChoreComplete, SkipChore, UpdateChoreAssignee } from '../../utils/Fetcher' +import { + MarkChoreComplete, + SkipChore, + UpdateChoreAssignee, +} from '../../utils/Fetcher' import { Fetch } from '../../utils/TokenManager' import ConfirmationModal from '../Modals/Inputs/ConfirmationModal' import DateModal from '../Modals/Inputs/DateModal' @@ -226,9 +229,7 @@ const ChoreCard = ({ onChoreUpdate(newChore, 'assigned') }) } - } - ) - + }) } const handleCompleteWithNote = note => { Fetch(`${API_URL}/chores/${chore.id}/do`, { @@ -314,8 +315,28 @@ const ChoreCard = ({ return 'Yearly' } else if (chore.frequencyType === 'days_of_the_week') { let days = JSON.parse(chore.frequencyMetadata).days - days = days.map(d => moment().day(d).format('ddd')) - return days.join(', ') + if (days.length > 4) { + const allDays = [ + 'Sunday', + 'Monday', + 'Tuesday', + 'Wednesday', + 'Thursday', + 'Friday', + 'Saturday', + ] + const selectedDays = days.map(d => moment().day(d).format('dddd')) + const notSelectedDay = allDays.filter( + day => !selectedDays.includes(day), + ) + const notSelectedShortdays = notSelectedDay.map(d => + moment().day(d).format('ddd'), + ) + return `Daily except ${notSelectedShortdays.join(', ')}` + } else { + days = days.map(d => moment().day(d).format('ddd')) + return days.join(', ') + } } else if (chore.frequencyType === 'day_of_the_month') { let freqData = JSON.parse(chore.frequencyMetadata) const months = freqData.months.map(m => moment().month(m).format('MMM')) @@ -629,10 +650,9 @@ const ChoreCard = ({ onClose={() => { setIsChangeAssigneeModalOpen(false) }} - onSave={(selected)=>{ + onSave={selected => { handleAssigneChange(selected.id) - } - } + }} /> Date: Fri, 6 Sep 2024 01:22:10 -0400 Subject: Update MyChore to have filter button instead of chips --- src/views/Chores/MyChores.jsx | 169 +++++++++++++++++++++--------------------- 1 file changed, 86 insertions(+), 83 deletions(-) (limited to 'src/views/Chores') diff --git a/src/views/Chores/MyChores.jsx b/src/views/Chores/MyChores.jsx index d4eed5a..f7b27da 100644 --- a/src/views/Chores/MyChores.jsx +++ b/src/views/Chores/MyChores.jsx @@ -1,13 +1,17 @@ -import { Add, CancelRounded, EditCalendar } from '@mui/icons-material' import { - Badge, + Add, + CancelRounded, + EditCalendar, + FilterAlt, + FilterAltOff, +} from '@mui/icons-material' +import { Box, - Checkbox, + Chip, Container, IconButton, Input, List, - ListItem, Menu, MenuItem, Snackbar, @@ -192,95 +196,27 @@ const MyChores = () => { My Chores */} {/* */} - - {['All', 'Overdue', 'Due today', 'Due in week'].map(filter => ( - - - handleSelectedFilter(filter)} - checked={filter === selectedFilter} - disableIcon - overlay - size='sm' - /> - - - ))} - - - - - - { - setFilteredChores( - FILTERS['Assigned To Me'](chores, userProfile.id), - ) - setSelectedFilter('Assigned To Me') - handleFilterMenuClose() - }} - > - Assigned to me - - { - setFilteredChores( - FILTERS['Created By Me'](chores, userProfile.id), - ) - setSelectedFilter('Created By Me') - handleFilterMenuClose() - }} - > - Created by me - - { - setFilteredChores(FILTERS['No Due Date'](chores, userProfile.id)) - setSelectedFilter('No Due Date') - handleFilterMenuClose() - }} - > - No Due Date - - - - {/* Search box to filter */} - { ) } /> + + {selectedFilter && selectedFilter != 'All' ? ( + + ) : ( + + )} + + + {/* */} + + + {Object.keys(FILTERS).map(filter => ( + { + const filterFunction = FILTERS[filter] + const filteredChores = + filterFunction.length === 2 + ? filterFunction(chores, userProfile.id) + : filterFunction(chores) + setFilteredChores(filteredChores) + setSelectedFilter(filter) + handleFilterMenuClose() + }} + > + {filter} + + {FILTERS[filter].length === 2 + ? FILTERS[filter](chores, userProfile.id).length + : FILTERS[filter](chores).length} + + + ))} + + {/* */} -- cgit