diff --git a/src/pages/HomePage/BoxCategory/BoxCategory.tsx b/src/pages/HomePage/BoxCategory/BoxCategory.tsx index f30a1ec..4d202c2 100644 --- a/src/pages/HomePage/BoxCategory/BoxCategory.tsx +++ b/src/pages/HomePage/BoxCategory/BoxCategory.tsx @@ -7,14 +7,13 @@ import ButtonTodoToggle from '@/shared/components/ButtonTodayToggle/ButtonTodoTo import useClickOutside from '@/shared/hooks/useClickOutside'; -import { usePatchTaskStatus } from '@/shared/apis/common/queries'; -import { usePostCreateTask } from '@/shared/apis/home/queries'; - -import { Task } from '@/shared/types/home'; +import type { TaskListType, TaskType } from '@/shared/types/tasks'; import ButtonAddIcon from '@/shared/assets/svgs/btn_task_add.svg?react'; import MeatBallDefault from '@/shared/assets/svgs/todo_meatball_default.svg?react'; +import { usePostCreateTask, usePostToggleTaskStatus } from '@/shared/apisV2/home/home.mutations'; + import { useCalendar } from '../hooks/useCalendar'; import BoxTodoInput from './BoxTodoInput/BoxTodoInput'; import StatusDefaultBoxCategory from './StatusDefaultBoxCategory/StatusDefaultBoxCategory'; @@ -25,9 +24,9 @@ const Calendar = lazy(() => import('@/shared/components/Calendar/Calendar')); interface BoxCategoryProps { id: number; title: string; - completedTodos: Task[]; - ongoingTodos: Task[]; - updateTodayTodos: (todo: Omit) => void; + completedTodos: TaskListType; + ongoingTodos: TaskListType; + updateTodayTodos: (todo: Omit) => void; addingTodayTodoStatus: boolean; getSelectedNumber: (id: number) => number; addingComplete: boolean; @@ -85,11 +84,9 @@ const BoxCategory = ({ const handleCreatePost = () => { const dataToPost = { categoryId: id, - taskData: { - name: name, - startDate: format(selectedStartDate) as string, - endDate: format(selectedEndDate), - }, + name: name, + startDate: format(selectedStartDate) as string, + endDate: format(selectedEndDate), }; mutate(dataToPost); @@ -100,7 +97,7 @@ const BoxCategory = ({ handlePeriodEnd(); }; - const { mutate: toggleTodoStatus } = usePatchTaskStatus(); + const { mutate: toggleTodoStatus } = usePostToggleTaskStatus(); if (isError) { console.error(error); @@ -167,13 +164,13 @@ const BoxCategory = ({ )} - {ongoingTodos.map(({ id, name, startDate, endDate, targetTime }) => { + {ongoingTodos.map(({ id, name, startDate, endDate, elapsedTime }) => { const todo = { id: id, name: name, startDate: startDate, endDate: endDate, - targetTime: targetTime, + elapsedTime: elapsedTime, }; const selectedNumber = getSelectedNumber(id); @@ -185,10 +182,10 @@ const BoxCategory = ({ name={name} startDate={startDate} endDate={endDate} - targetTime={targetTime} + elapsedTime={elapsedTime} isSelected={!!selectedNumber} selectedNumber={selectedNumber} - onToggleComplete={() => toggleTodoStatus(id)} + onToggleComplete={() => toggleTodoStatus({ taskId: id })} updateTodayTodos={() => updateTodayTodos(todo)} clickable={addingTodayTodoStatus} addingComplete={addingComplete} @@ -199,7 +196,7 @@ const BoxCategory = ({ {completedTodos.length !== 0 && ( - {completedTodos.map(({ id, name, startDate, endDate, targetTime }) => ( + {completedTodos.map(({ id, name, startDate, endDate, elapsedTime }) => ( toggleTodoStatus(id)} + elapsedTime={elapsedTime} + onToggleComplete={() => toggleTodoStatus({ taskId: id })} clickable={addingTodayTodoStatus} addingComplete={addingComplete} /> diff --git a/src/pages/HomePage/BoxTodayTodo/BoxTodayTodo.tsx b/src/pages/HomePage/BoxTodayTodo/BoxTodayTodo.tsx index 561008c..eb7fa8c 100644 --- a/src/pages/HomePage/BoxTodayTodo/BoxTodayTodo.tsx +++ b/src/pages/HomePage/BoxTodayTodo/BoxTodayTodo.tsx @@ -1,6 +1,6 @@ import { convertTime } from '@/shared/utils/time'; -import { Task } from '@/shared/types/home'; +import type { TaskType } from '@/shared/types/tasks'; import StatusAddBoxTodayTodo from './StatusAddBoxTodayTodo/StatusAddBoxTodayTodo'; import StatusDefaultBoxTodayTodo from './StatusDefaultBoxTodayTodo/StatusDefaultBoxTodayTodo'; @@ -8,11 +8,11 @@ import StatusDefaultBoxTodayTodo from './StatusDefaultBoxTodayTodo/StatusDefault interface BoxTodayTodoProps { time: number; addingTodayTodoStatus: boolean; - selectedTodayTodos: Omit[]; + selectedTodayTodos: Omit[]; hasTodos: boolean; enableAddingTodayTodo: () => void; disableAddingTodayTodo: () => void; - deleteTodayTodos: (todo: Omit) => void; + deleteTodayTodos: (todo: Omit) => void; getSelectedNumber: (id: number) => number; enableComplete: () => void; cancelComplte: () => void; diff --git a/src/pages/HomePage/BoxTodayTodo/StatusAddBoxTodayTodo/StatusAddBoxTodayTodo.tsx b/src/pages/HomePage/BoxTodayTodo/StatusAddBoxTodayTodo/StatusAddBoxTodayTodo.tsx index a7755be..d39c8a4 100644 --- a/src/pages/HomePage/BoxTodayTodo/StatusAddBoxTodayTodo/StatusAddBoxTodayTodo.tsx +++ b/src/pages/HomePage/BoxTodayTodo/StatusAddBoxTodayTodo/StatusAddBoxTodayTodo.tsx @@ -2,16 +2,16 @@ import BoxTodo from '@/shared/components/BoxTodo/BoxTodo'; import HomeLargeBtn from '@/shared/components/ButtonHomeLarge/ButtonHomeLarge'; import { HomeLargeBtnVariant } from '@/shared/types/global'; -import { Task } from '@/shared/types/home'; +import type { TaskType } from '@/shared/types/tasks'; import { LARGE_BTN_TEXT, SMALL_BTN_TEXT } from '@/shared/constants/btnText'; import HomeSmallBtn from './ButtonHomeSmall/ButtonHomeSmall'; interface StatusAddBoxTodayTodoProps { - selectedTodayTodos: Omit[]; + selectedTodayTodos: Omit[]; onDisableAddStatus: () => void; - deleteTodayTodos: (todo: Omit) => void; + deleteTodayTodos: (todo: Omit) => void; getSelectedNumber: (id: number) => number; enableComplete: () => void; cancelComplte: () => void; @@ -42,14 +42,14 @@ const StatusAddBoxTodayTodo = ({
{hasTodayTodos ? (
    - {selectedTodayTodos.map(({ id, targetTime, startDate, endDate, name }) => { + {selectedTodayTodos.map(({ id, elapsedTime, startDate, endDate, name }) => { const selectedNumber = getSelectedNumber(id); return (
  • { const [selectedDate, setSelectedDate] = useState(todayDate); const { startDate, endDate } = getThisWeekRange(selectedDate); - const { data: categoriesData, isError, error } = useGetAllCategoryTask(startDate, endDate); + const { data: categoriesData } = useGetCategoryTask({ startDate, endDate }); const categories = categoriesData?.data || []; + const dailyCategoryTask = getDailyCategoryTask(selectedDate, categories); const [addingTodayTodoStatus, setAddingTodayTodoStatus] = useState(false); const [addingComplete, setAddingComplete] = useState(false); - const addTodayTodoOverlayStyle = addingTodayTodoStatus && !addingComplete ? 'opacity-30 pointer-events-none' : ''; + const addTodayTodosOverlayStyle = addingTodayTodoStatus && !addingComplete ? 'opacity-30 pointer-events-none' : ''; - const [todayTodos, setTodayTodos] = useState[]>([]); + const [todayTodos, setTodayTodos] = useState[]>([]); - const { mutate: createTodayTodos } = usePostCreateTodayTodos(); + const { mutate: addTodayTodos } = usePostAddTodayTodos(); const { mutate: deleteCategory } = useDeleteCategory(); const navigate = useNavigate(); - const updateTodayTodos = (todo: Omit) => { + const updateTodayTodos = (todo: Omit) => { const canAddTask = !todayTodos.some((prevTodo) => prevTodo.id === todo.id); if (canAddTask) setTodayTodos((prev) => [...prev, todo]); else setTodayTodos((prev) => prev.filter((prevTodo) => prevTodo.id !== todo.id)); }; - const { - data: targetTimeData, - error: targetTimeError, - isError: isTargetTimeError, - } = useGetTargetTime(formattedTodayDate); - - const { targetTime } = targetTimeData?.data || 0; + const { data: workTimeData } = useGetWorkTime({ targetDate: formattedTodayDate }); const handleOpenCategoryModal = () => { categoryModalRef.current?.open(); @@ -105,7 +96,7 @@ const HomePage = () => { queryClient.invalidateQueries({ queryKey: ['msets'] }); }; - const deleteTodayTodos = (todo: Omit) => { + const deleteTodayTodos = (todo: Omit) => { setTodayTodos((prev) => prev.filter((prevTodo) => prevTodo.id !== todo.id)); }; @@ -139,34 +130,24 @@ const HomePage = () => { const handleCreateTodayTodos = () => { const todayTodoData = todayTodos.map((todo) => todo.id); const dataToPost = { - todayDate: formattedTodayDate, - todayTodos: { - taskIdList: todayTodoData, - }, + targetDate: formattedTodayDate, + taskList: todayTodoData, }; - createTodayTodos(dataToPost, { + addTodayTodos(dataToPost, { onSuccess: () => { navigate(ROUTES_CONFIG.timer.path); }, }); }; - const handleDeleteCategory = (userId: number) => { - deleteCategory(userId); + const handleDeleteCategory = (categoryId: number) => { + deleteCategory({ categoryId }); }; - if (isError) { - console.error(error); - } - - if (isTargetTimeError) { - console.error(targetTimeError); - } - return (
    -
    +
    @@ -243,7 +224,7 @@ const HomePage = () => { { onCreateTodayTodos={handleCreateTodayTodos} />
    - + {/* - + */} diff --git a/src/shared/components/BoxTodo/BoxTodo.tsx b/src/shared/components/BoxTodo/BoxTodo.tsx index 9a26f63..6fc9686 100644 --- a/src/shared/components/BoxTodo/BoxTodo.tsx +++ b/src/shared/components/BoxTodo/BoxTodo.tsx @@ -1,6 +1,6 @@ import { formatSeconds } from '@/shared/utils/time'; -import { Task } from '@/shared/types/home'; +import type { TaskType } from '@/shared/types/tasks'; import ButtonCalendarIcon from '@/shared/assets/svgs/btn_cal.svg?react'; import CheckBoxBlankIcon from '@/shared/assets/svgs/check_box_blank.svg?react'; @@ -15,13 +15,13 @@ interface BoxTodoProps { name: string; startDate: string; endDate: string | null; - targetTime: number; + elapsedTime: number; isComplete?: boolean; isSelected?: boolean; selectedNumber?: number; onClick?: () => void; onToggleComplete?: () => void; - updateTodayTodos?: (todo: Omit) => void; + updateTodayTodos?: (todo: Omit) => void; clickable?: boolean; addingComplete?: boolean; timerIncreasedTime?: number; @@ -38,19 +38,19 @@ const BoxTodo = ({ onToggleComplete, updateTodayTodos, clickable, - targetTime, + elapsedTime, addingComplete, timerIncreasedTime, }: BoxTodoProps) => { - const formattedTime = formatSeconds(timerIncreasedTime ? targetTime + timerIncreasedTime : targetTime); + const formattedTime = formatSeconds(timerIncreasedTime ? elapsedTime + timerIncreasedTime : elapsedTime); const formattedstartDate = startDate.replace(/-/g, '.'); const formattedendDate = endDate ? endDate.replace(/-/g, '.') : ''; const nameStyle = isComplete ? 'line-through' : ''; const CheckBoxIcon = isComplete ? : ; - const TimeIcon = targetTime ? : ; - const timeTextClass = targetTime ? 'text-mint-01' : 'text-gray-04'; + const TimeIcon = elapsedTime ? : ; + const timeTextClass = elapsedTime ? 'text-mint-01' : 'text-gray-04'; const selectedStyle = isSelected && !addingComplete @@ -66,7 +66,7 @@ const BoxTodo = ({ const handleClickTodo = () => { if (addingComplete) return; - if (clickable && updateTodayTodos) updateTodayTodos({ id, name, startDate, endDate, targetTime }); + if (clickable && updateTodayTodos) updateTodayTodos({ id, name, startDate, endDate, elapsedTime }); else if (onClick) { onClick(); }