Skip to content

Commit

Permalink
clean function
Browse files Browse the repository at this point in the history
  • Loading branch information
@dukenv0307
dukenv0307 committed Nov 8, 2023
1 parent 2e27297 commit c536053
Show file tree
Hide file tree
Showing 10 changed files with 36 additions and 26 deletions.
1 change: 1 addition & 0 deletions src/components/AmountTextInput.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ const defaultProps = {
function AmountTextInput(props) {
return (
<TextInput
accessibilityLabel="Text input field"
disableKeyboard
autoGrow
hideFocusedState
Expand Down
1 change: 1 addition & 0 deletions src/components/MagicCodeInput.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -303,6 +303,7 @@ function MagicCodeInput(props) {
{/* Hide the input above the text. Cannot set opacity to 0 as it would break pasting on iOS Safari. */}
<View style={[StyleSheet.absoluteFillObject, styles.w100, styles.bgTransparent]}>
<TextInput
accessibilityLabel="Text input field"
ref={(ref) => {
inputRefs.current[index] = ref;
// Setting attribute type to "search" to prevent Password Manager from appearing in Mobile Chrome
Expand Down
11 changes: 1 addition & 10 deletions src/components/ReportActionItem/MoneyRequestPreview.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,6 @@ import reportActionPropTypes from '@pages/home/report/reportActionPropTypes';
import styles from '@styles/styles';
import * as StyleUtils from '@styles/StyleUtils';
import themeColors from '@styles/themes/default';
import variables from '@styles/variables';
import * as PaymentMethods from '@userActions/PaymentMethods';
import * as Report from '@userActions/Report';
import CONST from '@src/CONST';
Expand Down Expand Up @@ -293,15 +292,7 @@ function MoneyRequestPreview(props) {
<Text
style={[
styles.textHeadline,
props.isBillSplit &&
StyleUtils.getAmountFontSizeAndLineHeight(
variables.fontSizeXLarge,
variables.lineHeightXXLarge,
isSmallScreenWidth,
windowWidth,
displayAmount.length,
participantAvatars.length,
),
props.isBillSplit && StyleUtils.getAmountFontSizeAndLineHeight(isSmallScreenWidth, windowWidth, displayAmount.length, participantAvatars.length),
isDeleted && styles.lineThrough,
]}
numberOfLines={1}
Expand Down
2 changes: 2 additions & 0 deletions src/pages/ReimbursementAccount/BankAccountManualStep.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,6 +98,7 @@ function BankAccountManualStep(props) {
source={exampleCheckImage(preferredLocale)}
/>
<TextInput
accessibilityLabel="Text input field"
autoFocus
shouldDelayFocus={shouldDelayFocus}
inputID="routingNumber"
Expand All @@ -111,6 +112,7 @@ function BankAccountManualStep(props) {
shouldUseDefaultValue={shouldDisableInputs}
/>
<TextInput
accessibilityLabel="Text input field"
inputID="accountNumber"
containerStyles={[styles.mt4]}
label={translate('bankAccount.accountNumber')}
Expand Down
3 changes: 3 additions & 0 deletions src/pages/ReimbursementAccount/IdentityForm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -142,6 +142,7 @@ function IdentityForm(props) {
<View style={[styles.flexRow]}>
<View style={[styles.flex2, styles.mr2]}>
<TextInput
accessibilityLabel="Text input field"
inputID={props.inputKeys.firstName}
shouldSaveDraft={props.shouldSaveDraft}
label={`${props.translate('common.firstName')}`}
Expand All @@ -155,6 +156,7 @@ function IdentityForm(props) {
</View>
<View style={[styles.flex2]}>
<TextInput
accessibilityLabel="Text input field"
inputID={props.inputKeys.lastName}
shouldSaveDraft={props.shouldSaveDraft}
label={`${props.translate('common.lastName')}`}
Expand All @@ -180,6 +182,7 @@ function IdentityForm(props) {
maxDate={maxDate}
/>
<TextInput
accessibilityLabel="Text input field"
inputID={props.inputKeys.ssnLast4}
shouldSaveDraft={props.shouldSaveDraft}
label={`${props.translate('common.ssnLast4')}`}
Expand Down
3 changes: 3 additions & 0 deletions src/pages/ReimbursementAccount/ValidationStep.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -153,6 +153,7 @@ function ValidationStep({reimbursementAccount, translate, onBackButtonPress, acc
</View>
<View style={[styles.mv5]}>
<TextInput
accessibilityLabel="Text input field"
inputID="amount1"
shouldSaveDraft
containerStyles={[styles.mb1]}
Expand All @@ -161,6 +162,7 @@ function ValidationStep({reimbursementAccount, translate, onBackButtonPress, acc
role={CONST.ACCESSIBILITY_ROLE.TEXT}
/>
<TextInput
accessibilityLabel="Text input field"
inputID="amount2"
shouldSaveDraft
containerStyles={[styles.mb1]}
Expand All @@ -169,6 +171,7 @@ function ValidationStep({reimbursementAccount, translate, onBackButtonPress, acc
role={CONST.ACCESSIBILITY_ROLE.TEXT}
/>
<TextInput
accessibilityLabel="Text input field"
shouldSaveDraft
inputID="amount3"
containerStyles={[styles.mb1]}
Expand Down
4 changes: 4 additions & 0 deletions src/pages/settings/Profile/PersonalDetails/AddressPage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -210,6 +210,7 @@ function AddressPage({privatePersonalDetails, route}) {
</View>
<View style={styles.formSpaceVertical} />
<TextInput
accessibilityLabel="Text input field"
inputID="addressLine2"
label={translate('common.addressLine', {lineNumber: 2})}
aria-label={translate('common.addressLine', {lineNumber: 2})}
Expand All @@ -236,6 +237,7 @@ function AddressPage({privatePersonalDetails, route}) {
</View>
) : (
<TextInput
accessibilityLabel="Text input field"
inputID="state"
label={translate('common.stateOrProvince')}
aria-label={translate('common.stateOrProvince')}
Expand All @@ -248,6 +250,7 @@ function AddressPage({privatePersonalDetails, route}) {
)}
<View style={styles.formSpaceVertical} />
<TextInput
accessibilityLabel="Text input field"
inputID="city"
label={translate('common.city')}
aria-label={translate('common.city')}
Expand All @@ -259,6 +262,7 @@ function AddressPage({privatePersonalDetails, route}) {
/>
<View style={styles.formSpaceVertical} />
<TextInput
accessibilityLabel="Text input field"
inputID="zipPostCode"
label={translate('common.zipPostCode')}
aria-label={translate('common.zipPostCode')}
Expand Down
5 changes: 5 additions & 0 deletions src/pages/settings/Wallet/AddDebitCardPage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -126,6 +126,7 @@ function DebitCardPage(props) {
style={[styles.mh5, styles.flexGrow1]}
>
<TextInput
accessibilityLabel="Text input field"
inputID="nameOnCard"
label={translate('addDebitCardPage.nameOnCard')}
aria-label={translate('addDebitCardPage.nameOnCard')}
Expand All @@ -134,6 +135,7 @@ function DebitCardPage(props) {
spellCheck={false}
/>
<TextInput
accessibilityLabel="Text input field"
inputID="cardNumber"
label={translate('addDebitCardPage.debitCardNumber')}
aria-label={translate('addDebitCardPage.debitCardNumber')}
Expand All @@ -144,6 +146,7 @@ function DebitCardPage(props) {
<View style={[styles.flexRow, styles.mt4]}>
<View style={[styles.flex1, styles.mr2]}>
<TextInput
accessibilityLabel="Text input field"
inputID="expirationDate"
label={translate('addDebitCardPage.expiration')}
aria-label={translate('addDebitCardPage.expiration')}
Expand All @@ -155,6 +158,7 @@ function DebitCardPage(props) {
</View>
<View style={[styles.flex1]}>
<TextInput
accessibilityLabel="Text input field"
inputID="securityCode"
label={translate('addDebitCardPage.cvv')}
aria-label={translate('addDebitCardPage.cvv')}
Expand All @@ -175,6 +179,7 @@ function DebitCardPage(props) {
/>
</View>
<TextInput
accessibilityLabel="Text input field"
inputID="addressZipCode"
label={translate('common.zip')}
aria-label={translate('common.zip')}
Expand Down
1 change: 1 addition & 0 deletions src/pages/workspace/reimburse/WorkspaceRateAndUnitPage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -176,6 +176,7 @@ class WorkspaceRateAndUnitPage extends React.Component {
}
>
<TextInput
accessibilityLabel="Text input field"
role={CONST.ACCESSIBILITY_ROLE.TEXT}
inputID="rate"
containerStyles={[styles.mt4]}
Expand Down
31 changes: 15 additions & 16 deletions src/styles/StyleUtils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1257,43 +1257,42 @@ function getDropDownButtonHeight(buttonSize: ButtonSizeValue): ViewStyle {
/**
* Returns fitting fontSize and lineHeight values in order to prevent large amounts from being cut off on small screen widths.
*/
function getAmountFontSizeAndLineHeight(
baseFontSize: number,
baseLineHeight: number,
isSmallScreenWidth: boolean,
windowWidth: number,
displayAmountLength: number,
numberOfParticipant: number,
): TextStyle {
function getAmountFontSizeAndLineHeight(isSmallScreenWidth: boolean, windowWidth: number, displayAmountLength: number, numberOfParticipant: number): TextStyle {
let toSubtract = 0;
const baseFontSize = variables.fontSizeXLarge;
const baseLineHeight = variables.lineHeightXXLarge;

const numberOfAvatar = numberOfParticipant < 4 ? numberOfParticipant : 4;
if (isSmallScreenWidth && windowWidth <= 410) {
const widthDifferent = 410 - windowWidth;

// with a window width is more than 420px the maximum amount will not be cut off with the maximum avatar displays
if (isSmallScreenWidth && windowWidth < 420) {
const widthDifference = 420 - windowWidth;
switch (true) {
case widthDifferent > 60:
// It is very rare for native devices to have a width smaller than 350px so add a constant subtract here
case widthDifference > 70:
toSubtract = 11;
break;
case widthDifferent > 50:
case widthDifference > 60:
if (18 - numberOfAvatar * 2 < displayAmountLength) {
toSubtract = numberOfAvatar * 2;
}
break;
case widthDifferent > 40:
case widthDifference > 50:
if (18 - numberOfAvatar * 2 < displayAmountLength) {
toSubtract = (numberOfAvatar - 1) * 2 + 1;
}
break;
case widthDifferent > 30:
case widthDifference > 40:
if (20 - numberOfAvatar * 2 < displayAmountLength) {
toSubtract = (numberOfAvatar - 1) * 2;
}
break;
case widthDifferent > 20:
case widthDifference > 30:
if (20 - numberOfAvatar * 2 < displayAmountLength) {
toSubtract = (numberOfAvatar - 1) * 2 - 1;
}
break;
case widthDifferent > 10:
case widthDifference > 20:
if (20 - numberOfAvatar * 2 < displayAmountLength) {
toSubtract = (numberOfAvatar - 2) * 2;
}
Expand Down

0 comments on commit c536053

Please sign in to comment.