466a1be22f
* Retrofitting basic unit tests to Accounts Extraction of useAccounts and useBalance hooks * Retrofitting basic unit tests to Accounts Extraction of useAccounts and useBalance hooks * Fixing accounts unit tests - basic account balances * Cleaning up after PR remarks * Fixing arrangements of balances 1/3 Moving ArrangedAccount around * Add useStakingInfo hook * Adopt linter suggestions * Fixing arrangements of balances 2/3 Linking arranged balances values to mocked balances calls. * Fixing arrangements of balances 3/3 Formatting utils made consistent * Details row odd-even + (un)hide * Improving th/td/footer layout * Add tags to details row * Changing layout of account balance with details * Add total/details balances unit tests * Add tags unit tests * Clean up of TODOs, adding comments * Improve tags unit testing * Alternate account row details coloring unit test * Row details toggling unit tests * Row details toggling unit tests - bad commit fix * Style address balances (#5897) * Fix jumping column problem * Improve balances positioning * Format sidebar * Position header * Extract common formatting of balances in tests. Thx @vitaliyworks, great hint. * Revert Sidebar styling * Use rems * Lint * Use useToggle for expanding account row * Add tags header * Apply FormatBalance review comments * Display parent account info above account name (#5947) * Display parent address * Improve layout * Set keyring in tests * Remove redundant code from components * Use derivedAccount only in specific test * Apply lint fixes * Remove parent column from expanded row * Apply review suggestions * Improve styling in ParentAddress component * Improve layout of parent address and add short address * Apply review suggestions * Use map instead of for loops Co-authored-by: Marcin Wachulski <marcin@ethworks.io> Co-authored-by: Vitaliy Mysak <vitaliy@ethworks.io> Co-authored-by: MiZiet <55240109+MiZiet@users.noreply.github.com> Co-authored-by: MiZiet <michalzietalak@o2.pl> Co-authored-by: Ewa Kowalska <30404388+ekowalsk@users.noreply.github.com> Co-authored-by: Ewa Kowalska <ewcia.kowalska@gmail.com> |
||
|---|---|---|
| .. | ||
| src | ||
| .skip-build | ||
| .skip-npm | ||
| index.html | ||
| LICENSE | ||
| package.json | ||
| README.md | ||
@polkadot/react-query
WARNING: This is an internal package to polkadot-js/apps so is not inteded (yet) for broad use. Since these are generic components, they will move to the polkadot-js/ui repo once deemed stable and usable.
For the existing sharable components usable in external React-based projects, take a look at the polkadot-js/ui documentation
Overview
A collection of RxJS enabled React components that operate with the @polkadot/api-rx library. It automatically manages subscriptions on behalf of the developer, providing a number of unstyled components that can be used to construct UIs.
Usage
Basic usage entails creating a ContextProvider and just using the components. For instance, to display the current node time,
import React from 'react';
import ReactDOM from 'react-dom';
import { Api, NodeTime } from '@polkadot/react-query';
...
ReactDOM.render(
<Api>
<NodeTime />
</Api>,
document.querySelector('#container')
);
...
All components are provided unstyled making no assumptions on the actual use, however they all support (optionally) the label, className and style attributes, that can be used to style to component.
...
ReactDOM.render(
<Api>
<NodeTime className='rx-time' label='current node time:' />
</Api>,
document.querySelector('#container')
);
...