From 26af2da56fdcda91eafc3dbd7f27acfb2357ee7b Mon Sep 17 00:00:00 2001 From: andyv09 Date: Mon, 4 Sep 2023 12:34:57 +0200 Subject: [PATCH 01/13] fix: update dApp connect page --- .../components/ConnectedProvider/index.tsx | 65 +++++++++++++++++-- 1 file changed, 61 insertions(+), 4 deletions(-) diff --git a/packages/dapp/src/components/ConnectedProvider/index.tsx b/packages/dapp/src/components/ConnectedProvider/index.tsx index d1dea0484..eef110564 100644 --- a/packages/dapp/src/components/ConnectedProvider/index.tsx +++ b/packages/dapp/src/components/ConnectedProvider/index.tsx @@ -1,6 +1,7 @@ 'use client'; import React from 'react'; +import { PlusCircleIcon } from '@heroicons/react/24/solid'; import { useTranslations } from 'next-intl'; import { useGeneralStore } from '@/stores'; @@ -19,10 +20,66 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => { return (
-
-

- {t('connect')} -

+
+
+ Connect Wallet & Install Masca +
+
+
+
+ Masca +
+
+ Manage Decentralized Identity in MetaMask +
+
+
    +
  • +
    + +
    + Feature A +
    +
    +
    + Use conversational language when explaining the snap. If you + need to use a technical term, briefly define it so everyone can + understand. Avoid jargon whenever possible, and keep your words + short and simple. Introduce your snap in the context of your + application to make it clear what the user gets if they install + it. +
    +
    • +
  • +
    + +
    Feature A
    +
    +
    + Use conversational language when explaining the snap. If you + need to use a technical term, briefly define it so everyone can + understand. Avoid jargon whenever possible, and keep your words + short and simple. Introduce your snap in the context of your + application to make it clear what the user gets if they install + it. +
    +
    • +
  • +
    + +
    Feature A
    +
    +
    + Use conversational language when explaining the snap. If you + need to use a technical term, briefly define it so everyone can + understand. Avoid jargon whenever possible, and keep your words + short and simple. Introduce your snap in the context of your + application to make it clear what the user gets if they install + it. +
    +
    • +
+
); From 834c43a0f11a0a26579db9bfa52b39a2c2f0bf77 Mon Sep 17 00:00:00 2001 From: andyv09 Date: Mon, 4 Sep 2023 12:50:13 +0200 Subject: [PATCH 02/13] fix: update connect page --- .../components/ConnectedProvider/index.tsx | 55 ++++++++++--------- packages/dapp/src/messages/en.json | 2 +- 2 files changed, 31 insertions(+), 26 deletions(-) diff --git a/packages/dapp/src/components/ConnectedProvider/index.tsx b/packages/dapp/src/components/ConnectedProvider/index.tsx index eef110564..496970c68 100644 --- a/packages/dapp/src/components/ConnectedProvider/index.tsx +++ b/packages/dapp/src/components/ConnectedProvider/index.tsx @@ -5,6 +5,7 @@ import { PlusCircleIcon } from '@heroicons/react/24/solid'; import { useTranslations } from 'next-intl'; import { useGeneralStore } from '@/stores'; +import MascaLogo from '../MascaLogo'; interface ConnectedProviderProps { children: React.ReactNode; @@ -24,20 +25,26 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
Connect Wallet & Install Masca
-
-
-
- Masca +
+
+
+
-
- Manage Decentralized Identity in MetaMask +
+
+ Masca +
+
+ Manage Decentralized Identity in MetaMask +
+
    -
  • +
  • -
    +
    Feature A
    @@ -45,37 +52,35 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => { Use conversational language when explaining the snap. If you need to use a technical term, briefly define it so everyone can understand. Avoid jargon whenever possible, and keep your words - short and simple. Introduce your snap in the context of your - application to make it clear what the user gets if they install - it. + short and simple.
    • -
  • -
    +
  • +
    -
    Feature A
    +
    + Feature A +
    -
    +
    Use conversational language when explaining the snap. If you need to use a technical term, briefly define it so everyone can understand. Avoid jargon whenever possible, and keep your words - short and simple. Introduce your snap in the context of your - application to make it clear what the user gets if they install - it. + short and simple.
    • -
  • -
    +
  • +
    -
    Feature A
    +
    + Feature A +
    -
    +
    Use conversational language when explaining the snap. If you need to use a technical term, briefly define it so everyone can understand. Avoid jargon whenever possible, and keep your words - short and simple. Introduce your snap in the context of your - application to make it clear what the user gets if they install - it. + short and simple.
diff --git a/packages/dapp/src/messages/en.json b/packages/dapp/src/messages/en.json index 86cbc2ff2..28628da73 100644 --- a/packages/dapp/src/messages/en.json +++ b/packages/dapp/src/messages/en.json @@ -61,7 +61,7 @@ "secondary-desc-2": "(Requires a primary device to work)" }, "ConnectButton": { - "connect": "Connect Wallet" + "connect": "Connect & Install Masca" }, "ConnectDeviceView": { "connect": "Connect Wallet to proceed!", From 888831798d9eb8988e1ea6fe6d0a81e3a2f70c6a Mon Sep 17 00:00:00 2001 From: andyv09 Date: Mon, 4 Sep 2023 13:10:33 +0200 Subject: [PATCH 03/13] fix: connect --- .../components/ConnectedProvider/index.tsx | 28 ++++++++----------- 1 file changed, 11 insertions(+), 17 deletions(-) diff --git a/packages/dapp/src/components/ConnectedProvider/index.tsx b/packages/dapp/src/components/ConnectedProvider/index.tsx index 496970c68..d9703a03b 100644 --- a/packages/dapp/src/components/ConnectedProvider/index.tsx +++ b/packages/dapp/src/components/ConnectedProvider/index.tsx @@ -39,48 +39,42 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
-
+
    -
  • +
  • - Feature A + Manage you Decentralized Identifiers
    - Use conversational language when explaining the snap. If you - need to use a technical term, briefly define it so everyone can - understand. Avoid jargon whenever possible, and keep your words - short and simple. + Create and manage your decentralized identifiers. Masca supports + multiple popular DID methods.
  • - Feature A + Manage your Credentials
    - Use conversational language when explaining the snap. If you - need to use a technical term, briefly define it so everyone can - understand. Avoid jargon whenever possible, and keep your words - short and simple. + Store Verifiable Credentials in Masca or Onchain & use them to + create Verifiable Presentation.
  • - Feature A + Receive and share Credentials
    - Use conversational language when explaining the snap. If you - need to use a technical term, briefly define it so everyone can - understand. Avoid jargon whenever possible, and keep your words - short and simple. + Masca supports Polygon ID & OID4VC flows to enable secure data + sharing between entities.
From debc571482bf5ab37bbd00498956b0eacdff7ff9 Mon Sep 17 00:00:00 2001 From: andyv09 Date: Wed, 6 Sep 2023 10:37:21 +0200 Subject: [PATCH 04/13] chore: add changeset --- .changeset/new-ladybugs-end.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/new-ladybugs-end.md diff --git a/.changeset/new-ladybugs-end.md b/.changeset/new-ladybugs-end.md new file mode 100644 index 000000000..8436725b0 --- /dev/null +++ b/.changeset/new-ladybugs-end.md @@ -0,0 +1,5 @@ +--- +'@blockchain-lab-um/dapp': patch +--- + +feat: add Masca description to "Connect Page" From 8414c970a55fd982f1f152357b6cf59cbf840ea2 Mon Sep 17 00:00:00 2001 From: andyv09 Date: Wed, 6 Sep 2023 15:37:16 +0200 Subject: [PATCH 05/13] fix: update Masca feature card --- .../components/ConnectedProvider/index.tsx | 113 ++++++++++++------ 1 file changed, 74 insertions(+), 39 deletions(-) diff --git a/packages/dapp/src/components/ConnectedProvider/index.tsx b/packages/dapp/src/components/ConnectedProvider/index.tsx index d9703a03b..94b6323af 100644 --- a/packages/dapp/src/components/ConnectedProvider/index.tsx +++ b/packages/dapp/src/components/ConnectedProvider/index.tsx @@ -1,7 +1,12 @@ 'use client'; import React from 'react'; -import { PlusCircleIcon } from '@heroicons/react/24/solid'; +import { + CreditCardIcon, + GlobeAltIcon, + LockClosedIcon, + PlusCircleIcon, +} from '@heroicons/react/24/solid'; import { useTranslations } from 'next-intl'; import { useGeneralStore } from '@/stores'; @@ -25,59 +30,89 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
Connect Wallet & Install Masca
-
+
-
+
Masca
-
+
Manage Decentralized Identity in MetaMask
-
    -
  • -
    - -
    - Manage you Decentralized Identifiers +
    +
      +
    • +
      + +
      + Own your identity +
      -
    -
    - Create and manage your decentralized identifiers. Masca supports - multiple popular DID methods. -
    -
    • -
  • -
    - -
    - Manage your Credentials +
    + Imagine your{' '} + + Ethereum account{' '} + + as a passport in the digital world. With just a few clicks, + transform your existing account into a{' '} + + universal digital identity + + , trusted everywhere.
    -
    -
    - Store Verifiable Credentials in Masca or Onchain & use them to - create Verifiable Presentation. -
    -
    • -
  • -
    - -
    - Receive and share Credentials +
    • +
  • +
    + +
    + Manage & share Credentials securely +
    -
-
- Masca supports Polygon ID & OID4VC flows to enable secure data - sharing between entities. -
- - +
+ Store everything from your driving license to your job + credentials safely and securely in one place. Choose to save + them on{' '} + + Ceramic Network + {' '} + or keep them privately in your + + {' '} + MetaMask wallet + + . These credentials can be shared with anyone, and they can be + verified using blockchain technology. +
+ +
  • +
    + +
    + Universal Compatibility with Identity Flows +
    +
    +
    + Easily use your digital identity across different platforms + and services with no extra setup. Masca supports popular + identity systems like{' '} + + Polygon ID + {' '} + and{' '} + + OID4VC + + , making your life easier and more secure. +
    +
    • + +
    From 45d644c9a8b42cf70292353d1f61be71e4a15601 Mon Sep 17 00:00:00 2001 From: andyv09 Date: Wed, 6 Sep 2023 17:35:42 +0200 Subject: [PATCH 06/13] fix: text & letter spacing & navbar dropdown --- .../components/ConnectedProvider/index.tsx | 22 ++++----- .../dapp/src/components/MenuPopover/index.tsx | 47 ++++++++++++------- packages/dapp/src/messages/en.json | 32 ++++++------- packages/dapp/tailwind.config.cjs | 22 ++++----- 4 files changed, 68 insertions(+), 55 deletions(-) diff --git a/packages/dapp/src/components/ConnectedProvider/index.tsx b/packages/dapp/src/components/ConnectedProvider/index.tsx index 94b6323af..d70dc25e0 100644 --- a/packages/dapp/src/components/ConnectedProvider/index.tsx +++ b/packages/dapp/src/components/ConnectedProvider/index.tsx @@ -28,7 +28,7 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
    - Connect Wallet & Install Masca + Connect Wallet & Install Masca to continue
    @@ -51,7 +51,7 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
    - Own your identity + Own your Identity
    @@ -62,22 +62,22 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => { as a passport in the digital world. With just a few clicks, transform your existing account into a{' '} - universal digital identity + universal digital Identity - , trusted everywhere. + .
  • - Manage & share Credentials securely + Manage Credentials securely
    - Store everything from your driving license to your job - credentials safely and securely in one place. Choose to save - them on{' '} + Store everything from your Web3 community participation + certificate to your real world work credentials safely and + securely in one place. Choose to save them on{' '} Ceramic Network {' '} @@ -86,8 +86,7 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => { {' '} MetaMask wallet - . These credentials can be shared with anyone, and they can be - verified using blockchain technology. + .
  • @@ -99,8 +98,7 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
    • Easily use your digital identity across different platforms - and services with no extra setup. Masca supports popular - identity systems like{' '} + and services. Masca supports popular identity systems like{' '} Polygon ID {' '} diff --git a/packages/dapp/src/components/MenuPopover/index.tsx b/packages/dapp/src/components/MenuPopover/index.tsx index 6d9f212a9..a5d589822 100644 --- a/packages/dapp/src/components/MenuPopover/index.tsx +++ b/packages/dapp/src/components/MenuPopover/index.tsx @@ -7,6 +7,8 @@ import { ChevronDownIcon } from '@heroicons/react/20/solid'; import clsx from 'clsx'; import { useTranslations } from 'next-intl'; +import { useGeneralStore } from '@/stores'; + const IconCreateCredential = () => ( JSX.Element; + requiresConnection: boolean; } const INTERNAL_LINKS: LinkProps[] = [ @@ -74,16 +77,19 @@ const INTERNAL_LINKS: LinkProps[] = [ name: 'create-credential', href: '/app/create-credential', icon: IconCreateCredential, + requiresConnection: true, }, { name: 'verify-data', href: '/app/verify-data', icon: IconVerifyData, + requiresConnection: true, }, { name: 'qr-scanner', href: '/app/qr-code-session', icon: IconCamera, + requiresConnection: false, }, ]; @@ -112,6 +118,8 @@ const DropDownItem = ({ SVGIcon, name, description }: DropDownItemProps) => ( function MenuPopover() { const t = useTranslations('AppNavbar'); + const isConnected = useGeneralStore((state) => state.isConnected); + return ( {({ open, close }) => ( @@ -147,22 +155,29 @@ function MenuPopover() {
    - {INTERNAL_LINKS.map((link) => ( - { - close(); - }} - className="dark:hover:bg-navy-blue-500/40 -m-3 flex items-center rounded-lg p-2 transition duration-150 ease-in-out hover:bg-gray-100 focus:outline-none focus-visible:ring focus-visible:ring-orange-500/50" - > - - - ))} + {INTERNAL_LINKS.map((link) => { + if ( + (link.requiresConnection && isConnected) || + !link.requiresConnection + ) { + return ( + { + close(); + }} + className="dark:hover:bg-navy-blue-500/40 -m-3 flex items-center rounded-lg p-2 transition duration-150 ease-in-out hover:bg-gray-100 focus:outline-none focus-visible:ring focus-visible:ring-orange-500/50" + > + + + ); + } + })}
    Date: Thu, 7 Sep 2023 11:41:06 +0200 Subject: [PATCH 07/13] fix: move text to locales --- .../components/ConnectedProvider/index.tsx | 48 ++++++++----------- .../dapp/src/components/MenuPopover/index.tsx | 1 + packages/dapp/src/messages/en.json | 22 ++++++++- 3 files changed, 43 insertions(+), 28 deletions(-) diff --git a/packages/dapp/src/components/ConnectedProvider/index.tsx b/packages/dapp/src/components/ConnectedProvider/index.tsx index d70dc25e0..d53e3626b 100644 --- a/packages/dapp/src/components/ConnectedProvider/index.tsx +++ b/packages/dapp/src/components/ConnectedProvider/index.tsx @@ -5,7 +5,6 @@ import { CreditCardIcon, GlobeAltIcon, LockClosedIcon, - PlusCircleIcon, } from '@heroicons/react/24/solid'; import { useTranslations } from 'next-intl'; @@ -28,7 +27,7 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
    - Connect Wallet & Install Masca to continue + {t('connect')}
    @@ -37,10 +36,10 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
    - Masca + {t('masca')}
    - Manage Decentralized Identity in MetaMask + {t('masca-desc')}
    @@ -51,18 +50,17 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
    - Own your Identity + {t('features.feat-1')}
    - Imagine your{' '} + {t('features.desc-1-1')} - Ethereum account{' '} + {t('features.desc-1-2')} - as a passport in the digital world. With just a few clicks, - transform your existing account into a{' '} + {t('features.desc-1-3')} - universal digital Identity + {t('features.desc-1-4')} .
    @@ -71,20 +69,17 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
    - Manage Credentials securely + {t('features.feat-2')}
    - Store everything from your Web3 community participation - certificate to your real world work credentials safely and - securely in one place. Choose to save them on{' '} + {t('features.desc-2-1')} - Ceramic Network - {' '} - or keep them privately in your + {t('features.desc-2-2')} + + {t('features.desc-2-3')} - {' '} - MetaMask wallet + {t('features.desc-2-4')} .
    @@ -93,20 +88,19 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
    - Universal Compatibility with Identity Flows + {t('features.feat-3')}
    - Easily use your digital identity across different platforms - and services. Masca supports popular identity systems like{' '} + {t('features.desc-3-1')} - Polygon ID - {' '} - and{' '} + {t('features.desc-3-2')} + + {t('features.desc-3-3')} - OID4VC + {t('features.desc-3-4')} - , making your life easier and more secure. + {t('features.desc-3-5')}
    diff --git a/packages/dapp/src/components/MenuPopover/index.tsx b/packages/dapp/src/components/MenuPopover/index.tsx index a5d589822..81101edcf 100644 --- a/packages/dapp/src/components/MenuPopover/index.tsx +++ b/packages/dapp/src/components/MenuPopover/index.tsx @@ -177,6 +177,7 @@ function MenuPopover() { ); } + return
    ; })}
    diff --git a/packages/dapp/src/messages/en.json b/packages/dapp/src/messages/en.json index b179bd211..79cc7b8b3 100644 --- a/packages/dapp/src/messages/en.json +++ b/packages/dapp/src/messages/en.json @@ -73,7 +73,27 @@ "success": "Connection established!" }, "ConnectedProvider": { - "connect": "Connect MetaMask to use the dapp" + "connect": "Connect Wallet & Install Masca to continue", + "masca": "Masca", + "masca-desc": "Manage Decentralized Identity in MetaMask", + "features": { + "feat-1": "Own your Identity", + "feat-2": "Manage Credentials securely", + "feat-3": "Universal Compatibility with Identity Flows", + "desc-1-1": "Imagine your ", + "desc-1-2": "Ethereum account ", + "desc-1-3": "as a passport in the digital world. With just a few clicks, transform your existing account into a ", + "desc-1-4": "universal digital Identity", + "desc-2-1": "Store everything from your Web3 community participation certificate to your real world work credentials safely and securely in one place. Choose to save them on ", + "desc-2-2": "Ceramic Network ", + "desc-2-3": "or keep them privately in your ", + "desc-2-4": "MetaMask wallet", + "desc-3-1": "Easily use your digital identity across different platforms and services. Masca supports popular identity systems like ", + "desc-3-2": "Polygon ID ", + "desc-3-3": "and ", + "desc-3-4": "OID4VC, ", + "desc-3-5": "making your life easier and more secure." + } }, "Controlbar": { "query": "Querying credentials", From 162cb8065ab073b67d6fca2dc89f886893a36b83 Mon Sep 17 00:00:00 2001 From: martines3000 Date: Fri, 8 Sep 2023 09:22:30 +0000 Subject: [PATCH 08/13] chore: update changeset --- .changeset/chilly-boxes-sit.md | 5 +++++ .changeset/new-ladybugs-end.md | 5 ----- 2 files changed, 5 insertions(+), 5 deletions(-) create mode 100644 .changeset/chilly-boxes-sit.md delete mode 100644 .changeset/new-ladybugs-end.md diff --git a/.changeset/chilly-boxes-sit.md b/.changeset/chilly-boxes-sit.md new file mode 100644 index 000000000..345415d9d --- /dev/null +++ b/.changeset/chilly-boxes-sit.md @@ -0,0 +1,5 @@ +--- +'@blockchain-lab-um/dapp': minor +--- + +Added Masca description to `Connect Page˙. diff --git a/.changeset/new-ladybugs-end.md b/.changeset/new-ladybugs-end.md deleted file mode 100644 index 8436725b0..000000000 --- a/.changeset/new-ladybugs-end.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@blockchain-lab-um/dapp': patch ---- - -feat: add Masca description to "Connect Page" From 24c75f327c29ffadc1620efbb5ece58ababb0b25 Mon Sep 17 00:00:00 2001 From: andyv09 Date: Fri, 8 Sep 2023 13:01:02 +0200 Subject: [PATCH 09/13] fix: fix connect wallet page for mobile devices --- .../src/components/AppBottomBar/index.tsx | 78 ++++++++++++------- .../dapp/src/components/AppNavbar/index.tsx | 37 +++++---- .../components/ConnectedProvider/index.tsx | 26 +++---- packages/dapp/src/messages/en.json | 6 +- packages/snap/snap.manifest.json | 2 +- 5 files changed, 88 insertions(+), 61 deletions(-) diff --git a/packages/dapp/src/components/AppBottomBar/index.tsx b/packages/dapp/src/components/AppBottomBar/index.tsx index 1c975ce61..fcd8bb9a7 100644 --- a/packages/dapp/src/components/AppBottomBar/index.tsx +++ b/packages/dapp/src/components/AppBottomBar/index.tsx @@ -6,35 +6,43 @@ import { EllipsisHorizontalIcon } from '@heroicons/react/24/solid'; import clsx from 'clsx'; import { useTranslations } from 'next-intl'; +import { useGeneralStore } from '@/stores/generalStore'; + const MAIN_LINKS = [ { name: 'dashboard', href: '/app', + requiresConnection: false, }, { name: 'settings', href: '/app/settings', + requiresConnection: true, }, ]; const OTHER_LINKS = [ - // { - // name: 'get-credential', - // href: '/app/get-credential', - // }, - // { - // name: 'authorization-request', - // href: '/app/authorization-request', - // }, { - name: 'qr-code-session', + name: 'create-credential', + href: '/app/create-credential', + requiresConnection: true, + }, + { + name: 'verify-data', + href: '/app/verify-data', + requiresConnection: true, + }, + { + name: 'qr-scanner', href: '/app/qr-code-session', + requiresConnection: false, }, ]; const AppBottomBar = () => { const t = useTranslations('AppBottomBar'); const [isMenuOpen, setIsMenuOpen] = useState(false); + const isConnected = useGeneralStore((state) => state.isConnected); const toggleMenu = () => { setIsMenuOpen((currVal) => !currVal); @@ -45,17 +53,22 @@ const AppBottomBar = () => {
    - {MAIN_LINKS.map(({ name, href }) => ( - // Link styled as button for mobile bottom navbar with tailwind - setIsMenuOpen(false)} - className="animated-transition dark:bg-navy-blue-700 dark:hover:bg-navy-blue-600 rounded-lg bg-pink-100 p-2 text-pink-600 hover:bg-pink-50 dark:text-white" - key={name} - href={href} - > - {t(name)} - - ))} + {MAIN_LINKS.map(({ name, href, requiresConnection }) => { + if ((requiresConnection && isConnected) || !requiresConnection) { + return ( + // Link styled as button for mobile bottom navbar with tailwind + setIsMenuOpen(false)} + className="animated-transition dark:bg-navy-blue-700 dark:hover:bg-navy-blue-600 rounded-lg bg-pink-100 p-2 text-pink-600 hover:bg-pink-50 dark:text-white" + key={name} + href={href} + > + {t(name)} + + ); + } + return
    ; + })}
    diff --git a/packages/dapp/src/components/AppNavbar/index.tsx b/packages/dapp/src/components/AppNavbar/index.tsx index b68563020..9eebee719 100644 --- a/packages/dapp/src/components/AppNavbar/index.tsx +++ b/packages/dapp/src/components/AppNavbar/index.tsx @@ -8,22 +8,26 @@ import { useTranslations } from 'next-intl'; import MascaLogo from '@/components/MascaLogo'; import MenuPopover from '@/components/MenuPopover'; import ToggleTheme from '@/components/ToggleTheme'; +import { useGeneralStore } from '@/stores'; import { NavConnection } from './NavConnection'; const MAIN_LINKS = [ { name: 'dashboard', href: '/app', + requiresConnection: false, }, { name: 'settings', href: '/app/settings', + requiresConnection: true, }, ]; export default function AppNavbar() { const t = useTranslations('AppNavbar'); const pathname = usePathname() ?? '/'; + const isConnected = useGeneralStore((state) => state.isConnected); return (
    @@ -37,20 +41,25 @@ export default function AppNavbar() {
    - {MAIN_LINKS.map(({ name, href }) => ( - - {t(`menu.${name}`)} - - ))} + {MAIN_LINKS.map(({ name, href, requiresConnection }) => { + if ((requiresConnection && isConnected) || !requiresConnection) { + return ( + + {t(`menu.${name}`)} + + ); + } + return
    ; + })}
    diff --git a/packages/dapp/src/components/ConnectedProvider/index.tsx b/packages/dapp/src/components/ConnectedProvider/index.tsx index d53e3626b..1bf7cec10 100644 --- a/packages/dapp/src/components/ConnectedProvider/index.tsx +++ b/packages/dapp/src/components/ConnectedProvider/index.tsx @@ -25,31 +25,31 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => { return (
    -
    -
    +
    +
    {t('connect')}
    -
    +
    -
    +
    {t('masca')}
    -
    +
    {t('masca-desc')}
    -
      +
      • -
        - -
        +
        + +
        {t('features.feat-1')}
        @@ -67,8 +67,8 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
      • - -
        + +
        {t('features.feat-2')}
        @@ -86,8 +86,8 @@ const ConnectedProvider = ({ children }: ConnectedProviderProps) => {
      • - -
        + +
        {t('features.feat-3')}
        diff --git a/packages/dapp/src/messages/en.json b/packages/dapp/src/messages/en.json index 79cc7b8b3..072a851a5 100644 --- a/packages/dapp/src/messages/en.json +++ b/packages/dapp/src/messages/en.json @@ -1,9 +1,9 @@ { "AppBottomBar": { - "authorization-request": "Authorization Request", "dashboard": "Dashboard", - "get-credential": "Get Credential", - "qr-code-session": "QR Scanner", + "get-credential": "Get Credentials", + "qr-scanner": "QR Code Scanner", + "verify-data": "Verify Data", "settings": "Settings" }, "AppNavbar": { diff --git a/packages/snap/snap.manifest.json b/packages/snap/snap.manifest.json index 87ada729c..b42f53376 100644 --- a/packages/snap/snap.manifest.json +++ b/packages/snap/snap.manifest.json @@ -15,7 +15,7 @@ "registry": "https://registry.npmjs.org" } }, - "shasum": "nVKFpAn6RCNMM8UOH344F+tQUP6pxGjzisRXGBYf550=" + "shasum": "WDdq5nRYRTf6/tY3A81reueTXmE5YrMsSE3LVh631QA=" }, "initialPermissions": { "endowment:ethereum-provider": {}, From 7ef603240396bed9121d84a3ae95d9e503c9eeb2 Mon Sep 17 00:00:00 2001 From: andyv09 Date: Fri, 8 Sep 2023 13:03:02 +0200 Subject: [PATCH 10/13] chore: add changeset --- .changeset/heavy-timers-laugh.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/heavy-timers-laugh.md diff --git a/.changeset/heavy-timers-laugh.md b/.changeset/heavy-timers-laugh.md new file mode 100644 index 000000000..56189b0f2 --- /dev/null +++ b/.changeset/heavy-timers-laugh.md @@ -0,0 +1,5 @@ +--- +'@blockchain-lab-um/dapp': patch +--- + +Add missing links in navbar and footer From 73cabbca35e586546278f5104a2b9a33eb775c49 Mon Sep 17 00:00:00 2001 From: andyv09 Date: Tue, 12 Sep 2023 09:29:02 +0200 Subject: [PATCH 11/13] fix: add create connection to locales --- packages/dapp/src/messages/en.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/dapp/src/messages/en.json b/packages/dapp/src/messages/en.json index 072a851a5..37e0ddb94 100644 --- a/packages/dapp/src/messages/en.json +++ b/packages/dapp/src/messages/en.json @@ -4,7 +4,8 @@ "get-credential": "Get Credentials", "qr-scanner": "QR Code Scanner", "verify-data": "Verify Data", - "settings": "Settings" + "settings": "Settings", + "create-credential": "Create Credential" }, "AppNavbar": { "address": { From 0244311fc3d226106bec9e18c367b1fc3c958091 Mon Sep 17 00:00:00 2001 From: andyv09 Date: Tue, 12 Sep 2023 10:19:15 +0200 Subject: [PATCH 12/13] fix: remove wrong title from locale --- packages/dapp/src/messages/en.json | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/dapp/src/messages/en.json b/packages/dapp/src/messages/en.json index 37e0ddb94..944e51dbf 100644 --- a/packages/dapp/src/messages/en.json +++ b/packages/dapp/src/messages/en.json @@ -1,11 +1,10 @@ { "AppBottomBar": { "dashboard": "Dashboard", - "get-credential": "Get Credentials", + "create-credential": "Create Credentials", "qr-scanner": "QR Code Scanner", "verify-data": "Verify Data", - "settings": "Settings", - "create-credential": "Create Credential" + "settings": "Settings" }, "AppNavbar": { "address": { From 1cf6d405070cfcf967b42d843ccb8d2fecdc16de Mon Sep 17 00:00:00 2001 From: andyv09 Date: Tue, 12 Sep 2023 10:21:22 +0200 Subject: [PATCH 13/13] fix: typo --- packages/dapp/src/messages/en.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dapp/src/messages/en.json b/packages/dapp/src/messages/en.json index 944e51dbf..d371c5cfc 100644 --- a/packages/dapp/src/messages/en.json +++ b/packages/dapp/src/messages/en.json @@ -1,7 +1,7 @@ { "AppBottomBar": { "dashboard": "Dashboard", - "create-credential": "Create Credentials", + "create-credential": "Create Credential", "qr-scanner": "QR Code Scanner", "verify-data": "Verify Data", "settings": "Settings"