diff --git a/packages/desktop/lib/routers/actions/initialiseRouters.ts b/packages/desktop/lib/routers/actions/initialiseRouters.ts
index b6cc0e2f6ae..6473f9fcb8b 100644
--- a/packages/desktop/lib/routers/actions/initialiseRouters.ts
+++ b/packages/desktop/lib/routers/actions/initialiseRouters.ts
@@ -12,6 +12,7 @@ import {
} from '@core/router/routers'
import { loginRouter, LoginRouter } from '@core/router/subrouters'
import { OnboardingRouter, onboardingRouter } from '@views/onboarding'
+import { implicitAccountCreationRouter, ImplicitAccountCreationRouter } from '@views/dashboard/wallet'
export function initialiseRouters(): void {
/**
@@ -33,6 +34,7 @@ function initialiseBaseRouters(): void {
settingsRouter.set(new SettingsRouter())
collectiblesRouter.set(new CollectiblesRouter())
governanceRouter.set(new GovernanceRouter())
+ implicitAccountCreationRouter.set(new ImplicitAccountCreationRouter())
initialiseBaseOnboardingRouters()
}
diff --git a/packages/desktop/lib/routers/actions/resetRouters.ts b/packages/desktop/lib/routers/actions/resetRouters.ts
index 57d4856d2a3..135d8f2eff0 100644
--- a/packages/desktop/lib/routers/actions/resetRouters.ts
+++ b/packages/desktop/lib/routers/actions/resetRouters.ts
@@ -6,6 +6,7 @@ import {
loginRouter,
settingsRouter,
} from '@core/router'
+import { implicitAccountCreationRouter } from '@views/dashboard/wallet'
import { onboardingRouter } from '@views/onboarding'
import { get } from 'svelte/store'
@@ -25,4 +26,5 @@ function resetBaseRouters(): void {
get(settingsRouter).reset()
get(collectiblesRouter).reset()
get(governanceRouter).reset()
+ get(implicitAccountCreationRouter).reset()
}
diff --git a/packages/desktop/views/dashboard/wallet/Wallet.svelte b/packages/desktop/views/dashboard/wallet/Wallet.svelte
index e08a03831ca..1cadbc226c3 100644
--- a/packages/desktop/views/dashboard/wallet/Wallet.svelte
+++ b/packages/desktop/views/dashboard/wallet/Wallet.svelte
@@ -1,13 +1,21 @@
-{#if hasAccount}
-
-{:else}
-
-
IMPLICIT ACCOUNT
-
+{#if $selectedWallet}
+ {#key $selectedWallet?.index}
+
+ {#if hasAccount}
+
+ {:else}
+
+ {/if}
+
+ {/key}
{/if}
diff --git a/packages/desktop/views/dashboard/wallet/implicit-account-creation-router.ts b/packages/desktop/views/dashboard/wallet/implicit-account-creation-router.ts
new file mode 100644
index 00000000000..4c517b3d456
--- /dev/null
+++ b/packages/desktop/views/dashboard/wallet/implicit-account-creation-router.ts
@@ -0,0 +1,37 @@
+import { get, writable } from 'svelte/store'
+import { Router } from '../../../../shared/lib/core/router/classes'
+import { ImplicitAccountCreationRoute } from './implicit-account-creation.enum'
+
+export const implicitAccountCreationRouter = writable(null)
+export const implicitAccountCreationRoute = writable(null)
+
+export class ImplicitAccountCreationRouter extends Router {
+ constructor() {
+ super(ImplicitAccountCreationRoute.Init, implicitAccountCreationRoute)
+ }
+
+ next(): void {
+ let nextRoute: ImplicitAccountCreationRoute
+
+ const currentRoute = get(this.routeStore)
+ switch (currentRoute) {
+ case ImplicitAccountCreationRoute.Init: {
+ nextRoute = ImplicitAccountCreationRoute.OneTimeDeposit
+ break
+ }
+ case ImplicitAccountCreationRoute.OneTimeDeposit: {
+ nextRoute = ImplicitAccountCreationRoute.FundConfirmation
+ break
+ }
+ case ImplicitAccountCreationRoute.FundConfirmation: {
+ nextRoute = ImplicitAccountCreationRoute.AccountCreation
+ break
+ }
+ case ImplicitAccountCreationRoute.AccountCreation: {
+ get(implicitAccountCreationRouter).reset()
+ return
+ }
+ }
+ this.setNext(nextRoute)
+ }
+}
diff --git a/packages/desktop/views/dashboard/wallet/implicit-account-creation.enum.ts b/packages/desktop/views/dashboard/wallet/implicit-account-creation.enum.ts
new file mode 100644
index 00000000000..3f6203f81ad
--- /dev/null
+++ b/packages/desktop/views/dashboard/wallet/implicit-account-creation.enum.ts
@@ -0,0 +1,6 @@
+export enum ImplicitAccountCreationRoute {
+ Init = 'init',
+ OneTimeDeposit = 'OneTimeDeposit',
+ FundConfirmation = 'FundConfirmation',
+ AccountCreation = 'AccountCreation',
+}
diff --git a/packages/desktop/views/dashboard/wallet/index.js b/packages/desktop/views/dashboard/wallet/index.js
index 2e2316e2ffe..84815d3c46c 100644
--- a/packages/desktop/views/dashboard/wallet/index.js
+++ b/packages/desktop/views/dashboard/wallet/index.js
@@ -1 +1,5 @@
export { default as Wallet } from './Wallet.svelte'
+
+export * from './implicit-account-creation-router'
+export * from './implicit-account-creation.enum'
+export * from './views'
diff --git a/packages/desktop/views/dashboard/wallet/views/ImplicitAccountCreationView.svelte b/packages/desktop/views/dashboard/wallet/views/ImplicitAccountCreationView.svelte
new file mode 100644
index 00000000000..ae248485f10
--- /dev/null
+++ b/packages/desktop/views/dashboard/wallet/views/ImplicitAccountCreationView.svelte
@@ -0,0 +1,40 @@
+
+
+
+
+ {localize('views.implicit-account-creation.title')}
+ {#if $implicitAccountCreationRoute === ImplicitAccountCreationRoute.Init}
+
+ {:else if $implicitAccountCreationRoute === ImplicitAccountCreationRoute.OneTimeDeposit}
+
+ {:else if $implicitAccountCreationRoute === ImplicitAccountCreationRoute.FundConfirmation}
+
+ {:else if $implicitAccountCreationRoute === ImplicitAccountCreationRoute.AccountCreation}
+
+ {/if}
+
+ {#if $implicitAccountCreationRoute !== ImplicitAccountCreationRoute.Init}
+
+ {#each IMPLICIT_ACCOUNT_STEPS as step}
+
+ {/each}
+
+ {/if}
+
+
+
diff --git a/packages/desktop/views/dashboard/wallet/views/WalletMainView.svelte b/packages/desktop/views/dashboard/wallet/views/WalletMainView.svelte
deleted file mode 100644
index a2619435816..00000000000
--- a/packages/desktop/views/dashboard/wallet/views/WalletMainView.svelte
+++ /dev/null
@@ -1,44 +0,0 @@
-
-
-{#if $selectedWallet}
-
- {#key $selectedWallet?.index}
-
-
-
- {#if features?.wallet?.accountSummary?.enabled}
-
- {/if}
-
-
-
- {#if features?.wallet?.sendAndReceive?.enabled}
-
-
- {/if}
-
-
-
-
- {#if features?.wallet?.assets?.enabled}
-
- {/if}
-
-
- {#if features?.wallet?.activityHistory?.enabled}
-
- {/if}
-
-
- {/key}
-
-{/if}
diff --git a/packages/desktop/views/dashboard/wallet/views/WalletView.svelte b/packages/desktop/views/dashboard/wallet/views/WalletView.svelte
new file mode 100644
index 00000000000..a3639625809
--- /dev/null
+++ b/packages/desktop/views/dashboard/wallet/views/WalletView.svelte
@@ -0,0 +1,34 @@
+
+
+
+
+
+ {#if features?.wallet?.accountSummary?.enabled}
+
+ {/if}
+
+
+
+ {#if features?.wallet?.sendAndReceive?.enabled}
+
+
+ {/if}
+
+
+
+
+ {#if features?.wallet?.assets?.enabled}
+
+ {/if}
+
+
+ {#if features?.wallet?.activityHistory?.enabled}
+
+ {/if}
+
+
diff --git a/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/AccountCreationView.svelte b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/AccountCreationView.svelte
new file mode 100644
index 00000000000..e7372a8d642
--- /dev/null
+++ b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/AccountCreationView.svelte
@@ -0,0 +1 @@
+AccountCreation
diff --git a/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/FundConfirmationView.svelte b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/FundConfirmationView.svelte
new file mode 100644
index 00000000000..896db9eff77
--- /dev/null
+++ b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/FundConfirmationView.svelte
@@ -0,0 +1 @@
+FundConfirmation
diff --git a/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/InitView.svelte b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/InitView.svelte
new file mode 100644
index 00000000000..b7fc5a99d32
--- /dev/null
+++ b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/InitView.svelte
@@ -0,0 +1,44 @@
+
+
+
+ {#each MAIN_VIEW_STEPS as step}
+
+
+
+ {step.title}
+ {step.description}
+
+
+ {/each}
+
+
diff --git a/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/OneTimeDepositView.svelte b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/OneTimeDepositView.svelte
new file mode 100644
index 00000000000..03648fe3fac
--- /dev/null
+++ b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/OneTimeDepositView.svelte
@@ -0,0 +1 @@
+OneTimeDeposit
diff --git a/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/index.js b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/index.js
new file mode 100644
index 00000000000..144a5c7581d
--- /dev/null
+++ b/packages/desktop/views/dashboard/wallet/views/implicit-account-creation-multistep/index.js
@@ -0,0 +1,4 @@
+export { default as OneTimeDepositView } from './OneTimeDepositView.svelte'
+export { default as FundConfirmationView } from './FundConfirmationView.svelte'
+export { default as AccountCreationView } from './AccountCreationView.svelte'
+export { default as InitView } from './InitView.svelte'
diff --git a/packages/desktop/views/dashboard/wallet/views/index.js b/packages/desktop/views/dashboard/wallet/views/index.js
index 365c6bc4321..61a66a5cda3 100644
--- a/packages/desktop/views/dashboard/wallet/views/index.js
+++ b/packages/desktop/views/dashboard/wallet/views/index.js
@@ -1 +1,4 @@
-export { default as WalletMainView } from './WalletMainView.svelte'
+export { default as ImplicitAccountCreationView } from './ImplicitAccountCreationView.svelte'
+export { default as WalletView } from './WalletView.svelte'
+
+export * from './implicit-account-creation-multistep'
diff --git a/packages/shared/assets/illustrations/implicit-account-creation/step1.svg b/packages/shared/assets/illustrations/implicit-account-creation/step1.svg
new file mode 100644
index 00000000000..89119ffa871
--- /dev/null
+++ b/packages/shared/assets/illustrations/implicit-account-creation/step1.svg
@@ -0,0 +1,18 @@
+
diff --git a/packages/shared/assets/illustrations/implicit-account-creation/step2.svg b/packages/shared/assets/illustrations/implicit-account-creation/step2.svg
new file mode 100644
index 00000000000..d26a9f432f1
--- /dev/null
+++ b/packages/shared/assets/illustrations/implicit-account-creation/step2.svg
@@ -0,0 +1,21 @@
+
diff --git a/packages/shared/assets/illustrations/implicit-account-creation/step3.svg b/packages/shared/assets/illustrations/implicit-account-creation/step3.svg
new file mode 100644
index 00000000000..f648ecb5c57
--- /dev/null
+++ b/packages/shared/assets/illustrations/implicit-account-creation/step3.svg
@@ -0,0 +1,19 @@
+
diff --git a/packages/shared/locales/en.json b/packages/shared/locales/en.json
index c8530fcc911..1cb995a85b7 100644
--- a/packages/shared/locales/en.json
+++ b/packages/shared/locales/en.json
@@ -655,6 +655,24 @@
"title": "Vesting of tokens",
"body": "From the tokens users received through an IOTA token airdrop, 10% are being available to users immediately at the genesis of the IOTA Stardust network. The rest is gradually unlocked over the course of two years in equal proportion happening every two weeks."
}
+ },
+ "implicit-account-creation":{
+ "title": "Activate Account",
+ "steps" : {
+ "step1": {
+ "title": "Step 1",
+ "body": "One-time deposit"
+ },
+ "step2": {
+ "title": "Step 2",
+ "body": "Fund confirmation"
+ },
+ "step3": {
+ "title": "Step 3",
+ "body": "Account creation"
+ }
+ },
+ "action": "Start"
}
},
"popups": {