feat: added incentive credits system

This commit is contained in:
DESKTOP-RTLN3BA\$punk 2026-01-26 23:32:30 -08:00
parent d45b33e776
commit 39d65d6166
27 changed files with 587 additions and 84 deletions

View file

@ -8,11 +8,11 @@ import { useTranslations } from "next-intl";
import { useEffect, useState } from "react";
import { toast } from "sonner";
import { loginMutationAtom } from "@/atoms/auth/auth-mutation.atoms";
import { Spinner } from "@/components/ui/spinner";
import { getAuthErrorDetails, isNetworkError, shouldRetry } from "@/lib/auth-errors";
import { AUTH_TYPE } from "@/lib/env-config";
import { ValidationError } from "@/lib/error";
import { trackLoginAttempt, trackLoginFailure, trackLoginSuccess } from "@/lib/posthog/events";
import { Spinner } from "@/components/ui/spinner";
export function LocalLoginForm() {
const t = useTranslations("auth");

View file

@ -9,6 +9,7 @@ import { useEffect, useState } from "react";
import { toast } from "sonner";
import { registerMutationAtom } from "@/atoms/auth/auth-mutation.atoms";
import { Logo } from "@/components/Logo";
import { Spinner } from "@/components/ui/spinner";
import { getAuthErrorDetails, isNetworkError, shouldRetry } from "@/lib/auth-errors";
import { AUTH_TYPE } from "@/lib/env-config";
import { AppError, ValidationError } from "@/lib/error";
@ -18,7 +19,6 @@ import {
trackRegistrationSuccess,
} from "@/lib/posthog/events";
import { AmbientBackground } from "../login/AmbientBackground";
import { Spinner } from "@/components/ui/spinner";
export default function RegisterPage() {
const t = useTranslations("auth");

View file

@ -8,8 +8,8 @@ import React from "react";
import { useDocumentUploadDialog } from "@/components/assistant-ui/document-upload-popup";
import { DocumentViewer } from "@/components/document-viewer";
import { Button } from "@/components/ui/button";
import { Spinner } from "@/components/ui/spinner";
import { Checkbox } from "@/components/ui/checkbox";
import { Spinner } from "@/components/ui/spinner";
import {
Table,
TableBody,

View file

@ -1,48 +1,50 @@
"use client";
import { ExternalLink, Gift, Mail, Star, MessageSquarePlus, Share2, Check } from "lucide-react";
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { Check, ExternalLink, Gift, Loader2, Mail, Star } from "lucide-react";
import { motion } from "motion/react";
import Link from "next/link";
import { useState, useCallback } from "react";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
import { Card, CardContent } from "@/components/ui/card";
import { Separator } from "@/components/ui/separator";
import { Skeleton } from "@/components/ui/skeleton";
import type { IncentiveTaskInfo } from "@/contracts/types/incentive-tasks.types";
import { incentiveTasksApiService } from "@/lib/apis/incentive-tasks-api.service";
import { cn } from "@/lib/utils";
const GITHUB_REPO_URL = "https://github.com/MODSetter/SurfSense";
export default function MorePagesPage() {
const queryClient = useQueryClient();
const INITIAL_TASKS = [
{
id: "star",
title: "Star the repository",
reward: 100,
href: GITHUB_REPO_URL,
icon: Star,
},
{
id: "issue",
title: "Create an issue",
reward: 50,
href: `${GITHUB_REPO_URL}/issues/new/choose`,
icon: MessageSquarePlus,
},
{
id: "share",
title: "Share on social media",
reward: 50,
href: `https://twitter.com/intent/tweet?text=Check out SurfSense - an AI-powered personal knowledge base!&url=${encodeURIComponent(GITHUB_REPO_URL)}`,
icon: Share2,
},
] as const;
// Fetch tasks from API
const { data, isLoading } = useQuery({
queryKey: ["incentive-tasks"],
queryFn: () => incentiveTasksApiService.getTasks(),
});
export default function FreePagesPage() {
const [completedIds, setCompletedIds] = useState<Set<string>>(new Set());
// Mutation to complete a task
const completeMutation = useMutation({
mutationFn: incentiveTasksApiService.completeTask,
onSuccess: (response) => {
if (response.success) {
toast.success(response.message);
// Invalidate queries to refresh data
queryClient.invalidateQueries({ queryKey: ["incentive-tasks"] });
queryClient.invalidateQueries({ queryKey: ["user"] });
}
},
onError: () => {
toast.error("Failed to complete task. Please try again.");
},
});
const handleTaskClick = useCallback((taskId: string) => {
setCompletedIds((prev) => new Set(prev).add(taskId));
}, []);
const handleTaskClick = (task: IncentiveTaskInfo) => {
if (!task.completed) {
completeMutation.mutate(task.task_type);
}
};
const allCompleted = completedIds.size === INITIAL_TASKS.length;
const allCompleted = data?.tasks.every((t) => t.completed) ?? false;
return (
<div className="flex min-h-[calc(100vh-64px)] items-center justify-center px-4 py-8">
@ -55,67 +57,93 @@ export default function FreePagesPage() {
{/* Header */}
<div className="mb-6 text-center">
<Gift className="mx-auto mb-3 h-8 w-8 text-primary" />
<h2 className="text-xl font-bold tracking-tight">Get Pages</h2>
<p className="text-sm text-muted-foreground">
Complete tasks to get free additional pages
</p>
<h2 className="text-xl font-bold tracking-tight">Get More Pages</h2>
<p className="text-sm text-muted-foreground">Complete tasks to earn additional pages</p>
</div>
{/* Tasks */}
<div className="space-y-2">
{INITIAL_TASKS.map((task) => {
const isCompleted = completedIds.has(task.id);
const Icon = task.icon;
return (
{isLoading ? (
<Card>
<CardContent className="flex items-center gap-3 p-3">
<Skeleton className="h-9 w-9 rounded-full" />
<div className="flex-1 space-y-2">
<Skeleton className="h-4 w-3/4" />
<Skeleton className="h-3 w-1/4" />
</div>
<Skeleton className="h-8 w-16" />
</CardContent>
</Card>
) : (
<div className="space-y-2">
{data?.tasks.map((task) => (
<Card
key={task.id}
className={cn("transition-colors", isCompleted && "bg-muted/50")}
key={task.task_type}
className={cn("transition-colors", task.completed && "bg-muted/50")}
>
<CardContent className="flex items-center gap-3 p-3">
<div
className={cn(
"flex h-9 w-9 shrink-0 items-center justify-center rounded-full",
isCompleted ? "bg-primary text-primary-foreground" : "bg-muted"
task.completed ? "bg-primary text-primary-foreground" : "bg-muted"
)}
>
{isCompleted ? <Check className="h-4 w-4" /> : <Icon className="h-4 w-4" />}
{task.completed ? <Check className="h-4 w-4" /> : <Star className="h-4 w-4" />}
</div>
<div className="flex-1 min-w-0">
<p className={cn("text-sm font-medium", isCompleted && "text-muted-foreground line-through")}>
<p
className={cn(
"text-sm font-medium",
task.completed && "text-muted-foreground line-through"
)}
>
{task.title}
</p>
<p className="text-xs text-muted-foreground">+{task.reward} pages</p>
<p className="text-xs text-muted-foreground">+{task.pages_reward} pages</p>
</div>
<Button
variant={isCompleted ? "ghost" : "outline"}
variant={task.completed ? "ghost" : "outline"}
size="sm"
asChild
onClick={() => handleTaskClick(task.id)}
disabled={task.completed || completeMutation.isPending}
onClick={() => handleTaskClick(task)}
asChild={!task.completed}
>
<a
href={task.href}
target="_blank"
rel="noopener noreferrer"
className={cn("gap-1", isCompleted && "pointer-events-none opacity-50")}
>
{isCompleted ? "Done" : "Go"}
{!isCompleted && <ExternalLink className="h-3 w-3" />}
</a>
{task.completed ? (
<span>Done</span>
) : (
<a
href={task.action_url}
target="_blank"
rel="noopener noreferrer"
className="gap-1"
>
{completeMutation.isPending ? (
<Loader2 className="h-3 w-3 animate-spin" />
) : (
<>
Go
<ExternalLink className="h-3 w-3" />
</>
)}
</a>
)}
</Button>
</CardContent>
</Card>
);
})}
</div>
))}
</div>
)}
{/* Contact */}
<Separator className="my-6" />
<div className="text-center">
<p className="mb-3 text-sm text-muted-foreground">
{allCompleted ? "All done! Need more?" : "Need more pages?"}
{allCompleted ? "Thanks! Need even more pages?" : "Need more pages?"}
</p>
<Button variant="outline" size="sm" asChild>
<Link href="mailto:rohan@surfsense.com?subject=Request%20to%20Increase%20Page%20Limits" className="gap-2">
<Link
href="mailto:rohan@surfsense.com?subject=Request%20to%20Increase%20Page%20Limits"
className="gap-2"
>
<Mail className="h-4 w-4" />
Contact Us
</Link>

View file

@ -5,12 +5,12 @@ import {
Bot,
Brain,
ChevronRight,
FileText,
type LucideIcon,
Menu,
MessageSquare,
Settings,
X,
FileText,
} from "lucide-react";
import { AnimatePresence, motion } from "motion/react";
import { useParams, useRouter } from "next/navigation";

View file

@ -95,6 +95,7 @@ import {
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { Spinner } from "@/components/ui/spinner";
import {
Table,
TableBody,
@ -105,7 +106,6 @@ import {
} from "@/components/ui/table";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Textarea } from "@/components/ui/textarea";
import { Spinner } from "@/components/ui/spinner";
import type {
CreateInviteRequest,
DeleteInviteRequest,

View file

@ -1,7 +1,7 @@
"use client";
import { useEffect, useState } from "react";
import { useTranslations } from "next-intl";
import { useEffect, useState } from "react";
import { useGlobalLoadingEffect } from "@/hooks/use-global-loading";
import { getBearerToken, redirectToLogin } from "@/lib/auth-utils";

View file

@ -13,7 +13,6 @@ import { type FC, type PropsWithChildren, useEffect, useRef, useState } from "re
import { useShallow } from "zustand/shallow";
import { TooltipIconButton } from "@/components/assistant-ui/tooltip-icon-button";
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
import { Spinner } from "@/components/ui/spinner";
import { Dialog, DialogContent, DialogTitle, DialogTrigger } from "@/components/ui/dialog";
import {
DropdownMenu,
@ -21,6 +20,7 @@ import {
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { Spinner } from "@/components/ui/spinner";
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
import { cn } from "@/lib/utils";
import { useDocumentUploadDialog } from "./document-upload-popup";

View file

@ -1,8 +1,8 @@
"use client";
import type { FC } from "react";
import { cn } from "@/lib/utils";
import { Spinner } from "@/components/ui/spinner";
import { cn } from "@/lib/utils";
interface ChatSessionStatusProps {
isAiResponding: boolean;

View file

@ -9,8 +9,8 @@ import type { SearchSourceConnector } from "@/contracts/types/connector.types";
import { cn } from "@/lib/utils";
import { DateRangeSelector } from "../../components/date-range-selector";
import { PeriodicSyncConfig } from "../../components/periodic-sync-config";
import { getConnectorConfigComponent } from "../index";
import { getConnectorDisplayName } from "../../tabs/all-connectors-tab";
import { getConnectorConfigComponent } from "../index";
interface ConnectorEditViewProps {
connector: SearchSourceConnector;

View file

@ -9,8 +9,8 @@ import { type FC, useState } from "react";
import { toast } from "sonner";
import { createDocumentMutationAtom } from "@/atoms/documents/document-mutation.atoms";
import { Button } from "@/components/ui/button";
import { Spinner } from "@/components/ui/spinner";
import { Label } from "@/components/ui/label";
import { Spinner } from "@/components/ui/spinner";
import { EnumConnectorName } from "@/contracts/enums/connector";
import { getConnectorIcon } from "@/contracts/enums/connectorIcons";

View file

@ -33,7 +33,7 @@ export function ContactFormGridWithDetails() {
<IconCalendar className="h-5 w-5" />
Schedule a Meeting
</Link>
<div className="flex items-center gap-2 text-neutral-500 dark:text-neutral-400">
<span className="h-px w-8 bg-neutral-300 dark:bg-neutral-600" />
<span className="text-sm">or</span>

View file

@ -105,7 +105,7 @@ export const Navbar = () => {
}, []);
return (
<div className="fixed top-1 left-0 right-0 z-[60] w-full">
<div className="fixed top-1 left-0 right-0 z-60 w-full">
<DesktopNav navItems={navItems} isScrolled={isScrolled} />
<MobileNav navItems={navItems} isScrolled={isScrolled} />
</div>

View file

@ -27,9 +27,9 @@ import {
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { Input } from "@/components/ui/input";
import { Spinner } from "@/components/ui/spinner";
import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
import { Spinner } from "@/components/ui/spinner";
import { useDebouncedValue } from "@/hooks/use-debounced-value";
import {
deleteThread,

View file

@ -27,9 +27,9 @@ import {
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { Input } from "@/components/ui/input";
import { Spinner } from "@/components/ui/spinner";
import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
import { Spinner } from "@/components/ui/spinner";
import { useDebouncedValue } from "@/hooks/use-debounced-value";
import {
deleteThread,

View file

@ -3,10 +3,10 @@
import { useAtomValue } from "jotai";
import { useEffect, useState } from "react";
import { createPortal } from "react-dom";
import { AmbientBackground } from "@/app/(home)/login/AmbientBackground";
import { globalLoadingAtom } from "@/atoms/ui/loading.atoms";
import { Logo } from "@/components/Logo";
import { Spinner } from "@/components/ui/spinner";
import { AmbientBackground } from "@/app/(home)/login/AmbientBackground";
import { cn } from "@/lib/utils";
/**

View file

@ -1,7 +1,7 @@
"use client";
import { useAtomValue } from "jotai";
import { useQuery } from "@tanstack/react-query";
import { useAtomValue } from "jotai";
import { Info, RotateCcw, Save } from "lucide-react";
import { useTranslations } from "next-intl";
import { useEffect, useState } from "react";

View file

@ -47,8 +47,8 @@ import {
DialogHeader,
DialogTitle,
} from "@/components/ui/dialog";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import { Spinner } from "@/components/ui/spinner";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import type { NewLLMConfig } from "@/contracts/types/new-llm-config.types";
import { cn } from "@/lib/utils";

View file

@ -8,7 +8,6 @@ import { useCallback, useMemo, useRef, useState } from "react";
import { useDropzone } from "react-dropzone";
import { toast } from "sonner";
import { uploadDocumentMutationAtom } from "@/atoms/documents/document-mutation.atoms";
import { Spinner } from "@/components/ui/spinner";
import {
Accordion,
AccordionContent,
@ -21,6 +20,7 @@ import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Progress } from "@/components/ui/progress";
import { Separator } from "@/components/ui/separator";
import { Spinner } from "@/components/ui/spinner";
import {
trackDocumentUploadFailure,
trackDocumentUploadStarted,

View file

@ -0,0 +1,67 @@
import { z } from "zod";
/**
* Incentive task type enum - matches backend IncentiveTaskType
*/
export const incentiveTaskTypeEnum = z.enum(["GITHUB_STAR"]);
/**
* Single incentive task info schema
*/
export const incentiveTaskInfo = z.object({
task_type: incentiveTaskTypeEnum,
title: z.string(),
description: z.string(),
pages_reward: z.number(),
action_url: z.string(),
completed: z.boolean(),
completed_at: z.string().nullable(),
});
/**
* Response schema for getting all incentive tasks
*/
export const getIncentiveTasksResponse = z.object({
tasks: z.array(incentiveTaskInfo),
total_pages_earned: z.number(),
});
/**
* Response schema for completing a task successfully
*/
export const completeTaskSuccessResponse = z.object({
success: z.literal(true),
message: z.string(),
pages_awarded: z.number(),
new_pages_limit: z.number(),
});
/**
* Response schema when task was already completed
*/
export const completeTaskAlreadyCompletedResponse = z.object({
success: z.literal(false),
message: z.string(),
completed_at: z.string(),
});
/**
* Union response for complete task endpoint
*/
export const completeTaskResponse = z.union([
completeTaskSuccessResponse,
completeTaskAlreadyCompletedResponse,
]);
// =============================================================================
// Inferred types
// =============================================================================
export type IncentiveTaskTypeEnum = z.infer<typeof incentiveTaskTypeEnum>;
export type IncentiveTaskInfo = z.infer<typeof incentiveTaskInfo>;
export type GetIncentiveTasksResponse = z.infer<typeof getIncentiveTasksResponse>;
export type CompleteTaskSuccessResponse = z.infer<typeof completeTaskSuccessResponse>;
export type CompleteTaskAlreadyCompletedResponse = z.infer<
typeof completeTaskAlreadyCompletedResponse
>;
export type CompleteTaskResponse = z.infer<typeof completeTaskResponse>;

View file

@ -0,0 +1,29 @@
import {
type CompleteTaskResponse,
completeTaskResponse,
type GetIncentiveTasksResponse,
getIncentiveTasksResponse,
type IncentiveTaskTypeEnum,
} from "@/contracts/types/incentive-tasks.types";
import { baseApiService } from "./base-api.service";
class IncentiveTasksApiService {
/**
* Get all available incentive tasks with completion status
*/
getTasks = async (): Promise<GetIncentiveTasksResponse> => {
return baseApiService.get("/api/v1/incentive-tasks", getIncentiveTasksResponse);
};
/**
* Mark a task as completed and receive page reward
*/
completeTask = async (taskType: IncentiveTaskTypeEnum): Promise<CompleteTaskResponse> => {
return baseApiService.post(
`/api/v1/incentive-tasks/${taskType}/complete`,
completeTaskResponse
);
};
}
export const incentiveTasksApiService = new IncentiveTasksApiService();