pezkuwichain/pezkuwi-ui
1
0
Fork 0
mirror of https://github.com/pezkuwichain/pezkuwi-ui.git synced 2026-06-11 16:11:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use publicKey for icons (#118)

Browse Source 
* Use publicKey for icons

* Hex value for jdenticon
This commit is contained in:
Jaco Greeff
2019-04-29 15:34:02 +02:00
committed by GitHub
parent 19e652c8ce
commit 700d495fa8
15 changed files with 746 additions and 503 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.travis.yml
+9 -1
View File
@@ -2,16 +2,24 @@ language: node_js
node_js:
- "10"
env:
- GH_PAGES_SRC="build-docs"
global:
- CC_TEST_REPORTER_ID=2e7a4e12a9039fd1b3721e79e2efa92e1d4925af092679f3d106428e01373436
- GH_PAGES_SRC="build-docs"
cache:
yarn: true
directories:
- node_modules
before_install:
- curl -o- -L https://yarnpkg.com/install.sh | bash
- curl -L https://codeclimate.com/downloads/test-reporter/test-reporter-latest-linux-amd64 > ./cc-test-reporter
- chmod +x ./cc-test-reporter
- export PATH=$HOME/.yarn/bin:$PATH
before_script:
- ./cc-test-reporter before-build
script:
- yarn polkadot-dev-travis-build
after_script:
- ./cc-test-reporter after-build --exit-code $TRAVIS_TEST_RESULT
deploy:
skip_cleanup: true
provider: script
CHANGELOG.md
+6
View File
@@ -1,3 +1,9 @@
# 0.38.1
- Sorting of keyring addresses
- Fix JSON import defaults
- Display icons using publicKey (not the encoded address)
# 0.37.1
- Add Emberic Elm (Dried Danta discontinued)
README.md
+2 -2
View File
@@ -3,8 +3,8 @@
[![style](https://img.shields.io/badge/code%20style-semistandard-lightgrey.svg?style=flat-square)](https://github.com/Flet/semistandard)
[![npm](https://img.shields.io/npm/v/@polkadot/ui-identicon.svg?style=flat-square)](https://www.npmjs.com/package/@polkadot/ui-identicon)
[![travis](https://img.shields.io/travis/polkadot-js/ui.svg?style=flat-square)](https://travis-ci.com/polkadot-js/ui)
[![maintainability](https://img.shields.io/codeclimate/maintainability/polkadot-js/ui.svg?style=flat-square)](https://codeclimate.com/github/polkadot-js/ui/maintainability)
[![coverage](https://img.shields.io/coveralls/polkadot-js/ui.svg?style=flat-square)](https://coveralls.io/github/polkadot-js/ui?branch=master)
[![maintainability](https://img.shields.io/codeclimate/maintainability/polkadot-js/ui.svg?style=flat-square)](https://codeclimate.com/github/polkadot-js/ui)
[![coverage](https://img.shields.io/codeclimate/coverage/polkadot-js/ui.svg?style=flat-square)](https://codeclimate.com/github/polkadot-js/ui)
[![greenkeeper](https://img.shields.io/badge/greenkeeper-enabled-brightgreen.svg?style=flat-square)](https://greenkeeper.io/)
# @polkadot/ui
package.json
+4 -5
View File
@@ -11,8 +11,7 @@
],
"resolutions": {
"babel-core": "^7.0.0-bridge.0",
"rxjs": "^6.4.0",
"typescript": "^3.4.3"
"typescript": "^3.4.5"
},
"scripts": {
"build": "polkadot-dev-build-ts && polkadot-dev-build-docs",
@@ -24,9 +23,9 @@
"test": "jest --coverage"
},
"devDependencies": {
"@babel/core": "^7.4.3",
"@babel/runtime": "^7.4.3",
"@polkadot/dev-react": "^0.30.0-beta.1",
"@babel/core": "^7.4.4",
"@babel/runtime": "^7.4.4",
"@polkadot/dev-react": "^0.30.0-beta.3",
"@polkadot/ts": "^0.1.56",
"empty": "^0.10.1",
"gh-pages": "^2.0.1"
packages/ui-assets/package.json
+1 -1
View File
@@ -9,6 +9,6 @@
],
"license": "Apache-2.0",
"dependencies": {
"@babel/runtime": "^7.4.3"
"@babel/runtime": "^7.4.4"
}
}
packages/ui-identicon/package.json
+3 -3
View File
@@ -9,7 +9,7 @@
],
"license": "Apache-2.0",
"dependencies": {
"@babel/runtime": "^7.4.3",
"@babel/runtime": "^7.4.4",
"@polkadot/ui-settings": "^0.38.0-beta.3",
"@types/color": "^3.0.0",
"@types/react-copy-to-clipboard": "^4.2.6",
@@ -24,8 +24,8 @@
"react": "*"
},
"devDependencies": {
"@polkadot/keyring": "^0.76.1",
"@polkadot/util-crypto": "^0.76.1",
"@polkadot/keyring": "^0.90.0-beta.1",
"@polkadot/util-crypto": "^0.90.0-beta.1",
"xmlserializer": "^0.6.1"
}
}
packages/ui-identicon/src/Identicon.tsx
+20 -16
View File
@@ -10,14 +10,15 @@ import CopyToClipboard from 'react-copy-to-clipboard';
import styled from 'styled-components';
import { decodeAddress, encodeAddress } from '@polkadot/keyring';
import settings from '@polkadot/ui-settings';
import { isHex, isU8a } from '@polkadot/util';
import { isHex, isU8a, u8aToHex } from '@polkadot/util';
import { Beachball, Empty, Jdenticon, Polkadot } from './icons';
const Fallback = Beachball;
type State = {
address?: string | null
address: string,
publicKey: string
};
const DEFAULT_SIZE = 64;
@@ -59,7 +60,8 @@ const Wrapper = styled.div`
export default class IdentityIcon extends React.PureComponent<Props, State> {
state: State = {
address: null
address: '',
publicKey: '0x'
};
private static prefix?: Prefix = undefined;
@@ -72,25 +74,26 @@ export default class IdentityIcon extends React.PureComponent<Props, State> {
try {
const address = isU8a(value) || isHex(value)
? encodeAddress(value, prefix)
: value;
decodeAddress(address as string, false, prefix);
: (value || '');
const publicKey = u8aToHex(decodeAddress(address, false, prefix));
return address === prevState.address
? null
: { address };
: {
address,
publicKey
};
} catch (error) {
// swallow,invalid address or input
return {
address: '',
publicKey: '0x'
};
}
return {
address: null
};
}
render () {
const { address } = this.state;
const wrapped = this.getWrapped(address);
const wrapped = this.getWrapped(this.state);
return !address
? wrapped
@@ -104,7 +107,7 @@ export default class IdentityIcon extends React.PureComponent<Props, State> {
);
}
private getWrapped (address?: string | null) {
private getWrapped ({ address, publicKey }: State) {
const { className, isHighlight = false, size = DEFAULT_SIZE, style, theme = settings.uiTheme } = this.props;
const Component = !address
? Empty
@@ -113,13 +116,14 @@ export default class IdentityIcon extends React.PureComponent<Props, State> {
return (
<Wrapper
className={`ui--IdentityIcon ${className}`}
key={address || ''}
key={address}
style={style}
>
<Component
address={address}
className={isHighlight ? 'highlight' : ''}
publicKey={publicKey}
size={size}
value={address || ''}
/>
</Wrapper>
);
packages/ui-identicon/src/icons/Beachball.tsx
+2 -2
View File
@@ -22,11 +22,11 @@ export default class Beachball extends React.PureComponent<Props> {
}
private appendIcon = (node: Element | null): void => {
const { size, value } = this.props;
const { address, size } = this.props;
if (node) {
node.appendChild(
identicon(value, size)
identicon(address, size)
);
}
}
packages/ui-identicon/src/icons/Jdenticon.tsx
+2 -2
View File
@@ -9,14 +9,14 @@ import jdenticon from 'jdenticon';
export default class Jdenticon extends React.PureComponent<Props> {
render () {
const { className, size, style, value } = this.props;
const { className, publicKey, size, style } = this.props;
return (
<div
className={`container ${className}`}
style={style}
dangerouslySetInnerHTML={ {
__html: jdenticon.toSvg(value, size)
__html: jdenticon.toSvg(publicKey.substr(2), size)
} }
/>
);
packages/ui-identicon/src/icons/Polkadot.tsx
+5 -5
View File
@@ -51,7 +51,7 @@ const schema: { [index: string]: Scheme } = {
export default class Identicon extends React.PureComponent<Props> {
render () {
const { className, size, style, value } = this.props;
const { address, className, size, style } = this.props;
const xy = this.getCircleXY();
const colors = this.getColors();
@@ -61,8 +61,8 @@ export default class Identicon extends React.PureComponent<Props> {
style={style}
>
<svg
id={value}
name={value}
id={address}
name={address}
width={size}
height={size}
viewBox='0 0 64 64'
@@ -131,9 +131,9 @@ export default class Identicon extends React.PureComponent<Props> {
}
private getColors () {
const { value } = this.props;
const { address } = this.props;
const total = Object.keys(schema).map(k => schema[k].freq).reduce((a, b) => a + b);
const id = Array.from(blake2(decodeAddress(value))).map((x, i) => (x + 256 - zero[i]) % 256);
const id = Array.from(blake2(decodeAddress(address))).map((x, i) => (x + 256 - zero[i]) % 256);
const d = Math.floor((id[30] + id[31] * 256) % total);
const rot = (id[28] % 6) * 3;
const sat = (Math.floor(id[29] * 70 / 256 + 26) % 80) + 30;
packages/ui-identicon/src/types.ts
+3 -2
View File
@@ -12,8 +12,9 @@ export type BaseProps = {
};
export type Props = BaseProps & {
size: number,
value: string
address: string,
publicKey: string,
size: number
};
export type IdentityProps = BaseProps & {
packages/ui-keyring/package.json
+4 -5
View File
@@ -10,16 +10,15 @@
"contributors": [],
"license": "Apache-2.0",
"dependencies": {
"@babel/runtime": "^7.4.3",
"@babel/runtime": "^7.4.4",
"@types/store": "^2.0.1",
"rxjs": "^6.4.0",
"store": "^2.0.12",
"styled-components": "^4.2.0"
},
"devDependencies": {
"@polkadot/keyring": "^0.76.1",
"@polkadot/types": "^0.77.0-beta.3",
"@polkadot/util": "^0.76.1"
"@polkadot/keyring": "^0.90.0-beta.1",
"@polkadot/types": "^0.78.0-beta.1",
"@polkadot/util": "^0.90.0-beta.1"
},
"peerDependencies": {
"@polkadot/keyring": "*",
packages/ui-settings/package.json
+2 -2
View File
@@ -9,8 +9,8 @@
],
"license": "Apache-2.0",
"dependencies": {
"@babel/runtime": "^7.4.3",
"@polkadot/util": "^0.76.1",
"@babel/runtime": "^7.4.4",
"@polkadot/util": "^0.90.0-beta.1",
"@types/store": "^2.0.1",
"store": "^2.0.12"
}
packages/ui-util/package.json
+2 -2
View File
@@ -9,10 +9,10 @@
],
"license": "Apache-2.0",
"dependencies": {
"@babel/runtime": "^7.4.3"
"@babel/runtime": "^7.4.4"
},
"devDependencies": {
"@polkadot/types": "^0.77.0-beta.3"
"@polkadot/types": "^0.78.0-beta.1"
},
"peerDependencies": {
"@polkadot/types": "*"
yarn.lock
+681 -455
View File
File diff suppressed because it is too large Load Diff