diff options
| author | Maze Winther <mazewinther@gmail.com> | 2025-07-20 16:36:21 +0200 |
|---|---|---|
| committer | Maze Winther <mazewinther@gmail.com> | 2025-07-20 16:36:21 +0200 |
| commit | ba3da43728bc051aa033dc7b45042b0f0f788e63 (patch) | |
| tree | 6039c0ddd5b19c7ecbcfbc6635e2495d85bd948b /apps/web/src/components/header.tsx | |
| parent | afa8f426fbe8617980d848cdda977f2ab47b5e4e (diff) | |
| parent | baaf773b809674c07b4ab17ae3098abd768050ab (diff) | |
| download | opencut-ba3da43728bc051aa033dc7b45042b0f0f788e63.tar.gz | |
Merge branch 'staging'
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 a52ca4c7..bfe314d6 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>
+ );
+}
|