diff --git a/packages/apps-routing/src/index.ts b/packages/apps-routing/src/index.ts index c4518a198b..a7ec36b84f 100644 --- a/packages/apps-routing/src/index.ts +++ b/packages/apps-routing/src/index.ts @@ -34,6 +34,7 @@ import techcomm from './techcomm'; import teleport from './teleport'; import transfer from './transfer'; import treasury from './treasury'; +import utilities from './utilities'; export default function create (t: TFunction): Routes { return [ @@ -66,6 +67,7 @@ export default function create (t: TFunction): Routes { sudo(t), files(t), js(t), + utilities(t), settings(t) ]; } diff --git a/packages/apps-routing/src/utilities.ts b/packages/apps-routing/src/utilities.ts new file mode 100644 index 0000000000..e66694c551 --- /dev/null +++ b/packages/apps-routing/src/utilities.ts @@ -0,0 +1,20 @@ +// Copyright 2017-2022 @polkadot/apps-routing authors & contributors +// SPDX-License-Identifier: Apache-2.0 + +import type { TFunction } from 'i18next'; +import type { Route } from './types'; + +import Component from '@polkadot/app-utilities'; + +export default function create (t: TFunction): Route { + return { + Component, + display: { + needsApi: [] + }, + group: 'developer', + icon: 'wrench', + name: 'utilities', + text: t('nav.utilities', 'Utilities', { ns: 'apps-routing' }) + }; +} diff --git a/packages/page-signing/src/index.tsx b/packages/page-signing/src/index.tsx index 7f505417c7..3e98b5e51c 100644 --- a/packages/page-signing/src/index.tsx +++ b/packages/page-signing/src/index.tsx @@ -8,7 +8,6 @@ import { Route, Switch } from 'react-router'; import { Tabs } from '@polkadot/react-components'; -import Hash from './Hash'; import Sign from './Sign'; import { useTranslation } from './translate'; import Verify from './Verify'; @@ -25,10 +24,6 @@ function SigningApp ({ basePath }: Props): React.ReactElement { { name: 'verify', text: t('Verify signature') - }, - { - name: 'hash', - text: t('Hash data') } ]); @@ -39,7 +34,6 @@ function SigningApp ({ basePath }: Props): React.ReactElement { items={itemsRef.current} /> - diff --git a/packages/page-utilities/.skip-build b/packages/page-utilities/.skip-build new file mode 100644 index 0000000000..e69de29bb2 diff --git a/packages/page-utilities/.skip-npm b/packages/page-utilities/.skip-npm new file mode 100644 index 0000000000..e69de29bb2 diff --git a/packages/page-utilities/LICENSE b/packages/page-utilities/LICENSE new file mode 100644 index 0000000000..0d381b2e97 --- /dev/null +++ b/packages/page-utilities/LICENSE @@ -0,0 +1,201 @@ + Apache License + Version 2.0, January 2004 + http://www.apache.org/licenses/ + +TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION + +1. Definitions. + + "License" shall mean the terms and conditions for use, reproduction, + and distribution as defined by Sections 1 through 9 of this document. + + "Licensor" shall mean the copyright owner or entity authorized by + the copyright owner that is granting the License. + + "Legal Entity" shall mean the union of the acting entity and all + other entities that control, are controlled by, or are under common + control with that entity. For the purposes of this definition, + "control" means (i) the power, direct or indirect, to cause the + direction or management of such entity, whether by contract or + otherwise, or (ii) ownership of fifty percent (50%) or more of the + outstanding shares, or (iii) beneficial ownership of such entity. + + "You" (or "Your") shall mean an individual or Legal Entity + exercising permissions granted by this License. + + "Source" form shall mean the preferred form for making modifications, + including but not limited to software source code, documentation + source, and configuration files. + + "Object" form shall mean any form resulting from mechanical + transformation or translation of a Source form, including but + not limited to compiled object code, generated documentation, + and conversions to other media types. + + "Work" shall mean the work of authorship, whether in Source or + Object form, made available under the License, as indicated by a + copyright notice that is included in or attached to the work + (an example is provided in the Appendix below). + + "Derivative Works" shall mean any work, whether in Source or Object + form, that is based on (or derived from) the Work and for which the + editorial revisions, annotations, elaborations, or other modifications + represent, as a whole, an original work of authorship. For the purposes + of this License, Derivative Works shall not include works that remain + separable from, or merely link (or bind by name) to the interfaces of, + the Work and Derivative Works thereof. + + "Contribution" shall mean any work of authorship, including + the original version of the Work and any modifications or additions + to that Work or Derivative Works thereof, that is intentionally + submitted to Licensor for inclusion in the Work by the copyright owner + or by an individual or Legal Entity authorized to submit on behalf of + the copyright owner. For the purposes of this definition, "submitted" + means any form of electronic, verbal, or written communication sent + to the Licensor or its representatives, including but not limited to + communication on electronic mailing lists, source code control systems, + and issue tracking systems that are managed by, or on behalf of, the + Licensor for the purpose of discussing and improving the Work, but + excluding communication that is conspicuously marked or otherwise + designated in writing by the copyright owner as "Not a Contribution." + + "Contributor" shall mean Licensor and any individual or Legal Entity + on behalf of whom a Contribution has been received by Licensor and + subsequently incorporated within the Work. + +2. Grant of Copyright License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + copyright license to reproduce, prepare Derivative Works of, + publicly display, publicly perform, sublicense, and distribute the + Work and such Derivative Works in Source or Object form. + +3. Grant of Patent License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + (except as stated in this section) patent license to make, have made, + use, offer to sell, sell, import, and otherwise transfer the Work, + where such license applies only to those patent claims licensable + by such Contributor that are necessarily infringed by their + Contribution(s) alone or by combination of their Contribution(s) + with the Work to which such Contribution(s) was submitted. If You + institute patent litigation against any entity (including a + cross-claim or counterclaim in a lawsuit) alleging that the Work + or a Contribution incorporated within the Work constitutes direct + or contributory patent infringement, then any patent licenses + granted to You under this License for that Work shall terminate + as of the date such litigation is filed. + +4. Redistribution. You may reproduce and distribute copies of the + Work or Derivative Works thereof in any medium, with or without + modifications, and in Source or Object form, provided that You + meet the following conditions: + + (a) You must give any other recipients of the Work or + Derivative Works a copy of this License; and + + (b) You must cause any modified files to carry prominent notices + stating that You changed the files; and + + (c) You must retain, in the Source form of any Derivative Works + that You distribute, all copyright, patent, trademark, and + attribution notices from the Source form of the Work, + excluding those notices that do not pertain to any part of + the Derivative Works; and + + (d) If the Work includes a "NOTICE" text file as part of its + distribution, then any Derivative Works that You distribute must + include a readable copy of the attribution notices contained + within such NOTICE file, excluding those notices that do not + pertain to any part of the Derivative Works, in at least one + of the following places: within a NOTICE text file distributed + as part of the Derivative Works; within the Source form or + documentation, if provided along with the Derivative Works; or, + within a display generated by the Derivative Works, if and + wherever such third-party notices normally appear. The contents + of the NOTICE file are for informational purposes only and + do not modify the License. You may add Your own attribution + notices within Derivative Works that You distribute, alongside + or as an addendum to the NOTICE text from the Work, provided + that such additional attribution notices cannot be construed + as modifying the License. + + You may add Your own copyright statement to Your modifications and + may provide additional or different license terms and conditions + for use, reproduction, or distribution of Your modifications, or + for any such Derivative Works as a whole, provided Your use, + reproduction, and distribution of the Work otherwise complies with + the conditions stated in this License. + +5. Submission of Contributions. Unless You explicitly state otherwise, + any Contribution intentionally submitted for inclusion in the Work + by You to the Licensor shall be under the terms and conditions of + this License, without any additional terms or conditions. + Notwithstanding the above, nothing herein shall supersede or modify + the terms of any separate license agreement you may have executed + with Licensor regarding such Contributions. + +6. Trademarks. This License does not grant permission to use the trade + names, trademarks, service marks, or product names of the Licensor, + except as required for reasonable and customary use in describing the + origin of the Work and reproducing the content of the NOTICE file. + +7. Disclaimer of Warranty. Unless required by applicable law or + agreed to in writing, Licensor provides the Work (and each + Contributor provides its Contributions) on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or + implied, including, without limitation, any warranties or conditions + of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A + PARTICULAR PURPOSE. You are solely responsible for determining the + appropriateness of using or redistributing the Work and assume any + risks associated with Your exercise of permissions under this License. + +8. Limitation of Liability. In no event and under no legal theory, + whether in tort (including negligence), contract, or otherwise, + unless required by applicable law (such as deliberate and grossly + negligent acts) or agreed to in writing, shall any Contributor be + liable to You for damages, including any direct, indirect, special, + incidental, or consequential damages of any character arising as a + result of this License or out of the use or inability to use the + Work (including but not limited to damages for loss of goodwill, + work stoppage, computer failure or malfunction, or any and all + other commercial damages or losses), even if such Contributor + has been advised of the possibility of such damages. + +9. Accepting Warranty or Additional Liability. While redistributing + the Work or Derivative Works thereof, You may choose to offer, + and charge a fee for, acceptance of support, warranty, indemnity, + or other liability obligations and/or rights consistent with this + License. However, in accepting such obligations, You may act only + on Your own behalf and on Your sole responsibility, not on behalf + of any other Contributor, and only if You agree to indemnify, + defend, and hold each Contributor harmless for any liability + incurred by, or claims asserted against, such Contributor by reason + of your accepting any such warranty or additional liability. + +END OF TERMS AND CONDITIONS + +APPENDIX: How to apply the Apache License to your work. + + To apply the Apache License to your work, attach the following + boilerplate notice, with the fields enclosed by brackets "[]" + replaced with your own identifying information. (Don't include + the brackets!) The text should be enclosed in the appropriate + comment syntax for the file format. We also recommend that a + file or class name and description of purpose be included on the + same "printed page" as the copyright notice for easier + identification within third-party archives. + +Copyright [yyyy] [name of copyright owner] + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. diff --git a/packages/page-utilities/README.md b/packages/page-utilities/README.md new file mode 100644 index 0000000000..1b6e650f7a --- /dev/null +++ b/packages/page-utilities/README.md @@ -0,0 +1 @@ +# @polkadot/app-utilities diff --git a/packages/page-utilities/package.json b/packages/page-utilities/package.json new file mode 100644 index 0000000000..0a5325d0de --- /dev/null +++ b/packages/page-utilities/package.json @@ -0,0 +1,19 @@ +{ + "bugs": "https://github.com/polkadot-js/apps/issues", + "homepage": "https://github.com/polkadot-js/apps/tree/master/packages/page-utilities#readme", + "license": "Apache-2.0", + "name": "@polkadot/app-utilities", + "private": true, + "repository": { + "directory": "packages/page-utilities", + "type": "git", + "url": "https://github.com/polkadot-js/apps.git" + }, + "sideEffects": false, + "type": "module", + "version": "0.113.2-55", + "dependencies": { + "@babel/runtime": "^7.17.9", + "@polkadot/react-components": "^0.113.2-55" + } +} diff --git a/packages/page-utilities/src/Convert.tsx b/packages/page-utilities/src/Convert.tsx new file mode 100644 index 0000000000..fedcba3b9b --- /dev/null +++ b/packages/page-utilities/src/Convert.tsx @@ -0,0 +1,124 @@ +// Copyright 2017-2022 @polkadot/app-utilities authors & contributors +// SPDX-License-Identifier: Apache-2.0 + +import type { Option } from '@polkadot/apps-config/settings/types'; + +import React, { useCallback, useMemo, useState } from 'react'; + +import { createOption } from '@polkadot/app-settings/util'; +import { createSs58 } from '@polkadot/apps-config'; +import { allNetworks } from '@polkadot/networks'; +import { Dropdown, InputAddressSimple, Static } from '@polkadot/react-components'; +import { useApi } from '@polkadot/react-hooks'; +import { formatNumber } from '@polkadot/util'; +import { base58Decode, checkAddressChecksum, encodeAddress, isAddress } from '@polkadot/util-crypto'; + +import { useTranslation } from './translate'; + +interface Props { + className?: string; +} + +interface State { + address: string | null; + inputSS58: number; +} + +function getState (input: string): State { + let address: string | null = null; + let inputSS58 = 42; + + if (isAddress(input)) { + const decoded = base58Decode(input); + const [,,, ss58Decoded] = checkAddressChecksum(decoded); + + address = input; + inputSS58 = ss58Decoded; + } + + return { + address, + inputSS58 + }; +} + +function Addresses ({ className }: Props): React.ReactElement { + const { t } = useTranslation(); + const { chainSS58 } = useApi(); + const [{ address, inputSS58 }, setState] = useState({ address: null, inputSS58: 42 }); + const [prefix, setPrefix] = useState(-1); + + const setAddress = useCallback( + (address: string) => + setState(getState(address)), + [] + ); + + const prefixOptions = useMemo( + (): (Option | React.ReactNode)[] => { + const network = allNetworks.find(({ prefix }) => prefix === chainSS58); + + return createSs58(t).map((o) => + createOption(o, ['default'], 'empty', ( + o.value === -1 + ? network + ? ` (${network.displayName}, ${chainSS58 || 0})` + : ` (${chainSS58 || 0})` + : ` (${o.value})` + )) + ); + }, + [chainSS58, t] + ); + + const converted = useMemo( + () => address && encodeAddress(address, prefix === -1 ? chainSS58 : prefix), + [address, chainSS58, prefix] + ); + + return ( +
+
+ ('address to convert')} + noConvert + onChange={setAddress} + /> +
+
+ ('Override the default ss58 prefix for address generation')} + label={t('address prefix')} + onChange={setPrefix} + options={prefixOptions} + /> +
+ {address && ( + <> +
+ ('input ss58 prefix')} + value={formatNumber(inputSS58)} + /> +
+ {converted && ( +
+ ('converted address')} + /> +
+ )} + + )} +
+ ); +} + +export default React.memo(Addresses); diff --git a/packages/page-signing/src/Hash.tsx b/packages/page-utilities/src/Hash.tsx similarity index 90% rename from packages/page-signing/src/Hash.tsx rename to packages/page-utilities/src/Hash.tsx index 63357e3e62..b09e310413 100644 --- a/packages/page-signing/src/Hash.tsx +++ b/packages/page-utilities/src/Hash.tsx @@ -1,4 +1,4 @@ -// Copyright 2017-2022 @polkadot/app-signing authors & contributors +// Copyright 2017-2022 @polkadot/app-utilities authors & contributors // SPDX-License-Identifier: Apache-2.0 import React, { useCallback, useState } from 'react'; @@ -9,13 +9,17 @@ import { blake2AsHex } from '@polkadot/util-crypto'; import { useTranslation } from './translate'; +interface Props { + className?: string; +} + interface State { data: string; hash: string; isHexData: boolean; } -function Hash (): React.ReactElement { +function Hash ({ className }: Props): React.ReactElement { const { t } = useTranslation(); const [{ data, hash, isHexData }, setState] = useState({ data: '', @@ -42,7 +46,7 @@ function Hash (): React.ReactElement { ); return ( -
+
{ + const { t } = useTranslation(); + + const tabsRef = useRef([ + { + isRoot: true, + name: 'convert', + text: t('Convert address') + }, + { + name: 'hash', + text: t('Hash data') + } + ]); + + return ( +
+ + + + + + + + + +
+ ); +} + +export default React.memo(UtilitiesApp); diff --git a/packages/page-utilities/src/translate.ts b/packages/page-utilities/src/translate.ts new file mode 100644 index 0000000000..8914de9212 --- /dev/null +++ b/packages/page-utilities/src/translate.ts @@ -0,0 +1,10 @@ +// Copyright 2017-2022 @polkadot/app-utilities authors & contributors +// SPDX-License-Identifier: Apache-2.0 + +import type { UseTranslationResponse } from 'react-i18next'; + +import { useTranslation as useTranslationBase } from 'react-i18next'; + +export function useTranslation (): UseTranslationResponse<'app-utilities', undefined> { + return useTranslationBase('app-utilities'); +} diff --git a/packages/page-utilities/tsconfig.build.json b/packages/page-utilities/tsconfig.build.json new file mode 100644 index 0000000000..da24d9f225 --- /dev/null +++ b/packages/page-utilities/tsconfig.build.json @@ -0,0 +1,9 @@ +{ + "extends": "../../tsconfig.base.json", + "compilerOptions": { + "baseUrl": "..", + "outDir": "./build", + "rootDir": "./src" + }, + "references": [] +} diff --git a/packages/react-components/src/InputAddressSimple.tsx b/packages/react-components/src/InputAddressSimple.tsx index 820fc0a2af..553e3bb472 100644 --- a/packages/react-components/src/InputAddressSimple.tsx +++ b/packages/react-components/src/InputAddressSimple.tsx @@ -14,26 +14,32 @@ interface Props { className?: string; defaultValue?: string | null; help?: React.ReactNode; + isDisabled?: boolean; isError?: boolean; isFull?: boolean; label?: React.ReactNode; + noConvert?: boolean; onChange?: (address: string | null) => void; onEnter?: () => void; onEscape?: () => void; } -function InputAddressSimple ({ autoFocus, children, className = '', defaultValue, help, isError, isFull, label, onChange, onEnter, onEscape }: Props): React.ReactElement { +function InputAddressSimple ({ autoFocus, children, className = '', defaultValue, help, isDisabled, isError, isFull, label, noConvert, onChange, onEnter, onEscape }: Props): React.ReactElement { const [address, setAddress] = useState(defaultValue || null); const _onChange = useCallback( (_address: string): void => { const address = toAddress(_address) || null; + const output = noConvert + ? address + ? _address + : null + : address; - setAddress(address); - - onChange && onChange(address); + setAddress(output); + onChange && onChange(output); }, - [onChange] + [noConvert, onChange] ); return ( @@ -42,6 +48,7 @@ function InputAddressSimple ({ autoFocus, children, className = '', defaultValue autoFocus={autoFocus} defaultValue={defaultValue} help={help} + isDisabled={isDisabled} isError={isError || !address} isFull={isFull} label={label} diff --git a/tsconfig.base.json b/tsconfig.base.json index 8338f4d344..eb3e04e1a3 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -68,6 +68,8 @@ "@polkadot/app-tech-comm/*": ["page-tech-comm/src/*"], "@polkadot/app-treasury": ["page-treasury/src"], "@polkadot/app-treasury/*": ["page-treasury/src/*"], + "@polkadot/app-utilities": ["page-utilities/src"], + "@polkadot/app-utilities/*": ["page-utilities/src/*"], "@polkadot/react-api": ["react-api/src"], "@polkadot/react-api/*": ["react-api/src/*"], "@polkadot/react-components": ["react-components/src"], diff --git a/yarn.lock b/yarn.lock index 4d5c71f2bc..f484c7be16 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2982,6 +2982,15 @@ __metadata: languageName: unknown linkType: soft +"@polkadot/app-utilities@workspace:packages/page-utilities": + version: 0.0.0-use.local + resolution: "@polkadot/app-utilities@workspace:packages/page-utilities" + dependencies: + "@babel/runtime": ^7.17.9 + "@polkadot/react-components": ^0.113.2-55 + languageName: unknown + linkType: soft + "@polkadot/apps-config@^0.113.2-55, @polkadot/apps-config@workspace:packages/apps-config": version: 0.0.0-use.local resolution: "@polkadot/apps-config@workspace:packages/apps-config"