7c9f388698
* added overview page * sanitized task * added workplan table * staged missing files * updated filters * fixed some types * updated mask graph * copyright * linting * install * added relay overview * linting * refactoring hooks * translations * updated coretime deps * updated tsconfig * fixed build * root tsconfig * fix tsconfig * app-coretime and app-broker * filter bug fix * prettied mask bar * updated deps * updated deps broker * removed TS filter and added graph * linting * fixed headers * fixed filter * updated coretime summary * updated relay tables * fixed bulk price display * updated regions * styling * fixed pallet version mismaatch info * fixed expand button * fixed alignment issues * yarn install * integrated some suggestions * linting * updated version * Fix Header on table * Small nit around naming * Usage bar console err fix: NaN * rearranged the layout for page broker on Coretime chain, changed UsageBar element to be more generic * filtering parachains by id * moved a type to a seprate type file * skip build and npm * generated locales * added default ui colours to test chains and kusama * abstracted logic from the rendering * default ui highlight fallback * table responsive - hiding timeslice info from the rows on mobile * version updates for react-components and react-query * exporting defaultHighlight * responsive summary * small fix for workplan filtering * separated coretime chain page * removed unused references * added useBrokerReservations call and marked reserved chains * useBrokerLease, added Legacy Lease type * showing last block for legacy leases * added processing at data retrieval * fix: missing icon * linting * organized files, minor refactor * moved filters out of the Overview componennt * minor refactor * version update * regenerated yarn lock * renamed column * linter :) * ts fixes :) --------- Co-authored-by: bee344 <alberto.penayo@parity.io> Co-authored-by: Alberto Nicolas Penayo <74352651+bee344@users.noreply.github.com> Co-authored-by: tarikgul <tariksnow37@gmail.com> |
||
|---|---|---|
| .. | ||
| src | ||
| .skip-build | ||
| .skip-npm | ||
| index.html | ||
| package.json | ||
| README.md | ||
| tsconfig.build.json | ||
@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')
);
...