diff --git a/web/settings/account-settings.react.js b/web/settings/account-settings.react.js --- a/web/settings/account-settings.react.js +++ b/web/settings/account-settings.react.js @@ -37,13 +37,13 @@ ); const openFriendList = React.useCallback( - () => pushModal(), - [popModal, pushModal], + () => pushModal(), + [pushModal], ); const openBlockList = React.useCallback( - () => pushModal(), - [popModal, pushModal], + () => pushModal(), + [pushModal], ); const isAccountWithPassword = useSelector(state => diff --git a/web/settings/relationship/add-friends-modal.react.js b/web/settings/relationship/add-friends-modal.react.js --- a/web/settings/relationship/add-friends-modal.react.js +++ b/web/settings/relationship/add-friends-modal.react.js @@ -17,16 +17,9 @@ userRelationshipStatus.REQUEST_RECEIVED, ]); -type Props = { - +onClose: () => void, -}; - -function AddFriendsModal(props: Props): React.Node { - const { onClose } = props; - +function AddFriendsModal(): React.Node { return ( void, +name: string, +excludedStatuses: $ReadOnlySet, +confirmButtonContent: React.Node, @@ -37,7 +37,6 @@ function AddUsersListModal(props: Props): React.Node { const { - closeModal, name, excludedStatuses, confirmButtonContent, @@ -45,6 +44,8 @@ relationshipAction, } = props; + const { popModal } = useModalContext(); + const [pendingUsersToAdd, setPendingUsersToAdd] = React.useState< $ReadOnlySet, >(new Set()); @@ -76,7 +77,7 @@ action: relationshipAction, userIDs: Array.from(pendingUsersToAdd), }); - closeModal(); + popModal(); return result; } catch (e) { setErrorMessage('unknown error'); @@ -84,9 +85,9 @@ } }, [ callUpdateRelationships, + popModal, relationshipAction, pendingUsersToAdd, - closeModal, ]); const confirmSelection = React.useCallback( @@ -133,7 +134,7 @@ return ( void, -}; - -function BlockListModal(props: Props): React.Node { - const { onClose } = props; - +function BlockListModal(): React.Node { const { pushModal } = useModalContext(); const openBlockUsersModal = React.useCallback(() => { - pushModal(); - }, [onClose, pushModal]); + pushModal(); + }, [pushModal]); return ( pushModal(), - [popModal, pushModal], + () => pushModal(), + [pushModal], ); const blockList = React.useMemo( diff --git a/web/settings/relationship/block-users-modal.react.js b/web/settings/relationship/block-users-modal.react.js --- a/web/settings/relationship/block-users-modal.react.js +++ b/web/settings/relationship/block-users-modal.react.js @@ -17,13 +17,7 @@ userRelationshipStatus.BLOCKED_BY_VIEWER, ]); -type Props = { - +onClose: () => void, -}; - -function BlockUsersModal(props: Props): React.Node { - const { onClose } = props; - +function BlockUsersModal(): React.Node { const buttonContent = (
@@ -33,7 +27,6 @@ return ( void, -}; - -function FriendListModal(props: Props): React.Node { - const { onClose } = props; - +function FriendListModal(): React.Node { const { pushModal } = useModalContext(); + const openNewFriendsModal = React.useCallback(() => { - pushModal(); - }, [onClose, pushModal]); + pushModal(); + }, [pushModal]); return ( pushModal(), - [popModal, pushModal], + () => pushModal(), + [pushModal], ); const friendList = React.useMemo( diff --git a/web/settings/relationship/user-list-modal.react.js b/web/settings/relationship/user-list-modal.react.js --- a/web/settings/relationship/user-list-modal.react.js +++ b/web/settings/relationship/user-list-modal.react.js @@ -2,6 +2,7 @@ import * as React from 'react'; +import { useModalContext } from 'lib/components/modal-provider.react.js'; import type { AccountUserInfo, UserInfo } from 'lib/types/user-types.js'; import css from './user-list.css'; @@ -10,7 +11,6 @@ import SearchModal from '../../modals/search-modal.react.js'; type Props = { - +onClose: () => void, +name: string, +userRowComponent: React.ComponentType, +filterUser: (userInfo: UserInfo) => boolean, @@ -21,7 +21,6 @@ function UserListModal(props: Props): React.Node { const { - onClose, name, userRowComponent, filterUser, @@ -30,6 +29,8 @@ onAddUsersClick, } = props; + const { popModal } = useModalContext(); + const searchModalChildGenerator = React.useCallback( (searchText: string) => (
@@ -58,7 +59,7 @@ name={name} size="large" searchPlaceholder="Search by name" - onClose={onClose} + onClose={popModal} > {searchModalChildGenerator}