Skip to content

Commit

Permalink
feat: show wallet on project create page
Browse files Browse the repository at this point in the history
  • Loading branch information
@marcuspang
marcuspang committed Aug 2, 2023
1 parent 7f82b5b commit 68d0f9b
Show file tree
Hide file tree
Showing 5 changed files with 97 additions and 74 deletions.
112 changes: 46 additions & 66 deletions components/NavBar.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,51 +1,24 @@
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 (
<li>
<Link href="/docs" legacyBehavior passHref>
<NavigationMenuLink asChild>
<a
ref={ref}
className={cn(
"block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
className
)}
{...props}
>
<div className="text-sm font-medium leading-none">{title}</div>
<p className="line-clamp-2 text-sm leading-snug text-muted-foreground">
{children}
</p>
</a>
</NavigationMenuLink>
</Link>
</li>
)
})
ListItem.displayName = "ListItem"
const WalletNoSSR = dynamic(() => import("./Wallet").then((res) => res.Wallet));

export function NavBar() {
const router = useRouter()
return (
<header className="px-[5%] py-4 z-50 sticky top-0 bg-white border-b">
<div className="">
<div className="navbar-logo-center-container shadow-three items-center">
<div className="w-40 mr-8">
<Link href="/">
<img
className=" image-4"
className="image-4"
loading="lazy"
width="auto"
height="auto"
Expand Down Expand Up @@ -74,12 +47,12 @@ export function NavBar() {
<NavigationMenuContent>
<ul className="grid w-[400px] gap-3 p-4 md:w-[500px] md:grid-cols-2 lg:w-[600px] ">

<ListItem href="https://www.radardao.xyz/" target="_blank" title="Introduction">
<NavBarListItem href="https://www.radardao.xyz/" target="_blank" title="Introduction">
About RADAR
</ListItem>
<ListItem href="https://www.play.radardao.xyz/" target="_blank" title="Report">
</NavBarListItem>
<NavBarListItem href="https://www.play.radardao.xyz/" target="_blank" title="Report">
Read the report
</ListItem>
</NavBarListItem>
</ul>
</NavigationMenuContent>
</NavigationMenuItem>
Expand All @@ -102,20 +75,24 @@ export function NavBar() {
<nav className="w-full flex justify-end" role="navigation">
<div className="flex">
<div className="space-x-3 lg:pr-0 hidden sm:flex">
<Button variant={'ghost'} asChild>
<Link href="https://airtable.com/appGvDqIhUSP0caqo/shrMcuu3zvWEfRqGM" target="_blank">
SIGN UP FOR DROPS
</Link>
</Button>
{/* <WalletNoSSR /> */}
<Button asChild>
<Link
href="https://airtable.com/appGvDqIhUSP0caqo/shrvi09PTUP5mTSHN"
target="_blank"
>
{"SHARE YOUR PROJECT"}
</Link>
</Button>
{router.asPath === '/project/create' ?
<WalletNoSSR />
:
<>
<Button variant={'ghost'} asChild>
<Link href="https://airtable.com/appGvDqIhUSP0caqo/shrMcuu3zvWEfRqGM" target="_blank">
SIGN UP FOR DROPS
</Link>
</Button>
<Button asChild>
<Link
href="https://airtable.com/appGvDqIhUSP0caqo/shrvi09PTUP5mTSHN"
target="_blank"
>
{"SHARE YOUR PROJECT"}
</Link>
</Button>
</>}
</div>
</div>
</nav>
Expand Down Expand Up @@ -165,20 +142,23 @@ export function NavBar() {
</div>
<SheetFooter>
<div className="flex justify-between flex-col space-y-2 w-full">
<Button variant={'ghost'} asChild>
<Link href="https://airtable.com/appGvDqIhUSP0caqo/shrMcuu3zvWEfRqGM" target="_blank">
SIGN UP FOR DROPS
</Link>
</Button>
{/* <WalletNoSSR /> */}
<Button asChild className="w-full">
<Link
href="https://airtable.com/appGvDqIhUSP0caqo/shrvi09PTUP5mTSHN"
target="_blank"
>
{"SHARE YOUR PROJECT"}
</Link>
</Button>
{router.asPath === '/project/create' ?
<WalletNoSSR />
: <>
<Button variant={'ghost'} asChild>
<Link href="https://airtable.com/appGvDqIhUSP0caqo/shrMcuu3zvWEfRqGM" target="_blank">
SIGN UP FOR DROPS
</Link>
</Button>
<Button asChild className="w-full">
<Link
href="https://airtable.com/appGvDqIhUSP0caqo/shrvi09PTUP5mTSHN"
target="_blank"
>
{"SHARE YOUR PROJECT"}
</Link>
</Button>
</>}
</div>
</SheetFooter>
</SheetContent>
Expand Down
32 changes: 32 additions & 0 deletions components/NavBarListItem.tsx
View file
Original file line number Diff line number Diff line change
@@ -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 (
<li>
<Link href="/docs" legacyBehavior passHref>
<NavigationMenuLink asChild>
<a
ref={ref}
className={cn(
"block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
className
)}
{...props}
>
<div className="text-sm font-medium leading-none">{title}</div>
<p className="line-clamp-2 text-sm leading-snug text-muted-foreground">
{children}
</p>
</a>
</NavigationMenuLink>
</Link>
</li>
);
});
NavBarListItem.displayName = "ListItem";
8 changes: 4 additions & 4 deletions components/Wallet.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,11 +26,11 @@ function authenticateUser({
},
body: isWalletLogin
? JSON.stringify({
public_address: address,
})
public_address: address,
})
: JSON.stringify({
appPubKey,
}),
appPubKey,
}),
});
}

Expand Down
5 changes: 5 additions & 0 deletions constants/whitelist.ts
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import { Address } from "viem";

export const WHITELISTED_ADDRESSES: Address[] = [
"0x7730B4Cdc1B1E7a33A309AB7205411faD009C106",
];
14 changes: 10 additions & 4 deletions pages/project/create/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand Down Expand Up @@ -203,12 +204,11 @@ export default function ProjectForm() {
);
const router = useRouter();
const { toast } = useToast();
console.log({ checkoutLink, createProjectData })

async function onSubmit(values: z.infer<typeof formSchema>) {
// print form errors
if (errors) {
console.error(errors);
console.error({ errors, values });
}

try {
Expand All @@ -234,14 +234,20 @@ 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 (
<Form {...form}>
<form
id="create-project"
onSubmit={handleSubmit(onSubmit)}
className="max-w-4xl mx-auto mt-24"
// @ts-expect-error For netlify forms
netlify
netlify="true"
>
<div className="border border-slate-200 rounded p-10 mb-10">
<h1>The Project</h1>
Expand Down

0 comments on commit 68d0f9b

Please sign in to comment.