From afe2dabc450da6d6d1b5964034ec885c56854a4a Mon Sep 17 00:00:00 2001 From: Alex Demchenko Date: Thu, 27 Jan 2022 22:30:50 +0100 Subject: [PATCH] Fixes after PR --- README.md | 2 +- src/LinkPreview.tsx | 14 ++++++++++---- src/utils.ts | 18 ++++++++++-------- 3 files changed, 21 insertions(+), 13 deletions(-) diff --git a/README.md b/README.md index c3e7a50..30336fd 100644 --- a/README.md +++ b/README.md @@ -52,9 +52,9 @@ return ( | renderMinimizedImage | (PreviewDataImage) => ReactNode | Custom minimised image render prop | | renderText | (string) => ReactNode | Custom provided text render prop | | renderTitle | (string) => ReactNode | Custom title render prop | +| requestTimeout | number | Timeout after which request to get preview data should abort | | textContainerStyle | [ViewStyle](https://reactnative.dev/docs/view-style-props) | Text, title, description and minimized image container style | | touchableWithoutFeedbackProps | TouchableWithoutFeedbackProps | Top level touchable props | -| requestTimeout | number | Timeout after which request to get preview data should abort | ## License diff --git a/src/LinkPreview.tsx b/src/LinkPreview.tsx index 636d79b..051a105 100644 --- a/src/LinkPreview.tsx +++ b/src/LinkPreview.tsx @@ -35,10 +35,10 @@ export interface LinkPreviewProps { renderMinimizedImage?: (image: PreviewDataImage) => React.ReactNode renderText?: (text: string) => React.ReactNode renderTitle?: (title: string) => React.ReactNode + requestTimeout?: number text: string textContainerStyle?: StyleProp - touchableWithoutFeedbackProps?: TouchableWithoutFeedbackProps, - requestTimeout?:number + touchableWithoutFeedbackProps?: TouchableWithoutFeedbackProps } export const LinkPreview = React.memo( @@ -57,10 +57,10 @@ export const LinkPreview = React.memo( renderMinimizedImage, renderText, renderTitle, + requestTimeout = 5000, text, textContainerStyle, touchableWithoutFeedbackProps, - requestTimeout = 5000 }: LinkPreviewProps) => { const [containerWidth, setContainerWidth] = React.useState(0) const [data, setData] = React.useState(previewData) @@ -95,7 +95,13 @@ export const LinkPreview = React.memo( return () => { isCancelled = true } - }, [enableAnimation, onPreviewDataFetched, previewData, text]) + }, [ + enableAnimation, + onPreviewDataFetched, + previewData, + requestTimeout, + text, + ]) const handleContainerLayout = React.useCallback( (event: LayoutChangeEvent) => { diff --git a/src/utils.ts b/src/utils.ts index b03a57d..d3df83c 100644 --- a/src/utils.ts +++ b/src/utils.ts @@ -54,7 +54,7 @@ export const getImageSize = (url: string) => { // Functions below use functions from the same file and mocks are not working /* istanbul ignore next */ -export const getPreviewData = async (text: string, requestTimeout=5000) => { +export const getPreviewData = async (text: string, requestTimeout = 5000) => { const previewData: PreviewData = { description: undefined, image: undefined, @@ -77,23 +77,25 @@ export const getPreviewData = async (text: string, requestTimeout=5000) => { url = 'https://' + url } - let abortControllerTimeout: NodeJS.Timeout; - const abortController = new AbortController(); + // eslint-disable-next-line no-undef + let abortControllerTimeout: NodeJS.Timeout + const abortController = new AbortController() const request = fetch(url, { headers: { 'User-Agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.169 Safari/537.36', }, - signal:abortController.signal + signal: abortController.signal, }) abortControllerTimeout = setTimeout(() => { - abortController.abort(); - }, requestTimeout); - const response = await request; + abortController.abort() + }, requestTimeout) - clearTimeout(abortControllerTimeout); + const response = await request + + clearTimeout(abortControllerTimeout) previewData.link = url