From 68d0f9b8d01ea968d2c11db691483db428010924 Mon Sep 17 00:00:00 2001 From: marcuspang Date: Wed, 2 Aug 2023 23:21:41 +0200 Subject: [PATCH] feat: show wallet on project create page --- components/NavBar.tsx | 112 ++++++++++++++------------------- components/NavBarListItem.tsx | 32 ++++++++++ components/Wallet.tsx | 8 +-- constants/whitelist.ts | 5 ++ pages/project/create/index.tsx | 14 +++-- 5 files changed, 97 insertions(+), 74 deletions(-) create mode 100644 components/NavBarListItem.tsx create mode 100644 constants/whitelist.ts diff --git a/components/NavBar.tsx b/components/NavBar.tsx index 1fbc0ff..6ee7744 100644 --- a/components/NavBar.tsx +++ b/components/NavBar.tsx @@ -1,43 +1,16 @@ -import { cn } from "@/lib/utils"; import { MenuIcon } from "lucide-react"; import Link from "next/link"; -import { ComponentPropsWithoutRef, ElementRef, forwardRef } from "react"; import { Button } from "./ui/button"; import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, navigationMenuTriggerStyle } from "./ui/navigation-menu"; -import { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "./ui/sheet"; -import { Dialog } from "./ui/dialog"; +import { Sheet, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "./ui/sheet"; +import dynamic from "next/dynamic"; +import { NavBarListItem } from "./NavBarListItem"; +import { useRouter } from "next/router"; -// const WalletNoSSR = dynamic(() => import("./Wallet").then((res) => res.Wallet)); - -const ListItem = forwardRef< - ElementRef<"a">, - ComponentPropsWithoutRef<"a"> ->(({ className, title, children, ...props }, ref) => { - return ( -
  • - - - -
    {title}
    -

    - {children} -

    -     -     - -
    • - ) -}) -ListItem.displayName = "ListItem" +const WalletNoSSR = dynamic(() => import("./Wallet").then((res) => res.Wallet)); export function NavBar() { + const router = useRouter() return (
    @@ -45,7 +18,7 @@ export function NavBar() {
      - + About RADAR - - + + Read the report - +
    @@ -102,20 +75,24 @@ export function NavBar() { @@ -165,20 +142,23 @@ export function NavBar() {
    - - {/* */} - + {router.asPath === '/project/create' ? + + : <> + + + }
    diff --git a/components/NavBarListItem.tsx b/components/NavBarListItem.tsx new file mode 100644 index 0000000..4094329 --- /dev/null +++ b/components/NavBarListItem.tsx @@ -0,0 +1,32 @@ +import { cn } from "@/lib/utils"; +import Link from "next/link"; +import { ComponentPropsWithoutRef, ElementRef, forwardRef } from "react"; +import { NavigationMenuLink } from "./ui/navigation-menu"; + +export const NavBarListItem = forwardRef< + ElementRef<"a">, + ComponentPropsWithoutRef<"a"> +>(({ className, title, children, ...props }, ref) => { + return ( +
  • + + + +
    {title}
    +

    + {children} +

    +     +     + +
    • + ); +}); +NavBarListItem.displayName = "ListItem"; diff --git a/components/Wallet.tsx b/components/Wallet.tsx index b45dc8b..eedce38 100644 --- a/components/Wallet.tsx +++ b/components/Wallet.tsx @@ -26,11 +26,11 @@ function authenticateUser({ }, body: isWalletLogin ? JSON.stringify({ - public_address: address, - }) + public_address: address, + }) : JSON.stringify({ - appPubKey, - }), + appPubKey, + }), }); } diff --git a/constants/whitelist.ts b/constants/whitelist.ts new file mode 100644 index 0000000..61b569b --- /dev/null +++ b/constants/whitelist.ts @@ -0,0 +1,5 @@ +import { Address } from "viem"; + +export const WHITELISTED_ADDRESSES: Address[] = [ + "0x7730B4Cdc1B1E7a33A309AB7205411faD009C106", +]; diff --git a/pages/project/create/index.tsx b/pages/project/create/index.tsx index dc15321..da7b326 100644 --- a/pages/project/create/index.tsx +++ b/pages/project/create/index.tsx @@ -54,9 +54,10 @@ import { import { useRouter } from "next/router"; import { useContext, useEffect } from "react"; import { AuthContext } from "@/components/AuthProvider"; -import { isAddress } from "viem"; +import { isAddress, isAddressEqual } from "viem"; import { retrieveYoutubeId } from "../../../lib/retrieveYoutubeId"; import { YOUTUBE_REGEX } from "../../../constants/regex"; +import { WHITELISTED_ADDRESSES } from "@/constants/whitelist"; async function createProject( idToken: string, @@ -203,12 +204,11 @@ export default function ProjectForm() { ); const router = useRouter(); const { toast } = useToast(); - console.log({ checkoutLink, createProjectData }) async function onSubmit(values: z.infer) { // print form errors if (errors) { - console.error(errors); + console.error({ errors, values }); } try { @@ -234,6 +234,12 @@ export default function ProjectForm() { } }, [isSubmitSuccess, createProjectData, toast, router, checkoutLink]); + useEffect(() => { + if (address !== undefined && !WHITELISTED_ADDRESSES.some(addr => isAddressEqual(address, addr))) { + router.back() + } + }, [address, router]) + return (

    The Project