diff options
| author | Hyteq <DerpsDer.es@gmail.com> | 2025-07-20 11:00:22 +0300 |
|---|---|---|
| committer | Hyteq <DerpsDer.es@gmail.com> | 2025-07-20 11:00:22 +0300 |
| commit | be1ae20d9089e81cb84a8294be76fe680a24b60f (patch) | |
| tree | 48472c1122d35f45f802bbd1c3cf2c15f653f9cf /apps/web/src/components/header.tsx | |
| parent | ede08dac416b47eac2db151969c164bdf0f06002 (diff) | |
| download | opencut-be1ae20d9089e81cb84a8294be76fe680a24b60f.tar.gz | |
format
Diffstat (limited to 'apps/web/src/components/header.tsx')
| -rw-r--r-- | apps/web/src/components/header.tsx | 140 |
1 files changed, 70 insertions, 70 deletions
diff --git a/apps/web/src/components/header.tsx b/apps/web/src/components/header.tsx index bfe314d6..a52ca4c7 100644 --- a/apps/web/src/components/header.tsx +++ b/apps/web/src/components/header.tsx @@ -1,70 +1,70 @@ -"use client";
-
-import Link from "next/link";
-import { Button } from "./ui/button";
-import { ArrowRight } from "lucide-react";
-import { HeaderBase } from "./header-base";
-import { useSession } from "@opencut/auth/client";
-import { getStars } from "@/lib/fetch-github-stars";
-import { useEffect, useState } from "react";
-import Image from "next/image";
-
-export function Header() {
- const { data: session } = useSession();
- const [star, setStar] = useState<string>("");
-
- useEffect(() => {
- const fetchStars = async () => {
- try {
- const data = await getStars();
- setStar(data);
- } catch (err) {
- console.error("Failed to fetch GitHub stars", err);
- }
- };
-
- fetchStars();
- }, []);
-
- const leftContent = (
- <Link href="/" className="flex items-center gap-3">
- <Image src="/logo.svg" alt="OpenCut Logo" width={32} height={32} />
- <span className="text-xl font-medium hidden md:block">OpenCut</span>
- </Link>
- );
-
- const rightContent = (
- <nav className="flex items-center gap-3">
- <Link href="/contributors">
- <Button variant="text" className="text-sm p-0">
- Contributors
- </Button>
- </Link>
- {process.env.NODE_ENV === "development" ? (
- <Link href="/projects">
- <Button size="sm" className="text-sm ml-4">
- Projects
- <ArrowRight className="h-4 w-4" />
- </Button>
- </Link>
- ) : (
- <Link href="https://github.com/OpenCut-app/OpenCut" target="_blank">
- <Button size="sm" className="text-sm ml-4">
- GitHub {star}+
- <ArrowRight className="h-4 w-4" />
- </Button>
- </Link>
- )}
- </nav>
- );
-
- return (
- <div className="mx-4 md:mx-0">
- <HeaderBase
- className="bg-accent border rounded-2xl max-w-3xl mx-auto mt-4 pl-4 pr-[14px]"
- leftContent={leftContent}
- rightContent={rightContent}
- />
- </div>
- );
-}
+"use client"; + +import Link from "next/link"; +import { Button } from "./ui/button"; +import { ArrowRight } from "lucide-react"; +import { HeaderBase } from "./header-base"; +import { useSession } from "@opencut/auth/client"; +import { getStars } from "@/lib/fetch-github-stars"; +import { useEffect, useState } from "react"; +import Image from "next/image"; + +export function Header() { + const { data: session } = useSession(); + const [star, setStar] = useState<string>(""); + + useEffect(() => { + const fetchStars = async () => { + try { + const data = await getStars(); + setStar(data); + } catch (err) { + console.error("Failed to fetch GitHub stars", err); + } + }; + + fetchStars(); + }, []); + + const leftContent = ( + <Link href="/" className="flex items-center gap-3"> + <Image src="/logo.svg" alt="OpenCut Logo" width={32} height={32} /> + <span className="text-xl font-medium hidden md:block">OpenCut</span> + </Link> + ); + + const rightContent = ( + <nav className="flex items-center gap-3"> + <Link href="/contributors"> + <Button variant="text" className="text-sm p-0"> + Contributors + </Button> + </Link> + {process.env.NODE_ENV === "development" ? ( + <Link href="/projects"> + <Button size="sm" className="text-sm ml-4"> + Projects + <ArrowRight className="h-4 w-4" /> + </Button> + </Link> + ) : ( + <Link href="https://github.com/OpenCut-app/OpenCut" target="_blank"> + <Button size="sm" className="text-sm ml-4"> + GitHub {star}+ + <ArrowRight className="h-4 w-4" /> + </Button> + </Link> + )} + </nav> + ); + + return ( + <div className="mx-4 md:mx-0"> + <HeaderBase + className="bg-accent border rounded-2xl max-w-3xl mx-auto mt-4 pl-4 pr-[14px]" + leftContent={leftContent} + rightContent={rightContent} + /> + </div> + ); +} |