Created prototype website (#6)

Author: DevaanshKathuria

.gitignore

@@ -39,3 +39,7 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+
+# playwright
+/test-results/
+/playwright-report/

e2e/auth-flow.spec.ts

@@ -0,0 +1,14 @@
+import { expect, test } from "@playwright/test";
+
+test("user can login and open problems page", async ({ page }) => {
+  await page.goto("/login");
+
+  await expect(page.getByRole("heading", { name: /sign in to continue/i })).toBeVisible();
+
+  await page.getByLabel("Email").fill("playwright@example.com");
+  await page.getByLabel("Password").fill("password123");
+  await page.getByRole("button", { name: "Sign in" }).click();
+
+  await expect(page).toHaveURL(/\/problems/);
+  await expect(page.getByRole("heading", { name: /^problems$/i })).toBeVisible();
+});

e2e/navigation-pages.spec.ts

@@ -0,0 +1,57 @@
+import { expect, test } from "@playwright/test";
+
+test("all primary pages load and are not blank", async ({ page }) => {
+  await page.goto("/login");
+
+  await page.getByLabel("Email").fill("navigation@example.com");
+  await page.getByLabel("Password").fill("password123");
+  await page.getByRole("button", { name: "Sign in" }).click();
+
+  const checks = [
+    { link: "Dashboard", pathSuffix: "/", heading: /^dashboard$/i },
+    { link: "Problems", pathSuffix: "/problems", heading: /^problems$/i },
+    {
+      link: "Competitions",
+      pathSuffix: "/competitions",
+      heading: /^competitions$/i,
+    },
+    { link: "Learn", pathSuffix: "/learn", heading: /^learn$/i },
+    { link: "Progress", pathSuffix: "/progress", heading: /^progress$/i },
+  ];
+
+  for (const item of checks) {
+    await page.getByRole("link", { name: item.link }).click();
+    await expect(page).toHaveURL(new RegExp(`${item.pathSuffix}$`));
+    await expect(page.getByRole("heading", { name: item.heading })).toBeVisible();
+  }
+});
+
+test("problem arena route opens from problems list", async ({ page }) => {
+  await page.goto("/login");
+
+  await page.getByLabel("Email").fill("arena@example.com");
+  await page.getByLabel("Password").fill("password123");
+  await page.getByRole("button", { name: "Sign in" }).click();
+
+  await page.getByRole("link", { name: "Problems" }).click();
+  await page.getByText("KNN Classifier on Iris", { exact: false }).first().click();
+
+  await expect(page).toHaveURL(/\/problems\/knn-classifier-iris/);
+  await expect(
+    page.getByRole("heading", { name: /knn classifier on iris/i })
+  ).toBeVisible();
+});
+
+test("topics in sidebar navigate to filtered problems", async ({ page }) => {
+  await page.goto("/login");
+
+  await page.getByLabel("Email").fill("topics@example.com");
+  await page.getByLabel("Password").fill("password123");
+  await page.getByRole("button", { name: "Sign in" }).click();
+
+  await page.getByRole("link", { name: "Learn" }).click();
+  await page.getByRole("button", { name: "Data Preprocessing" }).click();
+
+  await expect(page).toHaveURL(/\/problems\?category=Data\+Preprocessing$/);
+  await expect(page.getByRole("heading", { name: /^problems$/i })).toBeVisible();
+});

instrumentation-client.ts

@@ -0,0 +1,9 @@
+import * as Sentry from "@sentry/nextjs";
+
+Sentry.init({
+  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
+  tracesSampleRate: Number(process.env.NEXT_PUBLIC_SENTRY_TRACES_SAMPLE_RATE || 0.1),
+  environment: process.env.NEXT_PUBLIC_APP_ENV || process.env.NODE_ENV,
+  enabled: Boolean(process.env.NEXT_PUBLIC_SENTRY_DSN),
+  integrations: (integrations) => integrations,
+});

instrumentation.ts

@@ -0,0 +1,9 @@
+export async function register() {
+  if (process.env.NEXT_RUNTIME === "nodejs") {
+    await import("./sentry.server.config");
+  }
+
+  if (process.env.NEXT_RUNTIME === "edge") {
+    await import("./sentry.edge.config");
+  }
+}

middleware.ts

@@ -0,0 +1,38 @@
+import { NextRequest, NextResponse } from "next/server";
+import { AUTH_COOKIE_NAME } from "./src/lib/auth";
+
+function isAuthenticated(request: NextRequest): boolean {
+  return request.cookies.has(AUTH_COOKIE_NAME);
+}
+
+export function middleware(request: NextRequest) {
+  const { pathname, search } = request.nextUrl;
+  const authenticated = isAuthenticated(request);
+
+  if (pathname === "/login" && authenticated) {
+    const problemsUrl = new URL("/problems", request.url);
+    return NextResponse.redirect(problemsUrl);
+  }
+
+  if (!authenticated && pathname !== "/login") {
+    const loginUrl = new URL("/login", request.url);
+    const redirectPath = `${pathname}${search}`;
+    loginUrl.searchParams.set("redirect", redirectPath);
+    return NextResponse.redirect(loginUrl);
+  }
+
+  return NextResponse.next();
+}
+
+export const config = {
+  matcher: [
+    "/",
+    "/login",
+    "/problems/:path*",
+    "/competitions/:path*",
+    "/learn/:path*",
+    "/tracks/:path*",
+    "/progress/:path*",
+    "/profile/:path*",
+  ],
+};

next.config.ts

@@ -3,6 +3,10 @@ import type { NextConfig } from "next";
 const nextConfig: NextConfig = {
   /* config options here */
   reactCompiler: true,
+  allowedDevOrigins: ["127.0.0.1"],
+  turbopack: {
+    root: __dirname,
+  },
 };
 
 export default nextConfig;