Skip to content

Commit ad7304a

Browse files
izadoesdevizadoesdev
committed
fix: sdk
1 parent b1b9dd0 commit ad7304a

File tree

7 files changed

+422
-2
lines changed

7 files changed

+422
-2
lines changed

‎apps/docs/app/(home)/sponsors/page.tsx‎

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
import type { Metadata } from 'next';
2+
import { Footer } from '@/components/footer';
3+
import Section from '@/components/landing/section';
4+
import { Spotlight } from '@/components/landing/spotlight';
5+
import { sponsorStats, sponsors } from './sponsors-data';
6+
import SponsorsGrid from './sponsors-grid';
7+
import SponsorsHero from './sponsors-hero';
8+
9+
export const metadata: Metadata = {
10+
title: 'Sponsors | Databuddy',
11+
description:
12+
'Support Databuddy and help us build the future of privacy-first analytics',
13+
};
14+
15+
export default function SponsorsPage() {
16+
return (
17+
<div className="overflow-hidden">
18+
<Spotlight transform="translateX(-60%) translateY(-50%)" />
19+
20+
{/* Hero Section */}
21+
<Section className="overflow-hidden" customPaddings id="sponsors-hero">
22+
<SponsorsHero
23+
featuredSponsors={sponsorStats.featuredSponsors}
24+
totalSponsors={sponsorStats.totalSponsors}
25+
/>
26+
</Section>
27+
28+
{/* Current Sponsors Section */}
29+
<Section
30+
className="border-border border-t border-b bg-background/50"
31+
id="current-sponsors"
32+
>
33+
<div className="mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8">
34+
<SponsorsGrid sponsors={sponsors} />
35+
</div>
36+
</Section>
37+
38+
{/* Call to Action Section */}
39+
<Section className="bg-background/50" id="sponsor-cta">
40+
<div className="mx-auto w-full max-w-4xl px-4 text-center sm:px-6 lg:px-8">
41+
<h2 className="mb-6 font-semibold text-2xl sm:text-3xl lg:text-4xl">
42+
Ready to Support Databuddy?
43+
</h2>
44+
<p className="mx-auto mb-8 max-w-2xl text-muted-foreground text-sm sm:text-base lg:text-lg">
45+
Join our community of sponsors and help us build the future of
46+
privacy-first analytics. Your support enables us to continue
47+
developing innovative features and maintaining our open-source
48+
commitment.
49+
</p>
50+
<div className="flex flex-col gap-4 sm:flex-row sm:justify-center">
51+
<a
52+
className="inline-flex items-center justify-center rounded bg-primary px-8 py-3 font-medium text-primary-foreground transition-colors hover:bg-primary/90"
53+
href="mailto:[email protected]?subject=Sponsorship%20Inquiry"
54+
>
55+
Become a Sponsor
56+
</a>
57+
<a
58+
className="inline-flex items-center justify-center rounded border border-border bg-background px-8 py-3 font-medium transition-colors hover:bg-accent hover:text-accent-foreground"
59+
href="mailto:[email protected]?subject=Sponsorship%20Questions"
60+
>
61+
Ask Questions
62+
</a>
63+
</div>
64+
</div>
65+
</Section>
66+
67+
{/* Gradient Divider */}
68+
<div className="w-full">
69+
<div className="mx-auto h-px max-w-6xl bg-gradient-to-r from-transparent via-border/30 to-transparent" />
70+
</div>
71+
72+
{/* Footer Section */}
73+
<Footer />
74+
75+
{/* Final Gradient Divider */}
76+
<div className="w-full">
77+
<div className="mx-auto h-px max-w-6xl bg-gradient-to-r from-transparent via-border/30 to-transparent" />
78+
</div>
79+
</div>
80+
);
81+
}

‎apps/docs/app/(home)/sponsors/sponsors-data.ts‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
export interface Sponsor {
2+
id: string;
3+
name: string;
4+
logo: string;
5+
website: string;
6+
tier: 'platinum' | 'gold' | 'silver' | 'bronze';
7+
description?: string;
8+
disabled?: boolean;
9+
}
10+
11+
// Sample sponsors data - replace with real data
12+
export const sponsors: Sponsor[] = [
13+
{
14+
id: 'neon',
15+
name: 'Neon',
16+
logo: 'neon.svg',
17+
website: 'https://neon.tech',
18+
tier: 'bronze',
19+
description: 'Neon is a modern database for the cloud era.',
20+
},
21+
{
22+
id: 'upstash',
23+
name: 'Upstash',
24+
logo: 'upstash.svg',
25+
website: 'https://upstash.com',
26+
tier: 'silver',
27+
description: 'Modern Serverless Data Platform for Developers',
28+
disabled: true,
29+
},
30+
];
31+
32+
// Calculate sponsor statistics
33+
export const sponsorStats = {
34+
totalSponsors: sponsors.length,
35+
featuredSponsors: sponsors.filter(
36+
(s) => s.tier === 'platinum' || s.tier === 'gold'
37+
).length,
38+
};

‎apps/docs/app/(home)/sponsors/sponsors-grid.tsx‎

Lines changed: 174 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,174 @@
1+
'use client';
2+
3+
import Image from 'next/image';
4+
import Link from 'next/link';
5+
import type { Sponsor } from './sponsors-data';
6+
7+
interface SponsorsGridProps {
8+
sponsors: Sponsor[];
9+
}
10+
11+
function SponsorCard({ sponsor }: { sponsor: Sponsor }) {
12+
const tierColors = {
13+
platinum: 'border-purple-500/30 bg-purple-500/5',
14+
gold: 'border-yellow-500/30 bg-yellow-500/5',
15+
silver: 'border-gray-400/30 bg-gray-400/5',
16+
bronze: 'border-orange-600/30 bg-orange-600/5',
17+
};
18+
19+
const tierLabels = {
20+
platinum: 'Platinum',
21+
gold: 'Gold',
22+
silver: 'Silver',
23+
bronze: 'Bronze',
24+
};
25+
26+
return (
27+
<Link
28+
className="group block"
29+
href={sponsor.website}
30+
rel="noopener noreferrer"
31+
target="_blank"
32+
>
33+
<div
34+
className={`relative h-full rounded border backdrop-blur-sm transition-all duration-300 hover:border-border/80 hover:bg-card/70 hover:shadow-lg ${tierColors[sponsor.tier]}`}
35+
>
36+
<div className="flex flex-col items-center p-8">
37+
{/* Tier Badge */}
38+
<div className="mb-4 rounded-full bg-primary/10 px-3 py-1 font-medium text-primary text-xs">
39+
{tierLabels[sponsor.tier]} Sponsor
40+
</div>
41+
42+
{/* Logo */}
43+
<div className="mb-6 flex h-24 w-full items-center justify-center">
44+
<Image
45+
alt={`${sponsor.name} logo`}
46+
className="max-h-full max-w-full object-contain transition-transform duration-300 group-hover:scale-105"
47+
height={96}
48+
src={sponsor.logo}
49+
width={200}
50+
/>
51+
</div>
52+
53+
{/* Name */}
54+
<h3 className="mb-2 text-center font-semibold text-foreground text-xl transition-colors group-hover:text-primary">
55+
{sponsor.name}
56+
</h3>
57+
58+
{/* Description */}
59+
{sponsor.description && (
60+
<p className="text-center text-muted-foreground text-sm leading-relaxed">
61+
{sponsor.description}
62+
</p>
63+
)}
64+
</div>
65+
66+
{/* Sci-fi corners */}
67+
<div className="pointer-events-none absolute inset-0">
68+
<div className="absolute top-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
69+
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
70+
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
71+
</div>
72+
<div className="-scale-x-[1] absolute top-0 right-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
73+
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
74+
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
75+
</div>
76+
<div className="-scale-y-[1] absolute bottom-0 left-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
77+
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
78+
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
79+
</div>
80+
<div className="-scale-[1] absolute right-0 bottom-0 h-2 w-2 group-hover:animate-[cornerGlitch_0.6s_ease-in-out]">
81+
<div className="absolute top-0 left-0.5 h-0.5 w-1.5 origin-left bg-foreground" />
82+
<div className="absolute top-0 left-0 h-2 w-0.5 origin-top bg-foreground" />
83+
</div>
84+
</div>
85+
</div>
86+
</Link>
87+
);
88+
}
89+
90+
export default function SponsorsGrid({ sponsors }: SponsorsGridProps) {
91+
if (sponsors.length === 0) {
92+
return (
93+
<div className="text-center">
94+
<h2 className="mb-4 font-semibold text-2xl">Our Sponsors</h2>
95+
<p className="text-muted-foreground">
96+
No sponsors to display at the moment
97+
</p>
98+
</div>
99+
);
100+
}
101+
102+
const sponsorsByTier = sponsors.reduce(
103+
(acc, sponsor) => {
104+
if (!acc[sponsor.tier]) {
105+
if (sponsor.disabled) {
106+
return acc;
107+
}
108+
acc[sponsor.tier] = [];
109+
}
110+
acc[sponsor.tier].push(sponsor);
111+
return acc;
112+
},
113+
{} as Record<string, Sponsor[]>
114+
);
115+
116+
const tierOrder: Array<keyof typeof sponsorsByTier> = [
117+
'platinum',
118+
'gold',
119+
'silver',
120+
'bronze',
121+
];
122+
123+
return (
124+
<div>
125+
{/* Header */}
126+
<div className="mb-12 text-center">
127+
<h2 className="mb-4 font-semibold text-2xl sm:text-3xl lg:text-4xl">
128+
Our Sponsors
129+
</h2>
130+
<p className="mx-auto max-w-2xl text-muted-foreground text-sm sm:text-base lg:text-lg">
131+
Thank you to these amazing companies and individuals for supporting
132+
our mission
133+
</p>
134+
</div>
135+
136+
{/* Sponsors by Tier */}
137+
<div className="space-y-16">
138+
{tierOrder.map((tier) => {
139+
const tierSponsors = sponsorsByTier[tier];
140+
if (!tierSponsors || tierSponsors.length === 0) {
141+
return null;
142+
}
143+
144+
const tierLabels = {
145+
platinum: 'Platinum Sponsors',
146+
gold: 'Gold Sponsors',
147+
silver: 'Silver Sponsors',
148+
bronze: 'Bronze Sponsors',
149+
};
150+
151+
const gridCols = {
152+
platinum: 'grid-cols-1 sm:grid-cols-2 lg:grid-cols-2',
153+
gold: 'grid-cols-1 sm:grid-cols-2 lg:grid-cols-3',
154+
silver: 'grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
155+
bronze: 'grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4',
156+
};
157+
158+
return (
159+
<div key={tier}>
160+
<h3 className="mb-8 text-center font-semibold text-xl sm:text-2xl">
161+
{tierLabels[tier]}
162+
</h3>
163+
<div className={`grid gap-6 ${gridCols[tier]}`}>
164+
{tierSponsors.map((sponsor) => (
165+
<SponsorCard key={sponsor.id} sponsor={sponsor} />
166+
))}
167+
</div>
168+
</div>
169+
);
170+
})}
171+
</div>
172+
</div>
173+
);
174+
}

0 commit comments

Comments
 (0)