From 7aa827dffd86b8eb798c50279134f4d1040283ab Mon Sep 17 00:00:00 2001 From: linhan <15726044837@163.com> Date: Wed, 31 May 2023 10:33:07 +0800 Subject: [PATCH] feat: add zk sbt banner (#36) * add zksbt banner * fix font * change contract config --------- Co-authored-by: alpers --- packages/app-config/src/contract.ts | 2 +- packages/app/src/App.tsx | 2 +- packages/app/src/Claimer/index.tsx | 5 +- packages/page-did/src/eth-bind/SigItem.tsx | 31 +++++++++++ packages/page-did/src/eth-bind/Step3.tsx | 5 +- packages/page-did/src/eth-bind/Step4.tsx | 6 +-- packages/page-did/src/eth-bind/TextWithBg.tsx | 4 +- packages/page-sbt-event/src/Banner.tsx | 54 +++++++++++++++++++ packages/page-sbt-event/src/index.tsx | 44 +-------------- 9 files changed, 101 insertions(+), 52 deletions(-) create mode 100644 packages/page-did/src/eth-bind/SigItem.tsx create mode 100644 packages/page-sbt-event/src/Banner.tsx diff --git a/packages/app-config/src/contract.ts b/packages/app-config/src/contract.ts index 705a2560..a4ca3c2f 100644 --- a/packages/app-config/src/contract.ts +++ b/packages/app-config/src/contract.ts @@ -6,7 +6,7 @@ import { optimismGoerli } from '@credential/react-components'; import { isRelease } from './isRelease'; export const ZKSBT_ADDRESS = isRelease - ? '0x1addc21e939b93e9337f8A663F62a64583b62233' + ? '0x08f1a8Eeb39E861FcC78812fd1C79291cd3f88A7' : '0x1addc21e939b93e9337f8A663F62a64583b62233'; export const ZKSBT_CHAIN_ID = isRelease ? optimismGoerli.id : optimismGoerli.id; diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index c4374788..29b5ed27 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -238,7 +238,7 @@ const createNoSideBar = () => ( } - path='event/2' + path='event/zk-kyc2023' /> ); diff --git a/packages/app/src/Claimer/index.tsx b/packages/app/src/Claimer/index.tsx index 5739f26a..58acf58c 100644 --- a/packages/app/src/Claimer/index.tsx +++ b/packages/app/src/Claimer/index.tsx @@ -2,8 +2,9 @@ // SPDX-License-Identifier: Apache-2.0 import React, { useMemo } from 'react'; -import { Outlet, useLocation } from 'react-router-dom'; +import { Outlet, useLocation, useNavigate } from 'react-router-dom'; +import Banner from '@credential/page-sbt-event/Banner'; import { Box, useMediaQuery, useTheme } from '@credential/react-components'; import { useToggle } from '@credential/react-hooks'; @@ -19,6 +20,7 @@ const Claimer: React.FC = () => { const [open, toggleOpen] = useToggle(!!upMd); const { pathname } = useLocation(); const unreads = useNotification(); + const navigate = useNavigate(); const items = useMemo( () => [ @@ -47,6 +49,7 @@ const Claimer: React.FC = () => { return (
+ navigate('/event/zk-kyc2023')} /> = ({ label, mb, mt, value }) => { + return ( + + + {label} + + + + {value} + + + ); +}; + +export default React.memo(SigItem); diff --git a/packages/page-did/src/eth-bind/Step3.tsx b/packages/page-did/src/eth-bind/Step3.tsx index f0e9fa94..f2aa0c0d 100644 --- a/packages/page-did/src/eth-bind/Step3.tsx +++ b/packages/page-did/src/eth-bind/Step3.tsx @@ -16,6 +16,7 @@ import { } from '@credential/react-components'; import { DidsContext } from '@credential/react-dids'; +import SigItem from './SigItem'; import TextWithBg from './TextWithBg'; const Step3: React.FC<{ zkSig?: string; onMetaSigChange: (sig: string) => void; next: () => void }> = ({ @@ -61,8 +62,8 @@ const Step3: React.FC<{ zkSig?: string; onMetaSigChange: (sig: string) => void; - - + + diff --git a/packages/page-did/src/eth-bind/Step4.tsx b/packages/page-did/src/eth-bind/Step4.tsx index 0a8ac04c..3ac20e0e 100644 --- a/packages/page-did/src/eth-bind/Step4.tsx +++ b/packages/page-did/src/eth-bind/Step4.tsx @@ -9,7 +9,7 @@ import { zCloakSBTAbi, ZKSBT_ADDRESS, ZKSBT_CHAIN_ID } from '@credential/app-con import { ButtonEnableMetamask, useAccount, useContractWrite } from '@credential/react-components'; import { DidsContext } from '@credential/react-dids'; -import TextWithBg from './TextWithBg'; +import SigItem from './SigItem'; const Step4: React.FC<{ zkSig?: string; @@ -46,8 +46,8 @@ const Step4: React.FC<{ return ( <> - - + + Publish diff --git a/packages/page-did/src/eth-bind/TextWithBg.tsx b/packages/page-did/src/eth-bind/TextWithBg.tsx index 2303d7b7..1ca83393 100644 --- a/packages/page-did/src/eth-bind/TextWithBg.tsx +++ b/packages/page-did/src/eth-bind/TextWithBg.tsx @@ -11,7 +11,7 @@ const TextWithBg: React.FC< return ( {label && ( - + {label} )} @@ -25,7 +25,7 @@ const TextWithBg: React.FC< wordWrap: 'break-word' }} > - {value && {value}} + {value && {value}} {children} diff --git a/packages/page-sbt-event/src/Banner.tsx b/packages/page-sbt-event/src/Banner.tsx new file mode 100644 index 00000000..d31bd6b5 --- /dev/null +++ b/packages/page-sbt-event/src/Banner.tsx @@ -0,0 +1,54 @@ +// Copyright 2021-2023 zcloak authors & contributors +// SPDX-License-Identifier: Apache-2.0 + +import { Box, Typography } from '@mui/material'; +import React from 'react'; + +export const Banner: React.FC<{ onClick?: () => void }> = ({ onClick }) => { + const isClick = Boolean(onClick); + + return ( + + + zkKYC Event + + + Supported by Chaintool, zCloak Network + + + ); +}; + +export default React.memo(Banner); diff --git a/packages/page-sbt-event/src/index.tsx b/packages/page-sbt-event/src/index.tsx index 9869b270..c2970662 100644 --- a/packages/page-sbt-event/src/index.tsx +++ b/packages/page-sbt-event/src/index.tsx @@ -1,8 +1,9 @@ // Copyright 2021-2023 zcloak authors & contributors // SPDX-License-Identifier: Apache-2.0 -import { Box, Container, Typography } from '@mui/material'; +import { Box, Container } from '@mui/material'; +import Banner from './Banner'; import Introduction from './Introduction'; import MainStep from './MainSteps'; import OptionalStep from './OptionalStep'; @@ -36,45 +37,4 @@ const PageSbtEvent = () => { ); }; -const Banner = () => { - return ( - - - zkKYC Event - - - Supported by Chaintool, zCloak Network - - - ); -}; - export default PageSbtEvent;