diff --git a/src/frontend/src/components/authenticateBox.json b/src/frontend/src/components/authenticateBox.json deleted file mode 100644 index 9862c21703..0000000000 --- a/src/frontend/src/components/authenticateBox.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "en": { - "secure_and_convenient": "Secure & Convenient", - "instead_of_passwords": "Instead of using passwords to sign-in, you unlock your device to authorize the use of a passkey. Passkeys are built on a standardized technology that offers protection against phishing attacks. This makes Internet Identity both more convenient and secure than traditional sign-in methods.", - - "no_tracking": "No Tracking", - "get_privacy": "Get the privacy of many separate accounts, without the burden of managing them. When you create an account with a dapp using Internet Identity, a new set of authentication keys are created and managed for that dapp. This way, your identity cannot be tracked across dapps or websites.", - - "control_your_identity": "Control Your Identity", - "securely_access": "You can securely access your Internet Identity from many different devices through the use of passkeys. If you ever lose trust in a device, you can easily delete the passkeys associated with the device to revoke access.", - - "own_and_participate": "Own & Participate", - "share_and_vote": "Stake tokens and vote on the future of Internet Identity on the Network Nervous System (NNS). The NNS is decentralized control system (or DAO) that manages the Internet Computerโ€™s functions, including Internet Identity. You can submit proposals and vote on security, upgrades, implementing changes, community governance, etc.", - - "sign_in_to_web3": "Sign in to 100% Web3 dapps", - "manages_keys": "Internet Identity manages many keys for you and reduces the number of signature requests that you experience while exploring Web3. Internet Identity creates a public key for every dapp, so that you cannot be tracked across services. You use your device to authorize sessions instead of signing individual transactions. By signing a session, you authorize a scoped delegation that frees you to enjoy the dapp without signing every interaction.", - - "opensource_and_transparent": "Open Source & Transparent", - "internet_identity_codebase": "The codebase for Internet Identity is open source and available for anyone to view and contribute to on GitHub. This means that developers can audit the codebase and ensure that it meets the highest standards of security and transparency." - } -} diff --git a/src/frontend/src/components/authenticateBox.ts b/src/frontend/src/components/authenticateBox.ts index 52c885218c..f2992db67f 100644 --- a/src/frontend/src/components/authenticateBox.ts +++ b/src/frontend/src/components/authenticateBox.ts @@ -39,19 +39,10 @@ import { isNullish, nonNullish } from "@dfinity/utils"; import { TemplateResult, html, render } from "lit-html"; import { mkAnchorInput } from "./anchorInput"; import { mkAnchorPicker } from "./anchorPicker"; -import { - controlIcon, - githubBigIcon, - participateIcon, - privacyIcon, - secureIcon, - signInIcon, -} from "./icons"; import { mainWindow } from "./mainWindow"; import { promptUserNumber } from "./promptUserNumber"; import { DerEncodedPublicKey } from "@dfinity/agent"; -import copyJson from "./authenticateBox.json"; import { landingPage } from "./landingPage"; /** Template used for rendering specific authentication screens. See `authnScreens` below @@ -413,43 +404,18 @@ export const handleLoginFlowResult = async ( return undefined; }; +const learnMoreBlock = html`

+ Learn more + about Internet Identity +

`; + /** The templates for the authentication pages */ export const authnTemplates = (i18n: I18n, props: AuthnTemplates) => { - const copy = i18n.i18n(copyJson); - - const marketingBlocks = [ - { - icon: secureIcon, - title: copy.secure_and_convenient, - body: copy.instead_of_passwords, - }, - { - icon: privacyIcon, - title: copy.no_tracking, - body: copy.get_privacy, - }, - { - icon: controlIcon, - title: copy.control_your_identity, - body: copy.securely_access, - }, - { - icon: participateIcon, - title: copy.own_and_participate, - body: copy.share_and_vote, - }, - { - icon: signInIcon, - title: copy.sign_in_to_web3, - body: copy.manages_keys, - }, - { - icon: githubBigIcon, - title: copy.opensource_and_transparent, - body: copy.internet_identity_codebase, - }, - ]; - return { firstTime: (firstTimeProps: { useExisting: () => void; @@ -474,20 +440,7 @@ export const authnTemplates = (i18n: I18n, props: AuthnTemplates) => { ${props.firstTime.useExistingText} -
- ${marketingBlocks.map( - ({ title, body, icon }) => - html` -
- ${icon !== undefined - ? html`${icon}` - : undefined} -

${title}

-

${body}

-
- ` - )} -
`; + ${learnMoreBlock}`; }, useExisting: (useExistingProps: { register: () => void; @@ -560,6 +513,7 @@ export const authnTemplates = (i18n: I18n, props: AuthnTemplates) => { pick: pickProps.onSubmit, moreOptions: pickProps.moreOptions, }).template} + ${learnMoreBlock} `; }, }; @@ -569,22 +523,12 @@ export const authnPages = (i18n: I18n, props: AuthnTemplates) => { const templates = authnTemplates(i18n, props); return { - firstTime: ( - opts: Parameters[0], - // TODO: remove this parameter once the landing page is ready. - landingPageTemplate: boolean = false - ) => - // TODO: Use the landing page template always when ready. - page(templates.firstTime(opts), landingPageTemplate), + firstTime: (opts: Parameters[0]) => + page(templates.firstTime(opts), true), useExisting: (opts: Parameters[0]) => - page(templates.useExisting(opts)), - pick: ( - opts: Parameters[0], - // TODO: remove this parameter once the landing page is ready. - landingPageTemplate: boolean = false - ) => - // TODO: Use the landing page template always when ready. - page(templates.pick(opts), landingPageTemplate), + page(templates.useExisting(opts), false), + pick: (opts: Parameters[0]) => + page(templates.pick(opts), true), }; }; @@ -636,6 +580,7 @@ const page = (slot: TemplateResult, landingPageTemplate: boolean = false) => { const template = landingPageTemplate ? landingPage({ slot, + dataPage: "authenticate", }) : mainWindow({ slot: html` diff --git a/src/frontend/src/components/icons.ts b/src/frontend/src/components/icons.ts index 9c9d4428b4..f82f1829d6 100644 --- a/src/frontend/src/components/icons.ts +++ b/src/frontend/src/components/icons.ts @@ -418,93 +418,6 @@ export const externalLinkIcon = html` `; -export const privacyIcon = html` - -`; - -export const controlIcon = html` - - - -`; - -export const participateIcon = html` - - - - - - - -`; - -export const secureIcon = html` - - - -`; - -export const signInIcon = html` - - - - - - - -`; - -export const githubBigIcon = html` - - - -`; - export const questionIcon = html` { const i18n = new I18n(); const copy = i18n.i18n(copyJson); - return html`
+ return html`