[🔨] NT-1121 Stored cards redesign #822
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- `FreezeLinearLayoutManager` is no longer needed to stop the list of cards from scrolling when one is selected - `RewardLoadingCardViewHolder` and its layout `item_reward_loading_card.xml` is no longer needed because the progress state while a pledge is being created/updated is moving to the footer pledge button - `item_reward_pledge_card_disabled.xml` is no longer needed because the pledge button lives in the footer - `item_reward_credit_card.xml` is now `item_reward_unselected_card.xml` - `item_reward_pledge_card.xml` is now `item_reward_selected_card.xml` - `item_reward_add_card.xml` is now `item_add_card.xml` - `RewardCardViewHolder` is now `RewardCardUnselectedViewHolder` - `RewardCardViewHolderViewModel` is now `RewardCardUnselectedViewHolderViewModel` - `RewardPledgeCardViewHolder` is now `RewardCardSelectedViewHolder` - `RewardPledgeCardViewHolderViewModel` is now `RewardCardSelectedViewHolderViewModel` ## Style updates and additions - `stored_card_radius` is now `grid_1` - Added `unselected_card_stroke_width` with value `2dp` - Added `circle_accent` to highlight which card is selected - Added `circle_grey_500_stroke` to highlight which card is unselected - `SelectButton` style is no longer used so it's been deleted - `PledgeStoredCard` - no longer uses `cardUseCompatPadding` since the cards have no elevation - `RewardCardDecoration` only sets `bottom` margin, the parent sets `start` and `end` margin ## Stored cards - The stored cards got a makeover! - `CardState` - There are now only 2 card states `SELECTED` AND `UNSELECTED` - `RewardCardSelectedViewHolder` - Removed delegate since there are no actions you can take on this view - `RewardCardUnselectedViewHolderViewModel` - Added outputs `isClickable`, `issuerImageAlpha`, `lastFourTextColor`, and `selectImageIsVisible` - Added tests for new outputs - `PledgeFragmentViewModel` - Renamed `showPledgeCard` to `showSelectedCard`
jgsamudio
reviewed
Apr 6, 2020
app/src/main/java/com/kickstarter/viewmodels/RewardCardUnselectedViewHolderViewModel.kt
Show resolved
Hide resolved
jgsamudio
approved these changes
Apr 6, 2020
eoji
added a commit
that referenced
this pull request
Apr 8, 2020
- The new footer pledge button `pledge_footer_pledge_button` now accepts clicks (meaning you can actually pledge and update your payment method with it) - (The `Update Pledge` button will be removed in another PR to keep this one small) ## RewardCardUnselectedViewHolder - Renamed `Delegate.selectCardButtonClicked` to `cardSelected` that takes in the `StoredCard` along with its `position` - Added output `notifyDelegateCardSelected` that emits a `<Pair<StoredCard, Int>>` of the selected card and its position ## `PledgeFragmentViewModel` - Input `pledgeButtonClicked` no longer takes in the card ID `String` - When it emits a backing is created/updated - Input `selectCardButtonClicked` is now `cardSelected` that takes in a `StoredCard` and its position - Added helper `initialCardSelection` method to figure out what the initial selected card should be - The Tests™ - These small changes broke almost 20 tests 😢 - Added tests for asserting the correct card was selected - Created `TestData` data class to help set up situations like updating a pledge with or without shipping - Added helper methods `setUpBackedShippableRewardTestData` and `setUpBackedNoRewardTestData` and used them to clean up a few tests ## Deletions ## `BaseRewardCardViewHolderViewModel` - Removed `id` output since it's no longer used - `RewardLoadingCardViewHolderViewModel` - This ViewModel and its tests stopped being used in #822
eoji
added a commit
that referenced
this pull request
Apr 20, 2020
* [🦶🏾] NT-1104 Add Pledge screen footer (#817) * [⬇] NT-1120 Vertical payment methods in Pledge screen (#821) * [🔨] NT-1121 Stored cards redesign (#822) * [🛒] NT-1105 Kickstarter is not a store redesign (#823) * [💳] NT-1122 Initial card selection (#824) * [⏳] NT-1124 Loading state for payment methods (#825) * [➕] NT-1125 New card CTA (#828) * [💳] NT-1123 Last four digits copy (#826) * [💳] NT-1123 Card not allowed copy (#827) * [🎨] NT-1111 Adding 2 buttons in the new pledge footer (#830) * [🔌] NT-1129 Adding progress state for pledging (#831) * [🗣] NT-1126 Payment methods a11y (#829) * [👷🏾♀️] NT-1128 Moved continue button in Pledge screen to footer (#833) * [⚠️ ] NT-1131 Pledge error Toasts (#832) * [␡] NT-1127 Removing Update pledge button (#834) * [📝] NT-1130 Pledge button CTA (#835) * [✅] NT-1133 Enabling pledge button only when all fields are valid (#836)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Note: This is an unfortunately big PR but there were previously 4 states for stored cards and now there are 2, so hopefully it's for the best!
📲 What
Stored cards redesign.
🤔 Why
@colleenmacd flexin
🛠 How
Deletions and renames
FreezeLinearLayoutManageris no longer needed to stop the list of cards from scrolling when one is selectedRewardLoadingCardViewHolderand its layoutitem_reward_loading_card.xmlis no longer needed because the progress state while a pledge is being created/updated is moving to the footer pledge buttonitem_reward_pledge_card_disabled.xmlis no longer needed because the pledge button lives in the footeritem_reward_credit_card.xmlis nowitem_reward_unselected_card.xmlitem_reward_pledge_card.xmlis nowitem_reward_selected_card.xmlitem_reward_add_card.xmlis nowitem_add_card.xmlRewardCardViewHolderis nowRewardCardUnselectedViewHolderRewardCardViewHolderViewModelis nowRewardCardUnselectedViewHolderViewModelRewardPledgeCardViewHolderis nowRewardCardSelectedViewHolderRewardPledgeCardViewHolderViewModelis nowRewardCardSelectedViewHolderViewModelStyle updates and additions
stored_card_radiusis nowgrid_1unselected_card_stroke_widthwith value2dpcircle_accentto highlight which card is selectedcircle_grey_500_stroketo highlight which card is unselectedSelectButtonstyle is no longer used so it's been deletedPledgeStoredCardcardUseCompatPaddingsince the cards have no elevationRewardCardDecorationonly setsbottommargin, the parent setsstartandendmarginStored cards
CardStateSELECTEDANDUNSELECTEDRewardCardSelectedViewHolderRewardCardUnselectedViewHolderViewModelisClickable,issuerImageAlpha,lastFourTextColor, andselectImageIsVisiblePledgeFragmentViewModelshowPledgeCardtoshowSelectedCard👀 See
📋 QA
Please note, for the sake of keeping this PR smaller:
Story 📖
NT-1121