Merge pull request #37129 from VickyStash/ts-migration/reimbursementA…

…ccountLoadingIndicator-component [TS migration] Migrate 'ReimbursementAccountLoadingIndicator.js' component to TypeScript
Expensify · Feb 28, 2024 · 1d17193 · 1d17193
2 parents f9eb683 + 2bc705a
commit 1d17193
Showing 1 changed file with 8 additions and 9 deletions.
diff --git a/...s/ReimbursementAccountLoadingIndicator.js → .../ReimbursementAccountLoadingIndicator.tsx b/...s/ReimbursementAccountLoadingIndicator.js → .../ReimbursementAccountLoadingIndicator.tsx
@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 import React from 'react';
 import {StyleSheet, View} from 'react-native';
 import useLocalize from '@hooks/useLocalize';
@@ -10,14 +9,15 @@ import LottieAnimations from './LottieAnimations';
 import ScreenWrapper from './ScreenWrapper';
 import Text from './Text';
 
-const propTypes = {
+type ReimbursementAccountLoadingIndicatorProps = {
     /** Method to trigger when pressing back button of the header */
-    onBackButtonPress: PropTypes.func.isRequired,
+    onBackButtonPress: () => void;
 };
 
-function ReimbursementAccountLoadingIndicator(props) {
+function ReimbursementAccountLoadingIndicator({onBackButtonPress}: ReimbursementAccountLoadingIndicatorProps) {
     const styles = useThemeStyles();
     const {translate} = useLocalize();
+
     return (
         <ScreenWrapper
             shouldShowOfflineIndicator={false}
@@ -26,27 +26,26 @@ function ReimbursementAccountLoadingIndicator(props) {
         >
             <HeaderWithBackButton
                 title={translate('reimbursementAccountLoadingAnimation.oneMoment')}
-                onBackButtonPress={props.onBackButtonPress}
+                onBackButtonPress={onBackButtonPress}
             />
             <FullPageOfflineBlockingView>
-                <View style={[styles.pageWrapper]}>
+                <View style={styles.pageWrapper}>
                     <Lottie
                         source={LottieAnimations.ReviewingBankInfo}
                         autoPlay
                         loop
                         style={styles.loadingVBAAnimation}
                         webStyle={styles.loadingVBAAnimationWeb}
                     />
-                    <View style={[styles.ph6]}>
-                        <Text style={[styles.textAlignCenter]}>{translate('reimbursementAccountLoadingAnimation.explanationLine')}</Text>
+                    <View style={styles.ph6}>
+                        <Text style={styles.textAlignCenter}>{translate('reimbursementAccountLoadingAnimation.explanationLine')}</Text>
                     </View>
                 </View>
             </FullPageOfflineBlockingView>
         </ScreenWrapper>
     );
 }
 
-ReimbursementAccountLoadingIndicator.propTypes = propTypes;
 ReimbursementAccountLoadingIndicator.displayName = 'ReimbursementAccountLoadingIndicator';
 
 export default ReimbursementAccountLoadingIndicator;