Skip to content

Instantly share code, notes, and snippets.

@doodlemoonch
Created January 12, 2023 10:01
Show Gist options
  • Save doodlemoonch/32fc65c778cb5386c4f482857778202a to your computer and use it in GitHub Desktop.
Save doodlemoonch/32fc65c778cb5386c4f482857778202a to your computer and use it in GitHub Desktop.
import React, { useEffect, useState } from 'react';
import { ActivityIndicator, View } from 'react-native';
import { WebView } from 'react-native-webview';
import { AuthHeaders, getCognitoHeaders } from '@root/cognito/cognitoSessionInfo';
import { useAppSelector } from '@hooks/hooks';
export interface IAuthenticatedWebviewProps {
url: string;
injectedJavaScript?: any;
onShouldStartLoadWithRequest: any;
}
const AuthenticatedWebview: React.FC<IAuthenticatedWebviewProps> = ({
onShouldStartLoadWithRequest,
url,
injectedJavaScript,
}) => {
const app = useAppSelector((state) => state.app);
const env = useAppSelector((state) => state.app?.env);
const [headers, setHeaders] = useState<AuthHeaders | null>(null);
useEffect(() => {
async function getHeaders() {
setHeaders(
await getCognitoHeaders(app.cognitoUserPoolId, app.cognitoClientId, env, '', true)
);
}
getHeaders();
}, []);
if (!headers) return null;
const source = {
uri: url,
headers,
};
return (
<View style={{ flex: 1 }}>
<WebView
useWebKit={false}
source={source}
sharedCookiesEnabled={true}
incognito={true}
startInLoadingState={true}
onShouldStartLoadWithRequest={onShouldStartLoadWithRequest || (() => true)}
renderLoading={() => (
<View style={{ flex: 1, justifyContent: 'center' }}>
<ActivityIndicator animating={true} color="rgb(249,100,75)" size="large" />
</View>
)}
injectedJavaScript={injectedJavaScript || ''}
/>
</View>
);
};
export default AuthenticatedWebview;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment