From 93cbf3c872f014a2944628b4a38c85870f0462e8 Mon Sep 17 00:00:00 2001 From: Jaco Greeff Date: Thu, 21 Feb 2019 12:56:50 +0100 Subject: [PATCH] Add jdenticon as Substrate default (#83) --- CHANGELOG.md | 4 +++ lerna.json | 2 +- package.json | 2 +- packages/ui-assets/package.json | 2 +- packages/ui-identicon/package.json | 5 ++-- packages/ui-identicon/src/Demo.tsx | 13 +++++++-- .../{Substrate.tsx => icons/Beachball.tsx} | 6 ++-- .../ui-identicon/src/{ => icons}/Empty.tsx | 2 +- packages/ui-identicon/src/icons/Jdenticon.tsx | 24 ++++++++++++++++ .../ui-identicon/src/{ => icons}/Polkadot.tsx | 2 +- packages/ui-identicon/src/icons/index.ts | 8 ++++++ packages/ui-identicon/src/index.tsx | 14 ++++++---- packages/ui-identicon/src/types.ts | 2 +- packages/ui-identicon/webpack.config.js | 7 ++++- packages/ui-keyring/package.json | 4 +-- packages/ui-settings/package.json | 2 +- packages/ui-util/package.json | 4 +-- yarn.lock | 28 +++++++++++++------ 18 files changed, 98 insertions(+), 33 deletions(-) rename packages/ui-identicon/src/{Substrate.tsx => icons/Beachball.tsx} (81%) rename packages/ui-identicon/src/{ => icons}/Empty.tsx (94%) create mode 100644 packages/ui-identicon/src/icons/Jdenticon.tsx rename packages/ui-identicon/src/{ => icons}/Polkadot.tsx (99%) create mode 100644 packages/ui-identicon/src/icons/index.ts diff --git a/CHANGELOG.md b/CHANGELOG.md index 4df13e06..88c7699c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +# 0.28.1 + +Default Substrate icon is Jdenticon + # 0.27.1 Replace Charred Cherry with Dried Danta, remove old decimals and token name configs diff --git a/lerna.json b/lerna.json index e1e92e31..c42425c2 100644 --- a/lerna.json +++ b/lerna.json @@ -10,5 +10,5 @@ "packages": [ "packages/*" ], - "version": "0.27.1" + "version": "0.28.0" } diff --git a/package.json b/package.json index 5e098112..0c4c6054 100644 --- a/package.json +++ b/package.json @@ -25,7 +25,7 @@ "devDependencies": { "@babel/core": "^7.2.2", "@polkadot/dev-react": "^0.24.2", - "@polkadot/ts": "^0.1.52", + "@polkadot/ts": "^0.1.53", "empty": "^0.10.1" } } diff --git a/packages/ui-assets/package.json b/packages/ui-assets/package.json index 7d010992..3d0fc7d5 100644 --- a/packages/ui-assets/package.json +++ b/packages/ui-assets/package.json @@ -1,6 +1,6 @@ { "name": "@polkadot/ui-assets", - "version": "0.27.1", + "version": "0.28.0", "description": "Static assets shared accross projects", "main": "index.js", "author": "Jaco Greeff ", diff --git a/packages/ui-identicon/package.json b/packages/ui-identicon/package.json index 5893bdae..20c9ad67 100644 --- a/packages/ui-identicon/package.json +++ b/packages/ui-identicon/package.json @@ -1,6 +1,6 @@ { "name": "@polkadot/ui-identicon", - "version": "0.27.1", + "version": "0.28.0", "description": "Renders an SVG picture representing an address", "main": "index.js", "author": "Jaco Greeff ", @@ -10,10 +10,11 @@ "license": "Apache-2.0", "dependencies": { "@babel/runtime": "^7.3.1", - "@polkadot/ui-settings": "^0.27.1", + "@polkadot/ui-settings": "^0.28.0", "@types/color": "^3.0.0", "@types/react-copy-to-clipboard": "^4.2.6", "color": "^3.0.0", + "jdenticon": "^2.1.1", "react-copy-to-clipboard": "^5.0.1" }, "peerDependencies": { diff --git a/packages/ui-identicon/src/Demo.tsx b/packages/ui-identicon/src/Demo.tsx index bdeec412..ff028798 100644 --- a/packages/ui-identicon/src/Demo.tsx +++ b/packages/ui-identicon/src/Demo.tsx @@ -3,6 +3,7 @@ // of the Apache-2.0 license. See the LICENSE file for details. import React from 'react'; +import ReactDOM from 'react-dom'; import { encodeAddress } from '@polkadot/keyring'; import { randomAsU8a } from '@polkadot/util-crypto'; @@ -12,7 +13,7 @@ export default class Demo extends React.PureComponent { render () { const identities: Array = []; - while (identities.length !== 10) { + while (identities.length !== 50) { identities.push( encodeAddress(randomAsU8a(32)) ); @@ -21,9 +22,17 @@ export default class Demo extends React.PureComponent { return identities.map((value) => ( )); } - } + +const rootElement = document.getElementById('demo'); + +if (!rootElement) { + throw new Error(`Unable to find element with id 'demo'`); +} + +ReactDOM.render(, rootElement); diff --git a/packages/ui-identicon/src/Substrate.tsx b/packages/ui-identicon/src/icons/Beachball.tsx similarity index 81% rename from packages/ui-identicon/src/Substrate.tsx rename to packages/ui-identicon/src/icons/Beachball.tsx index 2208d2ba..b550a7b1 100644 --- a/packages/ui-identicon/src/Substrate.tsx +++ b/packages/ui-identicon/src/icons/Beachball.tsx @@ -2,13 +2,13 @@ // This software may be modified and distributed under the terms // of the Apache-2.0 license. See the LICENSE file for details. -import { Props } from './types'; +import { Props } from '../types'; import React from 'react'; -import identicon from './beachball'; +import identicon from '../beachball/index'; -export default class Substrate extends React.PureComponent { +export default class Beachball extends React.PureComponent { render () { const { className, style } = this.props; diff --git a/packages/ui-identicon/src/Empty.tsx b/packages/ui-identicon/src/icons/Empty.tsx similarity index 94% rename from packages/ui-identicon/src/Empty.tsx rename to packages/ui-identicon/src/icons/Empty.tsx index 70cf82e5..f6bd2648 100644 --- a/packages/ui-identicon/src/Empty.tsx +++ b/packages/ui-identicon/src/icons/Empty.tsx @@ -2,7 +2,7 @@ // This software may be modified and distributed under the terms // of the Apache-2.0 license. See the LICENSE file for details. -import { Props } from './types'; +import { Props } from '../types'; import React from 'react'; diff --git a/packages/ui-identicon/src/icons/Jdenticon.tsx b/packages/ui-identicon/src/icons/Jdenticon.tsx new file mode 100644 index 00000000..1ac79c6a --- /dev/null +++ b/packages/ui-identicon/src/icons/Jdenticon.tsx @@ -0,0 +1,24 @@ +// Copyright 2017-2019 @polkadot/ui-identicon authors & contributors +// This software may be modified and distributed under the terms +// of the Apache-2.0 license. See the LICENSE file for details. + +import { Props } from '../types'; + +import React from 'react'; +import jdenticon from 'jdenticon'; + +export default class Jdenticon extends React.PureComponent { + render () { + const { className, size, style, value } = this.props; + + return ( +
+ ); + } +} diff --git a/packages/ui-identicon/src/Polkadot.tsx b/packages/ui-identicon/src/icons/Polkadot.tsx similarity index 99% rename from packages/ui-identicon/src/Polkadot.tsx rename to packages/ui-identicon/src/icons/Polkadot.tsx index da6668b5..882b1005 100644 --- a/packages/ui-identicon/src/Polkadot.tsx +++ b/packages/ui-identicon/src/icons/Polkadot.tsx @@ -16,7 +16,7 @@ // - Move constants to file-level // - Overall it is now just a static component, expecting an address as an input value -import { Props as BaseProps } from './types'; +import { Props as BaseProps } from '../types'; import React from 'react'; import { decodeAddress } from '@polkadot/keyring'; diff --git a/packages/ui-identicon/src/icons/index.ts b/packages/ui-identicon/src/icons/index.ts new file mode 100644 index 00000000..b8aaa71d --- /dev/null +++ b/packages/ui-identicon/src/icons/index.ts @@ -0,0 +1,8 @@ +// Copyright 2017-2019 @polkadot/ui-identicon authors & contributors +// This software may be modified and distributed under the terms +// of the Apache-2.0 license. See the LICENSE file for details. + +export { default as Beachball } from './Beachball'; +export { default as Empty } from './Empty'; +export { default as Jdenticon } from './Jdenticon'; +export { default as Polkadot } from './Polkadot'; diff --git a/packages/ui-identicon/src/index.tsx b/packages/ui-identicon/src/index.tsx index 30b23862..a2b17ff7 100644 --- a/packages/ui-identicon/src/index.tsx +++ b/packages/ui-identicon/src/index.tsx @@ -12,9 +12,9 @@ import { decodeAddress, encodeAddress } from '@polkadot/keyring'; import settings from '@polkadot/ui-settings/index'; import { isHex, isU8a } from '@polkadot/util'; -import Empty from './Empty'; -import Polkadot from './Polkadot'; -import Substrate from './Substrate'; +import { Beachball, Empty, Jdenticon, Polkadot } from './icons'; + +const Fallback = Beachball; type State = { address?: string | null @@ -22,8 +22,10 @@ type State = { const DEFAULT_SIZE = 64; const Components: { [index: string]: React.ComponentType } = { + 'beachball': Beachball, + 'jdenticon': Jdenticon, 'polkadot': Polkadot, - 'substrate': Substrate + 'substrate': Jdenticon }; const Wrapper = styled.div` cursor: copy; @@ -106,11 +108,11 @@ export default class IdentityIcon extends React.PureComponent { const { className, isHighlight = false, size = DEFAULT_SIZE, style, theme = settings.uiTheme } = this.props; const Component = !address ? Empty - : Components[theme] || Substrate; + : Components[theme] || Fallback; return ( diff --git a/packages/ui-identicon/src/types.ts b/packages/ui-identicon/src/types.ts index b112898e..476ca65e 100644 --- a/packages/ui-identicon/src/types.ts +++ b/packages/ui-identicon/src/types.ts @@ -21,6 +21,6 @@ export type IdentityProps = BaseProps & { onCopy?: (value: string) => void, prefix?: Prefix, size?: number, - theme?: string, + theme?: 'beachball' | 'jdenticon' | 'polkadot' | 'substrate', value?: string | Uint8Array | null }; diff --git a/packages/ui-identicon/webpack.config.js b/packages/ui-identicon/webpack.config.js index dab3213c..185be681 100644 --- a/packages/ui-identicon/webpack.config.js +++ b/packages/ui-identicon/webpack.config.js @@ -2,19 +2,24 @@ // This software may be modified and distributed under the terms // of the Apache-2.0 license. See the LICENSE file for details. +const path = require('path'); + const ENV = process.env.NODE_ENV || 'development'; const isProd = ENV === 'production'; module.exports = { context: __dirname, devtool: isProd ? 'source-map' : 'cheap-eval-source-map', - entry: './src/demo.ts', + entry: './src/Demo.tsx', mode: ENV, output: { path: __dirname, filename: './demo.js' }, resolve: { + alias: { + '@polkadot/ui-settings': path.resolve(__dirname, '../ui-settings/src') + }, extensions: ['.js', '.jsx', '.ts', '.tsx'] }, module: { diff --git a/packages/ui-keyring/package.json b/packages/ui-keyring/package.json index d961f724..7dd0d014 100644 --- a/packages/ui-keyring/package.json +++ b/packages/ui-keyring/package.json @@ -1,6 +1,6 @@ { "name": "@polkadot/ui-keyring", - "version": "0.27.1", + "version": "0.28.0", "main": "index.js", "repository": "https://github.com/polkadot-js/apps.git", "author": "Jaco Greeff ", @@ -17,7 +17,7 @@ }, "devDependencies": { "@polkadot/keyring": "^0.34.21", - "@polkadot/types": "^0.45.8", + "@polkadot/types": "^0.45.9", "@polkadot/util": "^0.34.21" }, "peerDependencies": { diff --git a/packages/ui-settings/package.json b/packages/ui-settings/package.json index 5d5a6ddd..f58c687e 100644 --- a/packages/ui-settings/package.json +++ b/packages/ui-settings/package.json @@ -1,6 +1,6 @@ { "name": "@polkadot/ui-settings", - "version": "0.27.1", + "version": "0.28.0", "description": "Manages app settings", "main": "index.js", "author": "Jaco Greeff ", diff --git a/packages/ui-util/package.json b/packages/ui-util/package.json index 6e6bac0d..a3485c9c 100644 --- a/packages/ui-util/package.json +++ b/packages/ui-util/package.json @@ -1,6 +1,6 @@ { "name": "@polkadot/ui-util", - "version": "0.27.1", + "version": "0.28.0", "description": "Utility functions (non-React) that aid in display, formats and determination", "main": "index.js", "author": "Jaco Greeff ", @@ -12,7 +12,7 @@ "@babel/runtime": "^7.3.1" }, "devDependencies": { - "@polkadot/types": "^0.45.8" + "@polkadot/types": "^0.45.9" }, "peerDependencies": { "@polkadot/types": "*" diff --git a/yarn.lock b/yarn.lock index 6a590d9a..4d6a6202 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1544,15 +1544,15 @@ resolved "https://registry.yarnpkg.com/@polkadot/schnorrkel-js/-/schnorrkel-js-0.1.2-1.tgz#90e4e8bca54157513cf5192f4581491bcbf5c44e" integrity sha512-Y6cJWOOJyQ6TPzWzfgPrZlWzcR89X2tOgLIrCXOyEE72+CFiBfyAQDqG2jBzxolEqqN/Fz0AUdxqPT45BzionQ== -"@polkadot/ts@^0.1.52": - version "0.1.52" - resolved "https://registry.yarnpkg.com/@polkadot/ts/-/ts-0.1.52.tgz#6fb09e494d244dad4b3a9ca581bfe13beec66565" - integrity sha512-sij1O0x4CY51A394RYD4/aQwDPwIxIeTOpYI4AZgdF/vq5nvF14b4XFq9vAcSnblaIosf0sYKoz1f3dkN3QqLw== +"@polkadot/ts@^0.1.53": + version "0.1.53" + resolved "https://registry.yarnpkg.com/@polkadot/ts/-/ts-0.1.53.tgz#6fae961bed882b085c5b8940ef2d482d3dd36292" + integrity sha512-TOsr0OD191SEchYKBi7v+rFrnRtjOAVaY6U4fq75uhh/Al9wvs0pUt2QxhzAgTBq+BrKk4gGvaSyiciR+HoDCg== -"@polkadot/types@^0.45.8": - version "0.45.8" - resolved "https://registry.yarnpkg.com/@polkadot/types/-/types-0.45.8.tgz#a1abe64ccfce503b6da8b1136ce484692df260be" - integrity sha512-xmpK+rsz8Y5kUI1p8nPc8tB1RLj1dU2+vyvu+448nHMtd02Lukjjukl6aqqaMKdL5th2eYSJfexGSzlyTTNBNg== +"@polkadot/types@^0.45.9": + version "0.45.9" + resolved "https://registry.yarnpkg.com/@polkadot/types/-/types-0.45.9.tgz#adc5543d803d82a3b6c3fb47dc5de145fe717262" + integrity sha512-I+g+kJGPyhatIk5yFpVqGKEqphsWI1EmiDHmsjKsjF9JCPBqw1Lhlhg77zUEcCPAVUatkGB3MMTywIvTai0Hnw== dependencies: "@babel/runtime" "^7.3.1" "@polkadot/keyring" "^0.34.21" @@ -3081,6 +3081,11 @@ caniuse-lite@^1.0.30000929: resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000938.tgz#b64bf1427438df40183fce910fe24e34feda7a3f" integrity sha512-ekW8NQ3/FvokviDxhdKLZZAx7PptXNwxKgXtnR5y+PR3hckwuP3yJ1Ir+4/c97dsHNqtAyfKUGdw8P4EYzBNgw== +canvas-renderer@~2.1.1: + version "2.1.1" + resolved "https://registry.yarnpkg.com/canvas-renderer/-/canvas-renderer-2.1.1.tgz#d91fe9511ab48056ff9fa8a04514bede76535f55" + integrity sha512-/V0XetN7s1Mk3NO7x2wxPZYv0pLMQtGAhecuOuKR88beiYCUle1AbCcFZNLu+4NVzi9RVHS0rXtIgzPEaKidLw== + capture-exit@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/capture-exit/-/capture-exit-1.2.0.tgz#1c5fcc489fd0ab00d4f1ac7ae1072e3173fbab6f" @@ -6531,6 +6536,13 @@ istanbul-reports@^2.1.1: dependencies: handlebars "^4.1.0" +jdenticon@^2.1.1: + version "2.1.1" + resolved "https://registry.yarnpkg.com/jdenticon/-/jdenticon-2.1.1.tgz#f9288e87b3466e2c5f05948c68db58e1c9e1b800" + integrity sha512-bFD210JMaK2RMHGSkdDXqdQzasMrVIGDfxUMXD/Uwq2t7g9Njb4T6kms5TrocsLU0CDmQCoB0laGJ6JETiprsg== + dependencies: + canvas-renderer "~2.1.1" + jest-changed-files@^24.0.0: version "24.0.0" resolved "https://registry.yarnpkg.com/jest-changed-files/-/jest-changed-files-24.0.0.tgz#c02c09a8cc9ca93f513166bc773741bd39898ff7"