diff --git a/packages/ui/src/App.svelte b/packages/ui/src/App.svelte index 420f44b3..5deac1f5 100644 --- a/packages/ui/src/App.svelte +++ b/packages/ui/src/App.svelte @@ -27,6 +27,7 @@ import { saveAs } from 'file-saver'; import { injectHyperlinks } from './utils/inject-hyperlinks'; + import { InitialOptions } from './initial-options'; const dispatch = createEventDispatcher(); @@ -38,10 +39,13 @@ dispatch('tab-change', tab); }; + export let initialOpts: InitialOptions = {}; + let initialValuesSet = false; + let allOpts: { [k in Kind]?: Required } = {}; let errors: { [k in Kind]?: OptionsErrorMessages } = {}; - let contract: Contract = new ContractBuilder('MyToken'); + let contract: Contract = new ContractBuilder(initialOpts.name ?? 'MyToken'); $: functionCall && applyFunctionCall() @@ -49,6 +53,20 @@ $: { if (opts) { + if (!initialValuesSet) { + opts.name = initialOpts.name ?? opts.name; + switch (opts.kind) { + case 'ERC20': + opts.premint = initialOpts.premint ?? opts.premint; + case 'ERC721': + opts.symbol = initialOpts.symbol ?? opts.symbol; + break; + case 'ERC1155': + case 'Governor': + case 'Custom': + } + initialValuesSet = true; + } try { contract = buildGeneric(opts); errors[tab] = undefined; diff --git a/packages/ui/src/cairo/App.svelte b/packages/ui/src/cairo/App.svelte index 24a9f6cb..352c7b47 100644 --- a/packages/ui/src/cairo/App.svelte +++ b/packages/ui/src/cairo/App.svelte @@ -20,6 +20,7 @@ import { saveAs } from 'file-saver'; import { injectHyperlinks } from './inject-hyperlinks'; + import { InitialOptions } from '../initial-options'; const dispatch = createEventDispatcher(); @@ -31,15 +32,31 @@ dispatch('tab-change', tab); }; + export let initialOpts: InitialOptions = {}; + let initialValuesSet = false; + let allOpts: { [k in Kind]?: Required } = {}; let errors: { [k in Kind]?: OptionsErrorMessages } = {}; - let contract: Contract = new ContractBuilder('MyToken'); + let contract: Contract = new ContractBuilder(initialOpts.name ?? 'MyToken'); $: opts = allOpts[tab]; $: { if (opts) { + if (!initialValuesSet) { + opts.name = initialOpts.name ?? opts.name; + switch (opts.kind) { + case 'ERC20': + opts.premint = initialOpts.premint ?? opts.premint; + case 'ERC721': + opts.symbol = initialOpts.symbol ?? opts.symbol; + break; + case 'ERC1155': + case 'Custom': + } + initialValuesSet = true; + } try { contract = buildGeneric(opts); errors[tab] = undefined; diff --git a/packages/ui/src/embed.ts b/packages/ui/src/embed.ts index 0dcfbbea..6ca327ad 100644 --- a/packages/ui/src/embed.ts +++ b/packages/ui/src/embed.ts @@ -39,12 +39,19 @@ onDOMContentLoaded(function () { setSearchParam(w, src.searchParams, 'data-lang', 'lang'); setSearchParam(w, src.searchParams, 'data-tab', 'tab'); setSearchParam(w, src.searchParams, 'version', 'version'); + const sync = w.getAttribute('data-sync-url'); if (sync === 'fragment') { - const fragment = window.location.hash.replace('#', ''); - if (fragment) { - src.searchParams.set('tab', fragment); + // Uses format: #tab&key=value&key=value... + const fragments = window.location.hash.replace('#', '').split('&'); + for (const fragment of fragments) { + const [key, value] = fragment.split('=', 2); + if (key && value) { + src.searchParams.set(key, value); + } else { + src.searchParams.set('tab', fragment); + } } } diff --git a/packages/ui/src/initial-options.ts b/packages/ui/src/initial-options.ts new file mode 100644 index 00000000..9a4ec972 --- /dev/null +++ b/packages/ui/src/initial-options.ts @@ -0,0 +1 @@ +export interface InitialOptions { name?: string, symbol?: string, premint?: string }; \ No newline at end of file diff --git a/packages/ui/src/main.ts b/packages/ui/src/main.ts index ae2a159e..e2a9cba3 100644 --- a/packages/ui/src/main.ts +++ b/packages/ui/src/main.ts @@ -8,6 +8,7 @@ import UnsupportedVersion from './UnsupportedVersion.svelte'; import semver from 'semver'; import { compatibleContractsSemver as compatibleSolidityContractsSemver } from '@openzeppelin/wizard'; import { compatibleContractsSemver as compatibleCairoContractsSemver } from '@openzeppelin/wizard-cairo'; +import { InitialOptions } from './initial-options'; function postResize() { const { height } = document.documentElement.getBoundingClientRect(); @@ -25,6 +26,12 @@ const initialTab = params.get('tab') ?? undefined; const lang = params.get('lang') ?? undefined; const requestedVersion = params.get('version') ?? undefined; +const initialOpts: InitialOptions = { + name: params.get('name') ?? undefined, + symbol: params.get('symbol') ?? undefined, + premint: params.get('premint') ?? undefined, +} + let compatibleVersionSemver = lang === 'cairo' ? compatibleCairoContractsSemver : compatibleSolidityContractsSemver; let app; @@ -32,9 +39,9 @@ if (requestedVersion && !semver.satisfies(requestedVersion, compatibleVersionSem postMessage({ kind: 'oz-wizard-unsupported-version' }); app = new UnsupportedVersion({ target: document.body, props: { requestedVersion, compatibleVersionSemver }}); } else if (lang === 'cairo') { - app = new CairoApp({ target: document.body, props: { initialTab } }); + app = new CairoApp({ target: document.body, props: { initialTab, initialOpts } }); } else { - app = new App({ target: document.body, props: { initialTab } }); + app = new App({ target: document.body, props: { initialTab, initialOpts } }); } app.$on('tab-change', (e: CustomEvent) => {