From 5a7e6a3f1fff2b8c09ef78cc1d3a4a78417eae27 Mon Sep 17 00:00:00 2001 From: jacobkim9881 Date: Sat, 27 Jul 2024 01:19:14 +0900 Subject: [PATCH 1/7] fix: null check instead of setting an empty value --- src/components/ButtonWithDropdownMenu/index.tsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx index 094c26a2b387..8096ff8fe4d1 100644 --- a/src/components/ButtonWithDropdownMenu/index.tsx +++ b/src/components/ButtonWithDropdownMenu/index.tsx @@ -139,7 +139,12 @@ function ButtonWithDropdownMenu({ onClose={() => setIsMenuVisible(false)} onItemSelected={() => setIsMenuVisible(false)} anchorPosition={popoverAnchorPosition} - anchorRef={caretButton} + anchorRef={() => { + if (caretButton === null) { + return; + } + return caretButton; + }} withoutOverlay anchorAlignment={anchorAlignment} headerText={menuHeaderText} From 64c133933c2bdf26a77146be3d3c0205b3d1b64a Mon Sep 17 00:00:00 2001 From: jacobkim9881 Date: Sat, 27 Jul 2024 02:35:19 +0900 Subject: [PATCH 2/7] fix: type check failed --- src/components/ButtonWithDropdownMenu/index.tsx | 2 +- src/components/PopoverMenu.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx index 8096ff8fe4d1..63be95626420 100644 --- a/src/components/ButtonWithDropdownMenu/index.tsx +++ b/src/components/ButtonWithDropdownMenu/index.tsx @@ -141,7 +141,7 @@ function ButtonWithDropdownMenu({ anchorPosition={popoverAnchorPosition} anchorRef={() => { if (caretButton === null) { - return; + return null; } return caretButton; }} diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index bcec153491c9..34d988cc5b58 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -61,7 +61,7 @@ type PopoverMenuProps = Partial & { anchorPosition: AnchorPosition; /** Ref of the anchor */ - anchorRef: RefObject; + anchorRef: RefObject; /** Where the popover should be positioned relative to the anchor points. */ anchorAlignment?: AnchorAlignment; From ceb7b4152cec0125957cc63b6894d50eb611a37b Mon Sep 17 00:00:00 2001 From: jacobkim9881 Date: Sat, 27 Jul 2024 02:55:38 +0900 Subject: [PATCH 3/7] canceled null check --- src/components/ButtonWithDropdownMenu/index.tsx | 2 +- src/components/PopoverMenu.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx index 8096ff8fe4d1..63be95626420 100644 --- a/src/components/ButtonWithDropdownMenu/index.tsx +++ b/src/components/ButtonWithDropdownMenu/index.tsx @@ -141,7 +141,7 @@ function ButtonWithDropdownMenu({ anchorPosition={popoverAnchorPosition} anchorRef={() => { if (caretButton === null) { - return; + return null; } return caretButton; }} diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index bcec153491c9..34d988cc5b58 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -61,7 +61,7 @@ type PopoverMenuProps = Partial & { anchorPosition: AnchorPosition; /** Ref of the anchor */ - anchorRef: RefObject; + anchorRef: RefObject; /** Where the popover should be positioned relative to the anchor points. */ anchorAlignment?: AnchorAlignment; From a52a9975698ca43d3ad8c06bead7b4700f8280c8 Mon Sep 17 00:00:00 2001 From: jacobkim9881 Date: Sat, 27 Jul 2024 03:03:59 +0900 Subject: [PATCH 4/7] canceled null check --- src/components/ButtonWithDropdownMenu/index.tsx | 2 +- src/components/PopoverMenu.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx index 63be95626420..8096ff8fe4d1 100644 --- a/src/components/ButtonWithDropdownMenu/index.tsx +++ b/src/components/ButtonWithDropdownMenu/index.tsx @@ -141,7 +141,7 @@ function ButtonWithDropdownMenu({ anchorPosition={popoverAnchorPosition} anchorRef={() => { if (caretButton === null) { - return null; + return; } return caretButton; }} diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index 34d988cc5b58..bcec153491c9 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -61,7 +61,7 @@ type PopoverMenuProps = Partial & { anchorPosition: AnchorPosition; /** Ref of the anchor */ - anchorRef: RefObject; + anchorRef: RefObject; /** Where the popover should be positioned relative to the anchor points. */ anchorAlignment?: AnchorAlignment; From 89d1ae18e01d3e32c24f3d606e5a0c2ca508ec11 Mon Sep 17 00:00:00 2001 From: jacobkim9881 Date: Sun, 28 Jul 2024 10:00:42 +0900 Subject: [PATCH 5/7] fix typecheck, lint not passed --- src/components/ButtonWithDropdownMenu/index.tsx | 9 +++------ src/types/utils/nullCheckRef.ts | 11 +++++++++++ 2 files changed, 14 insertions(+), 6 deletions(-) create mode 100644 src/types/utils/nullCheckRef.ts diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx index 8096ff8fe4d1..379458db0729 100644 --- a/src/components/ButtonWithDropdownMenu/index.tsx +++ b/src/components/ButtonWithDropdownMenu/index.tsx @@ -10,6 +10,7 @@ import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import CONST from '@src/CONST'; import type {AnchorPosition} from '@src/styles'; +import nullCheckRef from '@src/types/utils/nullCheckRef'; import type {ButtonWithDropdownMenuProps} from './types'; function ButtonWithDropdownMenu({ @@ -42,6 +43,7 @@ function ButtonWithDropdownMenu({ const [popoverAnchorPosition, setPopoverAnchorPosition] = useState(null); const {windowWidth, windowHeight} = useWindowDimensions(); const caretButton = useRef(null); + const nullRef = useRef(null); const selectedItem = options[selectedItemIndex] || options[0]; const innerStyleDropButton = StyleUtils.getDropDownButtonHeight(buttonSize); const isButtonSizeLarge = buttonSize === CONST.DROPDOWN_BUTTON_SIZE.LARGE; @@ -139,12 +141,7 @@ function ButtonWithDropdownMenu({ onClose={() => setIsMenuVisible(false)} onItemSelected={() => setIsMenuVisible(false)} anchorPosition={popoverAnchorPosition} - anchorRef={() => { - if (caretButton === null) { - return; - } - return caretButton; - }} + anchorRef={nullCheckRef(caretButton, nullRef)} withoutOverlay anchorAlignment={anchorAlignment} headerText={menuHeaderText} diff --git a/src/types/utils/nullCheckRef.ts b/src/types/utils/nullCheckRef.ts new file mode 100644 index 000000000000..f43db5d8e922 --- /dev/null +++ b/src/types/utils/nullCheckRef.ts @@ -0,0 +1,11 @@ +import type {MutableRefObject} from 'react'; +import type {View} from 'react-native'; + +function nullCheckRef(ref: MutableRefObject, nullRef: MutableRefObject): MutableRefObject { + if (ref === null) { + return nullRef; + } + return ref; +} + +export default nullCheckRef; From e1404d0afc7a60eed85605d9a4378844ebd91585 Mon Sep 17 00:00:00 2001 From: jacobkim9881 Date: Sun, 28 Jul 2024 14:38:27 +0900 Subject: [PATCH 6/7] fix added null check in the script --- src/components/ButtonWithDropdownMenu/index.tsx | 6 +++--- src/types/utils/nullCheckRef.ts | 11 ----------- 2 files changed, 3 insertions(+), 14 deletions(-) delete mode 100644 src/types/utils/nullCheckRef.ts diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx index 379458db0729..5e65875a7e40 100644 --- a/src/components/ButtonWithDropdownMenu/index.tsx +++ b/src/components/ButtonWithDropdownMenu/index.tsx @@ -1,3 +1,4 @@ +import type {MutableRefObject} from 'react'; import React, {useEffect, useRef, useState} from 'react'; import {View} from 'react-native'; import Button from '@components/Button'; @@ -10,7 +11,6 @@ import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; import CONST from '@src/CONST'; import type {AnchorPosition} from '@src/styles'; -import nullCheckRef from '@src/types/utils/nullCheckRef'; import type {ButtonWithDropdownMenuProps} from './types'; function ButtonWithDropdownMenu({ @@ -43,10 +43,10 @@ function ButtonWithDropdownMenu({ const [popoverAnchorPosition, setPopoverAnchorPosition] = useState(null); const {windowWidth, windowHeight} = useWindowDimensions(); const caretButton = useRef(null); - const nullRef = useRef(null); const selectedItem = options[selectedItemIndex] || options[0]; const innerStyleDropButton = StyleUtils.getDropDownButtonHeight(buttonSize); const isButtonSizeLarge = buttonSize === CONST.DROPDOWN_BUTTON_SIZE.LARGE; + const nullCheckRef = (ref: MutableRefObject) => ref ?? null; useEffect(() => { if (!caretButton.current) { @@ -141,7 +141,7 @@ function ButtonWithDropdownMenu({ onClose={() => setIsMenuVisible(false)} onItemSelected={() => setIsMenuVisible(false)} anchorPosition={popoverAnchorPosition} - anchorRef={nullCheckRef(caretButton, nullRef)} + anchorRef={nullCheckRef(caretButton)} withoutOverlay anchorAlignment={anchorAlignment} headerText={menuHeaderText} diff --git a/src/types/utils/nullCheckRef.ts b/src/types/utils/nullCheckRef.ts deleted file mode 100644 index f43db5d8e922..000000000000 --- a/src/types/utils/nullCheckRef.ts +++ /dev/null @@ -1,11 +0,0 @@ -import type {MutableRefObject} from 'react'; -import type {View} from 'react-native'; - -function nullCheckRef(ref: MutableRefObject, nullRef: MutableRefObject): MutableRefObject { - if (ref === null) { - return nullRef; - } - return ref; -} - -export default nullCheckRef; From f73e6a94f431f3a1418f1c81c05a7b77a1b7b810 Mon Sep 17 00:00:00 2001 From: jacobkim9881 Date: Thu, 1 Aug 2024 02:27:51 +0900 Subject: [PATCH 7/7] fix: parameter name edited --- src/components/ButtonWithDropdownMenu/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ButtonWithDropdownMenu/index.tsx b/src/components/ButtonWithDropdownMenu/index.tsx index d0f79a75e451..26b9f7aa1736 100644 --- a/src/components/ButtonWithDropdownMenu/index.tsx +++ b/src/components/ButtonWithDropdownMenu/index.tsx @@ -150,7 +150,7 @@ function ButtonWithDropdownMenu({ onModalShow={onOptionsMenuShow} onItemSelected={() => setIsMenuVisible(false)} anchorPosition={popoverAnchorPosition} - anchorRef={nullCheckRef(caretButton)} + anchorRef={nullCheckRef(dropdownAnchor)} withoutOverlay anchorAlignment={anchorAlignment} headerText={menuHeaderText}