From 0cad760af0d58c67055b3452af2efb1833f7c58f Mon Sep 17 00:00:00 2001 From: JoaoSaIvador Date: Thu, 19 Jan 2023 15:46:38 +0000 Subject: [PATCH 1/3] fix: store state on create slack group checkbox --- .../SplitBoard/SubTeamsTab/MainBoardCard.tsx | 6 +++--- frontend/src/components/Primitives/Checkbox.tsx | 12 +----------- frontend/src/hooks/useCreateBoard.tsx | 11 +++++++++++ 3 files changed, 15 insertions(+), 14 deletions(-) diff --git a/frontend/src/components/CreateBoard/SplitBoard/SubTeamsTab/MainBoardCard.tsx b/frontend/src/components/CreateBoard/SplitBoard/SubTeamsTab/MainBoardCard.tsx index 261ec9a57..b81df9ade 100644 --- a/frontend/src/components/CreateBoard/SplitBoard/SubTeamsTab/MainBoardCard.tsx +++ b/frontend/src/components/CreateBoard/SplitBoard/SubTeamsTab/MainBoardCard.tsx @@ -43,6 +43,7 @@ const MainBoardCard = React.memo(({ team }: MainBoardCardInterface) => { const { handleAddTeam, handleRemoveTeam, + handleSlackToggle, createBoardData: { board }, setCreateBoardData, canAdd, @@ -153,10 +154,9 @@ const MainBoardCard = React.memo(({ team }: MainBoardCardInterface) => { - {/* onClick={slackEnableHandler} */} > | null; - handleChange?: (value: string) => void; - shouldUseForm?: boolean; + handleChange?: (value?: string) => void; handleSelectAll?: () => void; hasSelectAll?: boolean; }> = ({ @@ -81,7 +79,6 @@ const Checkbox: React.FC<{ checked, disabled, handleChange, - shouldUseForm, setCheckedTerms, handleSelectAll, hasSelectAll, @@ -92,13 +89,10 @@ const Checkbox: React.FC<{ disabled: false, handleChange: undefined, setCheckedTerms: null, - shouldUseForm: false, handleSelectAll: undefined, hasSelectAll: false, }; - const formContext = useFormContext(); - const [currentCheckValue, setCurrentCheckValue] = useState( checked, ); @@ -107,10 +101,6 @@ const Checkbox: React.FC<{ if (handleSelectAll) handleSelectAll(); setCurrentCheckValue(isChecked); if (setCheckedTerms != null) setCheckedTerms(!!isChecked); - - if (shouldUseForm) { - formContext.setValue('slackEnable', !!isChecked); - } }; const checkValue = hasSelectAll ? checked : currentCheckValue; diff --git a/frontend/src/hooks/useCreateBoard.tsx b/frontend/src/hooks/useCreateBoard.tsx index eef0f9251..3f8996566 100644 --- a/frontend/src/hooks/useCreateBoard.tsx +++ b/frontend/src/hooks/useCreateBoard.tsx @@ -218,11 +218,22 @@ const useCreateBoard = (team?: Team) => { })); }; + const handleSlackToggle = () => { + setCreateBoardData((prev) => ({ + ...prev, + board: { + ...prev.board, + slackEnable: !prev.board.slackEnable, + }, + })); + }; + return { createBoardData, setCreateBoardData, handleAddTeam, handleRemoveTeam, + handleSlackToggle, canAdd, canReduce, generateSubBoard, From 7e53bf617c1bec5048396272da6db81c6edfbbd8 Mon Sep 17 00:00:00 2001 From: JoaoSaIvador Date: Thu, 19 Jan 2023 16:02:07 +0000 Subject: [PATCH 2/3] fix: checkbox handleChange type --- frontend/src/components/Primitives/Checkbox.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/components/Primitives/Checkbox.tsx b/frontend/src/components/Primitives/Checkbox.tsx index 88bf81324..9d77f561c 100644 --- a/frontend/src/components/Primitives/Checkbox.tsx +++ b/frontend/src/components/Primitives/Checkbox.tsx @@ -68,7 +68,7 @@ const Checkbox: React.FC<{ disabled?: boolean; size: '12' | '16'; setCheckedTerms?: Dispatch> | null; - handleChange?: (value?: string) => void; + handleChange?: ((value: string) => void) | (() => void); handleSelectAll?: () => void; hasSelectAll?: boolean; }> = ({ From 03d9988eb4af621141c3d61890409acff14b3f27 Mon Sep 17 00:00:00 2001 From: JoaoSaIvador Date: Thu, 19 Jan 2023 17:45:29 +0000 Subject: [PATCH 3/3] fix: switch from useForm to board recoil state --- frontend/src/pages/boards/newSplitBoard.tsx | 28 +++++++++------------ 1 file changed, 12 insertions(+), 16 deletions(-) diff --git a/frontend/src/pages/boards/newSplitBoard.tsx b/frontend/src/pages/boards/newSplitBoard.tsx index 701aec73e..22da07cb9 100644 --- a/frontend/src/pages/boards/newSplitBoard.tsx +++ b/frontend/src/pages/boards/newSplitBoard.tsx @@ -109,19 +109,16 @@ const NewSplitBoard: NextPage = () => { /** * React Hook Form */ - const methods = useForm<{ text: string; team: string; maxVotes?: number; slackEnable?: boolean }>( - { - mode: 'onBlur', - reValidateMode: 'onBlur', - defaultValues: { - text: '', - maxVotes: boardState.board.maxVotes, - slackEnable: false, - team: undefined, - }, - resolver: joiResolver(SchemaCreateBoard), + const methods = useForm<{ text: string; team: string; maxVotes?: number }>({ + mode: 'onBlur', + reValidateMode: 'onBlur', + defaultValues: { + text: '', + maxVotes: boardState.board.maxVotes, + team: undefined, }, - ); + resolver: joiResolver(SchemaCreateBoard), + }); const mainBoardName = useWatch({ control: methods.control, @@ -153,7 +150,7 @@ const NewSplitBoard: NextPage = () => { * @param title Board Title * @param maxVotes Maxium number of votes allowed */ - const saveBoard = (title: string, team: string, maxVotes?: number, slackEnable?: boolean) => { + const saveBoard = (title: string, team: string, maxVotes?: number) => { const responsibles: string[] = []; const newDividedBoards: CreateBoardDto[] = boardState.board.dividedBoards.map((subBoard) => { const newSubBoard: CreateBoardDto = { ...subBoard, users: [], dividedBoards: [] }; @@ -182,7 +179,6 @@ const NewSplitBoard: NextPage = () => { title, dividedBoards: newDividedBoards, maxVotes, - slackEnable, maxUsers: boardState.count.maxUsersCount, team, responsibles, @@ -257,8 +253,8 @@ const NewSplitBoard: NextPage = () => { direction="column" onSubmit={ !haveError - ? methods.handleSubmit(({ text, team, maxVotes, slackEnable }) => { - saveBoard(text, team, maxVotes, slackEnable); + ? methods.handleSubmit(({ text, team, maxVotes }) => { + saveBoard(text, team, maxVotes); }) : undefined }