Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[UI - Wallet Stability] Create generic/reusable assets listview component #14716

Closed
Tracked by #14711
noeliaSD opened this issue May 10, 2024 · 2 comments · Fixed by #15157
Closed
Tracked by #14711

[UI - Wallet Stability] Create generic/reusable assets listview component #14716

noeliaSD opened this issue May 10, 2024 · 2 comments · Fixed by #15157
Assignees
Labels
E:D Wallet SendModal Stabilize, improve and sync with expected design and functionality feature
Milestone

Comments

@noeliaSD
Copy link
Contributor

noeliaSD commented May 10, 2024

Create a new generic and reusable listview component and delegates used for assets (to replace TokenListView):

  • Called “list” but it’s not a list but a composition of some components + 2 different lists. It could be decomposed into lists itself and another top level component composing lists together using tabs
  • In related storybook page there are done a lot of data transformations, some dependency of TransactionStore / WalletAssetsStore only to transform assets model data. This should be transparent for the storybook page itself. The storybook page for given component shouldn’t bother about earlier transformation we do in the app. It’s sufficient to provide just what’s expected by the component, in a form as easy as ListModel with static ListElement items. Then in storybook we clearly see what the structure of the model expected by the component. Having it done this way, we don’t need to copy logic from real store to stub store. Stub stores should be just empty QtObjects.
  • TransactionStore / WalletAssetsStore contains a lot of UI-side logic related to data transformation. It should be excluded from stores and kept in a separate components (Adaptors - responsible for that data transformation). Stores should be only a thin layer exposing backend’s models/properties/methods.
  • The component takes function for formatting balances, (formatCurrentCurrencyAmount, formatCurrencyAmountFromBigInt). In storybook page it could be very simplified implementation, like e.g. Math.round(balance) + " USD. No need to involve stores. Ideally, models taken by the component should contain ready-to-display data, with no need to use external methods for formatting
  • Instead of taking formatting info from CurrenciesStore via a method, we could have this info exposed as a model. Then on UI side left join may be performed to combine assets and corresponding formatting info. Other solution (probably more efficient) is to expose formatting details directly via assets model.
  • TokenListView exposes assetSearchString , the assumption is that model’s data are filtered externally according to that string. It makes that component not fully self-contained. When instantiated in storybook search doesn’t work. This type of search could be implementation detail of that component - encapsulated and hidden.
  • TokenListView takes networks model in order to do left joins internally for submodel of assets and collectibles. Currently, with the SubmodelProxyModel it’s no longer needed. That join may be done externally on submodels. It’s no longer needed to have network model as a dependency.
  • All model transformations, like adding role "isCommunityAsset" should be done externally. UI component should just depend on a model with such role.
@noeliaSD noeliaSD changed the title TokensListView component improvements [EPIC][UI - Wallet Stability] TokensListView component improvements May 10, 2024
@noeliaSD noeliaSD changed the title [EPIC][UI - Wallet Stability] TokensListView component improvements [UI - Wallet Stability] TokensListView component improvements May 10, 2024
@noeliaSD noeliaSD added this to the 2.30.0 Beta milestone May 14, 2024
@caybro
Copy link
Member

caybro commented May 14, 2024

@micieslak this is being used in the Swap designs so I guess a high(er) priority to finish this asap? (Figma: https://www.figma.com/design/TS0eQX9dAZXqZtELiwKIoK/Swap---Milestone-1?node-id=3406-234619&t=0m4QLdvh0QcUA2SP-0)

@noeliaSD
Copy link
Contributor Author

noeliaSD commented May 15, 2024

@micieslak as discussed offline, you will create subtasks and convert that to an epic!

@noeliaSD noeliaSD assigned micieslak and unassigned Seitseman May 16, 2024
@caybro caybro assigned caybro and unassigned micieslak Jun 10, 2024
@caybro caybro changed the title [UI - Wallet Stability] TokensListView component improvements [UI - Wallet Stability] Create generic/reusable assets listview component Jun 10, 2024
@noeliaSD noeliaSD added E:D Wallet SendModal Stabilize, improve and sync with expected design and functionality and removed E:D:Wallet Stabilisation E:Desktop Wallet UI Stability labels Jun 10, 2024
caybro added a commit that referenced this issue Jun 12, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 12, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 12, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 12, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 12, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 12, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 13, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 13, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 13, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 13, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 13, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 14, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 14, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 14, 2024
…omponent

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
(to be finished) and corresponding SB page
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 14, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 17, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 17, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 17, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 18, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 18, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 18, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 18, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 18, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
caybro added a commit that referenced this issue Jun 18, 2024
…omponent

TLDR: later this should form a basic building block for a new
TokenSelector picker component, potentially replacing the current
HoldingSelector* and TokenListView components (support for collectibles
TBD as part of #15121)

- create reusable `TokenSelectorAssetDelegate` and `TokenSelectorView`
- add corresponding SB page, showcasing the flow/integration and the
separation of concerns between the view, adaptor and delegate layers
- add QML testcase for TokenSelectorView
- don't display crypto symbol for token balances per chain tags
- update the stores and SB pages
- add some missing formatter functions to LocaleUtils and CurrenciesStore

Fixes #14716
@caybro caybro closed this as completed in a12a6a4 Jun 18, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
E:D Wallet SendModal Stabilize, improve and sync with expected design and functionality feature
Projects
Archived in project
4 participants