From 3a4519cb640fee59cdb4e6d9e3e9ddbcef46a37d Mon Sep 17 00:00:00 2001 From: Mo Tarbin Date: Sun, 1 Sep 2024 14:11:08 -0400 Subject: Add CookiePermissionSnackbar component to Landing page, Better UI to selected dates --- package.json | 2 +- src/views/Chores/ChoreCard.jsx | 40 +++++++++++++++++++------- src/views/Landing/CookiePermissionSnackbar.jsx | 40 ++++++++++++++++++++++++++ src/views/Landing/Landing.jsx | 3 +- 4 files changed, 73 insertions(+), 12 deletions(-) create mode 100644 src/views/Landing/CookiePermissionSnackbar.jsx diff --git a/package.json b/package.json index 3e9cd92..ea12bfe 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "donetick", "private": true, - "version": "0.1.73", + "version": "0.1.74", "type": "module", "lint-staged": { "*.{js,jsx,ts,tsx}": [ 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) - } - } + }} /> { + useEffect(() => { + const cookiePermission = Cookies.get('cookies_permission') + + if (cookiePermission !== 'true') { + setOpen(true) + } + }, []) + + const [open, setOpen] = useState(false) + const handleClose = () => { + // Cookies.set('cookies_permission', 'true') + setOpen(false) + } + + return ( + { + if (reason === 'clickaway') { + return + } + // Cookies.set('cookies_permission', 'true') + handleClose() + }} + > + We use cookies to ensure you get the best experience on our website. + + + ) +} + +export default CookiePermissionSnackbar diff --git a/src/views/Landing/Landing.jsx b/src/views/Landing/Landing.jsx index 7e70a03..a323ecc 100644 --- a/src/views/Landing/Landing.jsx +++ b/src/views/Landing/Landing.jsx @@ -3,6 +3,7 @@ import AOS from 'aos' import 'aos/dist/aos.css' import { useEffect } from 'react' import { useNavigate } from 'react-router-dom' +import CookiePermissionSnackbar from './CookiePermissionSnackbar' import DemoAssignee from './DemoAssignee' import DemoHistory from './DemoHistory' import DemoMyChore from './DemoMyChore' @@ -52,7 +53,7 @@ const Landing = () => { mb: 5, }} > - +