- {post.title} -
-{post.excerpt}
-
- {post.date}
- •
- {post.readTime}
-
-
-
@@ -155,100 +129,16 @@ export default function Home() {
{/* Leaderboard Section */}
-
-
-
- {/* Upload Modal */}
- {showUploadModal && (
-
- setShowUpdatesModal(false)} />
diff --git a/src/app/profile/[username]/page.tsx b/src/app/profile/[username]/page.tsx
index ee02ed2..bfb0dc3 100644
--- a/src/app/profile/[username]/page.tsx
+++ b/src/app/profile/[username]/page.tsx
@@ -1,7 +1,6 @@
"use client";
-import { useQuery } from "convex/react";
-import { api } from "../../../../convex/_generated/api";
+import { useQuery } from "@/hooks/useApi";
import { useParams } from "next/navigation";
import { motion } from "framer-motion";
import {
@@ -18,7 +17,7 @@ export default function ProfilePage() {
const username = decodeURIComponent(params.username as string);
const [selectedTimeRange, setSelectedTimeRange] = useState<"7d" | "30d" | "all">("30d");
- const profileData = useQuery(api.submissions.getProfile, { username });
+ const profileData = useQuery(`/api/profile/${username}`);
if (profileData === undefined) {
return (
diff --git a/src/app/providers.tsx b/src/app/providers.tsx
index 8717fc9..0f65557 100644
--- a/src/app/providers.tsx
+++ b/src/app/providers.tsx
@@ -1,16 +1,11 @@
"use client";
-import { ConvexProvider, ConvexReactClient } from "convex/react";
-import { SessionProvider } from "next-auth/react";
import { ReactNode } from "react";
-import { clientEnv } from "@/lib/env";
-
-const convex = new ConvexReactClient(clientEnv.NEXT_PUBLIC_CONVEX_URL);
export function Providers({ children }: { children: ReactNode }) {
return (
-
- {children}
-
+ <>
+ {children}
+
);
}
\ No newline at end of file
diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
deleted file mode 100644
index c9041c5..0000000
--- a/src/components/FileUpload.tsx
+++ /dev/null
@@ -1,284 +0,0 @@
-"use client";
-
-import { useState, useCallback } from "react";
-import { useDropzone } from "react-dropzone";
-import { motion, AnimatePresence } from "framer-motion";
-import { Upload, FileJson, CheckCircle, AlertCircle, Loader2, Github } from "lucide-react";
-import { useMutation } from "convex/react";
-import { api } from "../../convex/_generated/api";
-import { useSession, signIn } from "next-auth/react";
-import { formatNumber, formatCurrency } from "@/lib/utils";
-
-interface CCData {
- daily: Array<{
- date: string;
- inputTokens: number;
- outputTokens: number;
- cacheCreationTokens: number;
- cacheReadTokens: number;
- totalTokens: number;
- totalCost: number;
- modelsUsed: string[];
- modelBreakdowns?: any[];
- }>;
- totals: {
- inputTokens: number;
- outputTokens: number;
- cacheCreationTokens: number;
- cacheReadTokens: number;
- totalCost: number;
- totalTokens: number;
- };
-}
-
-interface FileUploadProps {
- onSuccess?: () => void;
-}
-
-export default function FileUpload({ onSuccess }: FileUploadProps) {
- const { data: session } = useSession();
- const [uploadState, setUploadState] = useState<"idle" | "loading" | "success" | "error">("idle");
- const [errorMessage, setErrorMessage] = useState("");
- const [parsedData, setParsedData] = useState(null);
-
- const submitMutation = useMutation(api.submissions.submit);
-
- const onDrop = useCallback((acceptedFiles: File[]) => {
- const file = acceptedFiles[0];
- if (!file) return;
-
- setUploadState("loading");
- setErrorMessage("");
-
- const reader = new FileReader();
- reader.onload = async (e) => {
- try {
- const content = e.target?.result as string;
- const data = JSON.parse(content) as CCData;
-
- // Validate the structure
- if (!data.daily || !data.totals) {
- throw new Error("Invalid cc.json format. Missing 'daily' or 'totals' field.");
- }
-
- setParsedData(data);
- setUploadState("idle");
- } catch (error) {
- setErrorMessage("Invalid file format. Please upload a valid cc.json file.");
- setUploadState("error");
- }
- };
- reader.readAsText(file);
- }, []);
-
- const { getRootProps, getInputProps, isDragActive } = useDropzone({
- onDrop,
- accept: {
- 'application/json': ['.json']
- },
- maxFiles: 1
- });
-
- const handleSubmit = async () => {
- if (!parsedData) return;
-
- setUploadState("loading");
- try {
- // Submit will use session if available, otherwise submit as unverified
- await submitMutation({
- username: session?.user?.username || "anonymous",
- githubUsername: session?.user?.username,
- githubName: session?.user?.name,
- githubAvatar: session?.user?.image,
- source: session ? "oauth" : "cli",
- verified: !!session,
- ccData: parsedData,
- });
- setUploadState("success");
- setParsedData(null);
-
- // Call onSuccess callback after successful submission
- setTimeout(() => {
- onSuccess?.();
- }, 1500);
- } catch (error) {
- setErrorMessage(error instanceof Error ? error.message : "Failed to submit");
- setUploadState("error");
- }
- };
-
- return (
- ("cost");
- const [showShareCard, setShowShareCard] = useState(null);
- const [dateFrom, setDateFrom] = useState("");
- const [dateTo, setDateTo] = useState("");
+ const [showShareCard, setShowShareCard] = useState(null);
const [showFilters, setShowFilters] = useState(false);
const [page, setPage] = useState(0);
- const { data: session } = useSession();
const ITEMS_PER_PAGE = 25;
- const submissions = useQuery(api.submissions.getLeaderboard, {
+ const submissions = useQuery("/api/leaderboard", {
sortBy,
limit: 200, // Fetch more to paginate client-side
dateFrom: dateFrom || undefined,
@@ -240,12 +242,11 @@ export default function Leaderboard() {
{paginatedSubmissions.map((submission, index) => {
const actualRank = page * ITEMS_PER_PAGE + index + 1;
- const isCurrentUser = session?.user?.username === submission.githubUsername ||
- session?.user?.email === submission.username;
+ const isCurrentUser = false; // No authentication system anymore
return (
setShowShareCard(submission._id)}
+ onClick={() => setShowShareCard(submission.id)}
className="p-1.5 rounded-lg hover:bg-card/50 transition-all opacity-0 group-hover:opacity-100"
title="Share your rank"
>
@@ -362,12 +336,11 @@ export default function Leaderboard() {
- ) : submission.githubUsername ? (
- 
- ) : (
-
{isCurrentUser && (
setShowShareCard(submission._id)}
+ onClick={() => setShowShareCard(submission.id)}
className="p-1.5 -mr-1 flex-shrink-0"
>
-
-
-
-
- {/* Mobile Navigation */}
-
-
- {mobileMenuOpen && (
-
-
- )}
-
-
-
- );
-}
\ No newline at end of file
diff --git a/src/hooks/useApi.ts b/src/hooks/useApi.ts
new file mode 100644
index 0000000..21a98e2
--- /dev/null
+++ b/src/hooks/useApi.ts
@@ -0,0 +1,45 @@
+import { useState, useEffect } from 'react';
+
+export function useQuery(url: string, params?: Record) {
+ const [data, setData] = useState(undefined);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+
+ useEffect(() => {
+ const fetchData = async () => {
+ try {
+ setLoading(true);
+ const searchParams = new URLSearchParams();
+
+ if (params) {
+ Object.entries(params).forEach(([key, value]) => {
+ if (value !== undefined && value !== null) {
+ searchParams.append(key, String(value));
+ }
+ });
+ }
+
+ const queryString = searchParams.toString();
+ const fetchUrl = queryString ? `${url}?${queryString}` : url;
+
+ const response = await fetch(fetchUrl);
+ if (!response.ok) {
+ throw new Error(`HTTP error! status: ${response.status}`);
+ }
+
+ const result = await response.json();
+ setData(result);
+ setError(null);
+ } catch (err) {
+ setError(err instanceof Error ? err : new Error('Unknown error'));
+ setData(undefined);
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ fetchData();
+ }, [url, JSON.stringify(params)]);
+
+ return data;
+}
\ No newline at end of file
diff --git a/src/lib/db/index.ts b/src/lib/db/index.ts
new file mode 100644
index 0000000..bcc2507
--- /dev/null
+++ b/src/lib/db/index.ts
@@ -0,0 +1,23 @@
+import postgres from 'postgres';
+import { drizzle } from 'drizzle-orm/postgres-js';
+import * as schema from './schema';
+
+let db: ReturnType | null = null;
+
+export function getDb() {
+ if (!db) {
+ const connectionString = process.env.DATABASE_URL;
+
+ if (!connectionString) {
+ throw new Error('DATABASE_URL environment variable is required');
+ }
+
+ const client = postgres(connectionString);
+ db = drizzle(client, { schema });
+ }
+
+ return db;
+}
+
+// For backwards compatibility
+export { getDb as db };
\ No newline at end of file
diff --git a/src/lib/db/operations.ts b/src/lib/db/operations.ts
new file mode 100644
index 0000000..7ec2af2
--- /dev/null
+++ b/src/lib/db/operations.ts
@@ -0,0 +1,379 @@
+import { getDb } from './index';
+import { submissions, profiles, type Submission, type Profile } from './schema';
+import { eq, desc, and, or, gte, lte, isNotNull, isNull } from 'drizzle-orm';
+
+// Submission operations
+export async function createSubmission(data: {
+ username: string;
+ email: string;
+ source: 'cli' | 'web';
+ verified: boolean;
+ ccData: {
+ totals: {
+ inputTokens: number;
+ outputTokens: number;
+ cacheCreationTokens: number;
+ cacheReadTokens: number;
+ totalCost: number;
+ totalTokens: number;
+ };
+ daily: Array<{
+ date: string;
+ inputTokens: number;
+ outputTokens: number;
+ cacheCreationTokens: number;
+ cacheReadTokens: number;
+ totalTokens: number;
+ totalCost: number;
+ modelsUsed: string[];
+ }>;
+ };
+}) {
+ const { username, email, source, verified, ccData } = data;
+
+ // Data validation (similar to Convex logic)
+ const calculatedTotalTokens = ccData.totals.inputTokens +
+ ccData.totals.outputTokens +
+ ccData.totals.cacheCreationTokens +
+ ccData.totals.cacheReadTokens;
+
+ if (Math.abs(calculatedTotalTokens - ccData.totals.totalTokens) > 1) {
+ throw new Error("Token totals don't match. Please use official ccusage tool.");
+ }
+
+ // Extract unique models
+ const modelsUsed = Array.from(
+ new Set(ccData.daily.flatMap((day) => day.modelsUsed))
+ );
+
+ // Sort dates to ensure consistent range
+ const dates = ccData.daily.map((d) => d.date).sort();
+ const dateRange = {
+ start: dates[0] || "",
+ end: dates[dates.length - 1] || "",
+ };
+
+ // Check for existing submission
+ const existingSubmissions = await getDb()
+ .select()
+ .from(submissions)
+ .where(eq(submissions.email, email));
+
+ let existingSubmission = null;
+ for (const submission of existingSubmissions) {
+ const existingSource = submission.source || "oauth";
+ if (existingSource !== source) continue;
+
+ const existingStart = submission.dateRange.start;
+ const existingEnd = submission.dateRange.end;
+ const newStart = dateRange.start;
+ const newEnd = dateRange.end;
+
+ if (existingStart <= newEnd && newStart <= existingEnd) {
+ existingSubmission = submission;
+ break;
+ }
+ }
+
+ let submissionId: number;
+
+ if (existingSubmission) {
+ // Merge logic would go here (simplified for now)
+ const [updated] = await getDb()
+ .update(submissions)
+ .set({
+ username: email, // Keep for backwards compatibility
+ email,
+ totalTokens: ccData.totals.totalTokens,
+ totalCost: ccData.totals.totalCost.toString(),
+ inputTokens: ccData.totals.inputTokens,
+ outputTokens: ccData.totals.outputTokens,
+ cacheCreationTokens: ccData.totals.cacheCreationTokens,
+ cacheReadTokens: ccData.totals.cacheReadTokens,
+ dateRange,
+ modelsUsed,
+ dailyBreakdown: ccData.daily,
+ submittedAt: new Date(),
+ verified,
+ source,
+ })
+ .where(eq(submissions.id, existingSubmission.id))
+ .returning();
+
+ submissionId = updated.id;
+ } else {
+ const [newSubmission] = await getDb()
+ .insert(submissions)
+ .values({
+ username: email, // Keep for backwards compatibility
+ email,
+ totalTokens: ccData.totals.totalTokens,
+ totalCost: ccData.totals.totalCost.toString(),
+ inputTokens: ccData.totals.inputTokens,
+ outputTokens: ccData.totals.outputTokens,
+ cacheCreationTokens: ccData.totals.cacheCreationTokens,
+ cacheReadTokens: ccData.totals.cacheReadTokens,
+ dateRange,
+ modelsUsed,
+ dailyBreakdown: ccData.daily,
+ verified,
+ source,
+ })
+ .returning();
+
+ submissionId = newSubmission.id;
+ }
+
+ // Update or create profile
+ const existingProfile = await getDb()
+ .select()
+ .from(profiles)
+ .where(eq(profiles.email, email))
+ .limit(1);
+
+ if (existingProfile.length > 0) {
+ const updates: any = {
+ bestSubmission: submissionId,
+ username: email, // Keep for backwards compatibility
+ };
+
+ if (!existingSubmission) {
+ updates.totalSubmissions = existingProfile[0].totalSubmissions + 1;
+ }
+
+ await getDb()
+ .update(profiles)
+ .set(updates)
+ .where(eq(profiles.id, existingProfile[0].id));
+ } else {
+ await getDb()
+ .insert(profiles)
+ .values({
+ username: email, // Keep for backwards compatibility
+ email,
+ totalSubmissions: 1,
+ bestSubmission: submissionId,
+ });
+ }
+
+ return submissionId;
+}
+
+export async function getLeaderboard(options: {
+ sortBy?: 'cost' | 'tokens';
+ limit?: number;
+ dateFrom?: string;
+ dateTo?: string;
+ includeFlagged?: boolean;
+} = {}) {
+ const { sortBy = 'cost', limit = 100, dateFrom, dateTo, includeFlagged = false } = options;
+
+ // 1. Get unique users via profiles table first to solve duplicates issue
+ const allProfiles = await getDb()
+ .select({
+ submissionId: profiles.bestSubmission
+ })
+ .from(profiles)
+ .where(isNotNull(profiles.bestSubmission));
+
+ if (allProfiles.length === 0) return [];
+
+ const submissionIds = allProfiles.map(p => p.submissionId!);
+
+ // 2. Fetch the actual submissions
+ let query = getDb().select().from(submissions).where(
+ and(
+ // Only get the best submission for each profile
+ or(...submissionIds.map(id => eq(submissions.id, id))),
+ // Filter out flagged if needed
+ includeFlagged ? undefined : or(eq(submissions.flaggedForReview, false), isNull(submissions.flaggedForReview))
+ )
+ );
+
+ const results = await query;
+
+ // 3. Process data for date filtering and recalculation
+ const processedResults = results.map(sub => {
+ // If no date filter, return as is (but ensure numbers are numbers)
+ if (!dateFrom && !dateTo) {
+ return {
+ ...sub,
+ totalCost: parseFloat(sub.totalCost),
+ totalTokens: sub.totalTokens
+ };
+ }
+
+ // Filter daily breakdown
+ const filteredDaily = sub.dailyBreakdown.filter(day => {
+ if (dateFrom && day.date < dateFrom) return false;
+ if (dateTo && day.date > dateTo) return false;
+ return true;
+ });
+
+ // Recalculate totals based on filtered days
+ const newTotalCost = filteredDaily.reduce((acc, day) => acc + day.totalCost, 0);
+ const newTotalTokens = filteredDaily.reduce((acc, day) => acc + day.totalTokens, 0);
+
+ return {
+ ...sub,
+ totalCost: newTotalCost,
+ totalTokens: newTotalTokens,
+ dailyBreakdown: filteredDaily,
+ // Helper to indicate this is a filtered view if needed
+ isFiltered: true
+ };
+ }).filter(sub => sub.totalCost > 0 || sub.totalTokens > 0);
+
+ // 4. Sort based on the (potentially recalculated) values
+ processedResults.sort((a, b) => {
+ if (sortBy === 'cost') {
+ return b.totalCost - a.totalCost;
+ } else {
+ return b.totalTokens - a.totalTokens;
+ }
+ });
+
+ // 5. Apply limit
+ // Convert totalCost back to string to match expected return type signature if needed
+ // or keep as number if upstream handles it.
+ // The schema defines totalCost as decimal string, but for sorting we needed numbers.
+ // Let's cast back to string to be safe with existing types if strictly needed,
+ // but usually for JSON response numbers are fine or better.
+ // However, the original type has totalCost as string (decimal).
+ // Let's keep it consistent with the return type expected by the frontend (it seems to handle raw JSON)
+
+ return processedResults.slice(0, limit);
+}
+
+export async function getSubmission(id: number) {
+ const result = await getDb()
+ .select()
+ .from(submissions)
+ .where(eq(submissions.id, id))
+ .limit(1);
+
+ return result[0] || null;
+}
+
+export async function getProfile(username: string) {
+ const profile = await getDb()
+ .select()
+ .from(profiles)
+ .where(eq(profiles.username, username))
+ .limit(1);
+
+ if (!profile.length) return null;
+
+ const userSubmissions = await getDb()
+ .select()
+ .from(submissions)
+ .where(eq(submissions.username, username))
+ .orderBy(desc(submissions.submittedAt));
+
+ return {
+ ...profile[0],
+ submissions: userSubmissions,
+ };
+}
+
+export async function getFlaggedSubmissions() {
+ return await getDb()
+ .select()
+ .from(submissions)
+ .where(eq(submissions.flaggedForReview, true))
+ .orderBy(desc(submissions.submittedAt));
+}
+
+export async function updateFlagStatus(submissionId: number, flagged: boolean, reason?: string) {
+ const submission = await getSubmission(submissionId);
+ if (!submission) {
+ throw new Error("Submission not found");
+ }
+
+ const updates: any = {
+ flaggedForReview: flagged,
+ };
+
+ if (flagged && reason) {
+ updates.flagReasons = [...(submission.flagReasons || []), reason];
+ } else if (!flagged) {
+ updates.flagReasons = null;
+ }
+
+ await getDb()
+ .update(submissions)
+ .set(updates)
+ .where(eq(submissions.id, submissionId));
+
+ return { success: true };
+}
+
+export async function getGlobalStats(options: { dateFrom?: string; dateTo?: string } = {}) {
+ const { dateFrom, dateTo } = options;
+ const allSubmissions = await getDb().select().from(submissions);
+
+ // Filter and recalculate based on date range if provided
+ const processedSubmissions = allSubmissions.map(sub => {
+ if (!dateFrom && !dateTo) {
+ return {
+ ...sub,
+ totalCost: parseFloat(sub.totalCost),
+ totalTokens: sub.totalTokens
+ };
+ }
+
+ const filteredDaily = sub.dailyBreakdown.filter(day => {
+ if (dateFrom && day.date < dateFrom) return false;
+ if (dateTo && day.date > dateTo) return false;
+ return true;
+ });
+
+ return {
+ ...sub,
+ totalCost: filteredDaily.reduce((acc, day) => acc + day.totalCost, 0),
+ totalTokens: filteredDaily.reduce((acc, day) => acc + day.totalTokens, 0),
+ dailyBreakdown: filteredDaily,
+ isFiltered: true
+ };
+ }).filter(sub => sub.totalCost > 0 || sub.totalTokens > 0);
+
+ const uniqueUsers = new Set(processedSubmissions.map(s => s.username)).size;
+ const totalCost = processedSubmissions.reduce((acc, s) => acc + s.totalCost, 0);
+ const totalTokens = processedSubmissions.reduce((acc, s) => acc + s.totalTokens, 0);
+
+ const topSubmission = processedSubmissions.sort((a, b) => b.totalCost - a.totalCost)[0];
+ const avgCostPerUser = uniqueUsers > 0 ? totalCost / uniqueUsers : 0;
+
+ const modelUsage = allSubmissions.reduce((acc, s) => {
+ // Note: Model usage is hard to filter by date from current schema without iterating days
+ // For now, we'll keep global model usage or we could iterate filtered days
+ const submissionToUse = dateFrom || dateTo ? processedSubmissions.find(p => p.id === s.id) : s;
+
+ if (submissionToUse && submissionToUse.dailyBreakdown) {
+ submissionToUse.dailyBreakdown.forEach((day: any) => {
+ if (day.modelsUsed) {
+ day.modelsUsed.forEach((model: string) => {
+ const key = model.includes("opus") ? "opus" : "sonnet";
+ acc[key] = (acc[key] || 0) + 1;
+ });
+ }
+ });
+ }
+ return acc;
+ }, {} as Record);
+
+ const totalDays = processedSubmissions.reduce((acc, s) => acc + s.dailyBreakdown.length, 0);
+
+ return {
+ totalUsers: uniqueUsers,
+ totalSubmissions: processedSubmissions.length,
+ totalCost,
+ totalTokens,
+ avgCostPerUser,
+ topCost: topSubmission ? topSubmission.totalCost : 0,
+ topUser: topSubmission?.username || "N/A",
+ modelUsage,
+ totalDays,
+ avgTokensPerUser: uniqueUsers > 0 ? totalTokens / uniqueUsers : 0,
+ };
+}
\ No newline at end of file
diff --git a/src/lib/db/schema.ts b/src/lib/db/schema.ts
new file mode 100644
index 0000000..598051b
--- /dev/null
+++ b/src/lib/db/schema.ts
@@ -0,0 +1,56 @@
+import { pgTable, text, integer, timestamp, boolean, jsonb, index, serial, decimal } from 'drizzle-orm/pg-core';
+
+export const submissions = pgTable('submissions', {
+ id: serial('id').primaryKey(),
+ username: text('username').notNull(), // Keep for backwards compatibility, will be email
+ email: text('email').notNull(),
+ totalTokens: integer('total_tokens').notNull(),
+ totalCost: decimal('total_cost', { precision: 10, scale: 4 }).notNull(),
+ inputTokens: integer('input_tokens').notNull(),
+ outputTokens: integer('output_tokens').notNull(),
+ cacheCreationTokens: integer('cache_creation_tokens').notNull(),
+ cacheReadTokens: integer('cache_read_tokens').notNull(),
+ dateRange: jsonb('date_range').$type<{
+ start: string;
+ end: string;
+ }>().notNull(),
+ modelsUsed: jsonb('models_used').$type().notNull(),
+ dailyBreakdown: jsonb('daily_breakdown').$type>().notNull(),
+ submittedAt: timestamp('submitted_at').notNull().defaultNow(),
+ verified: boolean('verified').notNull().default(false),
+ source: text('source', { enum: ['cli', 'web'] }),
+ flaggedForReview: boolean('flagged_for_review').default(false),
+ flagReasons: jsonb('flag_reasons').$type(),
+}, (table) => ({
+ totalCostIdx: index('submissions_total_cost_idx').on(table.totalCost),
+ totalTokensIdx: index('submissions_total_tokens_idx').on(table.totalTokens),
+ submittedAtIdx: index('submissions_submitted_at_idx').on(table.submittedAt),
+ usernameIdx: index('submissions_username_idx').on(table.username),
+ emailIdx: index('submissions_email_idx').on(table.email),
+}));
+
+export const profiles = pgTable('profiles', {
+ id: serial('id').primaryKey(),
+ username: text('username').notNull(), // Keep for backwards compatibility, will be email
+ email: text('email').notNull(),
+ totalSubmissions: integer('total_submissions').notNull().default(0),
+ bestSubmission: integer('best_submission').references(() => submissions.id),
+ createdAt: timestamp('created_at').notNull().defaultNow(),
+}, (table) => ({
+ usernameIdx: index('profiles_username_idx').on(table.username),
+ emailIdx: index('profiles_email_idx').on(table.email),
+}));
+
+export type Submission = typeof submissions.$inferSelect;
+export type InsertSubmission = typeof submissions.$inferInsert;
+export type Profile = typeof profiles.$inferSelect;
+export type InsertProfile = typeof profiles.$inferInsert;
\ No newline at end of file
diff --git a/src/lib/env.ts b/src/lib/env.ts
index bc8f811..2953cc2 100644
--- a/src/lib/env.ts
+++ b/src/lib/env.ts
@@ -1,23 +1,17 @@
// Client-side environment variables
export const clientEnv = {
- NEXT_PUBLIC_CONVEX_URL: process.env.NEXT_PUBLIC_CONVEX_URL!,
+ // No client-side env vars needed for PostgreSQL setup
} as const;
-// Server-side environment variables (only available in server components/API routes)
+// Server-side environment variables (only available in server components/API routes)
export const serverEnv = {
- GITHUB_ID: process.env.GITHUB_ID!,
- GITHUB_SECRET: process.env.GITHUB_SECRET!,
- NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET!,
- NEXTAUTH_URL: process.env.NEXTAUTH_URL!,
+ DATABASE_URL: process.env.DATABASE_URL || '',
} as const;
// Environment variable validation for server-side
export function validateServerEnv() {
const requiredEnvVars = [
- 'GITHUB_ID',
- 'GITHUB_SECRET',
- 'NEXTAUTH_SECRET',
- 'NEXTAUTH_URL'
+ 'DATABASE_URL'
];
const missingVars = requiredEnvVars.filter(
@@ -25,9 +19,10 @@ export function validateServerEnv() {
);
if (missingVars.length > 0) {
- throw new Error(
- `Missing required environment variables: ${missingVars.join(', ')}\n` +
- 'Please check your .env.local file.'
+ console.warn(
+ `Missing environment variables: ${missingVars.join(', ')}\n` +
+ 'Database connection will not function without these variables.'
);
+ // Don't throw during build - just warn
}
}
\ No newline at end of file
diff --git a/src/types/auth.ts b/src/types/auth.ts
deleted file mode 100644
index f6ae98f..0000000
--- a/src/types/auth.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { DefaultSession } from "next-auth";
-
-declare module "next-auth" {
- interface Session {
- user: {
- username?: string;
- } & DefaultSession["user"];
- }
-
- interface User {
- username?: string;
- }
-}
-
-declare module "next-auth/jwt" {
- interface JWT {
- username?: string;
- }
-}
-
-export interface GitHubProfile {
- id: number;
- login: string;
- name: string | null;
- email: string | null;
- avatar_url: string;
-}
\ No newline at end of file
diff --git a/submit-ccusage.sh b/submit-ccusage.sh
new file mode 100644
index 0000000..5127ebc
--- /dev/null
+++ b/submit-ccusage.sh
@@ -0,0 +1,107 @@
+#!/bin/bash
+
+# Claude Code usage submission script
+# Submits cc usage data once per day with cleanup and duplicate prevention
+# Usage: submit-ccusage.sh
+
+set -e
+
+# Check if email argument is provided
+# Ensure local paths are included for cron/launchd matching user environment
+export PATH="/usr/local/bin:/opt/homebrew/bin:/opt/homebrew/sbin:/opt/homebrew/opt/node@20/bin:$PATH"
+
+if [ $# -eq 0 ]; then
+ echo "Usage: $0 "
+ echo "Example: $0 john.doe@company.com"
+ exit 1
+fi
+
+USER_EMAIL="$1"
+
+# Configuration
+SERVER_URL="http://98.81.226.83/api/submit"
+LOCK_FILE="/tmp/ccusage-submitted-$(date +%Y-%m-%d)"
+LOG_FILE="/tmp/ccusage-submit.log"
+ERROR_LOG="/tmp/ccusage-submit-error.log"
+CC_DATA_FILE="/tmp/cc-usage-$(date +%Y%m%d-%H%M%S).json"
+
+# Function to log messages
+log_message() {
+ echo "$(date '+%Y-%m-%d %H:%M:%S') - $1" | tee -a "$LOG_FILE"
+}
+
+# Function to log errors
+log_error() {
+ echo "$(date '+%Y-%m-%d %H:%M:%S') - ERROR: $1" | tee -a "$ERROR_LOG" >&2
+}
+
+# Cleanup old files (older than 7 days)
+cleanup_old_files() {
+ log_message "Cleaning up old files..."
+ find /tmp -name "ccusage-submitted-*" -mtime +7 -delete 2>/dev/null || true
+ find /tmp -name "ccusage-submit*.log" -mtime +7 -delete 2>/dev/null || true
+ log_message "Cleanup completed"
+}
+
+# Check if already submitted today
+if [ -f "$LOCK_FILE" ]; then
+ log_message "Usage data already submitted today. Skipping..."
+ cleanup_old_files
+ exit 0
+fi
+
+# Generate cc.json data using ccusage command
+log_message "Generating Claude Code usage data..."
+if ! command -v ccusage &> /dev/null; then
+ log_error "ccusage command not found. Please install with: npm install -g ccusage"
+ exit 1
+fi
+
+# Generate usage data to temp file
+if ! ccusage --json > "$CC_DATA_FILE" 2>> "$ERROR_LOG"; then
+ log_error "Failed to generate Claude Code usage data"
+ exit 1
+fi
+
+log_message "Generated usage data at: $CC_DATA_FILE"
+
+# Basic email validation
+if [[ ! "$USER_EMAIL" =~ ^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,}$ ]]; then
+ log_error "Invalid email format: $USER_EMAIL"
+ exit 1
+fi
+
+log_message "Starting Claude Code usage submission for $USER_EMAIL"
+
+# Submit the data
+if curl -X POST \
+ -H "Content-Type: application/json" \
+ -H "X-User-Email: $USER_EMAIL" \
+ -H "X-CLI-Version: automated-v1.0" \
+ --data @"$CC_DATA_FILE" \
+ --max-time 30 \
+ --silent \
+ --show-error \
+ --fail \
+ "$SERVER_URL" >> "$LOG_FILE" 2>> "$ERROR_LOG"; then
+
+ log_message "Successfully submitted Claude Code usage data"
+
+ # Create lock file to prevent duplicate submissions
+ touch "$LOCK_FILE"
+
+ # Clean up temp file after successful submission
+ rm -f "$CC_DATA_FILE"
+ log_message "Cleaned up temporary data file"
+
+else
+ log_error "Failed to submit Claude Code usage data"
+ # Clean up temp file on failure too
+ rm -f "$CC_DATA_FILE"
+ exit 1
+fi
+
+# Cleanup old files
+cleanup_old_files
+
+log_message "Script completed successfully"
\ No newline at end of file
setShowUploadModal(false)}
+
+
{/* Updates Modal */}
+
-
- )}
+
-
-
- Submit Your Stats
- -
- {/* CLI Option */}
-
-
-
-
- {/* Manual Upload Option */}
- - - Option 1: Terminal (Recommended) -
-No installation needed - npx handles everything!
-
-
- {copiedToClipboard ? (
-
- ) : (
-
- )}
-
-
- npx viberank
-
-
- Having issues?
-
-
- • Try: npx viberank@latest
• Clear cache: npx clear-npx-cache
• Set git username: git config --global user.name "YourGitHubUsername"
• Requires Node.js 14+
-
-
-
- setShowUploadModal(false)} />
-
-
-
-
-
- {/* Instructions */}
-
-
- )}
-
- {/* Status Messages */}
-
- {uploadState === "error" && (
-
-
- )}
-
- {uploadState === "success" && (
-
-
- )}
-
-
- {/* Submit Button */}
- {parsedData && uploadState !== "success" && (
-
-
-
-
- )}
-
-
- );
-}
\ No newline at end of file
diff --git a/src/components/Leaderboard.tsx b/src/components/Leaderboard.tsx
index 7eb58d8..be5db1d 100644
--- a/src/components/Leaderboard.tsx
+++ b/src/components/Leaderboard.tsx
@@ -3,27 +3,29 @@
import { useState } from "react";
import { motion, AnimatePresence } from "framer-motion";
import { Trophy, Medal, Award, DollarSign, Zap, Calendar, User, Share2, Filter, Clock, X, ChevronDown, ArrowUpRight, ChevronLeft, ChevronRight, BadgeCheck } from "lucide-react";
-import { useQuery } from "convex/react";
-import { api } from "../../convex/_generated/api";
-import { useSession } from "next-auth/react";
+import { useQuery } from "@/hooks/useApi";
import Link from "next/link";
import ShareCard from "./ShareCard";
-import { formatNumber, formatCurrency, getGitHubAvatarUrl } from "@/lib/utils";
+import { formatNumber, formatCurrency } from "@/lib/utils";
type SortBy = "cost" | "tokens";
-export default function Leaderboard() {
+interface LeaderboardProps {
+ dateFrom: string;
+ dateTo: string;
+ setDateFrom: (date: string) => void;
+ setDateTo: (date: string) => void;
+}
+
+export default function Leaderboard({ dateFrom, dateTo, setDateFrom, setDateTo }: LeaderboardProps) {
const [sortBy, setSortBy] = useState
-
-
- {/* File Upload */}
-
-
-
- Step 1: Generate your usage file
-- Run this command in your terminal to generate your Claude usage statistics: -
-
-
-
- npx ccusage --json > cc.json
-
-
- 💡 Tip: Use npx viberank instead for automatic submission (no upload needed!)
-
-
-
- {/* Verification status notice */}
- {session ? (
- Step 2: Upload the generated file
-- Drag and drop your cc.json file below, or click to browse -
-
-
- ) : (
-
- Signed in as {session.user.username || session.user?.name}
- - Your submission will be verified
-
-
-
- )}
-
-
-
-
- Submitting without verification
- - Sign in to get verified badge
-
-
-
-
-
- {/* Parsed Data Preview */}
- {parsedData && (
- - {isDragActive - ? "Drop your cc.json file here" - : "Drag and drop your cc.json file"} -
-or click to browse
-File Summary
-
-
-
- Total Cost
- ${formatCurrency(parsedData.totals.totalCost)}
-
-
- Total Tokens
- {formatNumber(parsedData.totals.totalTokens)}
-
-
- Days Tracked
- {parsedData.daily.length}
-
-
- Date Range
-
- {parsedData.daily[0]?.date} → {parsedData.daily[parsedData.daily.length - 1]?.date}
-
-
-
- {submission.githubAvatar ? (
-
- ) : submission.githubUsername ? (
-
- ) : (
-
@@ -335,7 +309,7 @@ export default function Leaderboard() {
-
- )}
+
+
{actualRank <= 3 && (
{getRankDisplay(actualRank)}
@@ -287,25 +274,12 @@ export default function Leaderboard() {
@@ -325,7 +299,7 @@ export default function Leaderboard() {
{formatNumber(submission.totalTokens)}
- {submission.githubUsername || submission.username}
+ {submission.email || submission.username}
- {submission.verified && (
-
- {submission.githubName && submission.githubName !== submission.githubUsername && (
-
-
- )}
- Verified via GitHub authentication
-
- - {submission.githubName} -
- )}- {submission.dailyBreakdown.length} days + {submission.dailyBreakdown.length} active days
{paginatedSubmissions.map((submission, index) => {
const actualRank = page * ITEMS_PER_PAGE + index + 1;
- const isCurrentUser = session?.user?.username === submission.githubUsername ||
- session?.user?.email === submission.username;
+ const isCurrentUser = false; // No authentication system anymore
return (
{actualRank}
- {submission.githubAvatar ? (
-
-
- )}
+
+
- {submission.githubUsername || submission.username}
- {submission.verified && (
-
-
- )}
+ {submission.email || submission.username}
- {submission.githubName && submission.githubName !== submission.githubUsername && (
-
- Verified via GitHub authentication
-
- - {submission.githubName} -
- )}- {submission.dailyBreakdown.length} days + {submission.dailyBreakdown.length} active days
@@ -469,7 +415,7 @@ export default function Leaderboard() { {/* Share Card Modal */} - {showShareCard && submissions && submissions.find(s => s._id === showShareCard) && ( + {showShareCard && submissions && submissions.find(s => s.id === showShareCard) && ( e.stopPropagation()}>
s._id === showShareCard) + 1}
- username={submissions.find(s => s._id === showShareCard)!.username}
- totalCost={submissions.find(s => s._id === showShareCard)!.totalCost}
- totalTokens={submissions.find(s => s._id === showShareCard)!.totalTokens}
- dateRange={submissions.find(s => s._id === showShareCard)!.dateRange}
+ rank={submissions.findIndex(s => s.id === showShareCard) + 1}
+ username={submissions.find(s => s.id === showShareCard)!.username}
+ totalCost={submissions.find(s => s.id === showShareCard)!.totalCost}
+ totalTokens={submissions.find(s => s.id === showShareCard)!.totalTokens}
+ dateRange={submissions.find(s => s.id === showShareCard)!.dateRange}
onClose={() => setShowShareCard(null)}
/>
diff --git a/src/components/NavBar.tsx b/src/components/NavBar.tsx
deleted file mode 100644
index 8aa8c49..0000000
--- a/src/components/NavBar.tsx
+++ /dev/null
@@ -1,282 +0,0 @@
-"use client";
-
-import { useState, useEffect } from "react";
-import { motion, AnimatePresence } from "framer-motion";
-import { Trophy, Upload, Github, Sparkles, TrendingUp, Menu, X, Shield, BookOpen } from "lucide-react";
-import { useSession, signIn, signOut } from "next-auth/react";
-import Link from "next/link";
-import { usePathname } from "next/navigation";
-
-interface NavBarProps {
- onUploadClick: () => void;
- onUpdatesClick: () => void;
-}
-
-const ADMIN_USERS = ["nikshepsvn"];
-
-export default function NavBar({ onUploadClick, onUpdatesClick }: NavBarProps) {
- const [scrolled, setScrolled] = useState(false);
- const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
- const { data: session } = useSession();
- const pathname = usePathname();
-
- const isAdmin = session?.user?.username && ADMIN_USERS.includes(session.user.username);
-
- useEffect(() => {
- const handleScroll = () => {
- setScrolled(window.scrollY > 20);
- };
- window.addEventListener("scroll", handleScroll);
- return () => window.removeEventListener("scroll", handleScroll);
- }, []);
-
- const navItems = [
- { name: "Blog", href: "/blog", icon: BookOpen },
- ...(isAdmin ? [{ name: "Admin", href: "/admin", icon: Shield }] : []),
- ];
-
- return (
- <>
- {/* Desktop Navigation */}
-
- {/* Logo */}
-
-
-
-
-
- viberank
-
-
- {/* Nav Items */}
- {navItems.length > 0 && (
-
-
-
- {navItems.map((item) => {
- const isActive = pathname === item.href;
- const Icon = item.icon;
-
- return (
-
-
-
-
- );
- })}
-
- )}
-
- {/* Right side actions */}
-
- {/* Submit Button */}
-
-
-
- {/* Auth Button */}
- {session ? (
- signOut()}
- className="flex items-center gap-2 px-4 py-2 rounded-full border border-border hover:bg-accent/10 transition-colors text-sm"
- >
- 
- Sign out
-
- ) : (
- signIn("github")}
- className="px-4 py-2 rounded-full border border-border hover:bg-accent/10 transition-colors text-sm"
- >
- Sign in
-
- )}
-
- {/* Secondary actions */}
-
-
-
-
-
-
-
-
-
-
-
-
- {/* Mobile Menu */}
-
- {/* Submit Button */}
-
-
- {/* Menu Button */}
-
-
-
- {/* Admin link if applicable */}
- {navItems.map((item) => {
- const Icon = item.icon;
-
- return (
- setMobileMenuOpen(false)}
- >
-
-
-
-
- );
- })}
-
- {/* Secondary Actions */}
-
-
-
-
-
-
- {session ? (
-
- ) : (
-
- )}
-
-