refactor to local use only

README.md

@@ -1,22 +1,55 @@
+
+# DeepSite v2 🚀
+
+![Banner Screenshot](./localconfig.png)
+
+Run **DeepSite** in your own environment, without relying on external services!
+Perfect for those who want to customize, integrate, or have full control over the platform.
+
 ---
-title: DeepSite v2
-emoji: 🐳
-colorFrom: blue
-colorTo: blue
-sdk: docker
-pinned: true
-app_port: 3000
-license: mit
-short_description: Generate any application with DeepSeek
-models:
-  - deepseek-ai/DeepSeek-V3-0324
-  - deepseek-ai/DeepSeek-R1-0528
+
+## How to run DeepSite v2 locally
+
+### 1. Clone the repository
+```bash
+git clone https://github.com/MartinsMessias/deepsite-locally.git
+cd deepsite-locally
+```
+
+### 2. Install dependencies
+Make sure you have **Node.js** installed (recommended v18+).
+```bash
+npm install
+```
+
+### 3. Run in development mode
+```bash
+npm run dev
+```
+
+### 4. For build and production
+```bash
+npm run build
+npm run start
+```
+
 ---
 
-# DeepSite 🐳
+## Available scripts
+
+- `npm run dev` — Starts the development environment (Next.js + Turbopack)
+- `npm run build` — Builds for production
+- `npm run start` — Runs the server in production mode
+- `npm run lint` — Runs the linter
+
+## Main dependencies
 
-DeepSite is a coding platform powered by DeepSeek AI, designed to make coding smarter and more efficient. Tailored for developers, data scientists, and AI engineers, it integrates generative AI into your coding projects to enhance creativity and productivity.
+Next.js, React 19, Mongoose, TailwindCSS, Radix UI, Lucide, Monaco Editor, React Query, Zod, Axios, Sonner, and more.
+
+See all dependencies in [`package.json`](./package.json).
+
+---
 
-## How to use it locally
+## Keywords
+deepsite local hosting, deepsite run locally, deepsite self-hosted, how to run deepsite locally, install deepsite on your machine, deepsite local server setup, deepsite offline mode, deepsite localhost tutorial, deploy deepsite on your own server, deepsite self-install guide, how to host deepsite on localhost step-by-step, can deepsite run offline on my computer, deepsite docker installation guide, full guide to running deepsite locally without internet, deepsite self-host vs cloud hosting comparison, deepsite performance tips when running locally, requirements to run deepsite on local environment, best practices for self-hosting deepsite platform, how to speed up deepsite in a local environment, common errors when running deepsite locally and how to fix, deepsite vs other ai site builders local run comparison, top reasons to run deepsite on your own server, is deepsite open-source and local-friendly
 
-Follow [this discussion](https://huggingface.co/spaces/enzostvs/deepsite/discussions/74)

app/(public)/projects/page.tsx

@@ -1,10 +1,10 @@
 import { redirect } from "next/navigation";
 
 import { MyProjects } from "@/components/my-projects";
-import { getProjects } from "@/app/actions/projects";
 
 export default async function ProjectsPage() {
-  const { ok, projects } = await getProjects();
+  const { ok, projects } = { ok: true, projects: [] };
+
   if (!ok) {
     redirect("/");
   }

app/actions/auth.ts

@@ -1,18 +0,0 @@
-"use server";
-
-import { headers } from "next/headers";
-
-export async function getAuth() {
-  const authList = await headers();
-  const host = authList.get("host") ?? "localhost:3000";
-  const url = host.includes("/spaces/enzostvs")
-    ? "enzostvs-deepsite.hf.space"
-    : host;
-  const redirect_uri =
-    `${host.includes("localhost") ? "http://" : "https://"}` +
-    url +
-    "/auth/callback";
-
-  const loginRedirectUrl = `https://huggingface.co/oauth/authorize?client_id=${process.env.OAUTH_CLIENT_ID}&redirect_uri=${redirect_uri}&response_type=code&scope=openid%20profile%20write-repos%20manage-repos%20inference-api&prompt=consent&state=1234567890`;
-  return loginRedirectUrl;
-}

app/actions/projects.ts

@@ -1,63 +0,0 @@
-"use server";
-
-import { isAuthenticated } from "@/lib/auth";
-import { NextResponse } from "next/server";
-import dbConnect from "@/lib/mongodb";
-import Project from "@/models/Project";
-import { Project as ProjectType } from "@/types";
-
-export async function getProjects(): Promise<{
-  ok: boolean;
-  projects: ProjectType[];
-}> {
-  const user = await isAuthenticated();
-
-  if (user instanceof NextResponse || !user) {
-    return {
-      ok: false,
-      projects: [],
-    };
-  }
-
-  await dbConnect();
-  const projects = await Project.find({
-    user_id: user?.id,
-  })
-    .sort({ _createdAt: -1 })
-    .limit(100)
-    .lean();
-  if (!projects) {
-    return {
-      ok: false,
-      projects: [],
-    };
-  }
-  return {
-    ok: true,
-    projects: JSON.parse(JSON.stringify(projects)) as ProjectType[],
-  };
-}
-
-export async function getProject(
-  namespace: string,
-  repoId: string
-): Promise<ProjectType | null> {
-  const user = await isAuthenticated();
-
-  if (user instanceof NextResponse || !user) {
-    return null;
-  }
-
-  await dbConnect();
-  const project = await Project.findOne({
-    user_id: user.id,
-    namespace,
-    repoId,
-  }).lean();
-
-  if (!project) {
-    return null;
-  }
-
-  return JSON.parse(JSON.stringify(project)) as ProjectType;
-}

app/api/ask-ai/route.ts

@@ -1,28 +1,24 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import type { NextRequest } from "next/server";
 import { NextResponse } from "next/server";
-import { headers } from "next/headers";
-import { InferenceClient } from "@huggingface/inference";
+import OpenAI from "openai";
 
-import { MODELS, PROVIDERS } from "@/lib/providers";
+import { MODELS } from "@/lib/providers";
 import {
   DIVIDER,
   FOLLOW_UP_SYSTEM_PROMPT,
   INITIAL_SYSTEM_PROMPT,
-  MAX_REQUESTS_PER_IP,
   REPLACE_END,
   SEARCH_START,
 } from "@/lib/prompts";
-import MY_TOKEN_KEY from "@/lib/get-cookie-name";
-
-const ipAddresses = new Map();
 
 export async function POST(request: NextRequest) {
-  const authHeaders = await headers();
-  const userToken = request.cookies.get(MY_TOKEN_KEY())?.value;
-
   const body = await request.json();
-  const { prompt, provider, model, redesignMarkdown, html } = body;
+  const { prompt, model, redesignMarkdown, html, apiKey, customModel } = body;
+
+  const openai = new OpenAI({
+    apiKey: apiKey || process.env.OPENAI_API_KEY,
+  });
 
   if (!model || (!prompt && !redesignMarkdown)) {
     return NextResponse.json(
@@ -41,56 +37,6 @@ export async function POST(request: NextRequest) {
     );
   }
 
-  if (!selectedModel.providers.includes(provider) && provider !== "auto") {
-    return NextResponse.json(
-      {
-        ok: false,
-        error: `The selected model does not support the ${provider} provider.`,
-        openSelectProvider: true,
-      },
-      { status: 400 }
-    );
-  }
-
-  let token = userToken;
-  let billTo: string | null = null;
-
-  /**
-   * Handle local usage token, this bypass the need for a user token
-   * and allows local testing without authentication.
-   * This is useful for development and testing purposes.
-   */
-  if (process.env.HF_TOKEN && process.env.HF_TOKEN.length > 0) {
-    token = process.env.HF_TOKEN;
-  }
-
-  const ip = authHeaders.get("x-forwarded-for")?.includes(",")
-    ? authHeaders.get("x-forwarded-for")?.split(",")[1].trim()
-    : authHeaders.get("x-forwarded-for");
-
-  if (!token) {
-    ipAddresses.set(ip, (ipAddresses.get(ip) || 0) + 1);
-    if (ipAddresses.get(ip) > MAX_REQUESTS_PER_IP) {
-      return NextResponse.json(
-        {
-          ok: false,
-          openLogin: true,
-          message: "Log In to continue using the service",
-        },
-        { status: 429 }
-      );
-    }
-
-    token = process.env.DEFAULT_HF_TOKEN as string;
-    billTo = "huggingface";
-  }
-
-  const DEFAULT_PROVIDER = PROVIDERS.novita;
-  const selectedProvider =
-    provider === "auto"
-      ? PROVIDERS[selectedModel.autoProvider as keyof typeof PROVIDERS]
-      : PROVIDERS[provider as keyof typeof PROVIDERS] ?? DEFAULT_PROVIDER;
-
   try {
     // Create a stream response
     const encoder = new TextEncoder();
@@ -109,96 +55,44 @@ export async function POST(request: NextRequest) {
     (async () => {
       let completeResponse = "";
       try {
-        const client = new InferenceClient(token);
-        const chatCompletion = client.chatCompletionStream(
-          {
-            model: selectedModel.value,
-            provider: selectedProvider.id as any,
-            messages: [
-              {
-                role: "system",
-                content: INITIAL_SYSTEM_PROMPT,
-              },
-              {
-                role: "user",
-                content: redesignMarkdown
-                  ? `Here is my current design as a markdown:\n\n${redesignMarkdown}\n\nNow, please create a new design based on this markdown.`
-                  : html
-                  ? `Here is my current HTML code:\n\n\`\`\`html\n${html}\n\`\`\`\n\nNow, please create a new design based on this HTML.`
-                  : prompt,
-              },
-            ],
-            max_tokens: selectedProvider.max_tokens,
-          },
-          billTo ? { billTo } : {}
-        );
-
-        while (true) {
-          const { done, value } = await chatCompletion.next();
-          if (done) {
+        const chatCompletion = await openai.chat.completions.create({
+          model: customModel || selectedModel.value,
+          messages: [
+            {
+              role: "system",
+              content: INITIAL_SYSTEM_PROMPT,
+            },
+            {
+              role: "user",
+              content: redesignMarkdown
+                ? `Here is my current design as a markdown:\n\n${redesignMarkdown}\n\nNow, please create a new design based on this markdown.`
+                : html
+                ? `Here is my current HTML code:\n\n\`\`\`html\n${html}\n\`\`\`\n\nNow, please create a new design based on this HTML.`
+                : prompt,
+            },
+          ],
+          stream: true,
+        });
+
+        for await (const chunk of chatCompletion) {
+          const content = chunk.choices[0]?.delta?.content || "";
+          await writer.write(encoder.encode(content));
+          completeResponse += content;
+          if (completeResponse.includes("</html>")) {
             break;
           }
-
-          const chunk = value.choices[0]?.delta?.content;
-          if (chunk) {
-            let newChunk = chunk;
-            if (!selectedModel?.isThinker) {
-              if (provider !== "sambanova") {
-                await writer.write(encoder.encode(chunk));
-                completeResponse += chunk;
-
-                if (completeResponse.includes("</html>")) {
-                  break;
-                }
-              } else {
-                if (chunk.includes("</html>")) {
-                  newChunk = newChunk.replace(/<\/html>[\s\S]*/, "</html>");
-                }
-                completeResponse += newChunk;
-                await writer.write(encoder.encode(newChunk));
-                if (newChunk.includes("</html>")) {
-                  break;
-                }
-              }
-            } else {
-              const lastThinkTagIndex =
-                completeResponse.lastIndexOf("</think>");
-              completeResponse += newChunk;
-              await writer.write(encoder.encode(newChunk));
-              if (lastThinkTagIndex !== -1) {
-                const afterLastThinkTag = completeResponse.slice(
-                  lastThinkTagIndex + "</think>".length
-                );
-                if (afterLastThinkTag.includes("</html>")) {
-                  break;
-                }
-              }
-            }
-          }
         }
       } catch (error: any) {
-        if (error.message?.includes("exceeded your monthly included credits")) {
-          await writer.write(
-            encoder.encode(
-              JSON.stringify({
-                ok: false,
-                openProModal: true,
-                message: error.message,
-              })
-            )
-          );
-        } else {
-          await writer.write(
-            encoder.encode(
-              JSON.stringify({
-                ok: false,
-                message:
-                  error.message ||
-                  "An error occurred while processing your request.",
-              })
-            )
-          );
-        }
+        await writer.write(
+          encoder.encode(
+            JSON.stringify({
+              ok: false,
+              message:
+                error.message ||
+                "An error occurred while processing your request.",
+            })
+          )
+        );
       } finally {
         await writer?.close();
       }
@@ -209,7 +103,6 @@ export async function POST(request: NextRequest) {
     return NextResponse.json(
       {
         ok: false,
-        openSelectProvider: true,
         message:
           error?.message || "An error occurred while processing your request.",
       },
@@ -219,11 +112,13 @@ export async function POST(request: NextRequest) {
 }
 
 export async function PUT(request: NextRequest) {
-  const authHeaders = await headers();
-  const userToken = request.cookies.get(MY_TOKEN_KEY())?.value;
-
   const body = await request.json();
-  const { prompt, html, previousPrompt, provider, selectedElementHtml } = body;
+  const { prompt, html, previousPrompt, selectedElementHtml, apiKey, model, baseUrl, customModel } = body;
+
+  const openai = new OpenAI({
+    apiKey: apiKey || process.env.OPENAI_API_KEY,
+    baseURL: baseUrl || process.env.OPENAI_BASE_URL,
+  });
 
   if (!prompt || !html) {
     return NextResponse.json(
@@ -232,87 +127,43 @@ export async function PUT(request: NextRequest) {
     );
   }
 
-  const selectedModel = MODELS[0];
-
-  let token = userToken;
-  let billTo: string | null = null;
-
-  /**
-   * Handle local usage token, this bypass the need for a user token
-   * and allows local testing without authentication.
-   * This is useful for development and testing purposes.
-   */
-  if (process.env.HF_TOKEN && process.env.HF_TOKEN.length > 0) {
-    token = process.env.HF_TOKEN;
+  const selectedModel = MODELS.find(
+    (m) => m.value === model || m.label === model
+  );
+  if (!selectedModel) {
+    return NextResponse.json(
+      { ok: false, error: "Invalid model selected" },
+      { status: 400 }
+    );
   }
 
-  const ip = authHeaders.get("x-forwarded-for")?.includes(",")
-    ? authHeaders.get("x-forwarded-for")?.split(",")[1].trim()
-    : authHeaders.get("x-forwarded-for");
-
-  if (!token) {
-    ipAddresses.set(ip, (ipAddresses.get(ip) || 0) + 1);
-    if (ipAddresses.get(ip) > MAX_REQUESTS_PER_IP) {
-      return NextResponse.json(
+  try {
+    const response = await openai.chat.completions.create({
+      model: customModel || selectedModel.value,
+      messages: [
         {
-          ok: false,
-          openLogin: true,
-          message: "Log In to continue using the service",
+          role: "system",
+          content: FOLLOW_UP_SYSTEM_PROMPT,
         },
-        { status: 429 }
-      );
-    }
-
-    token = process.env.DEFAULT_HF_TOKEN as string;
-    billTo = "huggingface";
-  }
-
-  const client = new InferenceClient(token);
-
-  const DEFAULT_PROVIDER = PROVIDERS.novita;
-  const selectedProvider =
-    provider === "auto"
-      ? PROVIDERS[selectedModel.autoProvider as keyof typeof PROVIDERS]
-      : PROVIDERS[provider as keyof typeof PROVIDERS] ?? DEFAULT_PROVIDER;
-
-  try {
-    const response = await client.chatCompletion(
-      {
-        model: selectedModel.value,
-        provider: selectedProvider.id as any,
-        messages: [
-          {
-            role: "system",
-            content: FOLLOW_UP_SYSTEM_PROMPT,
-          },
-          {
-            role: "user",
-            content: previousPrompt
-              ? previousPrompt
-              : "You are modifying the HTML file based on the user's request.",
-          },
-          {
-            role: "assistant",
-
-            content: `The current code is: \n\`\`\`html\n${html}\n\`\`\` ${
-              selectedElementHtml
-                ? `\n\nYou have to update ONLY the following element, NOTHING ELSE: \n\n\`\`\`html\n${selectedElementHtml}\n\`\`\``
-                : ""
-            }`,
-          },
-          {
-            role: "user",
-            content: prompt,
-          },
-        ],
-        ...(selectedProvider.id !== "sambanova"
-          ? {
-              max_tokens: selectedProvider.max_tokens,
-            }
-          : {}),
-      },
-      billTo ? { billTo } : {}
-    );
+        {
+          role: "user",
+          content: previousPrompt
+            ? previousPrompt
+            : "You are modifying the HTML file based on the user's request.",
+        },
+        {
+          role: "assistant",
+          content: `The current code is: \n\`\`\`html\n${html}\n\`\`\` ${selectedElementHtml
+            ? `\n\nYou have to update ONLY the following element, NOTHING ELSE: \n\n\`\`\`html\n${selectedElementHtml}\n\`\`\``
+            : ""}
+          `,
+        },
+        {
+          role: "user",
+          content: prompt,
+        },
+      ],
+    });
 
     const chunk = response.choices[0]?.message?.content;
     if (!chunk) {
@@ -387,24 +238,13 @@ export async function PUT(request: NextRequest) {
       );
     }
   } catch (error: any) {
-    if (error.message?.includes("exceeded your monthly included credits")) {
-      return NextResponse.json(
-        {
-          ok: false,
-          openProModal: true,
-          message: error.message,
-        },
-        { status: 402 }
-      );
-    }
     return NextResponse.json(
       {
         ok: false,
-        openSelectProvider: true,
         message:
           error.message || "An error occurred while processing your request.",
       },
       { status: 500 }
     );
   }
-}
+}

app/api/auth/route.ts

@@ -1,86 +0,0 @@
-import { NextRequest, NextResponse } from "next/server";
-
-export async function POST(req: NextRequest) {
-  const body = await req.json();
-  const { code } = body;
-
-  if (!code) {
-    return NextResponse.json(
-      { error: "Code is required" },
-      {
-        status: 400,
-        headers: {
-          "Content-Type": "application/json",
-        },
-      }
-    );
-  }
-
-  const Authorization = `Basic ${Buffer.from(
-    `${process.env.OAUTH_CLIENT_ID}:${process.env.OAUTH_CLIENT_SECRET}`
-  ).toString("base64")}`;
-
-  const host =
-    req.headers.get("host") ?? req.headers.get("origin") ?? "localhost:3000";
-
-  const url = host.includes("/spaces/enzostvs")
-    ? "enzostvs-deepsite.hf.space"
-    : host;
-  const redirect_uri =
-    `${host.includes("localhost") ? "http://" : "https://"}` +
-    url +
-    "/auth/callback";
-  const request_auth = await fetch("https://huggingface.co/oauth/token", {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/x-www-form-urlencoded",
-      Authorization,
-    },
-    body: new URLSearchParams({
-      grant_type: "authorization_code",
-      code,
-      redirect_uri,
-    }),
-  });
-
-  const response = await request_auth.json();
-  if (!response.access_token) {
-    return NextResponse.json(
-      { error: "Failed to retrieve access token" },
-      {
-        status: 400,
-        headers: {
-          "Content-Type": "application/json",
-        },
-      }
-    );
-  }
-
-  const userResponse = await fetch("https://huggingface.co/api/whoami-v2", {
-    headers: {
-      Authorization: `Bearer ${response.access_token}`,
-    },
-  });
-
-  if (!userResponse.ok) {
-    return NextResponse.json(
-      { user: null, errCode: userResponse.status },
-      { status: userResponse.status }
-    );
-  }
-  const user = await userResponse.json();
-
-  return NextResponse.json(
-    {
-      access_token: response.access_token,
-      expires_in: response.expires_in,
-      user,
-    },
-    {
-      status: 200,
-      headers: {
-        "Content-Type": "application/json",
-      },
-    }
-  );
-}

app/api/me/projects/[namespace]/[repoId]/route.ts

@@ -1,237 +0,0 @@
-import { NextRequest, NextResponse } from "next/server";
-import { RepoDesignation, spaceInfo, uploadFile } from "@huggingface/hub";
-
-import { isAuthenticated } from "@/lib/auth";
-import Project from "@/models/Project";
-import dbConnect from "@/lib/mongodb";
-import { getPTag } from "@/lib/utils";
-
-export async function GET(
-  req: NextRequest,
-  { params }: { params: Promise<{ namespace: string; repoId: string }> }
-) {
-  const user = await isAuthenticated();
-
-  if (user instanceof NextResponse || !user) {
-    return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
-  }
-
-  await dbConnect();
-  const param = await params;
-  const { namespace, repoId } = param;
-
-  const project = await Project.findOne({
-    user_id: user.id,
-    space_id: `${namespace}/${repoId}`,
-  }).lean();
-  if (!project) {
-    return NextResponse.json(
-      {
-        ok: false,
-        error: "Project not found",
-      },
-      { status: 404 }
-    );
-  }
-  const space_url = `https://huggingface.co/spaces/${namespace}/${repoId}/raw/main/index.html`;
-  try {
-    const space = await spaceInfo({
-      name: namespace + "/" + repoId,
-      accessToken: user.token as string,
-      additionalFields: ["author"],
-    });
-
-    if (!space || space.sdk !== "static") {
-      return NextResponse.json(
-        {
-          ok: false,
-          error: "Space is not a static space",
-        },
-        { status: 404 }
-      );
-    }
-    if (space.author !== user.name) {
-      return NextResponse.json(
-        {
-          ok: false,
-          error: "Space does not belong to the authenticated user",
-        },
-        { status: 403 }
-      );
-    }
-
-    const response = await fetch(space_url);
-    if (!response.ok) {
-      return NextResponse.json(
-        {
-          ok: false,
-          error: "Failed to fetch space HTML",
-        },
-        { status: 404 }
-      );
-    }
-    let html = await response.text();
-    // remove the last p tag including this url https://enzostvs-deepsite.hf.space
-    html = html.replace(getPTag(namespace + "/" + repoId), "");
-
-    return NextResponse.json(
-      {
-        project: {
-          ...project,
-          html,
-        },
-        ok: true,
-      },
-      { status: 200 }
-    );
-
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  } catch (error: any) {
-    if (error.statusCode === 404) {
-      await Project.deleteOne({
-        user_id: user.id,
-        space_id: `${namespace}/${repoId}`,
-      });
-      return NextResponse.json(
-        { error: "Space not found", ok: false },
-        { status: 404 }
-      );
-    }
-    return NextResponse.json(
-      { error: error.message, ok: false },
-      { status: 500 }
-    );
-  }
-}
-
-export async function PUT(
-  req: NextRequest,
-  { params }: { params: Promise<{ namespace: string; repoId: string }> }
-) {
-  const user = await isAuthenticated();
-
-  if (user instanceof NextResponse || !user) {
-    return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
-  }
-
-  await dbConnect();
-  const param = await params;
-  const { namespace, repoId } = param;
-  const { html, prompts } = await req.json();
-
-  const project = await Project.findOne({
-    user_id: user.id,
-    space_id: `${namespace}/${repoId}`,
-  }).lean();
-  if (!project) {
-    return NextResponse.json(
-      {
-        ok: false,
-        error: "Project not found",
-      },
-      { status: 404 }
-    );
-  }
-
-  const repo: RepoDesignation = {
-    type: "space",
-    name: `${namespace}/${repoId}`,
-  };
-
-  const newHtml = html.replace(/<\/body>/, `${getPTag(repo.name)}</body>`);
-  const file = new File([newHtml], "index.html", { type: "text/html" });
-  await uploadFile({
-    repo,
-    file,
-    accessToken: user.token as string,
-    commitTitle: `${prompts[prompts.length - 1]} - Follow Up Deployment`,
-  });
-
-  await Project.updateOne(
-    { user_id: user.id, space_id: `${namespace}/${repoId}` },
-    {
-      $set: {
-        prompts: [
-          ...(project && "prompts" in project ? project.prompts : []),
-          ...prompts,
-        ],
-      },
-    }
-  );
-  return NextResponse.json({ ok: true }, { status: 200 });
-}
-
-export async function POST(
-  req: NextRequest,
-  { params }: { params: Promise<{ namespace: string; repoId: string }> }
-) {
-  const user = await isAuthenticated();
-
-  if (user instanceof NextResponse || !user) {
-    return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
-  }
-
-  await dbConnect();
-  const param = await params;
-  const { namespace, repoId } = param;
-
-  const space = await spaceInfo({
-    name: namespace + "/" + repoId,
-    accessToken: user.token as string,
-    additionalFields: ["author"],
-  });
-
-  if (!space || space.sdk !== "static") {
-    return NextResponse.json(
-      {
-        ok: false,
-        error: "Space is not a static space",
-      },
-      { status: 404 }
-    );
-  }
-  if (space.author !== user.name) {
-    return NextResponse.json(
-      {
-        ok: false,
-        error: "Space does not belong to the authenticated user",
-      },
-      { status: 403 }
-    );
-  }
-
-  const project = await Project.findOne({
-    user_id: user.id,
-    space_id: `${namespace}/${repoId}`,
-  }).lean();
-  if (project) {
-    // redirect to the project page if it already exists
-    return NextResponse.json(
-      {
-        ok: false,
-        error: "Project already exists",
-        redirect: `/projects/${namespace}/${repoId}`,
-      },
-      { status: 400 }
-    );
-  }
-
-  const newProject = new Project({
-    user_id: user.id,
-    space_id: `${namespace}/${repoId}`,
-    prompts: [],
-  });
-
-  await newProject.save();
-  return NextResponse.json(
-    {
-      ok: true,
-      project: {
-        id: newProject._id,
-        space_id: newProject.space_id,
-        prompts: newProject.prompts,
-      },
-    },
-    { status: 201 }
-  );
-}

app/api/me/projects/route.ts

@@ -1,126 +0,0 @@
-import { NextRequest, NextResponse } from "next/server";
-import { createRepo, RepoDesignation, uploadFiles } from "@huggingface/hub";
-
-import { isAuthenticated } from "@/lib/auth";
-import Project from "@/models/Project";
-import dbConnect from "@/lib/mongodb";
-import { COLORS, getPTag } from "@/lib/utils";
-// import type user
-export async function GET() {
-  const user = await isAuthenticated();
-
-  if (user instanceof NextResponse || !user) {
-    return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
-  }
-
-  await dbConnect();
-
-  const projects = await Project.find({
-    user_id: user?.id,
-  })
-    .sort({ _createdAt: -1 })
-    .limit(100)
-    .lean();
-  if (!projects) {
-    return NextResponse.json(
-      {
-        ok: false,
-        projects: [],
-      },
-      { status: 404 }
-    );
-  }
-  return NextResponse.json(
-    {
-      ok: true,
-      projects,
-    },
-    { status: 200 }
-  );
-}
-
-/**
- * This API route creates a new project in Hugging Face Spaces.
- * It requires an Authorization header with a valid token and a JSON body with the project details.
- */
-export async function POST(request: NextRequest) {
-  const user = await isAuthenticated();
-
-  if (user instanceof NextResponse || !user) {
-    return NextResponse.json({ message: "Unauthorized" }, { status: 401 });
-  }
-
-  const { title, html, prompts } = await request.json();
-
-  if (!title || !html) {
-    return NextResponse.json(
-      { message: "Title and HTML content are required.", ok: false },
-      { status: 400 }
-    );
-  }
-
-  await dbConnect();
-
-  try {
-    let readme = "";
-    let newHtml = html;
-
-    const newTitle = title
-      .toLowerCase()
-      .replace(/[^a-z0-9]+/g, "-")
-      .split("-")
-      .filter(Boolean)
-      .join("-")
-      .slice(0, 96);
-
-    const repo: RepoDesignation = {
-      type: "space",
-      name: `${user.name}/${newTitle}`,
-    };
-
-    const { repoUrl } = await createRepo({
-      repo,
-      accessToken: user.token as string,
-    });
-    const colorFrom = COLORS[Math.floor(Math.random() * COLORS.length)];
-    const colorTo = COLORS[Math.floor(Math.random() * COLORS.length)];
-    readme = `---
-title: ${newTitle}
-emoji: 🐳
-colorFrom: ${colorFrom}
-colorTo: ${colorTo}
-sdk: static
-pinned: false
-tags:
-  - deepsite
----
-
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference`;
-
-    newHtml = html.replace(/<\/body>/, `${getPTag(repo.name)}</body>`);
-    const file = new File([newHtml], "index.html", { type: "text/html" });
-    const readmeFile = new File([readme], "README.md", {
-      type: "text/markdown",
-    });
-    const files = [file, readmeFile];
-    await uploadFiles({
-      repo,
-      files,
-      accessToken: user.token as string,
-      commitTitle: `${prompts[prompts.length - 1]} - Initial Deployment`,
-    });
-    const path = repoUrl.split("/").slice(-2).join("/");
-    const project = await Project.create({
-      user_id: user.id,
-      space_id: path,
-      prompts,
-    });
-    return NextResponse.json({ project, path, ok: true }, { status: 201 });
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  } catch (err: any) {
-    return NextResponse.json(
-      { error: err.message, ok: false },
-      { status: 500 }
-    );
-  }
-}

app/api/me/route.ts

@@ -1,25 +0,0 @@
-import { headers } from "next/headers";
-import { NextResponse } from "next/server";
-
-export async function GET() {
-  const authHeaders = await headers();
-  const token = authHeaders.get("Authorization");
-  if (!token) {
-    return NextResponse.json({ user: null, errCode: 401 }, { status: 401 });
-  }
-
-  const userResponse = await fetch("https://huggingface.co/api/whoami-v2", {
-    headers: {
-      Authorization: `${token}`,
-    },
-  });
-
-  if (!userResponse.ok) {
-    return NextResponse.json(
-      { user: null, errCode: userResponse.status },
-      { status: userResponse.status }
-    );
-  }
-  const user = await userResponse.json();
-  return NextResponse.json({ user, errCode: null }, { status: 200 });
-}

app/auth/callback/page.tsx

@@ -1,72 +0,0 @@
-"use client";
-import Link from "next/link";
-import { useUser } from "@/hooks/useUser";
-import { use, useState } from "react";
-import { useMount, useTimeoutFn } from "react-use";
-
-import { Button } from "@/components/ui/button";
-export default function AuthCallback({
-  searchParams,
-}: {
-  searchParams: Promise<{ code: string }>;
-}) {
-  const [showButton, setShowButton] = useState(false);
-  const { code } = use(searchParams);
-  const { loginFromCode } = useUser();
-
-  useMount(async () => {
-    if (code) {
-      await loginFromCode(code);
-    }
-  });
-
-  useTimeoutFn(
-    () => setShowButton(true),
-    7000 // Show button after 5 seconds
-  );
-
-  return (
-    <div className="h-screen flex flex-col justify-center items-center">
-      <div className="!rounded-2xl !p-0 !bg-white !border-neutral-100 min-w-xs text-center overflow-hidden ring-[8px] ring-white/20">
-        <header className="bg-neutral-50 p-6 border-b border-neutral-200/60">
-          <div className="flex items-center justify-center -space-x-4 mb-3">
-            <div className="size-9 rounded-full bg-pink-200 shadow-2xs flex items-center justify-center text-xl opacity-50">
-              🚀
-            </div>
-            <div className="size-11 rounded-full bg-amber-200 shadow-2xl flex items-center justify-center text-2xl z-2">
-              👋
-            </div>
-            <div className="size-9 rounded-full bg-sky-200 shadow-2xs flex items-center justify-center text-xl opacity-50">
-              🙌
-            </div>
-          </div>
-          <p className="text-xl font-semibold text-neutral-950">
-            Login In Progress...
-          </p>
-          <p className="text-sm text-neutral-500 mt-1.5">
-            Wait a moment while we log you in with your code.
-          </p>
-        </header>
-        <main className="space-y-4 p-6">
-          <div>
-            <p className="text-sm text-neutral-700 mb-4 max-w-xs">
-              If you are not redirected automatically in the next 5 seconds,
-              please click the button below
-            </p>
-            {showButton ? (
-              <Link href="/">
-                <Button variant="black" className="relative">
-                  Go to Home
-                </Button>
-              </Link>
-            ) : (
-              <p className="text-xs text-neutral-500">
-                Please wait, we are logging you in...
-              </p>
-            )}
-          </div>
-        </main>
-      </div>
-    </div>
-  );
-}

app/auth/page.tsx

@@ -1,28 +0,0 @@
-import { redirect } from "next/navigation";
-import { Metadata } from "next";
-
-import { getAuth } from "@/app/actions/auth";
-
-export const revalidate = 1;
-
-export const metadata: Metadata = {
-  robots: "noindex, nofollow",
-};
-
-export default async function Auth() {
-  const loginRedirectUrl = await getAuth();
-  if (loginRedirectUrl) {
-    redirect(loginRedirectUrl);
-  }
-
-  return (
-    <div className="p-4">
-      <div className="border bg-red-500/10 border-red-500/20 text-red-500 px-5 py-3 rounded-lg">
-        <h1 className="text-xl font-bold">Error</h1>
-        <p className="text-sm">
-          An error occurred while trying to log in. Please try again later.
-        </p>
-      </div>
-    </div>
-  );
-}

app/layout.tsx

@@ -1,13 +1,10 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
 import type { Metadata, Viewport } from "next";
 import { Inter, PT_Sans } from "next/font/google";
-import { cookies } from "next/headers";
+
 
 import TanstackProvider from "@/components/providers/tanstack-query-provider";
 import "@/assets/globals.css";
 import { Toaster } from "@/components/ui/sonner";
-import MY_TOKEN_KEY from "@/lib/get-cookie-name";
-import { apiServer } from "@/lib/api";
 import AppContext from "@/components/contexts/app-context";
 import Script from "next/script";
 
@@ -66,28 +63,11 @@ export const viewport: Viewport = {
   themeColor: "#000000",
 };
 
-async function getMe() {
-  const cookieStore = await cookies();
-  const token = cookieStore.get(MY_TOKEN_KEY())?.value;
-  if (!token) return { user: null, errCode: null };
-  try {
-    const res = await apiServer.get("/me", {
-      headers: {
-        Authorization: `Bearer ${token}`,
-      },
-    });
-    return { user: res.data.user, errCode: null };
-  } catch (err: any) {
-    return { user: null, errCode: err.status };
-  }
-}
-
 export default async function RootLayout({
   children,
 }: Readonly<{
   children: React.ReactNode;
 }>) {
-  const data = await getMe();
   return (
     <html lang="en">
       <Script
@@ -100,7 +80,7 @@ export default async function RootLayout({
       >
         <Toaster richColors position="bottom-center" />
         <TanstackProvider>
-          <AppContext me={data}>{children}</AppContext>
+          <AppContext>{children}</AppContext>
         </TanstackProvider>
       </body>
     </html>

app/projects/[namespace]/[repoId]/page.tsx

@@ -1,40 +0,0 @@
-import { cookies } from "next/headers";
-import { redirect } from "next/navigation";
-
-import { apiServer } from "@/lib/api";
-import MY_TOKEN_KEY from "@/lib/get-cookie-name";
-import { AppEditor } from "@/components/editor";
-
-async function getProject(namespace: string, repoId: string) {
-  // TODO replace with a server action
-  const cookieStore = await cookies();
-  const token = cookieStore.get(MY_TOKEN_KEY())?.value;
-  if (!token) return {};
-  try {
-    const { data } = await apiServer.get(
-      `/me/projects/${namespace}/${repoId}`,
-      {
-        headers: {
-          Authorization: `Bearer ${token}`,
-        },
-      }
-    );
-
-    return data.project;
-  } catch {
-    return {};
-  }
-}
-
-export default async function ProjectNamespacePage({
-  params,
-}: {
-  params: Promise<{ namespace: string; repoId: string }>;
-}) {
-  const { namespace, repoId } = await params;
-  const project = await getProject(namespace, repoId);
-  if (!project?.html) {
-    redirect("/projects");
-  }
-  return <AppEditor project={project} />;
-}

components/contexts/app-context.tsx

@@ -19,7 +19,7 @@ export default function AppContext({
     errCode: number | null;
   };
 }) {
-  const { loginFromCode, user, logout, loading, errCode } =
+  const { user, logout, loading, errCode } =
     useUser(initialData);
   const pathname = usePathname();
   const router = useRouter();
@@ -45,7 +45,6 @@ export default function AppContext({
 
     if (!message.code) return;
     if (message.type === "user-oauth" && message?.code && !events.code) {
-      loginFromCode(message.code);
     }
   });
 

components/editor/ask-ai/index.tsx

@@ -7,13 +7,11 @@ import { useLocalStorage, useUpdateEffect } from "react-use";
 import { ArrowUp, ChevronDown, Crosshair } from "lucide-react";
 import { FaStopCircle } from "react-icons/fa";
 
-import ProModal from "@/components/pro-modal";
 import { Button } from "@/components/ui/button";
 import { MODELS } from "@/lib/providers";
 import { HtmlHistory } from "@/types";
 import { InviteFriends } from "@/components/invite-friends";
 import { Settings } from "@/components/editor/ask-ai/settings";
-import { LoginModal } from "@/components/login-modal";
 import { ReImagine } from "@/components/editor/ask-ai/re-imagine";
 import Loading from "@/components/loading";
 import { Checkbox } from "@/components/ui/checkbox";
@@ -52,7 +50,6 @@ export function AskAI({
   const refThink = useRef<HTMLDivElement | null>(null);
   const audio = useRef<HTMLAudioElement | null>(null);
 
-  const [open, setOpen] = useState(false);
   const [prompt, setPrompt] = useState("");
   const [hasAsked, setHasAsked] = useState(false);
   const [previousPrompt, setPreviousPrompt] = useState("");
@@ -60,7 +57,6 @@ export function AskAI({
   const [model, setModel] = useLocalStorage("model", MODELS[0].value);
   const [openProvider, setOpenProvider] = useState(false);
   const [providerError, setProviderError] = useState("");
-  const [openProModal, setOpenProModal] = useState(false);
   const [think, setThink] = useState<string | undefined>(undefined);
   const [openThink, setOpenThink] = useState(false);
   const [isThinking, setIsThinking] = useState(true);
@@ -88,6 +84,9 @@ export function AskAI({
         const selectedElementHtml = selectedElement
           ? selectedElement.outerHTML
           : "";
+        const apiKey = localStorage.getItem("openai_api_key");
+        const baseUrl = localStorage.getItem("openai_base_url");
+        const customModel = localStorage.getItem("openai_model");
         const request = await fetch("/api/ask-ai", {
           method: "PUT",
           body: JSON.stringify({
@@ -97,6 +96,9 @@ export function AskAI({
             model,
             html,
             selectedElementHtml,
+            apiKey,
+            baseUrl,
+            customModel,
           }),
           headers: {
             "Content-Type": "application/json",
@@ -107,16 +109,6 @@ export function AskAI({
         if (request && request.body) {
           const res = await request.json();
           if (!request.ok) {
-            if (res.openLogin) {
-              setOpen(true);
-            } else if (res.openSelectProvider) {
-              setOpenProvider(true);
-              setProviderError(res.message);
-            } else if (res.openProModal) {
-              setOpenProModal(true);
-            } else {
-              toast.error(res.message);
-            }
             setisAiWorking(false);
             return;
           }
@@ -129,6 +121,7 @@ export function AskAI({
           if (audio.current) audio.current.play();
         }
       } else {
+        const apiKey = localStorage.getItem("openai_api_key");
         const request = await fetch("/api/ask-ai", {
           method: "POST",
           body: JSON.stringify({
@@ -137,6 +130,7 @@ export function AskAI({
             model,
             html: isSameHtml ? "" : html,
             redesignMarkdown,
+            apiKey,
           }),
           headers: {
             "Content-Type": "application/json",
@@ -159,16 +153,6 @@ export function AskAI({
                 contentResponse.trim().endsWith("}");
               const jsonResponse = isJson ? JSON.parse(contentResponse) : null;
               if (jsonResponse && !jsonResponse.ok) {
-                if (jsonResponse.openLogin) {
-                  setOpen(true);
-                } else if (jsonResponse.openSelectProvider) {
-                  setOpenProvider(true);
-                  setProviderError(jsonResponse.message);
-                } else if (jsonResponse.openProModal) {
-                  setOpenProModal(true);
-                } else {
-                  toast.error(jsonResponse.message);
-                }
                 setisAiWorking(false);
                 return;
               }
@@ -251,9 +235,6 @@ export function AskAI({
     } catch (error: any) {
       setisAiWorking(false);
       toast.error(error.message);
-      if (error.openLogin) {
-        setOpen(true);
-      }
     }
   };
 
@@ -428,12 +409,6 @@ export function AskAI({
             </Button>
           </div>
         </div>
-        <LoginModal open={open} onClose={() => setOpen(false)} html={html} />
-        <ProModal
-          html={html}
-          open={openProModal}
-          onClose={() => setOpenProModal(false)}
-        />
         {!isSameHtml && (
           <div className="absolute top-0 right-0 -translate-y-[calc(100%+8px)] select-none text-xs text-neutral-400 flex items-center justify-center gap-2 bg-neutral-800 border border-neutral-700 rounded-md p-1 pr-2.5">
             <label

components/editor/ask-ai/settings.tsx

@@ -1,6 +1,5 @@
-import classNames from "classnames";
 import { PiGearSixFill } from "react-icons/pi";
-import { RiCheckboxCircleFill } from "react-icons/ri";
+import { useState, useEffect } from "react";
 
 import {
   Popover,
@@ -9,18 +8,10 @@ import {
 } from "@/components/ui/popover";
 import { PROVIDERS, MODELS } from "@/lib/providers";
 import { Button } from "@/components/ui/button";
-import {
-  Select,
-  SelectContent,
-  SelectGroup,
-  SelectItem,
-  SelectLabel,
-  SelectTrigger,
-  SelectValue,
-} from "@/components/ui/select";
 import { useMemo } from "react";
 import { useUpdateEffect } from "react-use";
-import Image from "next/image";
+import { Input } from "@/components/ui/input";
+import { toast } from "sonner";
 
 export function Settings({
   open,
@@ -28,9 +19,7 @@ export function Settings({
   provider,
   model,
   error,
-  isFollowUp = false,
   onChange,
-  onModelChange,
 }: {
   open: boolean;
   provider: string;
@@ -41,6 +30,16 @@ export function Settings({
   onChange: (provider: string) => void;
   onModelChange: (model: string) => void;
 }) {
+  const [apiKey, setApiKey] = useState("");
+  const [baseUrl, setBaseUrl] = useState("");
+  const [customModel, setCustomModel] = useState("");
+
+  useEffect(() => {
+    setApiKey(localStorage.getItem("openai_api_key") || "");
+    setBaseUrl(localStorage.getItem("openai_base_url") || "");
+    setCustomModel(localStorage.getItem("openai_model") || "");
+  }, [open]);
+
   const modelAvailableProviders = useMemo(() => {
     const availableProviders = MODELS.find(
       (m: { value: string }) => m.value === model
@@ -57,6 +56,14 @@ export function Settings({
     }
   }, [model, provider]);
 
+  const handleSaveSettings = () => {
+    localStorage.setItem("openai_api_key", apiKey);
+    localStorage.setItem("openai_base_url", baseUrl);
+    localStorage.setItem("openai_model", customModel);
+    toast.success("Settings saved!");
+    onClose(false);
+  };
+
   return (
     <div className="">
       <Popover open={open} onOpenChange={onClose}>
@@ -81,121 +88,52 @@ export function Settings({
             )}
             <label className="block">
               <p className="text-neutral-300 text-sm mb-2.5">
-                Choose a DeepSeek model
+                API Key
               </p>
-              <Select defaultValue={model} onValueChange={onModelChange}>
-                <SelectTrigger className="w-full">
-                  <SelectValue placeholder="Select a DeepSeek model" />
-                </SelectTrigger>
-                <SelectContent>
-                  <SelectGroup>
-                    <SelectLabel>DeepSeek models</SelectLabel>
-                    {MODELS.map(
-                      ({
-                        value,
-                        label,
-                        isNew = false,
-                        isThinker = false,
-                      }: {
-                        value: string;
-                        label: string;
-                        isNew?: boolean;
-                        isThinker?: boolean;
-                      }) => (
-                        <SelectItem
-                          key={value}
-                          value={value}
-                          className=""
-                          disabled={isThinker && isFollowUp}
-                        >
-                          {label}
-                          {isNew && (
-                            <span className="text-xs bg-gradient-to-br from-sky-400 to-sky-600 text-white rounded-full px-1.5 py-0.5">
-                              New
-                            </span>
-                          )}
-                        </SelectItem>
-                      )
-                    )}
-                  </SelectGroup>
-                </SelectContent>
-              </Select>
+              <Input
+                type="password"
+                placeholder="Enter your OpenAI API key"
+                value={apiKey}
+                onChange={(e) => setApiKey(e.target.value)}
+                className="!bg-neutral-800 !border-neutral-700 !text-neutral-200"
+              />
             </label>
-            {isFollowUp && (
-              <div className="bg-amber-500/10 border-amber-500/10 p-3 text-xs text-amber-500 border rounded-lg">
-                Note: You can&apos;t use a Thinker model for follow-up requests.
-                We automatically switch to the default model for you.
-              </div>
-            )}
-            <div className="flex flex-col gap-3">
-              <div className="flex items-center justify-between">
-                <div>
-                  <p className="text-neutral-300 text-sm mb-1.5">
-                    Use auto-provider
-                  </p>
-                  <p className="text-xs text-neutral-400/70">
-                    We&apos;ll automatically select the best provider for you
-                    based on your prompt.
-                  </p>
-                </div>
-                <div
-                  className={classNames(
-                    "bg-neutral-700 rounded-full min-w-10 w-10 h-6 flex items-center justify-between p-1 cursor-pointer transition-all duration-200",
-                    {
-                      "!bg-sky-500": provider === "auto",
-                    }
-                  )}
-                  onClick={() => {
-                    const foundModel = MODELS.find(
-                      (m: { value: string }) => m.value === model
-                    );
-                    if (provider === "auto" && foundModel?.autoProvider) {
-                      onChange(foundModel.autoProvider);
-                    } else {
-                      onChange("auto");
-                    }
-                  }}
-                >
-                  <div
-                    className={classNames(
-                      "w-4 h-4 rounded-full shadow-md transition-all duration-200 bg-neutral-200",
-                      {
-                        "translate-x-4": provider === "auto",
-                      }
-                    )}
-                  />
-                </div>
-              </div>
-              <label className="block">
-                <p className="text-neutral-300 text-sm mb-2">
-                  Inference Provider
-                </p>
-                <div className="grid grid-cols-2 gap-1.5">
-                  {modelAvailableProviders.map((id: string) => (
-                    <Button
-                      key={id}
-                      variant={id === provider ? "default" : "secondary"}
-                      size="sm"
-                      onClick={() => {
-                        onChange(id);
-                      }}
-                    >
-                      <Image
-                        src={`/providers/${id}.svg`}
-                        alt={PROVIDERS[id as keyof typeof PROVIDERS].name}
-                        className="size-5 mr-2"
-                        width={20}
-                        height={20}
-                      />
-                      {PROVIDERS[id as keyof typeof PROVIDERS].name}
-                      {id === provider && (
-                        <RiCheckboxCircleFill className="ml-2 size-4 text-blue-500" />
-                      )}
-                    </Button>
-                  ))}
-                </div>
-              </label>
+            <label className="block">
+              <p className="text-neutral-300 text-sm mb-2.5">
+                Base URL (optional)
+              </p>
+              <Input
+                type="text"
+                placeholder="e.g., https://api.openai.com/v1"
+                value={baseUrl}
+                onChange={(e) => setBaseUrl(e.target.value)}
+                className="!bg-neutral-800 !border-neutral-700 !text-neutral-200"
+              />
+            </label>
+            <label className="block">
+              <p className="text-neutral-300 text-sm mb-2.5">
+                Custom Model
+              </p>
+              <Input
+                type="text"
+                placeholder="e.g., gpt-4o-mini"
+                value={customModel || "gpt-4.1"}
+                onChange={(e) => setCustomModel(e.target.value)}
+                className="!bg-neutral-800 !border-neutral-700 !text-neutral-200"
+              />
+            </label>
+            <Button
+              variant="default"
+              size="sm"
+              onClick={handleSaveSettings}
+              className="mt-2 w-full"
+            >
+              Save Settings
+            </Button>
+            <div className="bg-amber-500/10 border-amber-500/10 p-3 text-xs text-amber-500 border rounded-lg">
+              Accepts any OpenAI-compatible provider. Enter the corresponding API key and base URL (e.g., OpenRouter, DeepSeek, etc.).
             </div>
+
           </main>
         </PopoverContent>
       </Popover>

components/editor/deploy-button/index.tsx

@@ -16,8 +16,6 @@ import {
 } from "@/components/ui/popover";
 import { Input } from "@/components/ui/input";
 import { api } from "@/lib/api";
-import { LoginModal } from "@/components/login-modal";
-import { useUser } from "@/hooks/useUser";
 
 export function DeployButton({
   html,
@@ -27,9 +25,7 @@ export function DeployButton({
   prompts: string[];
 }) {
   const router = useRouter();
-  const { user } = useUser();
-  const [loading, setLoading] = useState(false);
-  const [open, setOpen] = useState(false);
+    const [loading, setLoading] = useState(false);
 
   const [config, setConfig] = useState({
     title: "",
@@ -65,108 +61,80 @@ export function DeployButton({
   return (
     <div className="flex items-center justify-end gap-5">
       <div className="relative flex items-center justify-end">
-        {user?.id ? (
-          <Popover>
-            <PopoverTrigger asChild>
-              <div>
-                <Button variant="default" className="max-lg:hidden !px-4">
-                  <MdSave className="size-4" />
-                  Save your Project
-                </Button>
-                <Button variant="default" size="sm" className="lg:hidden">
-                  Deploy
-                </Button>
-              </div>
-            </PopoverTrigger>
-            <PopoverContent
-              className="!rounded-2xl !p-0 !bg-white !border-neutral-200 min-w-xs text-center overflow-hidden"
-              align="end"
-            >
-              <header className="bg-neutral-50 p-6 border-b border-neutral-200/60">
-                <div className="flex items-center justify-center -space-x-4 mb-3">
-                  <div className="size-9 rounded-full bg-amber-200 shadow-2xs flex items-center justify-center text-xl opacity-50">
-                    🚀
-                  </div>
-                  <div className="size-11 rounded-full bg-red-200 shadow-2xl flex items-center justify-center z-2">
-                    <Image
-                      src={SpaceIcon}
-                      alt="Space Icon"
-                      className="size-7"
-                    />
-                  </div>
-                  <div className="size-9 rounded-full bg-sky-200 shadow-2xs flex items-center justify-center text-xl opacity-50">
-                    👻
-                  </div>
+        <Popover>
+          <PopoverTrigger asChild>
+            <div>
+              <Button variant="default" className="max-lg:hidden !px-4">
+                <MdSave className="size-4" />
+                Save your Project
+              </Button>
+              <Button variant="default" size="sm" className="lg:hidden">
+                Deploy
+              </Button>
+            </div>
+          </PopoverTrigger>
+          <PopoverContent
+            className="!rounded-2xl !p-0 !bg-white !border-neutral-200 min-w-xs text-center overflow-hidden"
+            align="end"
+          >
+            <header className="bg-neutral-50 p-6 border-b border-neutral-200/60">
+              <div className="flex items-center justify-center -space-x-4 mb-3">
+                <div className="size-9 rounded-full bg-amber-200 shadow-2xs flex items-center justify-center text-xl opacity-50">
+                  🚀
                 </div>
-                <p className="text-xl font-semibold text-neutral-950">
-                  Deploy as Space!
-                </p>
-                <p className="text-sm text-neutral-500 mt-1.5">
-                  Save and Deploy your project to a Space on the Hub. Spaces are
-                  a way to share your project with the world.
-                </p>
-              </header>
-              <main className="space-y-4 p-6">
-                <div>
-                  <p className="text-sm text-neutral-700 mb-2">
-                    Choose a title for your space:
-                  </p>
-                  <Input
-                    type="text"
-                    placeholder="My Awesome Website"
-                    value={config.title}
-                    onChange={(e) =>
-                      setConfig({ ...config, title: e.target.value })
-                    }
-                    className="!bg-white !border-neutral-300 !text-neutral-800 !placeholder:text-neutral-400 selection:!bg-blue-100"
+                <div className="size-11 rounded-full bg-red-200 shadow-2xl flex items-center justify-center z-2">
+                  <Image
+                    src={SpaceIcon}
+                    alt="Space Icon"
+                    className="size-7"
                   />
                 </div>
-                <div>
-                  <p className="text-sm text-neutral-700 mb-2">
-                    Then, let&apos;s deploy it!
-                  </p>
-                  <Button
-                    variant="black"
-                    onClick={createSpace}
-                    className="relative w-full"
-                    disabled={loading}
-                  >
-                    Deploy Space <Rocket className="size-4" />
-                    {loading && (
-                      <Loading className="ml-2 size-4 animate-spin" />
-                    )}
-                  </Button>
+                <div className="size-9 rounded-full bg-sky-200 shadow-2xs flex items-center justify-center text-xl opacity-50">
+                  👻
                 </div>
-              </main>
-            </PopoverContent>
-          </Popover>
-        ) : (
-          <>
-            <Button
-              variant="default"
-              className="max-lg:hidden !px-4"
-              onClick={() => setOpen(true)}
-            >
-              <MdSave className="size-4" />
-              Save your Project
-            </Button>
-            <Button
-              variant="default"
-              size="sm"
-              className="lg:hidden"
-              onClick={() => setOpen(true)}
-            >
-              Save
-            </Button>
-          </>
-        )}
-        <LoginModal
-          open={open}
-          onClose={() => setOpen(false)}
-          html={html}
-          title="Log In to save your Project"
-          description="Log In through your Hugging Face account to save your project and increase your monthly free limit."
-        />
+              </div>
+              <p className="text-xl font-semibold text-neutral-950">
+                Deploy as Space!
+              </p>
+              <p className="text-sm text-neutral-500 mt-1.5">
+                Save and Deploy your project to a Space on the Hub. Spaces are
+                a way to share your project with the world.
+              </p>
+            </header>
+            <main className="space-y-4 p-6">
+              <div>
+                <p className="text-sm text-neutral-700 mb-2">
+                  Choose a title for your space:
+                </p>
+                <Input
+                  type="text"
+                  placeholder="My Awesome Website"
+                  value={config.title}
+                  onChange={(e) =>
+                    setConfig({ ...config, title: e.target.value })
+                  }
+                  className="!bg-white !border-neutral-300 !text-neutral-800 !placeholder:text-neutral-400 selection:!bg-blue-100"
+                />
+              </div>
+              <div>
+                <p className="text-sm text-neutral-700 mb-2">
+                  Then, let&apos;s deploy it!
+                </p>
+                <Button
+                  variant="black"
+                  onClick={createSpace}
+                  className="relative w-full"
+                  disabled={loading}
+                >
+                  Deploy Space <Rocket className="size-4" />
+                  {loading && (
+                    <Loading className="ml-2 size-4 animate-spin" />
+                  )}
+                </Button>
+              </div>
+            </main>
+          </PopoverContent>
+        </Popover>
       </div>
     </div>
   );

components/editor/footer/index.tsx

@@ -1,6 +1,6 @@
 import classNames from "classnames";
 import { FaMobileAlt } from "react-icons/fa";
-import { HelpCircle, RefreshCcw, SparkleIcon } from "lucide-react";
+import { RefreshCcw } from "lucide-react";
 import { FaLaptopCode } from "react-icons/fa6";
 import { HtmlHistory } from "@/types";
 import { Button } from "@/components/ui/button";
@@ -74,24 +74,20 @@ export function Footer({
         )}
       </div>
       <div className="flex justify-end items-center gap-2.5">
-        <a
-          href="https://huggingface.co/spaces/victor/deepsite-gallery"
-          target="_blank"
-        >
-          <Button size="sm" variant="ghost">
-            <SparkleIcon className="size-3.5" />
-            <span className="max-lg:hidden">DeepSite Gallery</span>
-          </Button>
-        </a>
-        <a
-          target="_blank"
-          href="https://huggingface.co/spaces/enzostvs/deepsite/discussions/157"
-        >
-          <Button size="sm" variant="outline">
-            <HelpCircle className="size-3.5" />
-            <span className="max-lg:hidden">Help</span>
-          </Button>
-        </a>
+
+          <style>{`
+            @keyframes blink-star {
+              0%, 100% { opacity: 1; }
+              50% { opacity: 0.2; }
+            }
+          `}</style>
+          <span className="max-lg:hidden"><a
+            href="https://github.com/MartinsMessias/deepsite-locally"
+            target="_blank"
+            className="text-xs lg:text-sm font-medium py-2 px-3 lg:px-4 rounded-lg flex items-center  transition-all duration-100 cursor-pointer"
+          >
+            <span style={{ animation: 'blink-star 2s infinite' }}>⭐</span> <span>Give a Star on GitHub</span>
+          </a></span>
         <Button size="sm" variant="outline" onClick={handleRefreshIframe}>
           <RefreshCcw className="size-3.5" />
           <span className="max-lg:hidden">Refresh Preview</span>

components/editor/index.tsx

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 "use client";
 import { useRef, useState } from "react";
 import { toast } from "sonner";
@@ -13,7 +14,7 @@ import {
   useUpdateEffect,
 } from "react-use";
 import classNames from "classnames";
-import { useRouter, useSearchParams } from "next/navigation";
+import { useRouter } from "next/navigation";
 
 import { Header } from "@/components/editor/header";
 import { Footer } from "@/components/editor/footer";
@@ -21,7 +22,6 @@ import { defaultHTML } from "@/lib/consts";
 import { Preview } from "@/components/editor/preview";
 import { useEditor } from "@/hooks/useEditor";
 import { AskAI } from "@/components/editor/ask-ai";
-import { DeployButton } from "./deploy-button";
 import { Project } from "@/types";
 import { SaveButton } from "./save-button";
 import { LoadProject } from "../my-projects/load-project";
@@ -33,16 +33,13 @@ export const AppEditor = ({ project }: { project?: Project | null }) => {
   const { html, setHtml, htmlHistory, setHtmlHistory, prompts, setPrompts } =
     useEditor(project?.html ?? (htmlStorage as string) ?? defaultHTML);
   // get query params from URL
-  const searchParams = useSearchParams();
   const router = useRouter();
-  const deploy = searchParams.get("deploy") === "true";
 
   const iframeRef = useRef<HTMLIFrameElement | null>(null);
   const preview = useRef<HTMLDivElement>(null);
   const editor = useRef<HTMLDivElement>(null);
   const editorRef = useRef<editor.IStandaloneCodeEditor | null>(null);
   const resizer = useRef<HTMLDivElement>(null);
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const monacoRef = useRef<any>(null);
 
   const [currentTab, setCurrentTab] = useState("chat");
@@ -114,20 +111,7 @@ export const AppEditor = ({ project }: { project?: Project | null }) => {
   };
 
   useMount(() => {
-    if (deploy && project?._id) {
-      toast.success("Your project is deployed! 🎉", {
-        action: {
-          label: "See Project",
-          onClick: () => {
-            window.open(
-              `https://huggingface.co/spaces/${project?.space_id}`,
-              "_blank"
-            );
-          },
-        },
-      });
-      router.replace(`/projects/${project?.space_id}`);
-    }
+    
     if (htmlStorage) {
       removeHtmlStorage();
       toast.warning("Previous HTML content restored from local storage.");
@@ -180,14 +164,16 @@ export const AppEditor = ({ project }: { project?: Project | null }) => {
       <Header tab={currentTab} onNewTab={setCurrentTab}>
         <LoadProject
           onSuccess={(project: Project) => {
-            router.push(`/projects/${project.space_id}`);
+            if (project.space_id && project.space_id !== "local") {
+              router.push(`/projects/${project.space_id}`);
+            } else {
+              setHtml(project.html);
+              setPrompts(project.prompts || []);
+              toast.success("Projeto HTML carregado.");
+            }
           }}
         />
-        {project?._id ? (
-          <SaveButton html={html} prompts={prompts} />
-        ) : (
-          <DeployButton html={html} prompts={prompts} />
-        )}
+        <SaveButton html={html} prompts={prompts} />
       </Header>
       <main className="bg-neutral-950 flex-1 max-lg:flex-col flex w-full max-lg:h-[calc(100%-82px)] relative">
         {currentTab === "chat" && (

components/editor/preview/index.tsx

@@ -129,7 +129,7 @@ export const Preview = ({
       />
       {!isAiWorking && hoveredElement && selectedElement && (
         <div
-          className="cursor-pointer absolute bg-sky-500/10 border-[2px] border-dashed border-sky-500 rounded-r-lg rounded-b-lg p-3 z-10 pointer-events-none"
+          className="cursor-pointer absolute bg-sky-500/10 border-[2px] border-dashed border-sky-500 p-3 z-10 pointer-events-none"
           style={{
             top:
               selectedElement.getBoundingClientRect().top +
@@ -141,36 +141,97 @@ export const Preview = ({
             height: selectedElement.getBoundingClientRect().height,
           }}
         >
-          <span className="bg-sky-500 rounded-t-md text-sm text-neutral-100 px-2 py-0.5 -translate-y-7 absolute top-0 left-0">
+          <span className="bg-sky-500 text-sm text-neutral-100 px-2 py-0.5 -translate-y-7 absolute top-0 left-0">
             {htmlTagToText(selectedElement.tagName.toLowerCase())}
           </span>
         </div>
       )}
-      <iframe
-        id="preview-iframe"
-        ref={iframeRef}
-        title="output"
-        className={classNames(
-          "w-full select-none transition-all duration-200 bg-black h-full",
-          {
-            "pointer-events-none": isResizing || isAiWorking,
-            "lg:max-w-md lg:mx-auto lg:!rounded-[42px] lg:border-[8px] lg:border-neutral-700 lg:shadow-2xl lg:h-[80dvh] lg:max-h-[996px]":
-              device === "mobile",
-            "lg:border-[8px] lg:border-neutral-700 lg:shadow-2xl lg:rounded-[24px]":
-              currentTab !== "preview" && device === "desktop",
-          }
-        )}
-        srcDoc={html}
-        onLoad={() => {
-          if (iframeRef?.current?.contentWindow?.document?.body) {
-            iframeRef.current.contentWindow.document.body.scrollIntoView({
-              block: isAiWorking ? "end" : "start",
-              inline: "nearest",
-              behavior: isAiWorking ? "instant" : "smooth",
-            });
-          }
-        }}
-      />
+      {device === "mobile" ? (
+        <div
+          style={{
+            width: 320,
+            height: 684,
+            border: "16px solid #222",
+            borderRadius: 40,
+            boxShadow: "0 8px 40px #0008",
+            position: "relative",
+            background: "#111",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            padding: 0,
+          }}
+        >
+          <div
+            style={{
+              position: "absolute",
+              top: 10,
+              left: "50%",
+              transform: "translateX(-50%)",
+              width: 60,
+              height: 5,
+              background: "#444",
+              borderRadius: 5,
+              zIndex: 3,
+            }}
+          />
+          <iframe
+            id="preview-iframe"
+            ref={iframeRef}
+            title="output"
+            className={classNames(
+              "w-full h-full select-none transition-all duration-200 bg-black",
+              {
+                "pointer-events-none": isResizing || isAiWorking,
+                "rounded-[32px]": false,
+              }
+            )}
+            style={{
+              border: "none",
+              width: 288,
+              height: 608,
+              borderRadius: 28,
+              marginTop: 24,
+              marginBottom: 24,
+              background: "#000",
+            }}
+            srcDoc={html}
+            onLoad={() => {
+              if (iframeRef?.current?.contentWindow?.document?.body) {
+                iframeRef.current.contentWindow.document.body.scrollIntoView({
+                  block: isAiWorking ? "end" : "start",
+                  inline: "nearest",
+                  behavior: isAiWorking ? "instant" : "smooth",
+                });
+              }
+            }}
+          />
+        </div>
+      ) : (
+        <iframe
+          id="preview-iframe"
+          ref={iframeRef}
+          title="output"
+          className={classNames(
+            "w-full select-none transition-all duration-200 bg-black h-full",
+            {
+              "pointer-events-none": isResizing || isAiWorking,
+              "lg:border-[8px] lg:border-neutral-700 lg:shadow-2xl":
+                currentTab !== "preview" && device === "desktop",
+            }
+          )}
+          srcDoc={html}
+          onLoad={() => {
+            if (iframeRef?.current?.contentWindow?.document?.body) {
+              iframeRef.current.contentWindow.document.body.scrollIntoView({
+                block: isAiWorking ? "end" : "start",
+                inline: "nearest",
+                behavior: isAiWorking ? "instant" : "smooth",
+              });
+            }
+          }}
+        />
+      )}
     </div>
   );
 };

components/editor/save-button/index.tsx

@@ -31,17 +31,7 @@ export function SaveButton({
         prompts,
       });
       if (res.data.ok) {
-        toast.success("Your space is updated! 🎉", {
-          action: {
-            label: "See Space",
-            onClick: () => {
-              window.open(
-                `https://huggingface.co/spaces/${namespace}/${repoId}`,
-                "_blank"
-              );
-            },
-          },
-        });
+        toast.success("Your space is updated! 🎉");
       } else {
         toast.error(res?.data?.error || "Failed to update space");
       }
@@ -55,20 +45,33 @@ export function SaveButton({
     <>
       <Button
         variant="default"
-        className="max-lg:hidden !px-4 relative"
+        size="sm"
+        className="lg:hidden relative"
         onClick={updateSpace}
       >
-        <MdSave className="size-4" />
-        Save your Project{" "}
-        {loading && <Loading className="ml-2 size-4 animate-spin" />}
+        Save {loading && <Loading className="ml-2 size-4 animate-spin" />}
       </Button>
       <Button
         variant="default"
-        size="sm"
-        className="lg:hidden relative"
-        onClick={updateSpace}
+        className="max-lg:hidden !px-4 relative"
+        onClick={() => {
+          let filename = prompt("Nome do arquivo .html:", "index.html");
+          if (!filename) return;
+          if (!filename.endsWith('.html')) filename += '.html';
+          const blob = new Blob([html], { type: "text/html" });
+          const url = URL.createObjectURL(blob);
+          const a = document.createElement("a");
+          a.href = url;
+          a.download = filename;
+          document.body.appendChild(a);
+          a.click();
+          document.body.removeChild(a);
+          URL.revokeObjectURL(url);
+          toast.success("HTML baixado com sucesso!");
+        }}
       >
-        Save {loading && <Loading className="ml-2 size-4 animate-spin" />}
+        Save to File
+        <MdSave className="ml-2" />
       </Button>
     </>
   );

components/login-modal/index.tsx

@@ -1,15 +1,11 @@
-import { useLocalStorage } from "react-use";
 import { Button } from "@/components/ui/button";
 import { Dialog, DialogContent, DialogTitle } from "@/components/ui/dialog";
-import { useUser } from "@/hooks/useUser";
-import { isTheSameHtml } from "@/lib/compare-html-diff";
 
 export const LoginModal = ({
   open,
-  html,
   onClose,
-  title = "Log In to use DeepSite for free",
-  description = "Log In through your Hugging Face account to continue using DeepSite and increase your monthly free limit.",
+  title = "Login is not available",
+  description = "This feature is currently disabled as the application no longer relies on Hugging Face authentication.",
 }: {
   open: boolean;
   html?: string;
@@ -17,15 +13,6 @@ export const LoginModal = ({
   title?: string;
   description?: string;
 }) => {
-  const { openLoginWindow } = useUser();
-  const [, setStorage] = useLocalStorage("html_content");
-  const handleClick = async () => {
-    if (html && !isTheSameHtml(html)) {
-      setStorage(html);
-    }
-    openLoginWindow();
-    onClose(false);
-  };
   return (
     <Dialog open={open} onOpenChange={onClose}>
       <DialogContent className="sm:max-w-lg lg:!p-8 !rounded-3xl !bg-white !border-neutral-100">
@@ -50,12 +37,12 @@ export const LoginModal = ({
             variant="black"
             size="lg"
             className="w-full !text-base !h-11 mt-8"
-            onClick={handleClick}
+            onClick={() => onClose(false)}
           >
-            Log In to Continue
+            Close
           </Button>
         </main>
       </DialogContent>
     </Dialog>
   );
-};
+};

components/my-projects/load-project.tsx

@@ -13,9 +13,6 @@ import {
 import Loading from "@/components/loading";
 import { Input } from "../ui/input";
 import { toast } from "sonner";
-import { api } from "@/lib/api";
-import { useUser } from "@/hooks/useUser";
-import { LoginModal } from "../login-modal";
 import { useRouter } from "next/navigation";
 
 export const LoadProject = ({
@@ -25,46 +22,28 @@ export const LoadProject = ({
   fullXsBtn?: boolean;
   onSuccess: (project: Project) => void;
 }) => {
-  const { user } = useUser();
-  const router = useRouter();
+    const router = useRouter();
 
-  const [openLoginModal, setOpenLoginModal] = useState(false);
   const [open, setOpen] = useState(false);
   const [url, setUrl] = useState<string>("");
   const [isLoading, setIsLoading] = useState(false);
 
-  const checkIfUrlIsValid = (url: string) => {
-    // should match a hugging face spaces URL like: https://huggingface.co/spaces/username/project or https://hf.co/spaces/username/project
-    const urlPattern = new RegExp(
-      /^(https?:\/\/)?(huggingface\.co|hf\.co)\/spaces\/([\w-]+)\/([\w-]+)$/,
-      "i"
-    );
-    return urlPattern.test(url);
-  };
-
   const handleClick = async () => {
     if (isLoading) return; // Prevent multiple clicks while loading
     if (!url) {
       toast.error("Please enter a URL.");
       return;
     }
-    if (!checkIfUrlIsValid(url)) {
-      toast.error("Please enter a valid Hugging Face Spaces URL.");
-      return;
-    }
 
-    const [username, namespace] = url
-      .replace("https://huggingface.co/spaces/", "")
-      .replace("https://hf.co/spaces/", "")
-      .split("/");
+    // The URL validation and parsing logic is removed as we are no longer using Hugging Face
 
     setIsLoading(true);
     try {
-      const response = await api.post(`/me/projects/${username}/${namespace}`);
+      // You will need to implement your own logic to import a project from a URL
+      // For now, this will just display a success message
       toast.success("Project imported successfully!");
       setOpen(false);
       setUrl("");
-      onSuccess(response.data.project);
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
     } catch (error: any) {
       if (error?.response?.data?.redirect) {
@@ -79,122 +58,98 @@ export const LoadProject = ({
   };
 
   return (
-    <>
-      {!user ? (
-        <>
-          <Button
-            variant="outline"
-            className="max-lg:hidden"
-            onClick={() => setOpenLoginModal(true)}
-          >
+    <Dialog open={open} onOpenChange={setOpen}>
+      <DialogTrigger asChild>
+        <div>
+          <Button variant="outline" className="max-lg:hidden">
             <Import className="size-4 mr-1.5" />
             Load existing Project
           </Button>
-          <Button
-            variant="outline"
-            size="sm"
-            className="lg:hidden"
-            onClick={() => setOpenLoginModal(true)}
-          >
+          <Button variant="outline" size="sm" className="lg:hidden">
             {fullXsBtn && <Import className="size-3.5 mr-1" />}
             Load
             {fullXsBtn && " existing Project"}
           </Button>
-          <LoginModal
-            open={openLoginModal}
-            onClose={setOpenLoginModal}
-            title="Log In to load your Project"
-            description="Log In through Hugging Face to load an existing project and increase your free limit!"
-          />
-        </>
-      ) : (
-        <Dialog open={open} onOpenChange={setOpen}>
-          <DialogTrigger asChild>
-            <div>
-              <Button variant="outline" className="max-lg:hidden">
-                <Import className="size-4 mr-1.5" />
-                Load existing Project
-              </Button>
-              <Button variant="outline" size="sm" className="lg:hidden">
-                {fullXsBtn && <Import className="size-3.5 mr-1" />}
-                Load
-                {fullXsBtn && " existing Project"}
-              </Button>
-            </div>
-          </DialogTrigger>
-          <DialogContent className="sm:max-w-md !p-0 !rounded-3xl !bg-white !border-neutral-100 overflow-hidden text-center">
-            <DialogTitle className="hidden" />
-            <header className="bg-neutral-50 p-6 border-b border-neutral-200/60">
-              <div className="flex items-center justify-center -space-x-4 mb-3">
-                <div className="size-11 rounded-full bg-pink-200 shadow-2xs flex items-center justify-center text-2xl opacity-50">
-                  🎨
-                </div>
-                <div className="size-13 rounded-full bg-amber-200 shadow-2xl flex items-center justify-center text-3xl z-2">
-                  🥳
-                </div>
-                <div className="size-11 rounded-full bg-sky-200 shadow-2xs flex items-center justify-center text-2xl opacity-50">
-                  💎
-                </div>
-              </div>
-              <p className="text-2xl font-semibold text-neutral-950">
-                Import a Project
-              </p>
-              <p className="text-base text-neutral-500 mt-1.5">
-                Enter the URL of your Hugging Face Space to import an existing
-                project.
-              </p>
-            </header>
-            <main className="space-y-4 px-9 pb-9 pt-2">
-              <div>
-                <p className="text-sm text-neutral-700 mb-2">
-                  Enter your Hugging Face Space
-                </p>
-                <Input
-                  type="text"
-                  placeholder="https://huggingface.com/spaces/username/project"
-                  value={url}
-                  onChange={(e) => setUrl(e.target.value)}
-                  onBlur={(e) => {
-                    const inputUrl = e.target.value.trim();
-                    if (!inputUrl) {
-                      setUrl("");
-                      return;
-                    }
-                    if (!checkIfUrlIsValid(inputUrl)) {
-                      toast.error("Please enter a valid URL.");
-                      return;
-                    }
-                    setUrl(inputUrl);
-                  }}
-                  className="!bg-white !border-neutral-300 !text-neutral-800 !placeholder:text-neutral-400 selection:!bg-blue-100"
-                />
-              </div>
-              <div>
-                <p className="text-sm text-neutral-700 mb-2">
-                  Then, let&apos;s import it!
-                </p>
-                <Button
-                  variant="black"
-                  onClick={handleClick}
-                  className="relative w-full"
-                >
-                  {isLoading ? (
-                    <>
-                      <Loading
-                        overlay={false}
-                        className="ml-2 size-4 animate-spin"
-                      />
-                      Fetching your Space...
-                    </>
-                  ) : (
-                    <>Import your Space</>
-                  )}
-                </Button>
-              </div>
-            </main>
-          </DialogContent>
-        </Dialog>
-      )}
-    </>
+        </div>
+      </DialogTrigger>
+      <DialogContent className="sm:max-w-md !p-0 !rounded-3xl !bg-white !border-neutral-100 overflow-hidden text-center">
+        <DialogTitle className="hidden" />
+        <header className="bg-neutral-50 p-6 border-b border-neutral-200/60">
+          <p className="text-2xl font-semibold text-neutral-950">
+            Import a Project
+          </p>
+          <p className="text-base text-neutral-500 mt-1.5">
+            Enter the URL of your project to import it.
+          </p>
+        </header>
+        <main className="space-y-4 px-9 pb-9 pt-2">
+          <div>
+            <p className="text-sm text-neutral-700 mb-2">
+              Load HTML from your computer
+            </p>
+            <Input
+              type="file"
+              accept=".html"
+              onChange={(e) => {
+                const file = e.target.files?.[0];
+                if (file) {
+                  const reader = new FileReader();
+                  reader.onload = (event) => {
+                    const htmlContent = event.target?.result as string;
+                    onSuccess({
+                      html: htmlContent,
+                      prompts: [],
+                      title: "Imported Project",
+                      user_id: "local",
+                      space_id: "local"
+                    });
+                    setOpen(false);
+                  };
+                  reader.readAsText(file);
+                }
+              }}
+              className="!bg-white !border-neutral-300 !text-neutral-800 !placeholder:text-neutral-400 selection:!bg-blue-100"
+            />
+          </div>
+          <div className="text-sm text-neutral-700 mb-2">
+            OR
+          </div>
+          <div>
+            <p className="text-sm text-neutral-700 mb-2">
+              Enter your Project URL
+            </p>
+            <Input
+              type="text"
+              placeholder="https://example.com/my-project"
+              value={url}
+              onChange={(e) => setUrl(e.target.value)}
+              className="!bg-white !border-neutral-300 !text-neutral-800 !placeholder:text-neutral-400 selection:!bg-blue-100"
+            />
+          </div>
+          <div>
+            <p className="text-sm text-neutral-700 mb-2">
+              Then, let&apos;s import it!
+            </p>
+            <Button
+              variant="black"
+              onClick={handleClick}
+              className="relative w-full"
+            >
+              {isLoading ? (
+                <>
+                  <Loading
+                    overlay={false}
+                    className="ml-2 size-4 animate-spin"
+                  />
+                  Importing...
+                </>
+              ) : (
+                <>Import Project</>
+              )}
+            </Button>
+          </div>
+        </main>
+      </DialogContent>
+    </Dialog>
   );
 };

components/my-projects/project-card.tsx

@@ -1,6 +1,6 @@
 import Link from "next/link";
 import { formatDistance } from "date-fns";
-import { EllipsisVertical, Settings } from "lucide-react";
+import { EllipsisVertical } from "lucide-react";
 
 import { Project } from "@/types";
 import { Button } from "@/components/ui/button";
@@ -8,8 +8,7 @@ import {
   DropdownMenu,
   DropdownMenuContent,
   DropdownMenuGroup,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
+    DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 
 export function ProjectCard({ project }: { project: Project }) {
@@ -56,15 +55,7 @@ export function ProjectCard({ project }: { project: Project }) {
           </DropdownMenuTrigger>
           <DropdownMenuContent className="w-56" align="start">
             <DropdownMenuGroup>
-              <a
-                href={`https://huggingface.co/spaces/${project.space_id}/settings`}
-                target="_blank"
-              >
-                <DropdownMenuItem>
-                  <Settings className="size-4 text-neutral-100" />
-                  Project Settings
-                </DropdownMenuItem>
-              </a>
+              
             </DropdownMenuGroup>
           </DropdownMenuContent>
         </DropdownMenu>

components/pro-modal/index.tsx

@@ -1,24 +1,15 @@
-import { useLocalStorage } from "react-use";
 import { Button } from "@/components/ui/button";
 import { Dialog, DialogContent, DialogTitle } from "@/components/ui/dialog";
-import { CheckCheck } from "lucide-react";
-import { isTheSameHtml } from "@/lib/compare-html-diff";
 
 export const ProModal = ({
   open,
-  html,
   onClose,
 }: {
   open: boolean;
-  html: string;
   onClose: React.Dispatch<React.SetStateAction<boolean>>;
 }) => {
-  const [, setStorage] = useLocalStorage("html_content");
   const handleProClick = () => {
-    if (!isTheSameHtml(html)) {
-      setStorage(html);
-    }
-    window.open("https://huggingface.co/subscribe/pro?from=DeepSite", "_blank");
+    // Replace with your own subscription logic
     onClose(false);
   };
   return (
@@ -26,55 +17,19 @@ export const ProModal = ({
       <DialogContent className="sm:max-w-lg lg:!p-8 !rounded-3xl !bg-white !border-neutral-100">
         <DialogTitle className="hidden" />
         <main className="flex flex-col items-start text-left relative pt-2">
-          <div className="flex items-center justify-start -space-x-4 mb-5">
-            <div className="size-14 rounded-full bg-pink-200 shadow-2xs flex items-center justify-center text-3xl opacity-50">
-              🚀
-            </div>
-            <div className="size-16 rounded-full bg-amber-200 shadow-2xl flex items-center justify-center text-4xl z-2">
-              🤩
-            </div>
-            <div className="size-14 rounded-full bg-sky-200 shadow-2xs flex items-center justify-center text-3xl opacity-50">
-              🥳
-            </div>
-          </div>
           <h2 className="text-2xl font-bold text-neutral-950">
-            Only $9 to enhance your possibilities
+            Upgrade to Pro
           </h2>
           <p className="text-neutral-500 text-base mt-2 max-w-sm">
-            It seems like you have reached the monthly free limit of DeepSite.
+            You have reached the monthly free limit.
           </p>
-          <hr className="bg-neutral-200 w-full max-w-[150px] my-6" />
-          <p className="text-lg mt-3 text-neutral-900 font-semibold">
-            Upgrade to a <ProTag className="mx-1" /> Account, and unlock your
-            DeepSite high quota access ⚡
-          </p>
-          <ul className="mt-3 space-y-1 text-neutral-500">
-            <li className="text-sm text-neutral-500 space-x-2 flex items-center justify-start gap-2 mb-3">
-              You&apos;ll also unlock some Hugging Face PRO features, like:
-            </li>
-            <li className="text-sm space-x-2 flex items-center justify-start gap-2">
-              <CheckCheck className="text-emerald-500 size-4" />
-              Get acces to thousands of AI app (ZeroGPU) with high quota
-            </li>
-            <li className="text-sm space-x-2 flex items-center justify-start gap-2">
-              <CheckCheck className="text-emerald-500 size-4" />
-              Get exclusive early access to new features and updates
-            </li>
-            <li className="text-sm space-x-2 flex items-center justify-start gap-2">
-              <CheckCheck className="text-emerald-500 size-4" />
-              Get free credits across all Inference Providers
-            </li>
-            <li className="text-sm text-neutral-500 space-x-2 flex items-center justify-start gap-2 mt-3">
-              ... and lots more!
-            </li>
-          </ul>
           <Button
             variant="black"
             size="lg"
             className="w-full !text-base !h-11 mt-8"
             onClick={handleProClick}
           >
-            Subscribe to PRO ($9/month)
+            Upgrade
           </Button>
         </main>
       </DialogContent>
@@ -82,11 +37,4 @@ export const ProModal = ({
   );
 };
 
-const ProTag = ({ className }: { className?: string }) => (
-  <span
-    className={`${className} bg-linear-to-br shadow-green-500/10 dark:shadow-green-500/20 inline-block -skew-x-12 border border-gray-200 from-pink-300 via-green-200 to-yellow-200 text-xs font-bold text-black shadow-lg rounded-md px-2.5 py-0.5`}
-  >
-    PRO
-  </span>
-);
 export default ProModal;

components/public/navigation/index.tsx

@@ -6,10 +6,7 @@ import Link from "next/link";
 import { useMount, useUnmount } from "react-use";
 import classNames from "classnames";
 
-import { Button } from "@/components/ui/button";
 import Logo from "@/assets/logo.svg";
-import { useUser } from "@/hooks/useUser";
-import { UserMenu } from "@/components/user-menu";
 
 const navigationLinks = [
   {
@@ -31,7 +28,6 @@ const navigationLinks = [
 ];
 
 export default function Navigation() {
-  const { openLoginWindow, user } = useUser();
   const [hash, setHash] = useState("");
 
   const selectorRef = useRef<HTMLDivElement>(null);
@@ -138,18 +134,6 @@ export default function Navigation() {
             <div className="size-1 bg-white rounded-full" />
           </div>
         </ul>
-        <div className="flex items-center justify-end gap-2">
-          {user ? (
-            <UserMenu className="!pl-3 !pr-4 !py-2 !h-auto !rounded-lg" />
-          ) : (
-            <>
-              <Button variant="link" size={"sm"} onClick={openLoginWindow}>
-                Log In
-              </Button>
-              <Button size={"sm"}>Sign Up</Button>
-            </>
-          )}
-        </div>
       </nav>
     </div>
   );

components/user-menu/index.tsx

@@ -1,6 +1,5 @@
 import {
-  ChartSpline,
-  CirclePlus,
+    CirclePlus,
   FolderCode,
   Import,
   LogOut,
@@ -63,12 +62,7 @@ export const UserMenu = ({ className }: { className?: string }) => {
               View Projects
             </DropdownMenuItem>
           </Link>
-          <a href="https://huggingface.co/settings/billing" target="_blank">
-            <DropdownMenuItem>
-              <ChartSpline className="size-4 text-neutral-100" />
-              Usage Quota
-            </DropdownMenuItem>
-          </a>
+          
         </DropdownMenuGroup>
         <DropdownMenuSeparator />
         <DropdownMenuItem

hooks/useUser.ts

@@ -1,29 +1,29 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 "use client";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
-import { useCookie } from "react-use";
+
 import { useRouter } from "next/navigation";
 
 import { User } from "@/types";
-import MY_TOKEN_KEY from "@/lib/get-cookie-name";
-import { api } from "@/lib/api";
+import { isAuthenticated } from "@/lib/auth";
 import { toast } from "sonner";
 
 export const useUser = (initialData?: {
   user: User | null;
   errCode: number | null;
 }) => {
-  const cookie_name = MY_TOKEN_KEY();
   const client = useQueryClient();
   const router = useRouter();
-  const [, setCookie, removeCookie] = useCookie(cookie_name);
-  const [currentRoute, setCurrentRoute] = useCookie("deepsite-currentRoute");
 
   const { data: { user, errCode } = { user: null, errCode: null }, isLoading } =
     useQuery({
       queryKey: ["user.me"],
       queryFn: async () => {
-        return { user: initialData?.user, errCode: initialData?.errCode };
+        const authResult = await isAuthenticated();
+        if (authResult && "id" in authResult) {
+          return { user: authResult as User, errCode: null };
+        }
+        return { user: null, errCode: 401 };
       },
       refetchOnWindowFocus: false,
       refetchOnReconnect: false,
@@ -32,63 +32,11 @@ export const useUser = (initialData?: {
       initialData: initialData
         ? { user: initialData?.user, errCode: initialData?.errCode }
         : undefined,
-      enabled: false,
+      enabled: true, // Enable the query to fetch the mock user
     });
 
-  const { data: loadingAuth } = useQuery({
-    queryKey: ["loadingAuth"],
-    queryFn: async () => false,
-    refetchOnWindowFocus: false,
-    refetchOnReconnect: false,
-    refetchOnMount: false,
-  });
-  const setLoadingAuth = (value: boolean) => {
-    client.setQueryData(["setLoadingAuth"], value);
-  };
-
-  const openLoginWindow = async () => {
-    setCurrentRoute(window.location.pathname);
-    return router.push("/auth");
-  };
-
-  const loginFromCode = async (code: string) => {
-    setLoadingAuth(true);
-    if (loadingAuth) return;
-    await api
-      .post("/auth", { code })
-      .then(async (res: any) => {
-        if (res.data) {
-          setCookie(res.data.access_token, {
-            expires: res.data.expires_in
-              ? new Date(Date.now() + res.data.expires_in * 1000)
-              : undefined,
-            sameSite: "none",
-            secure: true,
-          });
-          client.setQueryData(["user.me"], {
-            user: res.data.user,
-            errCode: null,
-          });
-          if (currentRoute) {
-            router.push(currentRoute);
-            setCurrentRoute("");
-          } else {
-            router.push("/projects");
-          }
-          toast.success("Login successful");
-        }
-      })
-      .catch((err: any) => {
-        toast.error(err?.data?.message ?? err.message ?? "An error occurred");
-      })
-      .finally(() => {
-        setLoadingAuth(false);
-      });
-  };
-
   const logout = async () => {
-    removeCookie();
-    router.push("/");
+    // Since authentication is removed, just reload the page
     toast.success("Logout successful");
     client.setQueryData(["user.me"], {
       user: null,
@@ -100,9 +48,7 @@ export const useUser = (initialData?: {
   return {
     user,
     errCode,
-    loading: isLoading || loadingAuth,
-    openLoginWindow,
-    loginFromCode,
+    loading: isLoading,
     logout,
   };
-};
+};

lib/api.ts

@@ -1,5 +1,5 @@
 import axios from "axios";
-import MY_TOKEN_KEY from "./get-cookie-name";
+
 
 export const api = axios.create({
   baseURL: `/api`,
@@ -15,21 +15,6 @@ export const apiServer = axios.create({
   },
 });
 
-api.interceptors.request.use(
-  async (config) => {
-    // get the token from cookies
-    const cookie_name = MY_TOKEN_KEY();
-    const token = document.cookie
-      .split("; ")
-      .find((row) => row.startsWith(`${cookie_name}=`))
-      ?.split("=")[1];
-    if (token) {
-      config.headers.Authorization = `Bearer ${token}`;
-    }
-    return config;
-  },
-  (error) => {
-    // Handle the error
-    return Promise.reject(error);
-  }
-);
+api.interceptors.request.use((config) => {
+  return config;
+});

lib/auth.ts

@@ -1,72 +1,22 @@
 import { User } from "@/types";
 import { NextResponse } from "next/server";
-import { cookies, headers } from "next/headers";
-import MY_TOKEN_KEY from "./get-cookie-name";
 
 // UserResponse = type User & { token: string };
 type UserResponse = User & { token: string };
 
-export const isAuthenticated = async (): // req: NextRequest
-Promise<UserResponse | NextResponse<unknown> | undefined> => {
-  const authHeaders = await headers();
-  const cookieStore = await cookies();
-  const token = cookieStore.get(MY_TOKEN_KEY())?.value
-    ? `Bearer ${cookieStore.get(MY_TOKEN_KEY())?.value}`
-    : authHeaders.get("Authorization");
-
-  if (!token) {
-    return NextResponse.json(
-      {
-        ok: false,
-        message: "Wrong castle fam :(",
-      },
-      {
-        status: 401,
-        headers: {
-          "Content-Type": "application/json",
-        },
-      }
-    );
-  }
-
-  const user = await fetch("https://huggingface.co/api/whoami-v2", {
-    headers: {
-      Authorization: token,
-    },
-    method: "GET",
-  })
-    .then((res) => res.json())
-    .catch(() => {
-      return NextResponse.json(
-        {
-          ok: false,
-          message: "Invalid token",
-        },
-        {
-          status: 401,
-          headers: {
-            "Content-Type": "application/json",
-          },
-        }
-      );
-    });
-  if (!user || !user.id) {
-    return NextResponse.json(
-      {
-        ok: false,
-        message: "Invalid token",
-      },
-      {
-        status: 401,
-        headers: {
-          "Content-Type": "application/json",
-        },
-      }
-    );
-  }
+export const isAuthenticated = async (): Promise<UserResponse | NextResponse<unknown> | undefined> => {
+  // Mock user for now, as Hugging Face authentication is removed
+  const user: User = {
+    id: "mock-user-id",
+    name: "Mock User",
+    fullname: "Mock User",
+    avatarUrl: "https://www.gravatar.com/avatar/?d=mp",
+    isPro: false,
+    isLocalUse: true,
+  };
 
   return {
     ...user,
-    token: token.replace("Bearer ", ""),
+    token: "mock-token",
   };
-};
+};

lib/consts.ts

@@ -5,16 +5,21 @@ export const defaultHTML = `<!DOCTYPE html>
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta charset="utf-8">
     <script src="https://cdn.tailwindcss.com"></script>
+    <style>
+      body { background: #181a20; }
+      .glass { background: #23242a; border-radius: 14px; }
+      .vibe-badge { border: 1px solid #ffe06650; background: #23242a; color: #ffe066; font-weight: 600; }
+      .neon { text-shadow: 0 0 1.5px #ffe066; }
+    </style>
   </head>
-  <body class="flex justify-center items-center h-screen overflow-hidden bg-white font-sans text-center px-6">
-    <div class="w-full">
-      <span class="text-xs rounded-full mb-2 inline-block px-2 py-1 border border-amber-500/15 bg-amber-500/15 text-amber-500">🔥 New version dropped!</span>
-      <h1 class="text-4xl lg:text-6xl font-bold font-sans">
-        <span class="text-2xl lg:text-4xl text-gray-400 block font-medium">I'm ready to work,</span>
+  <body class="flex justify-center items-center h-screen overflow-hidden font-sans text-center px-6 text-white">
+    <div class="w-full glass p-8">
+      <span class="text-xs rounded-full mb-4 inline-block px-3 py-1 vibe-badge">🔥 New version dropped!</span>
+      <h1 class="text-4xl lg:text-7xl font-black font-sans tracking-tight neon">
+        <span class="text-2xl lg:text-4xl block font-bold text-neutral-400 mb-1">I'm ready to work,</span>
         Ask me anything.
       </h1>
     </div>
-      <img src="https://enzostvs-deepsite.hf.space/arrow.svg" class="absolute bottom-8 left-0 w-[100px] transform rotate-[30deg]" />
     <script></script>
   </body>
 </html>

lib/get-cookie-name.ts

@@ -1,3 +0,0 @@
-export default function MY_TOKEN_KEY() {
-  return "deepsite-auth-token";
-}

lib/mongodb.ts

@@ -1,28 +0,0 @@
-import mongoose from "mongoose";
-
-const MONGODB_URI = process.env.MONGODB_URI;
-// @ts-expect-error iknown issue with mongoose types
-let cached = global.mongoose;
-
-if (!cached) {
-  // @ts-expect-error iknown issue with mongoose types
-  cached = global.mongoose = { conn: null, promise: null };
-}
-
-async function dbConnect() {
-  if (cached.conn) {
-    return cached.conn;
-  }
-
-  if (!cached.promise) {
-    cached.promise = mongoose
-      .connect(MONGODB_URI as string)
-      .then((mongoose) => {
-        return mongoose;
-      });
-  }
-  cached.conn = await cached.promise;
-  return cached.conn;
-}
-
-export default dbConnect;

lib/providers.ts

@@ -1,56 +1,17 @@
 export const PROVIDERS = {
-  "fireworks-ai": {
-    name: "Fireworks AI",
-    max_tokens: 131_000,
-    id: "fireworks-ai",
-  },
-  nebius: {
-    name: "Nebius AI Studio",
-    max_tokens: 131_000,
-    id: "nebius",
-  },
-  sambanova: {
-    name: "SambaNova",
-    max_tokens: 32_000,
-    id: "sambanova",
-  },
-  novita: {
-    name: "NovitaAI",
-    max_tokens: 16_000,
-    id: "novita",
-  },
-  hyperbolic: {
-    name: "Hyperbolic",
-    max_tokens: 131_000,
-    id: "hyperbolic",
-  },
-  together: {
-    name: "Together AI",
+  "openai-compatible": {
+    name: "OpenAI Compatible",
     max_tokens: 128_000,
-    id: "together",
+    id: "openai-compatible",
   },
 };
 
 export const MODELS = [
   {
-    value: "deepseek-ai/DeepSeek-V3-0324",
-    label: "DeepSeek V3 O324",
-    providers: ["fireworks-ai", "nebius", "sambanova", "novita", "hyperbolic"],
-    autoProvider: "novita",
-  },
-  {
-    value: "deepseek-ai/DeepSeek-R1-0528",
-    label: "DeepSeek R1 0528",
-    providers: [
-      "fireworks-ai",
-      "novita",
-      "hyperbolic",
-      "nebius",
-      "together",
-      "sambanova",
-    ],
-    autoProvider: "novita",
-    isNew: true,
-    isThinker: true,
+    value: "gpt-4o-mini", // Default model, can be overridden by user
+    label: "GPT-4o Mini (Default)",
+    providers: ["openai-compatible"],
+    autoProvider: "openai-compatible",
+    isThinker: false,
   },
 ];

package-lock.json

@@ -8,8 +8,6 @@
       "name": "deepsite-v2",
       "version": "0.1.0",
       "dependencies": {
-        "@huggingface/hub": "^2.2.0",
-        "@huggingface/inference": "^4.0.3",
         "@monaco-editor/react": "^4.7.0-rc.0",
         "@radix-ui/react-avatar": "^1.1.10",
         "@radix-ui/react-checkbox": "^1.3.2",
@@ -37,6 +35,7 @@
         "mongoose": "^8.15.1",
         "next": "15.3.3",
         "next-themes": "^0.4.6",
+        "openai": "^5.9.0",
         "react": "^19.0.0",
         "react-dom": "^19.0.0",
         "react-icons": "^5.5.0",
@@ -299,49 +298,6 @@
       "integrity": "sha512-MDWhGtE+eHw5JW7lq4qhc5yRLS11ERl1c7Z6Xd0a58DozHES6EnNNwUWbMiG4J9Cgj053Bhk8zvlhFYKVhULwg==",
       "license": "MIT"
     },
-    "node_modules/@huggingface/hub": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/@huggingface/hub/-/hub-2.2.0.tgz",
-      "integrity": "sha512-G+VS1eMp80KovIHBlsiEigS6I6qmI4j+VQ1UZ8CaXT+pw2A7tj6e/crfxFdKNE2uOK5oQkRFiCBJykMwrWQ8OA==",
-      "license": "MIT",
-      "dependencies": {
-        "@huggingface/tasks": "^0.19.11"
-      },
-      "bin": {
-        "hfjs": "dist/cli.js"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    },
-    "node_modules/@huggingface/inference": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/@huggingface/inference/-/inference-4.0.3.tgz",
-      "integrity": "sha512-TE1IvY+4DQJhjpJsFdBqDHu0Jg+p/+9G5UmW3hmLBcUJzy7P4J0yZky+VFniSVxI8dFA4eKKcW8/uYD+yZM9NA==",
-      "license": "MIT",
-      "dependencies": {
-        "@huggingface/jinja": "^0.5.0",
-        "@huggingface/tasks": "^0.19.12"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    },
-    "node_modules/@huggingface/jinja": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/@huggingface/jinja/-/jinja-0.5.0.tgz",
-      "integrity": "sha512-Ptc03/jGRiYRoi0bUYKZ14MkDslsBRT24oxmsvUlfYrvQMldrxCevhPnT+hfX8awKTT8/f/0ZBBWldoeAcMHdQ==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=18"
-      }
-    },
-    "node_modules/@huggingface/tasks": {
-      "version": "0.19.12",
-      "resolved": "https://registry.npmjs.org/@huggingface/tasks/-/tasks-0.19.12.tgz",
-      "integrity": "sha512-rg5+phoJg7SCqbUx9O9I+bfZkZBf6rqf2XGuN7M+uuwBSO4zO3V9s/Iqein1QSEhktR4g5OVBUZimodkX4ISkg==",
-      "license": "MIT"
-    },
     "node_modules/@humanfs/core": {
       "version": "0.19.1",
       "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz",
@@ -6885,6 +6841,26 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/openai": {
+      "version": "5.9.0",
+      "resolved": "https://registry.npmjs.org/openai/-/openai-5.9.0.tgz",
+      "integrity": "sha512-cmLC0pfqLLhBGxE4aZPyRPjydgYCncppV2ClQkKmW79hNjCvmzkfhz8rN5/YVDmjVQlFV+UsF1JIuNjNgeagyQ==",
+      "bin": {
+        "openai": "bin/cli"
+      },
+      "peerDependencies": {
+        "ws": "^8.18.0",
+        "zod": "^3.23.8"
+      },
+      "peerDependenciesMeta": {
+        "ws": {
+          "optional": true
+        },
+        "zod": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/optionator": {
       "version": "0.9.4",
       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",

package.json

@@ -9,8 +9,6 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@huggingface/hub": "^2.2.0",
-    "@huggingface/inference": "^4.0.3",
     "@monaco-editor/react": "^4.7.0-rc.0",
     "@radix-ui/react-avatar": "^1.1.10",
     "@radix-ui/react-checkbox": "^1.3.2",
@@ -38,6 +36,7 @@
     "mongoose": "^8.15.1",
     "next": "15.3.3",
     "next-themes": "^0.4.6",
+    "openai": "^5.9.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "react-icons": "^5.5.0",