Skip to content

Commit

Permalink
refactor(button): Make GRAY_WITH_BORDER the SECONDARY button type, re…
Browse files Browse the repository at this point in the history
…move unused styles (#5462)

### Description

SECONDARY updated to be GRAY_WITH_BORDER
GRAY_WITH_BORDER removed
SECONDARY_WHITE_BG removed

### Test plan
![Simulator Screenshot - iPhone 14 Pro - 2024-05-23 at 14 36
32](https://github.com/valora-inc/wallet/assets/140328381/49494ec9-354f-4fec-abbf-4e6ef478dc45)
![Simulator Screenshot - iPhone 14 Pro - 2024-05-23 at 14 29
33](https://github.com/valora-inc/wallet/assets/140328381/e7c1a2f5-947b-47d4-bdcd-9046fc5d348c)
![Simulator Screenshot - iPhone 14 Pro - 2024-05-23 at 14 29
47](https://github.com/valora-inc/wallet/assets/140328381/69f2b57c-7bc5-400f-8624-33d9a96bf7e9)
![Simulator Screenshot - iPhone 14 Pro - 2024-05-23 at 14 30
25](https://github.com/valora-inc/wallet/assets/140328381/3bc8bc10-b6eb-4ab1-8469-a2688d670e5a)
![Simulator Screenshot - iPhone 14 Pro - 2024-05-23 at 14 31
39](https://github.com/valora-inc/wallet/assets/140328381/cd44807e-f8a9-4887-bbdf-61220ee63f35)
![Simulator Screenshot - iPhone 14 Pro - 2024-05-23 at 14 35
48](https://github.com/valora-inc/wallet/assets/140328381/2a514c34-03e6-42f1-9b4e-82de149de057)



<!-- Demonstrate the change is solid, or why it doesn't need testing.
Example: add any manual testing steps or scenarios (if not obvious),
screenshots / videos if the pull request changes the user interface.
-->

### Related issues

- Fixes #ACT-1056

### Backwards compatibility

Yes

### Network scalability

If a new NetworkId and/or Network are added in the future, the changes
in this PR will:

- [X] Continue to work without code changes, OR trigger a compilation
error (guaranteeing we find it when a new network is added)
  • Loading branch information
finnian0826 authored May 23, 2024
1 parent 37e365e commit cca5d3c
Show file tree
Hide file tree
Showing 14 changed files with 35 additions and 33 deletions.
7 changes: 5 additions & 2 deletions src/account/__snapshots__/AccountKeyEducation.test.tsx.snap
Original file line number Diff line number Diff line change
Expand Up @@ -534,12 +534,15 @@ exports[`AccountKeyEducation renders correctly 1`] = `
[
{
"alignItems": "center",
"backgroundColor": "#F9F6F0",
"backgroundColor": "#F8F9F9",
"borderColor": "#E6E6E6",
"borderRadius": 100,
"borderWidth": 1,
"flexDirection": "row",
"height": 48,
"justifyContent": "center",
"minWidth": 120,
"opacity": undefined,
"opacity": 1,
"paddingHorizontal": 24,
"paddingVertical": 5,
},
Expand Down
7 changes: 5 additions & 2 deletions src/account/__snapshots__/GoldEducation.test.tsx.snap
Original file line number Diff line number Diff line change
Expand Up @@ -534,12 +534,15 @@ exports[`renders correctly 1`] = `
[
{
"alignItems": "center",
"backgroundColor": "#F9F6F0",
"backgroundColor": "#F8F9F9",
"borderColor": "#E6E6E6",
"borderRadius": 100,
"borderWidth": 1,
"flexDirection": "row",
"height": 48,
"justifyContent": "center",
"minWidth": 120,
"opacity": undefined,
"opacity": 1,
"paddingHorizontal": 24,
"paddingVertical": 5,
},
Expand Down
2 changes: 1 addition & 1 deletion src/app/MultichainBeta.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ function MultichainBeta() {
<Button
style={styles.cta}
touchableStyle={styles.ctaTouchable}
type={BtnTypes.SECONDARY_WHITE_BG}
type={BtnTypes.SECONDARY}
size={BtnSizes.FULL}
text={t('multichainBeta.secondaryCta')}
onPress={() => onPressCta(false)}
Expand Down
9 changes: 6 additions & 3 deletions src/backup/__snapshots__/BackupPhrase.test.tsx.snap
Original file line number Diff line number Diff line change
Expand Up @@ -661,12 +661,15 @@ exports[`BackupPhrase renders correctly with backup not completed 1`] = `
[
{
"alignItems": "center",
"backgroundColor": "#F9F6F0",
"backgroundColor": "#F8F9F9",
"borderColor": "#E6E6E6",
"borderRadius": 100,
"borderWidth": 1,
"flexDirection": "row",
"flexGrow": 1,
"height": 48,
"justifyContent": "center",
"opacity": undefined,
"opacity": 0.5,
"paddingHorizontal": 24,
"paddingVertical": 5,
},
Expand All @@ -679,7 +682,7 @@ exports[`BackupPhrase renders correctly with backup not completed 1`] = `
maxFontSizeMultiplier={1}
style={
{
"color": "#666666",
"color": "#2E3338",
"fontFamily": "Inter-SemiBold",
"fontSize": 16,
"lineHeight": 24,
Expand Down
10 changes: 0 additions & 10 deletions src/components/Button.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,6 @@ const DEBOUNCE_OPTIONS = {
export enum BtnTypes {
PRIMARY = 'Primary',
SECONDARY = 'Secondary',
SECONDARY_WHITE_BG = 'SecondaryWhiteBg',
GRAY_WITH_BORDER = 'GrayWithBorder',
ONBOARDING_SECONDARY = 'OnboardingSecondary',
}

Expand Down Expand Up @@ -165,14 +163,6 @@ function getColors(type: BtnTypes, disabled: boolean | undefined) {
opacity = disabled ? 0.25 : 1.0
break
case BtnTypes.SECONDARY:
textColor = disabled ? colors.gray4 : colors.black
backgroundColor = colors.onboardingBackground
break
case BtnTypes.SECONDARY_WHITE_BG:
textColor = colors.gray3
backgroundColor = colors.white
break
case BtnTypes.GRAY_WITH_BORDER:
textColor = colors.black
backgroundColor = colors.gray1
borderColor = colors.gray2
Expand Down
7 changes: 5 additions & 2 deletions src/components/__snapshots__/Button.test.tsx.snap
Original file line number Diff line number Diff line change
Expand Up @@ -61,12 +61,15 @@ exports[`Button when type is SECONDARY renders 1`] = `
[
{
"alignItems": "center",
"backgroundColor": "#F9F6F0",
"backgroundColor": "#F8F9F9",
"borderColor": "#E6E6E6",
"borderRadius": 100,
"borderWidth": 1,
"flexDirection": "row",
"height": 48,
"justifyContent": "center",
"minWidth": 120,
"opacity": undefined,
"opacity": 1,
"paddingHorizontal": 24,
"paddingVertical": 5,
},
Expand Down
4 changes: 2 additions & 2 deletions src/earn/EarnActivePool.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ export default function EarnActivePool({ depositTokenId, poolTokenId, cta }: Pro
navigate(Screens.EarnCollectScreen, { depositTokenId, poolTokenId })
}}
text={t('earnFlow.activePools.exitPool')}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
size={BtnSizes.FULL}
style={styles.button}
/>
Expand Down Expand Up @@ -136,7 +136,7 @@ export default function EarnActivePool({ depositTokenId, poolTokenId, cta }: Pro
navigate(Screens.TabDiscover)
}}
text={t('earnFlow.activePools.viewPools')}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
size={BtnSizes.FULL}
style={styles.button}
/>
Expand Down
2 changes: 1 addition & 1 deletion src/earn/EarnDepositBottomSheet.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -173,7 +173,7 @@ export default function EarnDepositBottomSheet({
testID="EarnDeposit/SecondaryCta"
size={BtnSizes.FULL}
text={t('earnFlow.depositBottomSheet.secondaryCta')}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
style={styles.cta}
onPress={onPressCancel}
disabled={transactionSubmitted}
Expand Down
2 changes: 1 addition & 1 deletion src/earn/EarnEnterAmount.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -460,7 +460,7 @@ function InfoBottomSheet({
onPress={onPressDismiss}
text={t('earnFlow.enterAmount.infoBottomSheet.dismiss')}
size={BtnSizes.FULL}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
/>
</BottomSheet>
)
Expand Down
6 changes: 3 additions & 3 deletions src/keylessBackup/KeylessBackupProgress.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -206,7 +206,7 @@ function Restore() {
onPress={onPressCreateNewWallet}
text={t('keylessBackupStatus.restore.failed.createNewWallet')}
size={BtnSizes.FULL}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
style={styles.button}
touchableStyle={styles.buttonTouchable}
/>
Expand Down Expand Up @@ -238,7 +238,7 @@ function Restore() {
onPress={onPressCreateNewWallet}
text={t('keylessBackupStatus.restore.notFound.createNewWallet')}
size={BtnSizes.FULL}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
style={styles.button}
touchableStyle={styles.buttonTouchable}
/>
Expand Down Expand Up @@ -324,7 +324,7 @@ function Setup() {
onPress={onPressManual}
text={t('keylessBackupStatus.setup.failed.manual')}
size={BtnSizes.FULL}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
style={styles.button}
touchableStyle={styles.buttonTouchable}
/>
Expand Down
2 changes: 1 addition & 1 deletion src/keylessBackup/LinkPhoneNumber.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ export default function LinkPhoneNumber({ navigation }: Props) {
text={t('linkPhoneNumber.later')}
onPress={laterButtonOnPress}
style={styles.button}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
size={BtnSizes.FULL}
testID="LinkPhoneNumberLater"
/>
Expand Down
2 changes: 1 addition & 1 deletion src/onboarding/welcome/Welcome.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ export default function Welcome() {
onPress={onPressRestoreAccount}
text={t('welcome.hasWallet')}
size={BtnSizes.FULL}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
testID={'RestoreAccountButton'}
disabled={buttonsDisabled}
/>
Expand Down
4 changes: 2 additions & 2 deletions src/points/PointsHistoryBottomSheet.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,7 @@ function PointsHistoryBottomSheet({ forwardedRef }: Props) {
testID={'PointsHistoryBottomSheet/TryAgain'}
onPress={() => onPressTryAgain(false)}
text={t('points.history.error.tryAgain')}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
size={BtnSizes.FULL}
style={{ width: '100%' }}
/>
Expand All @@ -145,7 +145,7 @@ function PointsHistoryBottomSheet({ forwardedRef }: Props) {
testID={'PointsHistoryBottomSheet/GotIt'}
onPress={onPressLearnMore}
text={t('points.history.empty.gotIt')}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
size={BtnSizes.FULL}
style={{ width: '100%' }}
/>
Expand Down
4 changes: 2 additions & 2 deletions src/points/PointsHome.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -129,7 +129,7 @@ export default function PointsHome({ route, navigation }: Props) {
<Button
onPress={onRetryLoadConfig}
text={t('points.error.retryCta')}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
size={BtnSizes.FULL}
style={styles.loadingRetryButton}
/>
Expand All @@ -144,7 +144,7 @@ export default function PointsHome({ route, navigation }: Props) {
testID={'PointsActivityButton'}
onPress={onPressActivity}
text={t('points.activity')}
type={BtnTypes.GRAY_WITH_BORDER}
type={BtnTypes.SECONDARY}
size={BtnSizes.FULL}
touchableStyle={styles.buttonStyle}
/>
Expand Down

0 comments on commit cca5d3c

Please sign in to comment.