From f4aab22b4ea09429472c5d56ef811e760a1f6459 Mon Sep 17 00:00:00 2001 From: codeisneverodd Date: Tue, 21 Jun 2022 03:38:11 +0900 Subject: [PATCH 1/6] =?UTF-8?q?feat:=20timer=20=EB=A6=AC=EC=85=8B=EC=9D=84?= =?UTF-8?q?=20=EC=9C=84=ED=95=9C=20=ED=95=A8=EC=88=98=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/shared/hooks/useTimers.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/shared/hooks/useTimers.js b/src/shared/hooks/useTimers.js index 6a93a51..50ca23a 100644 --- a/src/shared/hooks/useTimers.js +++ b/src/shared/hooks/useTimers.js @@ -45,7 +45,9 @@ export const useTimers = () => { setOriginId(null) setTimers(newTimers) } - + const resetTimers = (newTimers = {}) => { + setTimers(newTimers) + } return { timers, changeTime, @@ -53,5 +55,6 @@ export const useTimers = () => { addTimer, completeTimer, mergeTimer, + resetTimers, } } From 1aa5a182a31ffd27dbdead29a491a7d50b5ac3e5 Mon Sep 17 00:00:00 2001 From: codeisneverodd Date: Tue, 21 Jun 2022 03:39:11 +0900 Subject: [PATCH 2/6] =?UTF-8?q?feat:=20createSpareTime,=20createNameIds=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=EC=84=9C=20=EC=82=AC?= =?UTF-8?q?=EC=9A=A9=EB=90=A0=20useCreatingTimers=20=ED=9B=85=20=EA=B5=AC?= =?UTF-8?q?=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/shared/hooks/useCreatingTimers.js | 38 +++++++++++++++++++++++++++ 1 file changed, 38 insertions(+) create mode 100644 src/shared/hooks/useCreatingTimers.js diff --git a/src/shared/hooks/useCreatingTimers.js b/src/shared/hooks/useCreatingTimers.js new file mode 100644 index 0000000..4172d30 --- /dev/null +++ b/src/shared/hooks/useCreatingTimers.js @@ -0,0 +1,38 @@ +import { atom, useRecoilState } from 'recoil' + +export const TIME_TYPE = Object.freeze({ + HOUR: 'hour', + MINUTE: 'minute', +}) + +const spareTimeState = atom({ + key: 'spareTimeState', + default: { [TIME_TYPE.HOUR]: '0', [TIME_TYPE.MINUTE]: '0' }, +}) +const nameIdState = atom({ + key: 'nameIdState', + default: [], // {id,name} +}) + +export const useCreatingTimers = () => { + const [spareTime, setSpareTime] = useRecoilState(spareTimeState) + const [nameIds, setNameIds] = useRecoilState(nameIdState) + + const updateSpareTime = (timeType, value) => { + setSpareTime({ ...spareTime, [timeType]: value }) + } + const addNameId = (id, name) => { + setNameIds([...nameIds, { id, name }]) + } + const updateNameIds = newNames => { + setNameIds(newNames) + } + + return { + spareTime, + nameIds, + updateSpareTime, + addNameId, + updateNameIds, + } +} From 1455160033f5dae4115d8acab596c99f486a10a3 Mon Sep 17 00:00:00 2001 From: codeisneverodd Date: Tue, 21 Jun 2022 03:39:42 +0900 Subject: [PATCH 3/6] =?UTF-8?q?feat:=20=ED=8E=98=EC=9D=B4=EC=A7=80=20?= =?UTF-8?q?=EB=84=A4=EC=9D=B4=EB=B0=8D=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/routes.js | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/pages/routes.js b/src/pages/routes.js index 4585b7e..131df78 100644 --- a/src/pages/routes.js +++ b/src/pages/routes.js @@ -5,14 +5,14 @@ import Signup from 'pages/SignUp' import MyPage from 'pages/MyPage' import SelectUserType from 'pages/SelectUserType' -import CreateTime from 'pages/CreateTime' -import CreateTask from 'pages/CreateTask' -import CreateTimeDivider from 'pages/CreateTimeDivider' +import CreateSpareTime from 'pages/CreateSpareTime' +import DivideTime from 'pages/DivideTime' import UpdateTimeDivider from 'pages/UpdateTimeDivider' import ShareTask from 'pages/ShareTask' import NotFound from 'pages/NotFound' import MyPageEdit from 'pages/MyPageEdit' +import CreateNameIds from './CreateNameIds' const routes = [ { path: 'myPageEdit', view: MyPageEdit }, @@ -31,18 +31,18 @@ const routes = [ title: '첫 화면', }, { - path: 'createTime', - view: CreateTime, + path: 'createSpareTime', + view: CreateSpareTime, title: '오늘의 시간', }, { - path: 'createTask', - view: CreateTask, + path: 'createNameIds', + view: CreateNameIds, title: '해야 할 일을 적어요', }, { - path: 'createTimeDivider', - view: CreateTimeDivider, + path: 'divideTime', + view: DivideTime, title: '시간을 분배해요', }, { From d6455484da118d89832c7595e46b1f072f8eb27f Mon Sep 17 00:00:00 2001 From: codeisneverodd Date: Tue, 21 Jun 2022 03:40:54 +0900 Subject: [PATCH 4/6] =?UTF-8?q?etc:=20=ED=8E=98=EC=9D=B4=EC=A7=80=20?= =?UTF-8?q?=EC=9D=B4=EB=A6=84=20=EB=B3=80=EA=B2=BD=EC=9C=BC=EB=A1=9C=20?= =?UTF-8?q?=EC=9D=B8=ED=95=9C=20=ED=8C=8C=EC=9D=BC=20=EC=9D=B4=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../{CreateTask => CreateNameIds}/index.js | 41 ++++++++----------- .../{CreateTask => CreateNameIds}/style.js | 0 .../{CreateTime => CreateSpareTime}/index.js | 27 ++++++------ .../{CreateTime => CreateSpareTime}/style.js | 0 .../DivideTime}/components/TaskBox.jsx | 8 ++-- .../style.js | 0 6 files changed, 35 insertions(+), 41 deletions(-) rename src/pages/{CreateTask => CreateNameIds}/index.js (55%) rename src/pages/{CreateTask => CreateNameIds}/style.js (100%) rename src/pages/{CreateTime => CreateSpareTime}/index.js (73%) rename src/pages/{CreateTime => CreateSpareTime}/style.js (100%) rename src/{shared => pages/DivideTime}/components/TaskBox.jsx (84%) rename src/pages/{CreateTimeDivider => DivideTime}/style.js (100%) diff --git a/src/pages/CreateTask/index.js b/src/pages/CreateNameIds/index.js similarity index 55% rename from src/pages/CreateTask/index.js rename to src/pages/CreateNameIds/index.js index a3c0d62..f990af5 100644 --- a/src/pages/CreateTask/index.js +++ b/src/pages/CreateNameIds/index.js @@ -1,6 +1,4 @@ -import useCreateTasks from './hooks/useCreateTasks' -import useNavigation from 'shared/hooks/useNavigation' -import { Link, useLocation } from 'react-router-dom' +import { Link } from 'react-router-dom' import * as S from './style' import { colors } from 'shared/constants/colors' @@ -10,23 +8,20 @@ import Text from 'shared/components/Text' import Button from 'shared/components/Button' import Input from 'shared/components/Input' import Badge from 'shared/components/Badge' +import { useCreatingTimers } from '../../shared/hooks/useCreatingTimers' +import { useMemo } from 'react' +import useNameTags from './hooks/useNameTag' const BUTTON_TEXT = Object.freeze({ VALID: '계속 진행하기', INVALID: '할 일을 입력해주세요', }) -const CreateTask = () => { - const location = useLocation() - const { tasks, task, spareTime, setSpareTime, setTask, removeTask, handleSubmit, isValidTasks } = - useCreateTasks() +const CreateNameIds = () => { + const { nameIds } = useCreatingTimers() + const { nameTag, setNameTag, removeNameTag, handleNameTagSubmit } = useNameTags() - const navigationValidator = () => { - const { spareTime } = location.state - setSpareTime(spareTime) - } - - useNavigation(navigationValidator) + const isValidNames = useMemo(() => nameIds.length > 0, [nameIds]) return ( @@ -43,17 +38,17 @@ const CreateTask = () => { - {tasks.map(({ id, task }) => ( - removeTask(id)}> - {task} + {nameIds.map(({ id, name }) => ( + removeNameTag(id)}> + {name} ))} - + setTask(e.target.value)} + value={nameTag} + onChange={e => setNameTag(e.target.value)} autoFocus={true} required /> @@ -64,9 +59,9 @@ const CreateTask = () => { - - @@ -74,4 +69,4 @@ const CreateTask = () => { ) } -export default CreateTask +export default CreateNameIds diff --git a/src/pages/CreateTask/style.js b/src/pages/CreateNameIds/style.js similarity index 100% rename from src/pages/CreateTask/style.js rename to src/pages/CreateNameIds/style.js diff --git a/src/pages/CreateTime/index.js b/src/pages/CreateSpareTime/index.js similarity index 73% rename from src/pages/CreateTime/index.js rename to src/pages/CreateSpareTime/index.js index abccc42..eca7b61 100644 --- a/src/pages/CreateTime/index.js +++ b/src/pages/CreateSpareTime/index.js @@ -1,4 +1,4 @@ -import React, { useMemo, useState } from 'react' +import React, { useMemo } from 'react' import { Link } from 'react-router-dom' import * as S from './style' @@ -6,6 +6,7 @@ import NavBar from 'shared/components/NavBar' import Text from 'shared/components/Text' import Button from 'shared/components/Button' import Select from 'shared/components/Select' +import { TIME_TYPE, useCreatingTimers } from '../../shared/hooks/useCreatingTimers' const HOUR_NUMBERS = Array.from({ length: 24 }, (_, i) => { return { label: `${i}`, value: i } @@ -15,26 +16,22 @@ const MINUTE_NUMBERS = Array.from({ length: 6 }, (_, i) => { return { label: `${i * 10}`, value: i * 10 } }) -const TIME_TYPE = Object.freeze({ - HOUR: 'hour', - MINUTE: 'minute', -}) - const BUTTON_TEXT = Object.freeze({ VALID: '다음 단계', INVALID: '시간을 입력해주세요', }) -const CreateTime = () => { - const [spareTime, setSpareTime] = useState({ [TIME_TYPE.HOUR]: '0', [TIME_TYPE.MINUTE]: '0' }) +const CreateSpareTime = () => { + const { spareTime, updateSpareTime } = useCreatingTimers() + const isValidSpareTime = useMemo( () => spareTime.hour !== '0' || spareTime.minute !== '0', [spareTime], ) - const handleSpareTime = e => { + const handleSpareTimeChange = e => { const { name, value } = e.target - setSpareTime({ ...spareTime, [name]: value }) + updateSpareTime(name, value) } return ( @@ -52,20 +49,22 @@ const CreateTime = () => { name={'hour'} data={HOUR_NUMBERS} style={{ width: '10rem' }} - onChange={handleSpareTime} + onChange={handleSpareTimeChange} + value={spareTime[TIME_TYPE.HOUR]} /> 시간