This commit is contained in:
codebanditssss 2026-07-02 20:58:05 +05:30
parent 3ee0210809
commit e6a795fd82
5 changed files with 87 additions and 23 deletions

View File

@ -54,7 +54,7 @@ const links: LinkItemType[] = [
async function GitHubStars() {
let stars: string | null = null;
try {
const res = await fetch("https://api.github.com/repos/ComposioHQ/agent-orchestrator", {
const res = await fetch("https://api.github.com/repos/AgentWrapper/agent-orchestrator", {
next: { revalidate: 3600 },
});
if (res.ok) {
@ -104,13 +104,13 @@ export default function Layout({ children }: { children: ReactNode }) {
collapsible: true,
banner: (
<a
href="https://github.com/ComposioHQ/agent-orchestrator"
href="https://github.com/AgentWrapper/agent-orchestrator"
target="_blank"
rel="noreferrer noopener"
className="flex items-center gap-2 text-xs text-[var(--color-text-secondary)] hover:text-[var(--color-text-primary)] transition-colors py-1"
>
<GithubIcon />
<span>ComposioHQ/agent-orchestrator</span>
<span>AgentWrapper/agent-orchestrator</span>
<GitHubStars />
</a>
),

View File

@ -1,3 +1,5 @@
import { formatCompactNumber, getGitHubRepoStats } from "../lib/github-repo";
function GithubIcon({ className = "" }: { className?: string }) {
return (
<svg className={className} viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
@ -24,7 +26,9 @@ function BookIcon({ className = "" }: { className?: string }) {
);
}
export function LandingCTA() {
export async function LandingCTA() {
const { stars } = await getGitHubRepoStats();
return (
<section
id="cta"
@ -64,7 +68,7 @@ export function LandingCTA() {
style={{ color: "#081225" }}
>
<GithubIcon className="h-4 w-4" />
Star on GitHub · 7.7k
Star on GitHub · {formatCompactNumber(stars)}
<ArrowRightIcon className="h-4 w-4 transition-transform group-hover:translate-x-0.5" />
</a>
<a

View File

@ -1,6 +1,6 @@
"use client";
import { useState, useRef } from "react";
import { useEffect, useRef, useState } from "react";
import gsap from "gsap";
import { useGSAP } from "@gsap/react";
import { ScaledMockup } from "./ScaledMockup";
@ -44,6 +44,18 @@ function StarIcon({ className = "" }: { className?: string }) {
);
}
const GITHUB_REPO_API_URL = "https://api.github.com/repos/AgentWrapper/agent-orchestrator";
function formatCompactNumber(value: number): string {
if (value >= 1_000_000) {
return `${(value / 1_000_000).toFixed(1)}m`;
}
if (value >= 1_000) {
return `${(value / 1_000).toFixed(1)}k`;
}
return String(value);
}
const appProjects = [
{
name: "api-gateway",
@ -554,6 +566,38 @@ function SessionDot({ zone }: { zone: string }) {
export function LandingHero() {
const containerRef = useRef<HTMLDivElement>(null);
const [starCount, setStarCount] = useState<string | null>(null);
useEffect(() => {
let cancelled = false;
async function loadGitHubStars() {
try {
const response = await fetch(GITHUB_REPO_API_URL, {
headers: {
Accept: "application/vnd.github+json",
},
});
if (!response.ok) {
return;
}
const data = (await response.json()) as { stargazers_count?: number };
if (!cancelled && typeof data.stargazers_count === "number") {
setStarCount(formatCompactNumber(data.stargazers_count));
}
} catch {
// Keep the neutral loading placeholder if the browser cannot reach GitHub.
}
}
void loadGitHubStars();
return () => {
cancelled = true;
};
}, []);
useGSAP(
() => {
@ -606,16 +650,12 @@ export function LandingHero() {
<div className="relative z-10 mx-auto w-full max-w-[1200px] px-5 sm:px-8 lg:px-12 xl:px-16">
<div className="mx-auto text-center">
<h1 data-testid="hero-headline" className="gsap-reveal landing-hero-heading mx-auto font-sans">
<span className="block">Stop babysitting coding agents.</span>
<span className="mt-2 block">
Start merging <span className="text-[#93b4f8]">real work.</span>
<span className="landing-hero-heading-setup block">Stop babysitting agents.</span>
<span className="landing-hero-heading-action block">
Start merging <span className="landing-hero-heading-accent">real work.</span>
</span>
</h1>
<p className="gsap-reveal landing-body mx-auto mt-10">
Free, Apache 2.0 licensed, and runs on your laptop. Fork it, inspect it, and ship your first parallel agent
workflow in minutes.
</p>
<div className="gsap-reveal mt-10 flex w-full flex-col items-stretch justify-center gap-3 sm:w-auto sm:flex-row sm:items-center">
<div className="gsap-reveal mt-8 flex w-full flex-col items-stretch justify-center gap-3 sm:w-auto sm:flex-row sm:items-center">
<a
href="/docs/installation"
className="hero-pressable group inline-flex h-12 w-full items-center justify-center gap-2 rounded-[6px] border border-transparent bg-[color:var(--accent)] px-6 text-[15px] font-semibold shadow-[0_12px_32px_-18px_var(--accent-glow)] hover:brightness-[1.07] hover:shadow-[0_18px_44px_-16px_var(--accent-glow)] sm:w-auto"
@ -645,7 +685,7 @@ export function LandingHero() {
/>
</span>
<span className="gh-star-count rounded-full border border-white/10 bg-white/[0.04] px-1.5 py-0.5 text-[12px] leading-none text-[color:var(--fg-muted)]">
7.7k
{starCount ?? "..."}
</span>
</a>
</div>

View File

@ -14,7 +14,7 @@ const FALLBACK_STATS: GitHubRepoStats = {
export async function getGitHubRepoStats(): Promise<GitHubRepoStats> {
try {
const response = await fetch("https://api.github.com/repos/ComposioHQ/agent-orchestrator", {
const response = await fetch("https://api.github.com/repos/AgentWrapper/agent-orchestrator", {
next: { revalidate: 3600 },
headers: {
Accept: "application/vnd.github+json",

View File

@ -182,8 +182,8 @@ body::-webkit-scrollbar,
}
.landing-hero-section {
padding-top: clamp(160px, 16vw, 220px);
padding-bottom: clamp(100px, 12vw, 160px);
padding-top: clamp(120px, 13vw, 180px);
padding-bottom: clamp(80px, 9vw, 120px);
}
.landing-section {
@ -252,14 +252,34 @@ body::-webkit-scrollbar,
}
.landing-hero-heading {
max-width: 980px;
font-size: clamp(48px, 7vw, 80px);
font-weight: 600;
line-height: 1.02;
letter-spacing: -0.03em;
max-width: 1080px;
font-size: clamp(52px, 6.2vw, 84px);
font-weight: 650;
line-height: 0.96;
letter-spacing: 0;
color: var(--fg);
}
.landing-hero-heading-setup {
font-size: 0.74em;
font-weight: 440;
line-height: 1.08;
color: color-mix(in oklab, var(--fg) 72%, var(--fg-muted));
}
.landing-hero-heading-action {
margin-top: 0.04em;
font-size: 1em;
font-weight: 760;
line-height: 0.96;
color: var(--fg);
}
.landing-hero-heading-accent {
color: #93b4f8;
font-weight: 780;
}
.landing-body {
max-width: 65ch;
font-size: clamp(16px, 1.4vw, 18px);