mirror of
https://github.com/pezkuwichain/pezkuwi-ui.git
synced 2026-04-28 16:47:59 +00:00
Some additional functional wrappers (#292)
This commit is contained in:
Jaco Greeff
+2
-2
@@ -30,8 +30,8 @@
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.8.7",
|
||||
"@babel/runtime": "^7.8.7",
|
||||
"@polkadot/dev": "^0.50.31",
|
||||
"@polkadot/ts": "^0.3.8",
|
||||
"@polkadot/dev": "^0.50.32",
|
||||
"@polkadot/ts": "^0.3.9",
|
||||
"babel-plugin-transform-vue-template": "^0.4.2",
|
||||
"empty": "^0.10.1",
|
||||
"react": "^16.13.0",
|
||||
|
||||
@@ -60,7 +60,7 @@ const Wrapper = styled.div`
|
||||
}
|
||||
`;
|
||||
|
||||
export default class IdentityIcon extends React.PureComponent<Props, State> {
|
||||
class BaseIcon extends React.PureComponent<Props, State> {
|
||||
public state: State = {
|
||||
address: '',
|
||||
publicKey: '0x'
|
||||
@@ -69,10 +69,10 @@ export default class IdentityIcon extends React.PureComponent<Props, State> {
|
||||
private static prefix?: Prefix = undefined;
|
||||
|
||||
public static setDefaultPrefix (prefix: Prefix): void {
|
||||
IdentityIcon.prefix = prefix;
|
||||
BaseIcon.prefix = prefix;
|
||||
}
|
||||
|
||||
public static getDerivedStateFromProps ({ prefix = IdentityIcon.prefix, value }: Props, prevState: State): State | null {
|
||||
public static getDerivedStateFromProps ({ prefix = BaseIcon.prefix, value }: Props, prevState: State): State | null {
|
||||
try {
|
||||
const address = isU8a(value) || isHex(value)
|
||||
? encodeAddress(value, prefix)
|
||||
@@ -140,3 +140,9 @@ export default class IdentityIcon extends React.PureComponent<Props, State> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function Identicon (props: Props): React.ReactElement<Props> {
|
||||
return <BaseIcon {...props} />;
|
||||
}
|
||||
|
||||
export default React.memo(Identicon);
|
||||
|
||||
@@ -4,8 +4,7 @@
|
||||
|
||||
import { BaseProps } from './types';
|
||||
|
||||
import React from 'react';
|
||||
import { xxhashAsHex } from '@polkadot/util-crypto';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
|
||||
import { createAddressPayload } from './util';
|
||||
import QrDisplay from './Display';
|
||||
@@ -15,44 +14,26 @@ interface Props extends BaseProps {
|
||||
genesisHash: string;
|
||||
}
|
||||
|
||||
interface State {
|
||||
data: Uint8Array | null;
|
||||
dataHash: string | null;
|
||||
}
|
||||
function DisplayExtrinsic ({ address, className, genesisHash, size, style }: Props): React.ReactElement<Props> | null {
|
||||
const [data, setData] = useState<Uint8Array | null>(null);
|
||||
|
||||
export default class DisplayExtrinsic extends React.PureComponent<Props, State> {
|
||||
public state: State = {
|
||||
data: null,
|
||||
dataHash: null
|
||||
};
|
||||
useEffect((): void => {
|
||||
setData(createAddressPayload(address, genesisHash));
|
||||
}, [address, genesisHash]);
|
||||
|
||||
public static getDerivedStateFromProps ({ address, genesisHash }: Props, prevState: State): State | null {
|
||||
const data = createAddressPayload(address, genesisHash);
|
||||
const dataHash = xxhashAsHex(data);
|
||||
|
||||
if (dataHash === prevState.dataHash) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return { data, dataHash };
|
||||
if (!data) {
|
||||
return null;
|
||||
}
|
||||
|
||||
public render (): React.ReactNode {
|
||||
const { className, size, style } = this.props;
|
||||
const { data } = this.state;
|
||||
|
||||
if (!data) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<QrDisplay
|
||||
className={className}
|
||||
skipEncoding={true}
|
||||
size={size}
|
||||
style={style}
|
||||
value={data}
|
||||
/>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<QrDisplay
|
||||
className={className}
|
||||
skipEncoding={true}
|
||||
size={size}
|
||||
style={style}
|
||||
value={data}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default React.memo(DisplayExtrinsic);
|
||||
|
||||
@@ -4,8 +4,7 @@
|
||||
|
||||
import { BaseProps } from './types';
|
||||
|
||||
import React from 'react';
|
||||
import { xxhashAsHex } from '@polkadot/util-crypto';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
|
||||
import { createSignPayload } from './util';
|
||||
import QrDisplay from './Display';
|
||||
@@ -16,43 +15,25 @@ interface Props extends BaseProps {
|
||||
payload: Uint8Array;
|
||||
}
|
||||
|
||||
interface State {
|
||||
data: Uint8Array | null;
|
||||
dataHash: string | null;
|
||||
}
|
||||
function DisplayPayload ({ address, className, cmd, payload, size, style }: Props): React.ReactElement<Props> | null {
|
||||
const [data, setData] = useState<Uint8Array | null>(null);
|
||||
|
||||
export default class DisplayPayload extends React.PureComponent<Props, State> {
|
||||
public state: State = {
|
||||
data: null,
|
||||
dataHash: null
|
||||
};
|
||||
useEffect((): void => {
|
||||
setData(createSignPayload(address, cmd, payload));
|
||||
}, [address, cmd, payload]);
|
||||
|
||||
public static getDerivedStateFromProps ({ address, cmd, payload }: Props, prevState: State): State | null {
|
||||
const data = createSignPayload(address, cmd, payload);
|
||||
const dataHash = xxhashAsHex(data);
|
||||
|
||||
if (dataHash === prevState.dataHash) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return { data, dataHash };
|
||||
if (!data) {
|
||||
return null;
|
||||
}
|
||||
|
||||
public render (): React.ReactNode {
|
||||
const { className, size, style } = this.props;
|
||||
const { data } = this.state;
|
||||
|
||||
if (!data) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<QrDisplay
|
||||
className={className}
|
||||
size={size}
|
||||
style={style}
|
||||
value={data}
|
||||
/>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<QrDisplay
|
||||
className={className}
|
||||
size={size}
|
||||
style={style}
|
||||
value={data}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default React.memo(DisplayPayload);
|
||||
|
||||
@@ -2862,9 +2862,9 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@polkadot/dev@npm:^0.50.31":
|
||||
version: 0.50.31
|
||||
resolution: "@polkadot/dev@npm:0.50.31"
|
||||
"@polkadot/dev@npm:^0.50.32":
|
||||
version: 0.50.32
|
||||
resolution: "@polkadot/dev@npm:0.50.32"
|
||||
dependencies:
|
||||
"@babel/cli": ^7.8.4
|
||||
"@babel/core": ^7.8.7
|
||||
@@ -2946,7 +2946,7 @@ __metadata:
|
||||
polkadot-exec-typedoc: scripts/polkadot-exec-typedoc.js
|
||||
polkadot-exec-vuepress: scripts/polkadot-exec-vuepress.js
|
||||
polkadot-exec-webpack: scripts/polkadot-exec-webpack.js
|
||||
checksum: 2/33b76f85de371410f6e44b5281ba4bfcf8d738cda393097cb1b0de213e0a819fa48c7efc177365f02371c079f72fd0b56146c31426d91d1de74e633be333b864
|
||||
checksum: 2/3db2d2d29ff45c9104e5e477f6f8423a61efef57cb87a12ae7354728b3ed825f1b08a4739a803744b205836811b550b6afe5c06393282e21b63076f492a9308e
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
@@ -2996,8 +2996,8 @@ __metadata:
|
||||
dependencies:
|
||||
"@babel/runtime": ^7.8.7
|
||||
"@polkadot/keyring": ^2.6.2
|
||||
"@polkadot/ui-settings": 0.52.0-beta.7
|
||||
"@polkadot/ui-shared": 0.52.0-beta.7
|
||||
"@polkadot/ui-settings": 0.52.0-beta.8
|
||||
"@polkadot/ui-shared": 0.52.0-beta.8
|
||||
"@polkadot/util": ^2.6.2
|
||||
"@polkadot/util-crypto": ^2.6.2
|
||||
"@types/react-copy-to-clipboard": ^4.3.0
|
||||
@@ -3033,12 +3033,12 @@ __metadata:
|
||||
languageName: unknown
|
||||
linkType: soft
|
||||
|
||||
"@polkadot/reactnative-identicon@0.52.0-beta.7, @polkadot/reactnative-identicon@workspace:packages/reactnative-identicon":
|
||||
"@polkadot/reactnative-identicon@0.52.0-beta.8, @polkadot/reactnative-identicon@workspace:packages/reactnative-identicon":
|
||||
version: 0.0.0-use.local
|
||||
resolution: "@polkadot/reactnative-identicon@workspace:packages/reactnative-identicon"
|
||||
dependencies:
|
||||
"@babel/runtime": ^7.8.7
|
||||
"@polkadot/ui-shared": 0.52.0-beta.7
|
||||
"@polkadot/ui-shared": 0.52.0-beta.8
|
||||
"@polkadot/util-crypto": ^2.6.2
|
||||
"@types/react-native": ^0.61.22
|
||||
react-native-svg: ^12.0.3
|
||||
@@ -3049,12 +3049,12 @@ __metadata:
|
||||
languageName: unknown
|
||||
linkType: soft
|
||||
|
||||
"@polkadot/ts@npm:^0.3.8":
|
||||
version: 0.3.8
|
||||
resolution: "@polkadot/ts@npm:0.3.8"
|
||||
"@polkadot/ts@npm:^0.3.9":
|
||||
version: 0.3.9
|
||||
resolution: "@polkadot/ts@npm:0.3.9"
|
||||
dependencies:
|
||||
"@types/chrome": ^0.0.100
|
||||
checksum: 2/252e254c4f2fef159623c98dc4e1fe7f4f47ebff9ca6ae0b6682b944fdb1221e3d0cd2dd735b44b5ea65b8d1d7ec6a28ad01edad471d8fe5bb80928b01496024
|
||||
checksum: 2/d5c2b8ed941e08e10beca5ca117da60ad2aef68e469160eff7e669134050c906b0cab7d72371910b39a4013ea916fc99308f8bf3865c11cdea53ab7dcf0c58dd
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
@@ -3082,7 +3082,7 @@ __metadata:
|
||||
languageName: unknown
|
||||
linkType: soft
|
||||
|
||||
"@polkadot/ui-keyring@0.52.0-beta.7, @polkadot/ui-keyring@workspace:packages/ui-keyring":
|
||||
"@polkadot/ui-keyring@0.52.0-beta.8, @polkadot/ui-keyring@workspace:packages/ui-keyring":
|
||||
version: 0.0.0-use.local
|
||||
resolution: "@polkadot/ui-keyring@workspace:packages/ui-keyring"
|
||||
dependencies:
|
||||
@@ -3109,7 +3109,7 @@ __metadata:
|
||||
languageName: unknown
|
||||
linkType: soft
|
||||
|
||||
"@polkadot/ui-settings@0.52.0-beta.7, @polkadot/ui-settings@workspace:packages/ui-settings":
|
||||
"@polkadot/ui-settings@0.52.0-beta.8, @polkadot/ui-settings@workspace:packages/ui-settings":
|
||||
version: 0.0.0-use.local
|
||||
resolution: "@polkadot/ui-settings@workspace:packages/ui-settings"
|
||||
dependencies:
|
||||
@@ -3122,7 +3122,7 @@ __metadata:
|
||||
languageName: unknown
|
||||
linkType: soft
|
||||
|
||||
"@polkadot/ui-shared@0.52.0-beta.7, @polkadot/ui-shared@workspace:packages/ui-shared":
|
||||
"@polkadot/ui-shared@0.52.0-beta.8, @polkadot/ui-shared@workspace:packages/ui-shared":
|
||||
version: 0.0.0-use.local
|
||||
resolution: "@polkadot/ui-shared@workspace:packages/ui-shared"
|
||||
dependencies:
|
||||
@@ -3175,7 +3175,7 @@ __metadata:
|
||||
resolution: "@polkadot/vue-identicon@workspace:packages/vue-identicon"
|
||||
dependencies:
|
||||
"@babel/runtime": ^7.8.7
|
||||
"@polkadot/ui-shared": 0.52.0-beta.7
|
||||
"@polkadot/ui-shared": 0.52.0-beta.8
|
||||
"@polkadot/util-crypto": ^2.6.2
|
||||
jdenticon: 2.2.0
|
||||
vue: ^2.6.11
|
||||
@@ -8814,9 +8814,9 @@ __metadata:
|
||||
"@babel/core": ^7.8.7
|
||||
"@babel/runtime": ^7.8.7
|
||||
"@polkadot/keyring": ^2.6.2
|
||||
"@polkadot/reactnative-identicon": 0.52.0-beta.7
|
||||
"@polkadot/ui-keyring": 0.52.0-beta.7
|
||||
"@polkadot/ui-settings": 0.52.0-beta.7
|
||||
"@polkadot/reactnative-identicon": 0.52.0-beta.8
|
||||
"@polkadot/ui-keyring": 0.52.0-beta.8
|
||||
"@polkadot/ui-settings": 0.52.0-beta.8
|
||||
"@polkadot/util": ^2.6.2
|
||||
"@polkadot/util-crypto": ^2.6.2
|
||||
"@react-native-community/async-storage": ^1.8.1
|
||||
@@ -17663,8 +17663,8 @@ __metadata:
|
||||
dependencies:
|
||||
"@babel/core": ^7.8.7
|
||||
"@babel/runtime": ^7.8.7
|
||||
"@polkadot/dev": ^0.50.31
|
||||
"@polkadot/ts": ^0.3.8
|
||||
"@polkadot/dev": ^0.50.32
|
||||
"@polkadot/ts": ^0.3.9
|
||||
babel-plugin-transform-vue-template: ^0.4.2
|
||||
empty: ^0.10.1
|
||||
react: ^16.13.0
|
||||
|
||||
Reference in New Issue
Block a user