From 1679dac89d03148fea72c9187a10d46e25250bb2 Mon Sep 17 00:00:00 2001 From: Nitin Koche Date: Sun, 18 Aug 2024 21:28:13 +0530 Subject: [PATCH] more refatoring and code cleaning --- .../RecordBoardColumnDropdownMenu.tsx | 25 ++++++++++++++++--- .../components/RecordBoardColumnNewButton.tsx | 20 +++------------ .../RecordBoardColumnNewOpportunityButton.tsx | 10 +++++--- .../hooks/useAddNewCard.ts | 20 +++++++++++++++ .../hooks/useAddNewOpportunity.ts | 4 +-- 5 files changed, 54 insertions(+), 25 deletions(-) create mode 100644 packages/twenty-front/src/modules/object-record/record-board/record-board-column/hooks/useAddNewCard.ts diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnDropdownMenu.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnDropdownMenu.tsx index ccbc54af0e93..91f7fcf57ee5 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnDropdownMenu.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnDropdownMenu.tsx @@ -2,7 +2,9 @@ import styled from '@emotion/styled'; import { useCallback, useContext, useRef } from 'react'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; +import { RecordBoardContext } from '@/object-record/record-board/contexts/RecordBoardContext'; import { RecordBoardColumnContext } from '@/object-record/record-board/record-board-column/contexts/RecordBoardColumnContext'; +import { useAddNewCard } from '@/object-record/record-board/record-board-column/hooks/useAddNewCard'; import { useAddNewOpportunity } from '@/object-record/record-board/record-board-column/hooks/useAddNewOpportunity'; import { SingleEntitySelect } from '@/object-record/relation-picker/components/SingleEntitySelect'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; @@ -28,7 +30,7 @@ export const RecordBoardColumnDropdownMenu = ({ onClose, }: RecordBoardColumnDropdownMenuProps) => { const boardColumnMenuRef = useRef(null); - + const { objectMetadataItem } = useContext(RecordBoardContext); const closeMenu = useCallback(() => { onClose(); }, [onClose]); @@ -40,8 +42,23 @@ export const RecordBoardColumnDropdownMenu = ({ const { columnDefinition } = useContext(RecordBoardColumnContext); - const { isCreatingCard, handleNewClick, handleCancel, handleEntitySelect } = - useAddNewOpportunity(); + const { + isCreatingCard, + handleAddNewOpportunityClick, + handleCancel, + handleEntitySelect, + } = useAddNewOpportunity(); + const { handleAddNewCardClick } = useAddNewCard(); + + const isOpportunity = + objectMetadataItem.nameSingular === CoreObjectNameSingular.Opportunity; + + const handleClick = isOpportunity + ? handleAddNewOpportunityClick + : () => { + handleAddNewCardClick(); + closeMenu(); + }; return ( @@ -72,7 +89,7 @@ export const RecordBoardColumnDropdownMenu = ({ /> ))} diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnNewButton.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnNewButton.tsx index 552b51f6b576..a8aa4eb11570 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnNewButton.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnNewButton.tsx @@ -1,10 +1,8 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { useContext } from 'react'; import { IconPlus } from 'twenty-ui'; -import { RecordBoardContext } from '@/object-record/record-board/contexts/RecordBoardContext'; -import { RecordBoardColumnContext } from '@/object-record/record-board/record-board-column/contexts/RecordBoardColumnContext'; +import { useAddNewCard } from '@/object-record/record-board/record-board-column/hooks/useAddNewCard'; const StyledButton = styled.button` align-items: center; @@ -25,21 +23,11 @@ const StyledButton = styled.button` export const RecordBoardColumnNewButton = () => { const theme = useTheme(); - const { columnDefinition } = useContext(RecordBoardColumnContext); - const { createOneRecord, selectFieldMetadataItem } = - useContext(RecordBoardContext); - - const onNewClick = () => { - createOneRecord({ - [selectFieldMetadataItem.name]: columnDefinition.value, - position: 'last', - }); - }; - + const { handleAddNewCardClick } = useAddNewCard(); return ( - + - New agaga + New ); }; diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnNewOpportunityButton.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnNewOpportunityButton.tsx index c10f0857b82b..e1f8e4d6ea54 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnNewOpportunityButton.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnNewOpportunityButton.tsx @@ -25,8 +25,12 @@ const StyledButton = styled.button` export const RecordBoardColumnNewOpportunityButton = () => { const theme = useTheme(); - const { isCreatingCard, handleNewClick, handleCancel, handleEntitySelect } = - useAddNewOpportunity(); + const { + isCreatingCard, + handleAddNewOpportunityClick, + handleCancel, + handleEntitySelect, + } = useAddNewOpportunity(); return ( <> {isCreatingCard ? ( @@ -39,7 +43,7 @@ export const RecordBoardColumnNewOpportunityButton = () => { selectedRelationRecordIds={[]} /> ) : ( - + New diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/hooks/useAddNewCard.ts b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/hooks/useAddNewCard.ts new file mode 100644 index 000000000000..f0efd9def771 --- /dev/null +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/hooks/useAddNewCard.ts @@ -0,0 +1,20 @@ +import { RecordBoardContext } from '@/object-record/record-board/contexts/RecordBoardContext'; +import { RecordBoardColumnContext } from '@/object-record/record-board/record-board-column/contexts/RecordBoardColumnContext'; +import { useContext } from 'react'; + +export const useAddNewCard = () => { + const { columnDefinition } = useContext(RecordBoardColumnContext); + const { createOneRecord, selectFieldMetadataItem } = + useContext(RecordBoardContext); + + const handleAddNewCardClick = () => { + createOneRecord({ + [selectFieldMetadataItem.name]: columnDefinition.value, + position: 'last', + }); + }; + + return { + handleAddNewCardClick, + }; +}; diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/hooks/useAddNewOpportunity.ts b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/hooks/useAddNewOpportunity.ts index bfba0dae3425..9090d5644d98 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/hooks/useAddNewOpportunity.ts +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/hooks/useAddNewOpportunity.ts @@ -45,7 +45,7 @@ export const useAddNewOpportunity = () => { ], ); - const handleNewClick = useCallback(() => { + const handleAddNewOpportunityClick = useCallback(() => { setIsCreatingCard(true); setHotkeyScopeAndMemorizePreviousScope( RelationPickerHotkeyScope.RelationPicker, @@ -61,7 +61,7 @@ export const useAddNewOpportunity = () => { return { isCreatingCard, handleEntitySelect, - handleNewClick, + handleAddNewOpportunityClick, handleCancel, }; };