diff --git a/src/components/OptionListContextProvider.tsx b/src/components/OptionListContextProvider.tsx index b14a26138b6e..994ebfc2a1b0 100644 --- a/src/components/OptionListContextProvider.tsx +++ b/src/components/OptionListContextProvider.tsx @@ -4,7 +4,6 @@ import usePrevious from '@hooks/usePrevious'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import type {OptionList} from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; -import CONST from '@src/CONST'; import ONYXKEYS from '@src/ONYXKEYS'; import type {PersonalDetails, Report} from '@src/types/onyx'; import {usePersonalDetails} from './OnyxProvider'; @@ -35,7 +34,7 @@ const OptionsListContext = createContext({ resetOptions: () => {}, }); -const isEqualPersonalDetail = (prevPersonalDetail: PersonalDetails | null, personalDetail: PersonalDetails | null) => +const isEqualPersonalDetail = (prevPersonalDetail: PersonalDetails, personalDetail: PersonalDetails) => prevPersonalDetail?.firstName === personalDetail?.firstName && prevPersonalDetail?.lastName === personalDetail?.lastName && prevPersonalDetail?.login === personalDetail?.login && @@ -49,7 +48,7 @@ function OptionsListContextProvider({children}: OptionsListProviderProps) { }); const [reports] = useOnyx(ONYXKEYS.COLLECTION.REPORT); - const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT; + const personalDetails = usePersonalDetails(); const prevPersonalDetails = usePrevious(personalDetails); /** @@ -83,6 +82,10 @@ function OptionsListContextProvider({children}: OptionsListProviderProps) { return; } + if (!personalDetails) { + return; + } + const newReportOptions: Array<{ replaceIndex: number; newReportOption: OptionsListUtils.SearchOption; @@ -90,9 +93,9 @@ function OptionsListContextProvider({children}: OptionsListProviderProps) { Object.keys(personalDetails).forEach((accountID) => { const prevPersonalDetail = prevPersonalDetails?.[accountID]; - const personalDetail = personalDetails?.[accountID]; + const personalDetail = personalDetails[accountID]; - if (isEqualPersonalDetail(prevPersonalDetail, personalDetail)) { + if (prevPersonalDetail && personalDetail && isEqualPersonalDetail(prevPersonalDetail, personalDetail)) { return; } diff --git a/src/components/ReportActionItem/TaskView.tsx b/src/components/ReportActionItem/TaskView.tsx index 9a2906aa7d62..2b0dc9387927 100644 --- a/src/components/ReportActionItem/TaskView.tsx +++ b/src/components/ReportActionItem/TaskView.tsx @@ -1,7 +1,5 @@ import React, {useEffect} from 'react'; import {View} from 'react-native'; -import {withOnyx} from 'react-native-onyx'; -import type {OnyxEntry} from 'react-native-onyx'; import Checkbox from '@components/Checkbox'; import Hoverable from '@components/Hoverable'; import Icon from '@components/Icon'; @@ -26,31 +24,24 @@ import * as TaskUtils from '@libs/TaskUtils'; import * as Session from '@userActions/Session'; import * as Task from '@userActions/Task'; import CONST from '@src/CONST'; -import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; -import type {PersonalDetailsList, Report} from '@src/types/onyx'; +import type {Report} from '@src/types/onyx'; -type TaskViewOnyxProps = { - /** All of the personal details for everyone */ - personalDetails: OnyxEntry; +type TaskViewProps = WithCurrentUserPersonalDetailsProps & { + /** The report currently being looked at */ + report: Report; }; -type TaskViewProps = TaskViewOnyxProps & - WithCurrentUserPersonalDetailsProps & { - /** The report currently being looked at */ - report: Report; - }; - function TaskView({report, ...props}: TaskViewProps) { const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); useEffect(() => { Task.setTaskReport(report); }, [report]); - + const personalDetails = usePersonalDetails(); const taskTitle = convertToLTR(report.reportName ?? ''); const assigneeTooltipDetails = ReportUtils.getDisplayNamesWithTooltips( - OptionsListUtils.getPersonalDetailsForAccountIDs(report.managerID ? [report.managerID] : [], props.personalDetails), + OptionsListUtils.getPersonalDetailsForAccountIDs(report.managerID ? [report.managerID] : [], personalDetails), false, ); const isCompleted = ReportUtils.isCompletedTaskReport(report); @@ -59,7 +50,6 @@ function TaskView({report, ...props}: TaskViewProps) { const canActionTask = Task.canActionTask(report, props.currentUserPersonalDetails.accountID); const disableState = !canModifyTask; const isDisableInteractive = !canModifyTask || !isOpen; - const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT; const {translate} = useLocalize(); return ( @@ -190,10 +180,4 @@ function TaskView({report, ...props}: TaskViewProps) { TaskView.displayName = 'TaskView'; -const TaskViewWithOnyx = withOnyx({ - personalDetails: { - key: ONYXKEYS.PERSONAL_DETAILS_LIST, - }, -})(TaskView); - -export default withCurrentUserPersonalDetails(TaskViewWithOnyx); +export default withCurrentUserPersonalDetails(TaskView); diff --git a/src/components/Search/SearchRouter/buildSubstitutionsMap.ts b/src/components/Search/SearchRouter/buildSubstitutionsMap.ts index a7185f126e55..1394b5de4cf1 100644 --- a/src/components/Search/SearchRouter/buildSubstitutionsMap.ts +++ b/src/components/Search/SearchRouter/buildSubstitutionsMap.ts @@ -26,7 +26,7 @@ const getSubstitutionsKey = (filterKey: SearchFilterKey, value: string) => `${fi */ function buildSubstitutionsMap( query: string, - personalDetails: OnyxTypes.PersonalDetailsList, + personalDetails: OnyxTypes.PersonalDetailsList | undefined, reports: OnyxCollection, allTaxRates: Record, ): SubstitutionMap { diff --git a/src/components/createOnyxContext.tsx b/src/components/createOnyxContext.tsx index edd7100e57de..9d6d96a5502e 100644 --- a/src/components/createOnyxContext.tsx +++ b/src/components/createOnyxContext.tsx @@ -33,7 +33,7 @@ type CreateOnyxContext = [ WithOnyxKey, ComponentType, TOnyxKey>>, React.Context>, - () => NonNullable>, + () => OnyxValue, ]; export default (onyxKeyName: TOnyxKey): CreateOnyxContext => { @@ -43,7 +43,7 @@ export default (onyxKeyName: TOnyxKey): CreateOnyxCont } Provider.displayName = `${Str.UCFirst(onyxKeyName)}Provider`; - + // eslint-disable-next-line const ProviderWithOnyx = withOnyx, ProviderOnyxProps>({ [onyxKeyName]: { key: onyxKeyName, @@ -87,7 +87,7 @@ export default (onyxKeyName: TOnyxKey): CreateOnyxCont if (value === null) { throw new Error(`useOnyxContext must be used within a OnyxProvider [key: ${onyxKeyName}]`); } - return value as NonNullable>; + return value as OnyxValue; }; return [withOnyxKey, ProviderWithOnyx, Context, useOnyxContext]; diff --git a/src/libs/SearchQueryUtils.ts b/src/libs/SearchQueryUtils.ts index f975c575400d..75bb4cab1d77 100644 --- a/src/libs/SearchQueryUtils.ts +++ b/src/libs/SearchQueryUtils.ts @@ -361,7 +361,7 @@ function buildFilterFormValuesFromQuery( policyCategories: OnyxCollection, policyTags: OnyxCollection, currencyList: OnyxTypes.CurrencyList, - personalDetails: OnyxTypes.PersonalDetailsList, + personalDetails: OnyxTypes.PersonalDetailsList | undefined, cardList: OnyxTypes.CardList, reports: OnyxCollection, taxRates: Record, @@ -391,7 +391,7 @@ function buildFilterFormValuesFromQuery( filtersForm[filterKey] = filterValues.filter((id) => reports?.[`${ONYXKEYS.COLLECTION.REPORT}${id}`]?.reportID); } if (filterKey === CONST.SEARCH.SYNTAX_FILTER_KEYS.FROM || filterKey === CONST.SEARCH.SYNTAX_FILTER_KEYS.TO) { - filtersForm[filterKey] = filterValues.filter((id) => personalDetails[id]); + filtersForm[filterKey] = filterValues.filter((id) => personalDetails && personalDetails[id]); } if (filterKey === CONST.SEARCH.SYNTAX_FILTER_KEYS.CURRENCY) { const validCurrency = new Set(Object.keys(currencyList)); @@ -488,7 +488,7 @@ function getPolicyIDFromSearchQuery(queryJSON: SearchQueryJSON) { /** * Returns the human-readable "pretty" string for a specified filter value. */ -function getFilterDisplayValue(filterName: string, filterValue: string, personalDetails: OnyxTypes.PersonalDetailsList, reports: OnyxCollection) { +function getFilterDisplayValue(filterName: string, filterValue: string, personalDetails: OnyxTypes.PersonalDetailsList | undefined, reports: OnyxCollection) { if (filterName === CONST.SEARCH.SYNTAX_FILTER_KEYS.FROM || filterName === CONST.SEARCH.SYNTAX_FILTER_KEYS.TO) { // login can be an empty string // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing @@ -519,7 +519,7 @@ function getFilterDisplayValue(filterName: string, filterValue: string, personal */ function buildUserReadableQueryString( queryJSON: SearchQueryJSON, - PersonalDetails: OnyxTypes.PersonalDetailsList, + PersonalDetails: OnyxTypes.PersonalDetailsList | undefined, reports: OnyxCollection, taxRates: Record, ) { diff --git a/src/pages/RoomMembersPage.tsx b/src/pages/RoomMembersPage.tsx index 71f3117be927..16c10fb69116 100644 --- a/src/pages/RoomMembersPage.tsx +++ b/src/pages/RoomMembersPage.tsx @@ -55,7 +55,7 @@ function RoomMembersPage({report, policies}: RoomMembersPageProps) { const [userSearchPhrase] = useOnyx(ONYXKEYS.ROOM_MEMBERS_USER_SEARCH_PHRASE); const [searchValue, setSearchValue] = useState(''); const [didLoadRoomMembers, setDidLoadRoomMembers] = useState(false); - const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT; + const personalDetails = usePersonalDetails(); const policy = useMemo(() => policies?.[`${ONYXKEYS.COLLECTION.POLICY}${report?.policyID ?? ''}`], [policies, report?.policyID]); const isPolicyExpenseChat = useMemo(() => ReportUtils.isPolicyExpenseChat(report), [report]); const backTo = route.params.backTo; @@ -212,7 +212,7 @@ function RoomMembersPage({report, policies}: RoomMembersPageProps) { let result: ListItem[] = []; participants.forEach((accountID) => { - const details = personalDetails[accountID]; + const details = personalDetails?.[accountID]; // If search value is provided, filter out members that don't match the search value if (!details || (searchValue.trim() && !OptionsListUtils.isSearchStringMatchUserDetails(details, searchValue))) { diff --git a/src/pages/Search/AdvancedSearchFilters.tsx b/src/pages/Search/AdvancedSearchFilters.tsx index 60c01e6f75f0..6ffa239c1067 100644 --- a/src/pages/Search/AdvancedSearchFilters.tsx +++ b/src/pages/Search/AdvancedSearchFilters.tsx @@ -126,8 +126,8 @@ function getFilterCardDisplayTitle(filters: Partial, : undefined; } -function getFilterParticipantDisplayTitle(accountIDs: string[], personalDetails: PersonalDetailsList) { - const selectedPersonalDetails = accountIDs.map((id) => personalDetails[id]); +function getFilterParticipantDisplayTitle(accountIDs: string[], personalDetails: PersonalDetailsList | undefined) { + const selectedPersonalDetails = accountIDs.map((id) => personalDetails?.[id]); return selectedPersonalDetails .map((personalDetail) => { diff --git a/src/pages/home/report/ReportActionCompose/ReportActionCompose.tsx b/src/pages/home/report/ReportActionCompose/ReportActionCompose.tsx index 59d1b4c00683..1113233ba7de 100644 --- a/src/pages/home/report/ReportActionCompose/ReportActionCompose.tsx +++ b/src/pages/home/report/ReportActionCompose/ReportActionCompose.tsx @@ -122,7 +122,7 @@ function ReportActionCompose({ const {isOffline} = useNetwork(); const actionButtonRef = useRef(null); const currentUserPersonalDetails = useCurrentUserPersonalDetails(); - const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT; + const personalDetails = usePersonalDetails(); const navigation = useNavigation(); const [blockedFromConcierge] = useOnyx(ONYXKEYS.NVP_BLOCKED_FROM_CONCIERGE); const [shouldShowComposeInput = true] = useOnyx(ONYXKEYS.SHOULD_SHOW_COMPOSE_INPUT); @@ -328,7 +328,7 @@ function ReportActionCompose({ // When we invite someone to a room they don't have the policy object, but we still want them to be able to mention other reports they are members of, so we only check if the policyID in the report is from a workspace const isGroupPolicyReport = useMemo(() => !!report?.policyID && report.policyID !== CONST.POLICY.ID_FAKE, [report]); const reportRecipientAcountIDs = ReportUtils.getReportRecipientAccountIDs(report, currentUserPersonalDetails.accountID); - const reportRecipient = personalDetails[reportRecipientAcountIDs[0]]; + const reportRecipient = personalDetails?.[reportRecipientAcountIDs[0]]; const shouldUseFocusedColor = !isBlockedFromConcierge && !disabled && isFocused; const hasReportRecipient = !isEmptyObject(reportRecipient); diff --git a/src/pages/home/report/ReportActionCompose/SuggestionMention.tsx b/src/pages/home/report/ReportActionCompose/SuggestionMention.tsx index 6a62201058e8..b69a26e5f90e 100644 --- a/src/pages/home/report/ReportActionCompose/SuggestionMention.tsx +++ b/src/pages/home/report/ReportActionCompose/SuggestionMention.tsx @@ -85,7 +85,7 @@ function SuggestionMention( {value, selection, setSelection, updateComment, isAutoSuggestionPickerLarge, measureParentContainerAndReportCursor, isComposerFocused, isGroupPolicyReport, policyID}: SuggestionProps, ref: ForwardedRef, ) { - const personalDetails = usePersonalDetails() ?? CONST.EMPTY_OBJECT; + const personalDetails = usePersonalDetails(); const {translate, formatPhoneNumber} = useLocalize(); const [suggestionValues, setSuggestionValues] = useState(defaultSuggestionsValues); const suggestionValuesRef = useRef(suggestionValues); @@ -112,7 +112,7 @@ function SuggestionMention( }, [currentReport], ); - const weightedPersonalDetails: PersonalDetailsList | SuggestionPersonalDetailsList = useMemo(() => { + const weightedPersonalDetails: PersonalDetailsList | SuggestionPersonalDetailsList | undefined = useMemo(() => { const policyEmployeeAccountIDs = getPolicyEmployeeAccountIDs(policyID); if (!ReportUtils.isGroupChat(currentReport) && !ReportUtils.doesReportBelongToWorkspace(currentReport, policyEmployeeAccountIDs, policyID)) { return personalDetails; @@ -264,7 +264,7 @@ function SuggestionMention( ); const getUserMentionOptions = useCallback( - (personalDetailsParam: PersonalDetailsList | SuggestionPersonalDetailsList, searchValue = ''): Mention[] => { + (personalDetailsParam: PersonalDetailsList | SuggestionPersonalDetailsList | undefined, searchValue = ''): Mention[] => { const suggestions = []; if (CONST.AUTO_COMPLETE_SUGGESTER.HERE_TEXT.includes(searchValue.toLowerCase())) { diff --git a/src/pages/home/report/ReportActionItem.tsx b/src/pages/home/report/ReportActionItem.tsx index 2e1696d1c464..095eff663da9 100644 --- a/src/pages/home/report/ReportActionItem.tsx +++ b/src/pages/home/report/ReportActionItem.tsx @@ -187,7 +187,7 @@ function ReportActionItem({ // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- This is needed to prevent the app from crashing when the app is using imported state. const [reportNameValuePairs] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT_NAME_VALUE_PAIRS}${report?.reportID || '-1'}`); const StyleUtils = useStyleUtils(); - const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT; + const personalDetails = usePersonalDetails(); const [isContextMenuActive, setIsContextMenuActive] = useState(() => ReportActionContextMenu.isActiveReportAction(action.reportActionID)); const [isEmojiPickerActive, setIsEmojiPickerActive] = useState(); const [isPaymentMethodPopoverActive, setIsPaymentMethodPopoverActive] = useState(); @@ -603,7 +603,7 @@ function ReportActionItem({ ); } else if (ReportActionsUtils.isReimbursementQueuedAction(action)) { const linkedReport = ReportUtils.isChatThread(report) ? parentReport : report; - const submitterDisplayName = PersonalDetailsUtils.getDisplayNameOrDefault(personalDetails[linkedReport?.ownerAccountID ?? -1]); + const submitterDisplayName = PersonalDetailsUtils.getDisplayNameOrDefault(personalDetails?.[linkedReport?.ownerAccountID ?? -1]); const paymentType = ReportActionsUtils.getOriginalMessage(action)?.paymentType ?? ''; const missingPaymentMethod = ReportUtils.getIndicatedMissingPaymentMethod(userWallet, linkedReport?.reportID ?? '-1', action); diff --git a/src/pages/home/report/ReportActionItemSingle.tsx b/src/pages/home/report/ReportActionItemSingle.tsx index fa8230640c8e..60e271cdf6d4 100644 --- a/src/pages/home/report/ReportActionItemSingle.tsx +++ b/src/pages/home/report/ReportActionItemSingle.tsx @@ -82,16 +82,16 @@ function ReportActionItemSingle({ const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); const {translate} = useLocalize(); - const personalDetails = usePersonalDetails() ?? CONST.EMPTY_OBJECT; + const personalDetails = usePersonalDetails(); const policy = usePolicy(report?.policyID); - const delegatePersonalDetails = personalDetails[action?.delegateAccountID ?? '']; + const delegatePersonalDetails = personalDetails?.[action?.delegateAccountID ?? '']; const ownerAccountID = iouReport?.ownerAccountID ?? action?.childOwnerAccountID; const isReportPreviewAction = action?.actionName === CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW; const actorAccountID = ReportUtils.getReportActionActorAccountID(action, iouReport, report); const [invoiceReceiverPolicy] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${report?.invoiceReceiver && 'policyID' in report.invoiceReceiver ? report.invoiceReceiver.policyID : -1}`); let displayName = ReportUtils.getDisplayNameForParticipant(actorAccountID); - const {avatar, login, pendingFields, status, fallbackIcon} = personalDetails[actorAccountID ?? -1] ?? {}; + const {avatar, login, pendingFields, status, fallbackIcon} = personalDetails?.[actorAccountID ?? -1] ?? {}; const accountOwnerDetails = getPersonalDetailByEmail(login ?? ''); // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing let actorHint = (login || (displayName ?? '')).replace(CONST.REGEX.MERGED_ACCOUNT_PREFIX, ''); @@ -108,7 +108,7 @@ function ReportActionItemSingle({ actorHint = displayName; avatarSource = ReportUtils.getWorkspaceIcon(report, policy).source; avatarId = report?.policyID; - } else if (action?.delegateAccountID && personalDetails[action?.delegateAccountID]) { + } else if (action?.delegateAccountID && personalDetails?.[action?.delegateAccountID]) { displayName = delegatePersonalDetails?.displayName ?? ''; avatarSource = delegatePersonalDetails?.avatar; avatarId = delegatePersonalDetails?.accountID; diff --git a/src/pages/home/report/ReportActionsList.tsx b/src/pages/home/report/ReportActionsList.tsx index ff6f635e3c6f..da920f17aabd 100644 --- a/src/pages/home/report/ReportActionsList.tsx +++ b/src/pages/home/report/ReportActionsList.tsx @@ -150,7 +150,7 @@ function ReportActionsList({ parentReportActionForTransactionThread, }: ReportActionsListProps) { const currentUserPersonalDetails = useCurrentUserPersonalDetails(); - const personalDetailsList = usePersonalDetails() || CONST.EMPTY_OBJECT; + const personalDetailsList = usePersonalDetails(); const styles = useThemeStyles(); const {translate} = useLocalize(); const {windowHeight} = useWindowDimensions(); diff --git a/src/pages/home/report/ReportFooter.tsx b/src/pages/home/report/ReportFooter.tsx index c087510374be..18f453c0905e 100644 --- a/src/pages/home/report/ReportFooter.tsx +++ b/src/pages/home/report/ReportFooter.tsx @@ -152,7 +152,7 @@ function ReportFooter({ let assigneeChatReport; if (mentionWithDomain) { if (isValidMention) { - assignee = Object.values(allPersonalDetails).find((value) => value?.login === mentionWithDomain) ?? undefined; + assignee = Object.values(allPersonalDetails ?? {}).find((value) => value?.login === mentionWithDomain) ?? undefined; if (!Object.keys(assignee ?? {}).length) { const assigneeAccountID = UserUtils.generateAccountID(mentionWithDomain); const optimisticDataForNewAssignee = Task.setNewOptimisticAssignee(mentionWithDomain, assigneeAccountID); diff --git a/src/pages/iou/request/MoneyRequestAttendeeSelector.tsx b/src/pages/iou/request/MoneyRequestAttendeeSelector.tsx index a47129e5064d..99a8e1efb227 100644 --- a/src/pages/iou/request/MoneyRequestAttendeeSelector.tsx +++ b/src/pages/iou/request/MoneyRequestAttendeeSelector.tsx @@ -52,7 +52,7 @@ function MoneyRequestAttendeeSelector({attendees = [], onFinish, onAttendeesAdde const [betas] = useOnyx(ONYXKEYS.BETAS); const [activePolicyID] = useOnyx(ONYXKEYS.NVP_ACTIVE_POLICY_ID); const session = useSession(); - const isCurrentUserAttendee = attendees.some((attendee) => attendee.accountID === session.accountID); + const isCurrentUserAttendee = attendees.some((attendee) => attendee.accountID === session?.accountID); const [recentAttendees] = useOnyx(ONYXKEYS.NVP_RECENT_ATTENDEES); const policy = usePolicy(activePolicyID); const [isSearchingForReports] = useOnyx(ONYXKEYS.IS_SEARCHING_FOR_REPORTS, {initWithStoredValues: false}); diff --git a/src/pages/iou/request/step/IOURequestStepConfirmation.tsx b/src/pages/iou/request/step/IOURequestStepConfirmation.tsx index cb5b4d626715..9e5405c241c3 100644 --- a/src/pages/iou/request/step/IOURequestStepConfirmation.tsx +++ b/src/pages/iou/request/step/IOURequestStepConfirmation.tsx @@ -54,7 +54,7 @@ function IOURequestStepConfirmation({ isLoadingTransaction, }: IOURequestStepConfirmationProps) { const currentUserPersonalDetails = useCurrentUserPersonalDetails(); - const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT; + const personalDetails = usePersonalDetails(); const [policyDraft] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY_DRAFTS}${IOU.getIOURequestPolicyID(transaction, reportDraft)}`); const [policyReal] = useOnyx(`${ONYXKEYS.COLLECTION.POLICY}${IOU.getIOURequestPolicyID(transaction, reportReal)}`);