diff --git a/src/frontend/src/flows/addDevice/addCurrentDevice.json b/src/frontend/src/flows/addDevice/addCurrentDevice.json new file mode 100644 index 0000000000..fa4173ed87 --- /dev/null +++ b/src/frontend/src/flows/addDevice/addCurrentDevice.json @@ -0,0 +1,9 @@ +{ + "en": { + "title": "Add Current Device", + "paragraph": "Please add the current device to your identity to improve the user experience with Internet Identity.", + "skip": "Skip", + "add": "Add", + "label_icon": "Recommended Action" + } +} diff --git a/src/frontend/src/flows/addDevice/addCurrentDevice.ts b/src/frontend/src/flows/addDevice/addCurrentDevice.ts new file mode 100644 index 0000000000..2ebf99d9fe --- /dev/null +++ b/src/frontend/src/flows/addDevice/addCurrentDevice.ts @@ -0,0 +1,46 @@ +import { infoScreenTemplate } from "$src/components/infoScreen"; +import { I18n } from "$src/i18n"; +import { renderPage } from "$src/utils/lit-html"; +import { TemplateResult } from "lit-html"; +import copyJson from "./addCurrentDevice.json"; + +const addCurrentDeviceTemplate = ({ + add, + skip, + i18n, +}: { + add: () => void; + skip: () => void; + i18n: I18n; +}): TemplateResult => { + const copy = i18n.i18n(copyJson); + + return infoScreenTemplate({ + cancel: skip, + cancelText: copy.skip, + next: add, + nextText: copy.add, + title: copy.title, + paragraph: copy.paragraph, + scrollToTop: true, + icon: "info", + pageId: "add-current-device", + label: copy.label_icon, + }); +}; + +export const addCurrentDevicePage = renderPage(addCurrentDeviceTemplate); + +// Prompt the user to add the current device (with the current origin). +// Adding the current device to the current origin improves the UX of the user when they come back to this origin. +export const addCurrentDevice = (): Promise<{ + action: "skip" | "add-current-device"; +}> => { + return new Promise((resolve) => + addCurrentDevicePage({ + i18n: new I18n(), + add: () => resolve({ action: "add-current-device" }), + skip: () => resolve({ action: "skip" }), + }) + ); +}; diff --git a/src/showcase/src/pages/addCurrentDevice.astro b/src/showcase/src/pages/addCurrentDevice.astro new file mode 100644 index 0000000000..d58310a023 --- /dev/null +++ b/src/showcase/src/pages/addCurrentDevice.astro @@ -0,0 +1,17 @@ +--- +import Screen from "../layouts/Screen.astro"; +--- + + + +