generated from blockmatic-icebox/powerstack
-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
wip: project landing page header updates
- Loading branch information
1 parent
4c6f898
commit 0eaf6fa
Showing
8 changed files
with
170 additions
and
296 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,47 @@ | ||
| 'use client' | ||
| import React, { useState } from 'react' | ||
| import { AnimatePresence } from 'framer-motion' | ||
| import { LucideCheck, LucideLoader2, LucideShare, LucideX } from 'lucide-react' | ||
|
|
||
| import { generateShortLink } from '@/actions' | ||
|
|
||
| export function CopyShortlinkIcon() { | ||
| const [status, setStatus] = useState< | ||
| 'default' | 'loading' | 'copied' | 'error' | ||
| >('default') | ||
|
|
||
| const copyToClipboard = async () => { | ||
| setStatus('loading') | ||
| try { | ||
| const { data, error } = await generateShortLink(location.href) | ||
| if (error || !data) throw new Error(error?.message || 'Unknown error') | ||
| navigator.clipboard.writeText(data.shortLink) | ||
| setStatus('copied') | ||
| setTimeout(() => setStatus('default'), 5000) | ||
| } catch (error) { | ||
| console.error('Failed to copy share link:', error) | ||
| setStatus('error') | ||
| setTimeout(() => setStatus('default'), 5000) | ||
| } | ||
| } | ||
|
|
||
| return ( | ||
| <button | ||
| onClick={copyToClipboard} | ||
| className="relative size-[58px] rounded-full" | ||
| > | ||
| <AnimatePresence>{iconsMap[status]}</AnimatePresence> | ||
| </button> | ||
| ) | ||
| } | ||
|
|
||
| interface CopyShortlinkIconProps { | ||
| linkPath: string | ||
| } | ||
|
|
||
| const iconsMap = { | ||
| loading: <LucideLoader2 size={26} className="animate-spin stroke-accent" />, | ||
| copied: <LucideCheck size={26} className="stroke-success" />, | ||
| error: <LucideX size={26} className="stroke-destructive" />, | ||
| default: <LucideShare size={26} className="stroke-accent" /> | ||
| } |
63 changes: 63 additions & 0 deletions
63
apps/webapp/components/routes/auction/project-data-card.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,63 @@ | ||
| import Link from 'next/link' | ||
| import { AuctionInfo } from '@/components/routes/auction/auction-info' | ||
| import { buttonVariants } from '@/components/ui/button' | ||
| import { IconDiscord, IconTelegram, IconTwitterX } from '@/components/ui/icons' | ||
| import { Project, ProjectWithAuction } from '@/lib/projects' | ||
| import { cn } from '@/lib/utils' | ||
| import { CopyShortlinkIcon } from './copy-shorlink' | ||
|
|
||
| export function ProjectDataCard({ project }: { project: Project }) { | ||
| return ( | ||
| <div className="container relative z-10 flex flex-col items-center justify-between h-full gap-16 px-4 md:px-10 lg:flex-row lg:gap-20"> | ||
| <div className="flex size-full max-h-[560px] max-w-screen-sm flex-col justify-between rounded-xl border border-card/30 bg-card/60 px-8 py-6 backdrop-blur-lg md:px-11 md:py-8"> | ||
| <h1 className="text-3xl font-bold leading-loose tracking-tighter md:text-5xl"> | ||
| {project.title} | ||
| <span className="text-xl leading-tight tracking-wide"> | ||
| {project.pitch} | ||
| </span> | ||
| </h1> | ||
| <div className="flex flex-col w-full gap-3"> | ||
| <h2 className="text-xl font-semibold">Media & Share</h2> | ||
| <div className="flex items-center gap-3 md:gap-6"> | ||
| <Link | ||
| href={`https://twitter.com/${project.twitterUsername}`} | ||
| className={cn( | ||
| buttonVariants({ variant: 'outline', size: 'icon' }), | ||
| 'p-3.5' | ||
| )} | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| > | ||
| <IconTwitterX className="size-6 fill-accent" /> | ||
| </Link> | ||
| <Link | ||
| href={`https://discord.gg/${project.discordServer}`} | ||
| className={cn( | ||
| buttonVariants({ variant: 'outline', size: 'icon' }), | ||
| 'p-3.5' | ||
| )} | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| > | ||
| <IconDiscord className="size-7 fill-accent" /> | ||
| </Link> | ||
| <Link | ||
| href={`https://t.me/${project.telegramGroup}`} | ||
| className={cn( | ||
| buttonVariants({ variant: 'outline', size: 'icon' }), | ||
| 'p-3.5' | ||
| )} | ||
| target="_blank" | ||
| rel="noopener noreferrer" | ||
| > | ||
| <IconTelegram className="size-7 fill-accent" /> | ||
| </Link> | ||
|
|
||
| <CopyShortlinkIcon /> | ||
| </div> | ||
| </div> | ||
| <AuctionInfo project={project as ProjectWithAuction} /> | ||
| </div> | ||
| </div> | ||
| ) | ||
| } |
Oops, something went wrong.