-
Notifications
You must be signed in to change notification settings - Fork 2.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix - Attachment - Unable to download a txt attachment until the browser is refreshed #49898
Changes from 8 commits
8da97f8
692a88b
fcf13c9
87aa484
33360aa
86d532a
bd9a32f
9e228dc
9b536ef
28cf9ad
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -2,8 +2,7 @@ import {Str} from 'expensify-common'; | |
import React, {memo, useContext, useEffect, useState} from 'react'; | ||
import type {GestureResponderEvent, StyleProp, ViewStyle} from 'react-native'; | ||
import {View} from 'react-native'; | ||
import type {OnyxEntry} from 'react-native-onyx'; | ||
import {withOnyx} from 'react-native-onyx'; | ||
import {useOnyx} from 'react-native-onyx'; | ||
import AttachmentCarouselPagerContext from '@components/Attachments/AttachmentCarousel/Pager/AttachmentCarouselPagerContext'; | ||
import type {Attachment, AttachmentSource} from '@components/Attachments/types'; | ||
import DistanceEReceipt from '@components/DistanceEReceipt'; | ||
|
@@ -24,60 +23,57 @@ import * as TransactionUtils from '@libs/TransactionUtils'; | |
import type {ColorValue} from '@styles/utils/types'; | ||
import variables from '@styles/variables'; | ||
import ONYXKEYS from '@src/ONYXKEYS'; | ||
import type {Transaction} from '@src/types/onyx'; | ||
import AttachmentViewImage from './AttachmentViewImage'; | ||
import AttachmentViewPdf from './AttachmentViewPdf'; | ||
import AttachmentViewVideo from './AttachmentViewVideo'; | ||
import DefaultAttachmentView from './DefaultAttachmentView'; | ||
import HighResolutionInfo from './HighResolutionInfo'; | ||
|
||
type AttachmentViewOnyxProps = { | ||
transaction: OnyxEntry<Transaction>; | ||
}; | ||
type AttachmentViewProps = Attachment & { | ||
/** Whether this view is the active screen */ | ||
isFocused?: boolean; | ||
|
||
type AttachmentViewProps = AttachmentViewOnyxProps & | ||
Attachment & { | ||
/** Whether this view is the active screen */ | ||
isFocused?: boolean; | ||
/** Function for handle on press */ | ||
onPress?: (e?: GestureResponderEvent | KeyboardEvent) => void; | ||
|
||
/** Function for handle on press */ | ||
onPress?: (e?: GestureResponderEvent | KeyboardEvent) => void; | ||
isUsedInAttachmentModal?: boolean; | ||
|
||
isUsedInAttachmentModal?: boolean; | ||
/** Flag to show/hide download icon */ | ||
shouldShowDownloadIcon?: boolean; | ||
|
||
/** Flag to show/hide download icon */ | ||
shouldShowDownloadIcon?: boolean; | ||
/** Flag to show the loading indicator */ | ||
shouldShowLoadingSpinnerIcon?: boolean; | ||
|
||
/** Flag to show the loading indicator */ | ||
shouldShowLoadingSpinnerIcon?: boolean; | ||
/** Notify parent that the UI should be modified to accommodate keyboard */ | ||
onToggleKeyboard?: (shouldFadeOut: boolean) => void; | ||
|
||
/** Notify parent that the UI should be modified to accommodate keyboard */ | ||
onToggleKeyboard?: (shouldFadeOut: boolean) => void; | ||
/** A callback when the PDF fails to load */ | ||
onPDFLoadError?: () => void; | ||
|
||
/** A callback when the PDF fails to load */ | ||
onPDFLoadError?: () => void; | ||
/** Extra styles to pass to View wrapper */ | ||
containerStyles?: StyleProp<ViewStyle>; | ||
|
||
/** Extra styles to pass to View wrapper */ | ||
containerStyles?: StyleProp<ViewStyle>; | ||
/** Denotes whether it is a workspace avatar or not */ | ||
isWorkspaceAvatar?: boolean; | ||
|
||
/** Denotes whether it is a workspace avatar or not */ | ||
isWorkspaceAvatar?: boolean; | ||
/** Denotes whether it is an icon (ex: SVG) */ | ||
maybeIcon?: boolean; | ||
|
||
/** Denotes whether it is an icon (ex: SVG) */ | ||
maybeIcon?: boolean; | ||
/** Fallback source to use in case of error */ | ||
fallbackSource?: AttachmentSource; | ||
|
||
/** Fallback source to use in case of error */ | ||
fallbackSource?: AttachmentSource; | ||
/* Whether it is hovered or not */ | ||
isHovered?: boolean; | ||
|
||
/* Whether it is hovered or not */ | ||
isHovered?: boolean; | ||
/** Whether the attachment is used as a chat attachment */ | ||
isUsedAsChatAttachment?: boolean; | ||
|
||
/** Whether the attachment is used as a chat attachment */ | ||
isUsedAsChatAttachment?: boolean; | ||
/* Flag indicating whether the attachment has been uploaded. */ | ||
isUploaded?: boolean; | ||
|
||
/* Flag indicating whether the attachment has been uploaded. */ | ||
isUploaded?: boolean; | ||
}; | ||
/** Flag indicating if the attachment is being uploaded. */ | ||
isUploading?: boolean; | ||
}; | ||
|
||
function AttachmentView({ | ||
source, | ||
|
@@ -95,16 +91,20 @@ function AttachmentView({ | |
isWorkspaceAvatar, | ||
maybeIcon, | ||
fallbackSource, | ||
transaction, | ||
transactionID = '-1', | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. There is a conversation about the usage of In the future I understand we want undefined or null (not sure which one), so I don't know if we should be using There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. We will continue with |
||
reportActionID, | ||
isHovered, | ||
duration, | ||
isUsedAsChatAttachment, | ||
isUploaded = true, | ||
isUploading = false, | ||
}: AttachmentViewProps) { | ||
const {translate} = useLocalize(); | ||
const {updateCurrentlyPlayingURL} = usePlaybackContext(); | ||
const attachmentCarouselPagerContext = useContext(AttachmentCarouselPagerContext); | ||
|
||
const [transaction] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`); | ||
|
||
const theme = useTheme(); | ||
const styles = useThemeStyles(); | ||
const StyleUtils = useStyleUtils(); | ||
|
@@ -288,20 +288,16 @@ function AttachmentView({ | |
<DefaultAttachmentView | ||
fileName={file?.name} | ||
shouldShowDownloadIcon={shouldShowDownloadIcon} | ||
shouldShowLoadingSpinnerIcon={shouldShowLoadingSpinnerIcon} | ||
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing | ||
shouldShowLoadingSpinnerIcon={shouldShowLoadingSpinnerIcon || isUploading} | ||
containerStyles={containerStyles} | ||
isUploading={isUploading} | ||
/> | ||
); | ||
} | ||
|
||
AttachmentView.displayName = 'AttachmentView'; | ||
|
||
export default memo( | ||
withOnyx<AttachmentViewProps, AttachmentViewOnyxProps>({ | ||
transaction: { | ||
key: ({transactionID}) => `${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`, | ||
}, | ||
})(AttachmentView), | ||
); | ||
export default memo(AttachmentView); | ||
|
||
export type {AttachmentViewProps}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
we missed to add a comment to this prop when it was added, could we add it please?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done.