From eff890890b9999aeae1e1f28bc0562314aa50e63 Mon Sep 17 00:00:00 2001 From: MurakawaTakuya Date: Fri, 20 Dec 2024 19:02:55 +0900 Subject: [PATCH] =?UTF-8?q?=E6=8A=95=E7=A8=BF=E3=81=97=E3=81=9F=E3=82=89?= =?UTF-8?q?=E5=90=8C=E3=81=98=E7=9B=AE=E6=A8=99=E3=82=92=E6=AC=A1=E3=81=AE?= =?UTF-8?q?=E6=97=A5=E3=81=AB=E8=A4=87=E8=A3=BD=E3=81=99=E3=82=8B=E3=83=9C?= =?UTF-8?q?=E3=82=BF=E3=83=B3=E3=82=92=E8=A1=A8=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../GoalModal/CopyGoalAfterPostButton.tsx | 34 ++++++++ src/Components/GoalModal/CopyGoalButton.tsx | 6 +- src/Components/GoalModal/CreateGoalModal.tsx | 1 + src/Components/PostModal/PostModal.tsx | 9 +- src/Components/Progress/Progress.tsx | 87 +++++++++++++++---- 5 files changed, 117 insertions(+), 20 deletions(-) create mode 100644 src/Components/GoalModal/CopyGoalAfterPostButton.tsx diff --git a/src/Components/GoalModal/CopyGoalAfterPostButton.tsx b/src/Components/GoalModal/CopyGoalAfterPostButton.tsx new file mode 100644 index 0000000..731ab11 --- /dev/null +++ b/src/Components/GoalModal/CopyGoalAfterPostButton.tsx @@ -0,0 +1,34 @@ +import { Add } from "@mui/icons-material"; +import { Button } from "@mui/joy"; +import { useState } from "react"; +import CreateGoalModal from "./CreateGoalModal"; + +export default function CopyGoalAfterPostButton({ + goalText, + deadline, +}: { + goalText: string; + deadline: string; +}) { + const [open, setOpen] = useState(false); + + return ( + <> + + + + + ); +} diff --git a/src/Components/GoalModal/CopyGoalButton.tsx b/src/Components/GoalModal/CopyGoalButton.tsx index 019c06d..042fff6 100644 --- a/src/Components/GoalModal/CopyGoalButton.tsx +++ b/src/Components/GoalModal/CopyGoalButton.tsx @@ -4,10 +4,10 @@ import CreateGoalModal from "./CreateGoalModal"; export default function CopyModalButton({ deadline, - text, + goalText, }: { deadline: string; - text: string; + goalText: string; }) { const [open, setOpen] = useState(false); @@ -21,7 +21,7 @@ export default function CopyModalButton({ diff --git a/src/Components/GoalModal/CreateGoalModal.tsx b/src/Components/GoalModal/CreateGoalModal.tsx index 36a6c4b..3472a55 100644 --- a/src/Components/GoalModal/CreateGoalModal.tsx +++ b/src/Components/GoalModal/CreateGoalModal.tsx @@ -41,6 +41,7 @@ export default function CreateGoalModal({ const localDate = new Date( convertedDate.getTime() - convertedDate.getTimezoneOffset() * 60000 ); + localDate.setDate(localDate.getDate() + 1); // 1日後にする setDueDate(localDate.toISOString().slice(0, 16)); } }, [defaultText, defaultDeadline]); diff --git a/src/Components/PostModal/PostModal.tsx b/src/Components/PostModal/PostModal.tsx index 65ca544..769e369 100644 --- a/src/Components/PostModal/PostModal.tsx +++ b/src/Components/PostModal/PostModal.tsx @@ -24,7 +24,13 @@ import Typography from "@mui/material/Typography"; import { styled } from "@mui/material/styles"; import React, { ChangeEvent, useState } from "react"; -export default function PostModal({ goalId }: { goalId: string }) { +export default function PostModal({ + goalId, + setIsSubmitted, +}: { + goalId: string; + setIsSubmitted: React.Dispatch>; +}) { const [open, setOpen] = useState(false); const [text, setText] = useState(""); const [image, setImage] = useState(null); @@ -104,6 +110,7 @@ export default function PostModal({ goalId }: { goalId: string }) { message: "投稿しました", type: "success", }); + setIsSubmitted(true); setImage(null); setText(""); diff --git a/src/Components/Progress/Progress.tsx b/src/Components/Progress/Progress.tsx index b0f71c5..29fa70c 100644 --- a/src/Components/Progress/Progress.tsx +++ b/src/Components/Progress/Progress.tsx @@ -15,6 +15,7 @@ import { Divider } from "@mui/material"; import { ReactNode, useEffect, useState } from "react"; import DeleteGoalModal from "../DeleteGoalModal/DeleteGoalModal"; import DeletePostModal from "../DeletePostModal/DeletePostModal"; +import CopyGoalAfterPostButton from "../GoalModal/CopyGoalAfterPostButton"; import CopyModalButton from "../GoalModal/CopyGoalButton"; import PostModal from "../PostModal/PostModal"; @@ -98,18 +99,40 @@ export default function Progress({ <> {allResults.map((result) => { const userName = userNames[result.userId] || "Loading..."; + + if (!user) { + return null; + } + if (result.type === "success") { - return successStep( - result as SuccessResult, - userName, - user as UserData + return ( + ); } if (result.type === "failed") { - return failedStep(result as GoalWithId, userName, user as UserData); + return ( + + ); } if (result.type === "pending") { - return pendingStep(result as GoalWithId, userName, user as UserData); + return ( + + ); } return null; })} @@ -117,11 +140,15 @@ export default function Progress({ ); } -const successStep = ( - result: SuccessResult, - userName: string, - user: UserData -) => { +const SuccessStep = ({ + result, + userName, + user, +}: { + result: SuccessResult; + userName: string; + user: UserData; +}) => { return ( { +const FailedStep = ({ + result, + userName, + user, +}: { + result: GoalWithId; + userName: string; + user: UserData; +}) => { return ( { ); }; -const pendingStep = (result: GoalWithId, userName: string, user: UserData) => { +const PendingStep = ({ + result, + userName, + user, +}: { + result: GoalWithId; + userName: string; + user: UserData; +}) => { + const [isSubmitted, setIsSubmitted] = useState(false); + return ( { userId={result.userId} user={user} /> - {/* 自分の作成した目標の場合のみ投稿可能にする */} - {result.userId === user?.userId && } + {isSubmitted ? ( + // 投稿したら同じ目標で明日にも作成できるボタンを表示する + + ) : ( + // 自分の作成した目標の場合のみ投稿可能にする + result.userId === user?.userId && ( + + ) + )} ); @@ -293,7 +348,7 @@ const GoalCard = ({ {formatStringToDate(deadline)}までに
- + {/* 期限の1時間以内、もしくは自分の目標ではない場合は削除できないようにする */} {!isWithinOneHour && userId === user?.userId && (