From b770e8d6b48ec7a587ebb8fea0351d3c01c7c428 Mon Sep 17 00:00:00 2001 From: Jakub Butkiewicz Date: Fri, 15 Dec 2023 12:10:56 +0100 Subject: [PATCH 1/5] ref: migrated WorkspaceInvoiceVBAView and added one prop to menu items proptypes --- src/components/menuItemPropTypes.js | 3 +++ ...n.js => WorkspaceInvoicesFirstSection.tsx} | 0 ...View.js => WorkspaceInvoicesNoVBAView.tsx} | 0 ...oicesPage.js => WorkspaceInvoicesPage.tsx} | 0 ...BAView.js => WorkspaceInvoicesVBAView.tsx} | 27 +++++++++---------- 5 files changed, 15 insertions(+), 15 deletions(-) rename src/pages/workspace/invoices/{WorkspaceInvoicesFirstSection.js => WorkspaceInvoicesFirstSection.tsx} (100%) rename src/pages/workspace/invoices/{WorkspaceInvoicesNoVBAView.js => WorkspaceInvoicesNoVBAView.tsx} (100%) rename src/pages/workspace/invoices/{WorkspaceInvoicesPage.js => WorkspaceInvoicesPage.tsx} (100%) rename src/pages/workspace/invoices/{WorkspaceInvoicesVBAView.js => WorkspaceInvoicesVBAView.tsx} (58%) diff --git a/src/components/menuItemPropTypes.js b/src/components/menuItemPropTypes.js index 4d2de3275e23..c12ce293c2bf 100644 --- a/src/components/menuItemPropTypes.js +++ b/src/components/menuItemPropTypes.js @@ -162,6 +162,9 @@ const propTypes = { /** Should check anonymous user in onPress function */ shouldCheckActionAllowedOnPress: PropTypes.bool, + + /** link the menu item link or function to get the link */ + link: PropTypes.oneOfType(PropTypes.func, PropTypes.string), }; export default propTypes; diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.js b/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.tsx similarity index 100% rename from src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.js rename to src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.tsx diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.js b/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.tsx similarity index 100% rename from src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.js rename to src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.tsx diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesPage.js b/src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx similarity index 100% rename from src/pages/workspace/invoices/WorkspaceInvoicesPage.js rename to src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesVBAView.js b/src/pages/workspace/invoices/WorkspaceInvoicesVBAView.tsx similarity index 58% rename from src/pages/workspace/invoices/WorkspaceInvoicesVBAView.js rename to src/pages/workspace/invoices/WorkspaceInvoicesVBAView.tsx index c5e047f6291b..5c62e16eaa4a 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoicesVBAView.js +++ b/src/pages/workspace/invoices/WorkspaceInvoicesVBAView.tsx @@ -1,36 +1,34 @@ -import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; import * as Expensicons from '@components/Icon/Expensicons'; import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; -import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Link from '@userActions/Link'; import WorkspaceInvoicesFirstSection from './WorkspaceInvoicesFirstSection'; -const propTypes = { - /** The policy ID currently being configured */ - policyID: PropTypes.string.isRequired, - - ...withLocalizePropTypes, +type WorkspaceInvoicesVBAViewProps = { + /** The polgicy ID currently being configured */ + policyID: string; }; -function WorkspaceInvoicesVBAView(props) { +function WorkspaceInvoicesVBAView({policyID}: WorkspaceInvoicesVBAViewProps) { + const {translate} = useLocalize(); const styles = useThemeStyles(); - const viewUnpaidInvoicesUrl = `reports?policyID=${props.policyID}&from=all&type=invoice&showStates=Processing&isAdvancedFilterMode=true`; + const viewUnpaidInvoicesUrl = `reports?policyID=${policyID}&from=all&type=invoice&showStates=Processing&isAdvancedFilterMode=true`; return ( <> - +
Link.openOldDotLink(viewUnpaidInvoicesUrl), icon: Expensicons.Hourglass, shouldShowRightIcon: true, @@ -41,14 +39,13 @@ function WorkspaceInvoicesVBAView(props) { ]} > - {props.translate('workspace.invoices.unlockVBACopy')} + {translate('workspace.invoices.unlockVBACopy')}
); } -WorkspaceInvoicesVBAView.propTypes = propTypes; WorkspaceInvoicesVBAView.displayName = 'WorkspaceInvoicesVBAView'; -export default withLocalize(WorkspaceInvoicesVBAView); +export default WorkspaceInvoicesVBAView; From d44ee3f3485227b3906e66354fffe0b1a1f16598 Mon Sep 17 00:00:00 2001 From: Jakub Butkiewicz Date: Fri, 15 Dec 2023 12:15:48 +0100 Subject: [PATCH 2/5] ref: moved WorkspaceInvoicesPage to TS --- .../invoices/WorkspaceInvoicesPage.tsx | 31 +++++++------------ 1 file changed, 11 insertions(+), 20 deletions(-) diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx b/src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx index 8bc0c4484100..49e9430768cf 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx +++ b/src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx @@ -1,33 +1,25 @@ -import PropTypes from 'prop-types'; +import {StackScreenProps} from '@react-navigation/stack'; import React from 'react'; -import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useLocalize from '@hooks/useLocalize'; +import {SettingsNavigatorParamList} from '@libs/Navigation/types'; import WorkspacePageWithSections from '@pages/workspace/WorkspacePageWithSections'; import CONST from '@src/CONST'; +import SCREENS from '@src/SCREENS'; import WorkspaceInvoicesNoVBAView from './WorkspaceInvoicesNoVBAView'; import WorkspaceInvoicesVBAView from './WorkspaceInvoicesVBAView'; -const propTypes = { - /** The route object passed to this page from the navigator */ - route: PropTypes.shape({ - /** Each parameter passed via the URL */ - params: PropTypes.shape({ - /** The policyID that is being configured */ - policyID: PropTypes.string.isRequired, - }).isRequired, - }).isRequired, +type WorkspaceInvoicesPageProps = StackScreenProps; - ...withLocalizePropTypes, -}; - -function WorkspaceInvoicesPage(props) { +function WorkspaceInvoicesPage({route}: WorkspaceInvoicesPageProps) { + const {translate} = useLocalize(); return ( - {(hasVBA, policyID) => ( + {(hasVBA: boolean, policyID: string) => ( <> {!hasVBA && } {hasVBA && } @@ -37,7 +29,6 @@ function WorkspaceInvoicesPage(props) { ); } -WorkspaceInvoicesPage.propTypes = propTypes; WorkspaceInvoicesPage.displayName = 'WorkspaceInvoicesPage'; -export default withLocalize(WorkspaceInvoicesPage); +export default WorkspaceInvoicesPage; From b794b822ddf92a5aebf5aa740f0cbf4a26a5abf7 Mon Sep 17 00:00:00 2001 From: Jakub Butkiewicz Date: Fri, 15 Dec 2023 12:19:17 +0100 Subject: [PATCH 3/5] ref: Refactor WorkspaceInvoicesNoVBAView component to TS --- .../invoices/WorkspaceInvoicesNoVBAView.tsx | 24 +++++++++---------- .../invoices/WorkspaceInvoicesPage.tsx | 1 + 2 files changed, 12 insertions(+), 13 deletions(-) diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.tsx b/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.tsx index 25a97ac93442..b382f0d7c609 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.tsx +++ b/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.tsx @@ -1,37 +1,36 @@ -import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; import ConnectBankAccountButton from '@components/ConnectBankAccountButton'; import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; -import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import WorkspaceInvoicesFirstSection from './WorkspaceInvoicesFirstSection'; -const propTypes = { +type WorkspaceInvoicesNoVBAViewProps = { /** The policy ID currently being configured */ - policyID: PropTypes.string.isRequired, - - ...withLocalizePropTypes, + policyID: string; }; -function WorkspaceInvoicesNoVBAView(props) { +function WorkspaceInvoicesNoVBAView({policyID}: WorkspaceInvoicesNoVBAViewProps) { const styles = useThemeStyles(); + const {translate} = useLocalize(); + return ( <> - +
- {props.translate('workspace.invoices.unlockNoVBACopy')} + {translate('workspace.invoices.unlockNoVBACopy')}
@@ -39,7 +38,6 @@ function WorkspaceInvoicesNoVBAView(props) { ); } -WorkspaceInvoicesNoVBAView.propTypes = propTypes; WorkspaceInvoicesNoVBAView.displayName = 'WorkspaceInvoicesNoVBAView'; -export default withLocalize(WorkspaceInvoicesNoVBAView); +export default WorkspaceInvoicesNoVBAView; diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx b/src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx index 49e9430768cf..8c1eb5b66871 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx +++ b/src/pages/workspace/invoices/WorkspaceInvoicesPage.tsx @@ -12,6 +12,7 @@ type WorkspaceInvoicesPageProps = StackScreenProps Date: Fri, 15 Dec 2023 12:26:28 +0100 Subject: [PATCH 4/5] ref: Refactor WorkspaceInvoicesFirstSection component to TS --- .../WorkspaceInvoicesFirstSection.tsx | 26 +++++++++---------- 1 file changed, 12 insertions(+), 14 deletions(-) diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.tsx b/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.tsx index b33311021e61..ede9a94d5159 100644 --- a/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.tsx +++ b/src/pages/workspace/invoices/WorkspaceInvoicesFirstSection.tsx @@ -1,33 +1,32 @@ -import PropTypes from 'prop-types'; import React from 'react'; import {View} from 'react-native'; import * as Expensicons from '@components/Icon/Expensicons'; import * as Illustrations from '@components/Icon/Illustrations'; import Section from '@components/Section'; import Text from '@components/Text'; -import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; +import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Link from '@userActions/Link'; -const propTypes = { +type WorkspaceInvoicesFirstSectionProps = { /** The policy ID currently being configured */ - policyID: PropTypes.string.isRequired, - - ...withLocalizePropTypes, + policyID: string; }; -function WorkspaceInvoicesFirstSection(props) { +function WorkspaceInvoicesFirstSection({policyID}: WorkspaceInvoicesFirstSectionProps) { const styles = useThemeStyles(); + const {translate} = useLocalize(); + const sendInvoiceUrl = encodeURI('reports?param={"createInvoice":true}'); - const viewAllInvoicesUrl = `reports?policyID=${props.policyID}&from=all&type=invoice&showStates=Open,Processing,Approved,Reimbursed,Archived&isAdvancedFilterMode=true`; + const viewAllInvoicesUrl = `reports?policyID=${policyID}&from=all&type=invoice&showStates=Open,Processing,Approved,Reimbursed,Archived&isAdvancedFilterMode=true`; return (
Link.openOldDotLink(sendInvoiceUrl), icon: Expensicons.Send, shouldShowRightIcon: true, @@ -36,7 +35,7 @@ function WorkspaceInvoicesFirstSection(props) { link: () => Link.buildOldDotURL(sendInvoiceUrl), }, { - title: props.translate('workspace.invoices.viewAllInvoices'), + title: translate('workspace.invoices.viewAllInvoices'), onPress: () => Link.openOldDotLink(viewAllInvoicesUrl), icon: Expensicons.Invoice, shouldShowRightIcon: true, @@ -48,13 +47,12 @@ function WorkspaceInvoicesFirstSection(props) { containerStyles={[styles.cardSection]} > - {props.translate('workspace.invoices.invoiceFirstSectionCopy')} + {translate('workspace.invoices.invoiceFirstSectionCopy')}
); } -WorkspaceInvoicesFirstSection.propTypes = propTypes; WorkspaceInvoicesFirstSection.displayName = 'WorkspaceInvoicesFirstSection'; -export default withLocalize(WorkspaceInvoicesFirstSection); +export default WorkspaceInvoicesFirstSection; From 7dbead3203bfc14cc9151604984d6c5d07f7f4b7 Mon Sep 17 00:00:00 2001 From: Jakub Butkiewicz Date: Mon, 18 Dec 2023 14:28:25 +0100 Subject: [PATCH 5/5] fix: typo --- src/components/menuItemPropTypes.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/menuItemPropTypes.js b/src/components/menuItemPropTypes.js index c12ce293c2bf..21cc8295ff46 100644 --- a/src/components/menuItemPropTypes.js +++ b/src/components/menuItemPropTypes.js @@ -163,7 +163,7 @@ const propTypes = { /** Should check anonymous user in onPress function */ shouldCheckActionAllowedOnPress: PropTypes.bool, - /** link the menu item link or function to get the link */ + /** The menu item link or function to get the link */ link: PropTypes.oneOfType(PropTypes.func, PropTypes.string), };