Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions src/components/AddPaymentMethodMenu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ function AddPaymentMethodMenu({
}: AddPaymentMethodMenuProps) {
const {translate} = useLocalize();
const [restoreFocusType, setRestoreFocusType] = useState<BaseModalProps['restoreFocusType']>();
const [session] = useOnyx(ONYXKEYS.SESSION);
const [session] = useOnyx(ONYXKEYS.SESSION, {canBeMissing: true});

// Users can choose to pay with business bank account in case of Expense reports or in case of P2P IOU report
// which then starts a bottom up flow and creates a Collect workspace where the payer is an admin and payee is an employee.
Expand Down Expand Up @@ -130,7 +130,6 @@ function AddPaymentMethodMenu({
// },
// ],
]}
withoutOverlay
shouldEnableNewFocusManagement
restoreFocusType={restoreFocusType}
/>
Expand Down
1 change: 0 additions & 1 deletion src/components/AvatarWithImagePicker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -430,7 +430,6 @@ function AvatarWithImagePicker({
menuItems={menuItems}
anchorPosition={shouldUseStyleUtilityForAnchorPosition ? styles.popoverMenuOffset(windowWidth) : popoverPosition}
anchorAlignment={{horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT, vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.TOP}}
withoutOverlay
anchorRef={anchorRef}
/>
</>
Expand Down
1 change: 0 additions & 1 deletion src/components/ButtonWithDropdownMenu/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -238,7 +238,6 @@ function ButtonWithDropdownMenu<IValueType>({
shouldShowSelectedItemCheck={shouldShowSelectedItemCheck}
// eslint-disable-next-line react-compiler/react-compiler
anchorRef={nullCheckRef(dropdownAnchor)}
withoutOverlay
scrollContainerStyle={!shouldUseModalPaddingStyle && isSmallScreenWidth && styles.pv4}
anchorAlignment={anchorAlignment}
shouldUseModalPaddingStyle={shouldUseModalPaddingStyle}
Expand Down
3 changes: 1 addition & 2 deletions src/components/ConnectToNetSuiteFlow/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ function ConnectToNetSuiteFlow({policyID}: ConnectToNetSuiteFlowProps) {
const [reuseConnectionPopoverPosition, setReuseConnectionPopoverPosition] = useState<AnchorPosition>({horizontal: 0, vertical: 0});
const {popoverAnchorRefs} = useAccountingContext();

const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`);
const [policy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${policyID}`, {canBeMissing: true});
const shouldGoToCredentialsPage = isAuthenticationError(policy, CONST.POLICY.CONNECTIONS.NAME.NETSUITE);

const threeDotsMenuContainerRef = popoverAnchorRefs?.current?.[CONST.POLICY.CONNECTIONS.NAME.NETSUITE];
Expand Down Expand Up @@ -77,7 +77,6 @@ function ConnectToNetSuiteFlow({policyID}: ConnectToNetSuiteFlowProps) {
onClose={() => {
setIsReuseConnectionsPopoverOpen(false);
}}
withoutOverlay
menuItems={connectionOptions}
onItemSelected={(item) => {
if (!item?.onSelected) {
Expand Down
5 changes: 4 additions & 1 deletion src/components/EmojiPicker/EmojiPicker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ function EmojiPicker({viewportOffsetTop}: EmojiPickerProps, ref: ForwardedRef<Em
vertical: 0,
});
const [emojiPopoverAnchorOrigin, setEmojiPopoverAnchorOrigin] = useState<AnchorOrigin>(DEFAULT_ANCHOR_ORIGIN);
const [isWithoutOverlay, setIsWithoutOverlay] = useState(true);
const [activeID, setActiveID] = useState<string | null>();
const emojiPopoverAnchorRef = useRef<EmojiPopoverAnchor | null>(null);
const emojiAnchorDimension = useRef({
Expand Down Expand Up @@ -78,10 +79,12 @@ function EmojiPicker({viewportOffsetTop}: EmojiPickerProps, ref: ForwardedRef<Em
onWillShow?: OnWillShowPicker,
id?: string,
activeEmojiValue?: string,
withoutOverlay = true,
) => {
onModalHide.current = onModalHideValue;
onEmojiSelected.current = onEmojiSelectedValue;
activeEmoji.current = activeEmojiValue;
setIsWithoutOverlay(withoutOverlay);
emojiPopoverAnchorRef.current = emojiPopoverAnchorValue;
const emojiPopoverAnchor = getEmojiPopoverAnchor();
// Drop focus to avoid blue focus ring.
Expand Down Expand Up @@ -203,7 +206,7 @@ function EmojiPicker({viewportOffsetTop}: EmojiPickerProps, ref: ForwardedRef<Em
horizontal: emojiPopoverAnchorPosition.horizontal,
}}
anchorRef={getEmojiPopoverAnchor() as RefObject<View | HTMLDivElement>}
withoutOverlay
withoutOverlay={isWithoutOverlay}
popoverDimensions={{
width: CONST.EMOJI_PICKER_SIZE.WIDTH,
height: CONST.EMOJI_PICKER_SIZE.HEIGHT,
Expand Down
17 changes: 10 additions & 7 deletions src/components/EmojiPicker/EmojiPickerButtonDropdown.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,25 +11,27 @@ import Tooltip from '@components/Tooltip/PopoverAnchorTooltip';
import useLocalize from '@hooks/useLocalize';
import useStyleUtils from '@hooks/useStyleUtils';
import useThemeStyles from '@hooks/useThemeStyles';
import {hideEmojiPicker, isEmojiPickerVisible, resetEmojiPopoverAnchor, showEmojiPicker} from '@libs/actions/EmojiPickerAction';
import type {OnModalHideValue} from '@libs/actions/EmojiPickerAction';
import getButtonState from '@libs/getButtonState';
import * as EmojiPickerAction from '@userActions/EmojiPickerAction';
import CONST from '@src/CONST';

type EmojiPickerButtonDropdownProps = {
/** Flag to disable the emoji picker button */
isDisabled?: boolean;
accessibilityLabel?: string;
role?: string;
onModalHide: EmojiPickerAction.OnModalHideValue;
onModalHide: OnModalHideValue;
onInputChange: (emoji: string) => void;
value?: string;
disabled?: boolean;
style: StyleProp<ViewStyle>;
withoutOverlay?: boolean;
};

function EmojiPickerButtonDropdown(
// eslint-disable-next-line @typescript-eslint/no-unused-vars
{isDisabled = false, onModalHide, onInputChange, value, disabled, style, ...otherProps}: EmojiPickerButtonDropdownProps,
{isDisabled = false, withoutOverlay = false, onModalHide, onInputChange, value, disabled, style, ...otherProps}: EmojiPickerButtonDropdownProps,
// eslint-disable-next-line @typescript-eslint/no-unused-vars
ref: ForwardedRef<AnimatedTextInputRef>,
) {
Expand All @@ -38,14 +40,14 @@ function EmojiPickerButtonDropdown(
const emojiPopoverAnchor = useRef(null);
const {translate} = useLocalize();

useEffect(() => EmojiPickerAction.resetEmojiPopoverAnchor, []);
useEffect(() => resetEmojiPopoverAnchor, []);
const onPress = () => {
if (EmojiPickerAction.isEmojiPickerVisible()) {
EmojiPickerAction.hideEmojiPicker();
if (isEmojiPickerVisible()) {
hideEmojiPicker();
return;
}

EmojiPickerAction.showEmojiPicker(
showEmojiPicker(
onModalHide,
(emoji) => onInputChange(emoji),
emojiPopoverAnchor,
Expand All @@ -57,6 +59,7 @@ function EmojiPickerButtonDropdown(
() => {},
undefined,
value,
withoutOverlay,
);
};

Expand Down
1 change: 1 addition & 0 deletions src/components/LHNOptionsList/OptionRowLHN.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -163,6 +163,7 @@ function OptionRowLHN({
callbacks: {
onHide: () => setIsContextMenuActive(false),
},
withoutOverlay: false,
});
};

Expand Down
8 changes: 5 additions & 3 deletions src/libs/actions/EmojiPickerAction.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react';
import type {MutableRefObject} from 'react';
import type {RefObject} from 'react';
import type {TextInput, View} from 'react-native';
import type {ValueOf} from 'type-fest';
import type {Emoji} from '@assets/emojis/types';
Expand All @@ -12,7 +12,7 @@ type AnchorOrigin = {
shiftVertical?: number;
};

type EmojiPopoverAnchor = MutableRefObject<View | HTMLDivElement | TextInput | null>;
type EmojiPopoverAnchor = RefObject<View | HTMLDivElement | TextInput | null>;

type OnWillShowPicker = (callback?: CloseContextMenuCallback) => void;

Expand All @@ -27,6 +27,7 @@ type EmojiPickerRef = {
onWillShow?: OnWillShowPicker,
id?: string,
activeEmoji?: string,
withoutOverlay?: boolean,
) => void;
isActive: (id: string) => boolean;
clearActive: () => void;
Expand Down Expand Up @@ -57,12 +58,13 @@ function showEmojiPicker(
onWillShow: OnWillShowPicker = () => {},
id?: string,
activeEmoji?: string,
withoutOverlay?: boolean,
) {
if (!emojiPickerRef.current) {
return;
}

emojiPickerRef.current.showEmojiPicker(onModalHide, onEmojiSelected, emojiPopoverAnchor, anchorOrigin, onWillShow, id, activeEmoji);
emojiPickerRef.current.showEmojiPicker(onModalHide, onEmojiSelected, emojiPopoverAnchor, anchorOrigin, onWillShow, id, activeEmoji, withoutOverlay);
}

/**
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -68,6 +68,7 @@ function PopoverReportActionContextMenu(_props: unknown, ref: ForwardedRef<Repor
const [isThreadReportParentAction, setIsThreadReportParentAction] = useState(false);
const [disabledActions, setDisabledActions] = useState<ContextMenuAction[]>([]);
const [shouldSwitchPositionIfOverflow, setShouldSwitchPositionIfOverflow] = useState(false);
const [isWithoutOverlay, setIsWithoutOverlay] = useState<boolean>(true);

const contentRef = useRef<View>(null);
const anchorRef = useRef<View | HTMLDivElement | null>(null);
Expand Down Expand Up @@ -170,11 +171,13 @@ function PopoverReportActionContextMenu(_props: unknown, ref: ForwardedRef<Repor
disabledOptions = [],
shouldCloseOnTarget = false,
isOverflowMenu = false,
withoutOverlay = true,
} = showContextMenuParams;
const {reportID, originalReportID, isArchivedRoom = false, isChronos = false, isPinnedChat = false, isUnreadChat = false} = report;
const {reportActionID, draftMessage, isThreadReportParentAction: isThreadReportParentActionParam = false} = reportAction;
const {onShow = () => {}, onHide = () => {}, setIsEmojiPickerActive = () => {}} = callbacks;
setIsContextMenuOpening(true);
setIsWithoutOverlay(withoutOverlay);
const {pageX = 0, pageY = 0} = extractPointerEvent(event);
contextMenuAnchorRef.current = contextMenuAnchor;
contextMenuTargetNode.current = event.target as HTMLDivElement;
Expand Down Expand Up @@ -343,7 +346,7 @@ function PopoverReportActionContextMenu(_props: unknown, ref: ForwardedRef<Repor
disableAnimation={false}
shouldSetModalVisibility={false}
fullscreen
withoutOverlay
withoutOverlay={isWithoutOverlay}
anchorDimensions={contextMenuDimensions.current}
anchorRef={anchorRef}
shouldSwitchPositionIfOverflow={shouldSwitchPositionIfOverflow}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@ type ShowContextMenuParams = {
disabledOptions?: ContextMenuAction[];
shouldCloseOnTarget?: boolean;
isOverflowMenu?: boolean;
withoutOverlay?: boolean;
};

type ShowContextMenu = (params: ShowContextMenuParams) => void;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,6 @@ function BasePopoverReactionList({emojiName, reportActionID, currentUserPersonal
disableAnimation={false}
shouldSetModalVisibility={false}
fullscreen
withoutOverlay
anchorRef={reactionListRef}
>
<BaseReactionList
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -409,7 +409,6 @@ function AttachmentPickerWithMenuItems({
anchorPosition={styles.createMenuPositionReportActionCompose(shouldUseNarrowLayout, windowHeight, windowWidth)}
anchorAlignment={{horizontal: CONST.MODAL.ANCHOR_ORIGIN_HORIZONTAL.LEFT, vertical: CONST.MODAL.ANCHOR_ORIGIN_VERTICAL.BOTTOM}}
menuItems={menuItems}
withoutOverlay
anchorRef={actionButtonRef}
/>
</>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -545,7 +545,6 @@ function FloatingActionButtonAndPopover({onHideCreateMenu, onShowCreateMenu, isT
},
};
})}
withoutOverlay
anchorRef={fabRef}
/>
<ConfirmModal
Expand Down
Loading