@knotpad/app 0.1.0 → 0.1.2

package/app/upgrade/page.tsx

@@ -1,75 +0,0 @@
-import type { Metadata } from "next";
-import { auth } from "@/auth";
-import { redirect } from "next/navigation";
-import { prisma } from "@/lib/prisma";
-import { AppLogo } from "@/components/branding/app-logo";
-import { SwitchAccountButton } from "@/components/auth/switch-account-button";
-import { BillingDashboard } from "@/components/billing/billing-dashboard";
-
-export const metadata: Metadata = {
-  title: "Upgrade",
-  robots: "noindex, nofollow",
-};
-
-/**
- * Standalone upgrade page, outside the (app) route group.
- *
- * app/(app)/layout.tsx paywalls IS_CLOUD users whose workspaces are all FREE —
- * which would otherwise also block /settings/billing. This page resolves the
- * user's PERSONAL workspace directly (not via getActiveWorkspaceId, which on
- * cloud only returns Pro-accessible workspaces) so a FREE user always has a
- * path to checkout.
- */
-export default async function UpgradePage() {
-  const session = await auth();
-  if (!session) redirect("/login");
-
-  const member = await prisma.workspaceMember.findFirst({
-    where: { userId: session.user.id, workspace: { type: "PERSONAL" }, revokedAt: null },
-    include: {
-      workspace: {
-        include: { _count: { select: { members: { where: { revokedAt: null } } } } },
-      },
-    },
-  });
-  if (!member) redirect("/login");
-
-  const { workspace } = member;
-
-  const me = await prisma.user.findUnique({
-    where: { id: session.user.id },
-    select: { email: true, passwordHash: true },
-  });
-  const isGuest = !!me?.email?.endsWith("@local.brief") && !me?.passwordHash;
-
-  return (
-    <div className="flex min-h-full items-center justify-center px-6 py-12">
-      <div className="w-full max-w-lg space-y-6">
-        <div className="space-y-4">
-          <div className="flex justify-center sm:justify-start">
-            <AppLogo className="h-8 w-auto" />
-          </div>
-          <div>
-            <h1 className="text-xl font-semibold text-zinc-100">Upgrade to Knotpad Pro</h1>
-            <p className="mt-1 text-sm text-zinc-400">
-              Unlock cloud sync and access from any device, including the web and PWA.
-            </p>
-          </div>
-          <SwitchAccountButton className="rounded-md border border-zinc-700 px-4 py-2 text-sm text-zinc-300 hover:bg-zinc-900 transition-colors" />
-        </div>
-        <BillingDashboard
-          isPro={workspace.isPro}
-          isOwner={member.role === "OWNER"}
-          memberCount={workspace._count.members}
-          seatCount={workspace.seatCount}
-          stripeId={workspace.stripeId}
-          planType={workspace.planType}
-          licenseType={workspace.licenseType}
-          workspaceType={workspace.type}
-          workspaceId={workspace.id}
-          isGuest={isGuest}
-        />
-      </div>
-    </div>
-  );
-}

package/auth.config.ts

@@ -1,33 +0,0 @@
-import type { NextAuthConfig } from "next-auth";
-
-// Lightweight config for proxy.ts — no DB adapter, JWT-only verification.
-export const authConfig: NextAuthConfig = {
-  pages: { signIn: "/login" },
-  callbacks: {
-    authorized({ auth, request: { nextUrl } }) {
-      const isLoggedIn = !!auth?.user;
-      // Invite pages are accessible regardless of login state (invite page handles auth itself).
-      if (nextUrl.pathname.startsWith("/invite/")) return true;
-
-      const isAuthPage =
-        nextUrl.pathname === "/login" ||
-        nextUrl.pathname === "/register" ||
-        nextUrl.pathname === "/guest" ||
-        nextUrl.pathname === "/forgot-password" ||
-        nextUrl.pathname === "/reset-password";
-
-      if (isAuthPage) {
-        if (!isLoggedIn) return true;
-        // Logged-in user visiting an auth page — redirect away.
-        // Preserve ?next= so invite-accept flow isn't broken (e.g. /login?next=/invite/TOKEN).
-        // Validate next is a relative same-origin path to prevent open redirect.
-        const next = nextUrl.searchParams.get("next");
-        const safePath =
-          next && next.startsWith("/") && !next.startsWith("//") ? next : "/notes";
-        return Response.redirect(new URL(safePath, nextUrl));
-      }
-      return isLoggedIn;
-    },
-  },
-  providers: [],
-};

package/auth.ts

@@ -1,79 +0,0 @@
-import NextAuth from "next-auth";
-import { PrismaAdapter } from "@auth/prisma-adapter";
-import Credentials from "next-auth/providers/credentials";
-import Google from "next-auth/providers/google";
-import bcrypt from "bcryptjs";
-import { prisma, getCloudPrisma } from "@/lib/prisma";
-import { authConfig } from "@/auth.config";
-
-export const { handlers, auth, signIn, signOut } = NextAuth({
-  ...authConfig,
-  trustHost: true, // Required for local HTTP (NPX/Electron dev and production)
-  // Auth (User, Session, Account) lives in Neon — identity is cloud-scoped.
-  // Free/guest users skip OAuth entirely and use local credentials only.
-  adapter: getCloudPrisma() ? (PrismaAdapter(getCloudPrisma()!) as any) : undefined,
-  session: { strategy: "jwt" },
-  providers: [
-    Credentials({
-      credentials: {
-        email: { label: "Email", type: "email" },
-        password: { label: "Password", type: "password" },
-      },
-      async authorize(credentials) {
-        if (!credentials?.email) return null;
-
-        const email = credentials.email as string;
-
-        // Guest accounts live in local PGlite (no cloud account needed)
-        if (email.endsWith("@local.brief")) {
-          const localUser = await prisma.user.findUnique({ where: { email } });
-          if (localUser && !localUser.passwordHash) {
-            return { id: localUser.id, email: localUser.email, name: localUser.name ?? "Guest" };
-          }
-          return null;
-        }
-
-        // Real accounts: prefer cloud (Neon) when available, fall back to local PGlite
-        // so that registration works in fully-local mode (no CLOUD_DATABASE_URL).
-        const db = getCloudPrisma() ?? prisma;
-        const user = await db.user.findUnique({ where: { email } });
-        if (!user || !credentials.password || !user.passwordHash) return null;
-
-        const valid = await bcrypt.compare(credentials.password as string, user.passwordHash);
-        if (!valid) return null;
-
-        return { id: user.id, email: user.email, name: user.name ?? "" };
-      },
-    }),
-    ...(process.env.GOOGLE_CLIENT_ID && process.env.GOOGLE_CLIENT_SECRET
-      ? [
-          Google({
-            clientId: process.env.GOOGLE_CLIENT_ID,
-            clientSecret: process.env.GOOGLE_CLIENT_SECRET,
-          }),
-        ]
-      : []),
-  ],
-  callbacks: {
-    async jwt({ token, user }) {
-      if (user) token.id = user.id;
-      return token;
-    },
-    async session({ session, token }) {
-      if (token?.id) session.user.id = token.id as string;
-      return session;
-    },
-    authorized: authConfig.callbacks!.authorized,
-  },
-});
-
-declare module "next-auth" {
-  interface Session {
-    user: {
-      id: string;
-      email: string;
-      name: string;
-      image?: string;
-    };
-  }
-}

package/components/auth/login-form.tsx

@@ -1,302 +0,0 @@
-"use client";
-
-import { useState, Suspense } from "react";
-import { signIn } from "next-auth/react";
-import { useRouter, useSearchParams } from "next/navigation";
-import Link from "next/link";
-import { AppLogo } from "@/components/branding/app-logo";
-import { PasswordInput } from "@/components/auth/password-input";
-import { TwoFactorInput } from "@/components/auth/two-factor-input";
-import { Shield, Loader2 } from "lucide-react";
-
-export function LoginSkeleton() {
-  return (
-    <div className="w-full max-w-sm space-y-6">
-      <div className="h-8 w-48 animate-pulse rounded bg-zinc-800" />
-      <div className="h-4 w-64 animate-pulse rounded bg-zinc-800" />
-      <div className="space-y-4 pt-4">
-        <div className="h-10 animate-pulse rounded bg-zinc-800" />
-        <div className="h-10 animate-pulse rounded bg-zinc-800" />
-        <div className="h-10 animate-pulse rounded bg-zinc-800" />
-      </div>
-    </div>
-  );
-}
-
-// `isCloud` reflects the runtime: desktop/NPX (false) offers a local, no-account
-// "Start writing" path; the browser/cloud build (true) has no local DB, so it
-// only offers Log in / Sign up.
-export function LoginForm({ isCloud }: { isCloud: boolean }) {
-  return (
-    <Suspense fallback={<LoginSkeleton />}>
-      <LoginFormInner isCloud={isCloud} />
-    </Suspense>
-  );
-}
-
-function LoginFormInner({ isCloud }: { isCloud: boolean }) {
-  const router = useRouter();
-  const searchParams = useSearchParams();
-  const [error, setError] = useState("");
-  const [loading, setLoading] = useState(false);
-  const [needs2FA, setNeeds2FA] = useState(false);
-  const [twoFactorCode, setTwoFactorCode] = useState("");
-  const [credentials, setCredentials] = useState({ email: "", password: "" });
-
-  // Validate that ?next= is a same-origin relative path to prevent open redirect.
-  const rawNext = searchParams.get("next") ?? "";
-  const redirectTo =
-    rawNext.startsWith("/") && !rawNext.startsWith("//") ? rawNext : "/notes";
-  const justReset = searchParams.get("reset") === "1";
-
-  async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
-    e.preventDefault();
-    setLoading(true);
-    setError("");
-
-    const form = e.currentTarget;
-    const email = (form.elements.namedItem("email") as HTMLInputElement).value;
-    const password = (form.elements.namedItem("password") as HTMLInputElement).value;
-
-    setCredentials({ email, password });
-
-    try {
-      // Check if 2FA is required first
-      const checkRes = await fetch("/api/auth/check-2fa", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ email }),
-      });
-
-      const checkData = await checkRes.json();
-
-      if (checkData.requires2FA) {
-        setNeeds2FA(true);
-        setLoading(false);
-        return;
-      }
-
-      // No 2FA required, proceed with normal sign in
-      const result = await signIn("credentials", {
-        email,
-        password,
-        redirect: false,
-      });
-
-      if (result?.error) {
-        setError("Invalid email or password");
-        setLoading(false);
-      } else {
-        router.push(redirectTo);
-        router.refresh();
-      }
-    } catch {
-      setError("Something went wrong. Please try again.");
-      setLoading(false);
-    }
-  }
-
-  async function handle2FASubmit(e: React.FormEvent) {
-    e.preventDefault();
-    setLoading(true);
-    setError("");
-
-    try {
-      // Verify 2FA code
-      const res = await fetch("/api/auth/verify-2fa", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          email: credentials.email,
-          password: credentials.password,
-          code: twoFactorCode,
-        }),
-      });
-
-      const data = await res.json();
-
-      if (!res.ok) {
-        setError(data.error || "Invalid 2FA code");
-        setLoading(false);
-        return;
-      }
-
-      // 2FA verified, now sign in
-      const result = await signIn("credentials", {
-        email: credentials.email,
-        password: credentials.password,
-        redirect: false,
-      });
-
-      if (result?.error) {
-        setError("Authentication failed");
-        setLoading(false);
-      } else {
-        router.push(redirectTo);
-        router.refresh();
-      }
-    } catch {
-      setError("Something went wrong. Please try again.");
-      setLoading(false);
-    }
-  }
-
-  return (
-    <div className="w-full max-w-sm space-y-6">
-      <div className="flex justify-end">
-        <Link href="/" className="text-sm text-zinc-500 hover:text-zinc-300 transition-colors">
-          back to home
-        </Link>
-      </div>
-      <div>
-        <AppLogo className="mb-4 h-8 w-auto" />
-        <h1 className="text-2xl font-semibold tracking-tight">Welcome to Knotpad</h1>
-        <p className="mt-1 text-sm text-zinc-400">
-          {isCloud
-            ? "Sign in, or create an account to get started."
-            : "Start writing instantly — or sign in to your account."}
-        </p>
-      </div>
-
-      {/* Desktop/local: the primary, no-account path. */}
-      {!isCloud && (
-        <div className="space-y-2">
-          <Link
-            href="/guest"
-            className="block w-full rounded-md bg-zinc-100 px-4 py-2.5 text-center text-sm font-medium text-zinc-900 hover:bg-zinc-200 transition-colors"
-          >
-            Start writing
-          </Link>
-          <p className="text-center text-xs text-zinc-600">
-            No account needed. Your notes stay on this device.
-          </p>
-        </div>
-      )}
-
-      {!isCloud && (
-        <div className="relative">
-          <div className="absolute inset-0 flex items-center">
-            <div className="w-full border-t border-zinc-800" />
-          </div>
-          <div className="relative flex justify-center text-xs">
-            <span className="bg-zinc-950 px-3 text-zinc-600">or sign in</span>
-          </div>
-        </div>
-      )}
-
-      {justReset && (
-        <div className="rounded-md border border-emerald-800/40 bg-emerald-950/30 px-4 py-3">
-          <p className="text-sm text-emerald-300">Password updated. Sign in with your new password.</p>
-        </div>
-      )}
-
-      {needs2FA ? (
-        <form onSubmit={handle2FASubmit} className="space-y-4">
-          <div className="flex items-center gap-2 text-zinc-300">
-            <Shield size={18} />
-            <h2 className="text-sm font-medium">Two-Factor Authentication</h2>
-          </div>
-          <p className="text-xs text-zinc-400">
-            Enter the 6-digit code from your authenticator app.
-          </p>
-
-          <div className="space-y-1">
-            <label className="text-sm font-medium text-zinc-300">
-              2FA Code
-            </label>
-            <TwoFactorInput
-              value={twoFactorCode}
-              onChange={setTwoFactorCode}
-              length={6}
-              disabled={loading}
-              autoFocus
-            />
-          </div>
-
-          {error && <p className="text-sm text-red-400">{error}</p>}
-
-          <div className="flex gap-2">
-            <button
-              type="button"
-              onClick={() => {
-                setNeeds2FA(false);
-                setTwoFactorCode("");
-                setError("");
-              }}
-              className="flex-1 rounded-md border border-zinc-700 bg-zinc-900 px-4 py-2 text-sm font-medium text-zinc-100 hover:bg-zinc-800"
-            >
-              Back
-            </button>
-            <button
-              type="submit"
-              disabled={loading || twoFactorCode.length !== 6}
-              className="flex-1 rounded-md bg-zinc-100 px-4 py-2 text-sm font-medium text-zinc-900 hover:bg-zinc-200 disabled:opacity-50"
-            >
-              {loading ? (
-                <span className="flex items-center justify-center gap-1">
-                  <Loader2 size={14} className="animate-spin" />
-                  Verifying…
-                </span>
-              ) : (
-                "Verify"
-              )}
-            </button>
-          </div>
-        </form>
-      ) : (
-        <form onSubmit={handleSubmit} className="space-y-4">
-          <div className="space-y-1">
-            <label htmlFor="email" className="text-sm font-medium text-zinc-300">
-              Email
-            </label>
-            <input
-              id="email"
-              name="email"
-              type="email"
-              required
-              autoComplete="email"
-              className="w-full rounded-md border border-zinc-700 bg-zinc-900 px-3 py-2 text-sm text-zinc-100 placeholder-zinc-500 focus:border-zinc-500 focus:outline-none"
-              placeholder="you@example.com"
-            />
-          </div>
-
-          <div className="space-y-1">
-            <label htmlFor="password" className="text-sm font-medium text-zinc-300">
-              Password
-            </label>
-            <PasswordInput
-              id="password"
-              name="password"
-              required
-              autoComplete="current-password"
-              placeholder="••••••••"
-            />
-          </div>
-
-          {error && <p className="text-sm text-red-400">{error}</p>}
-
-          <div className="flex justify-end">
-            <Link href="/forgot-password" className="text-xs text-zinc-600 hover:text-zinc-400 transition-colors">
-              Forgot password?
-            </Link>
-          </div>
-
-          <button
-            type="submit"
-            disabled={loading}
-            className="w-full rounded-md border border-zinc-700 bg-zinc-900 px-4 py-2 text-sm font-medium text-zinc-100 hover:bg-zinc-800 disabled:opacity-50"
-          >
-            {loading ? "Signing in…" : "Sign in"}
-          </button>
-        </form>
-      )}
-
-      <p className="text-center text-sm text-zinc-500">
-        {isCloud ? "Want cloud sync and Pro? " : "Need cloud sync across devices? "}
-        <Link href="/register" className="text-zinc-300 underline underline-offset-2 hover:text-white">
-          Sign up
-        </Link>
-      </p>
-    </div>
-  );
-}

package/components/auth/password-checklist.tsx

@@ -1,31 +0,0 @@
-"use client";
-
-import { Check, X } from "lucide-react";
-
-const RULES: { label: string; test: (pw: string) => boolean }[] = [
-  { label: "At least 8 characters", test: (pw) => pw.length >= 8 },
-  { label: "One uppercase letter", test: (pw) => /[A-Z]/.test(pw) },
-  { label: "One lowercase letter", test: (pw) => /[a-z]/.test(pw) },
-  { label: "One number", test: (pw) => /[0-9]/.test(pw) },
-  { label: "One symbol (e.g. !?#$%)", test: (pw) => /[^A-Za-z0-9]/.test(pw) },
-];
-
-export function PasswordChecklist({ password }: { password: string }) {
-  return (
-    <ul className="space-y-1">
-      {RULES.map((rule) => {
-        const met = rule.test(password);
-        return (
-          <li key={rule.label} className="flex items-center gap-1.5 text-xs">
-            {met ? (
-              <Check className="h-3.5 w-3.5 text-emerald-500" />
-            ) : (
-              <X className="h-3.5 w-3.5 text-zinc-700" />
-            )}
-            <span className={met ? "text-zinc-400" : "text-zinc-600"}>{rule.label}</span>
-          </li>
-        );
-      })}
-    </ul>
-  );
-}

package/components/auth/password-input.tsx

@@ -1,36 +0,0 @@
-"use client";
-
-import { useState, forwardRef } from "react";
-import { Eye, EyeOff } from "lucide-react";
-
-type Props = Omit<React.InputHTMLAttributes<HTMLInputElement>, "type">;
-
-export const PasswordInput = forwardRef<HTMLInputElement, Props>(function PasswordInput(
-  { className, ...props },
-  ref
-) {
-  const [visible, setVisible] = useState(false);
-
-  return (
-    <div className="relative">
-      <input
-        {...props}
-        ref={ref}
-        type={visible ? "text" : "password"}
-        className={
-          className ??
-          "w-full rounded-md border border-zinc-700 bg-zinc-900 px-3 py-2 pr-10 text-sm text-zinc-100 placeholder-zinc-500 focus:border-zinc-500 focus:outline-none ring-focus"
-        }
-      />
-      <button
-        type="button"
-        onClick={() => setVisible((v) => !v)}
-        tabIndex={-1}
-        aria-label={visible ? "Hide password" : "Show password"}
-        className="absolute inset-y-0 right-0 flex items-center px-3 text-zinc-500 hover:text-zinc-300 transition-colors"
-      >
-        {visible ? <EyeOff className="h-4 w-4" /> : <Eye className="h-4 w-4" />}
-      </button>
-    </div>
-  );
-});

package/components/auth/switch-account-button.test.tsx

@@ -1,22 +0,0 @@
-// @vitest-environment jsdom
-import { render, screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import { describe, expect, it, vi } from "vitest";
-import { SwitchAccountButton } from "@/components/auth/switch-account-button";
-
-const signOut = vi.fn();
-
-vi.mock("next-auth/react", () => ({
-  signOut: (...args: unknown[]) => signOut(...args),
-}));
-
-describe("SwitchAccountButton", () => {
-  it("signs the user out to the login page when clicked", async () => {
-    const user = userEvent.setup();
-    render(<SwitchAccountButton />);
-
-    await user.click(screen.getByRole("button", { name: "Switch account" }));
-
-    expect(signOut).toHaveBeenCalledWith({ callbackUrl: "/login" });
-  });
-});

package/components/auth/switch-account-button.tsx

@@ -1,19 +0,0 @@
-"use client";
-
-import { signOut } from "next-auth/react";
-
-type SwitchAccountButtonProps = {
-  className?: string;
-};
-
-export function SwitchAccountButton({ className }: SwitchAccountButtonProps) {
-  return (
-    <button
-      type="button"
-      onClick={() => signOut({ callbackUrl: "/login" })}
-      className={className}
-    >
-      Switch account
-    </button>
-  );
-}