m

Author: shadil-rayyan

.gitignore

@@ -17,6 +17,9 @@
 /.next/
 /out/
 
+# open-next / Cloudflare artifacts
+/.open-next/
+
 # production
 /build
 
@@ -36,6 +39,10 @@ yarn-error.log*
 # vercel
 .vercel
 
+# Playwright
+/playwright-report/
+/test-results/
+
 # typescript
 *.tsbuildinfo
 next-env.d.ts

__tests__/components/tabs.test.tsx

@@ -0,0 +1,24 @@
+import { render, screen } from '@testing-library/react';
+import { Tabs, TabsList, TabsTrigger, TabsContent } from '@/components/ui/tabs';
+
+function TabsExample() {
+  return (
+    <Tabs defaultValue="one">
+      <TabsList>
+        <TabsTrigger value="one">One</TabsTrigger>
+        <TabsTrigger value="two">Two</TabsTrigger>
+      </TabsList>
+      <TabsContent value="one">Tab One Content</TabsContent>
+      <TabsContent value="two">Tab Two Content</TabsContent>
+    </Tabs>
+  );
+}
+
+describe('Tabs component', () => {
+  it('renders triggers and default content', () => {
+    render(<TabsExample />);
+    expect(screen.getByRole('tab', { name: 'One' })).toBeInTheDocument();
+    expect(screen.getByRole('tab', { name: 'Two' })).toBeInTheDocument();
+    expect(screen.getByText('Tab One Content')).toBeInTheDocument();
+  });
+});

__tests__/lib/utils.test.ts

@@ -0,0 +1,13 @@
+import { cn } from '@/lib/utils';
+
+describe('cn utility', () => {
+  it('merges class names correctly', () => {
+    expect(cn('a', 'b')).toBe('a b');
+    expect(cn('a', false && 'b', undefined as unknown as string, 'c')).toBe('a c');
+  });
+
+  it('dedupes Tailwind classes with conflicts', () => {
+    // tailwind-merge should remove the first bg-red-500 in favor of bg-blue-500
+    expect(cn('bg-red-500 p-2', 'bg-blue-500')).toBe('p-2 bg-blue-500');
+  });
+});

docs/README.md

@@ -0,0 +1,7 @@
+# Project Collaboration Platform Docs
+
+This folder contains user-facing and internal developer documentation.
+
+- Feature Overview: `features.md`
+- Internal Developer Guide: `internal-developer-guide.md`
+- Testing Guide: `testing.md`

docs/features.md

@@ -0,0 +1,16 @@
+# Feature Overview
+
+- Add projects with name, description, link, and categories.
+- Contact fields: Instagram, LinkedIn, Email, WhatsApp on `projects` table.
+- Filter/search projects by category options via `category_option_values` and `project_options`.
+- Profile: view user-created projects.
+- Admin panels for managing categories and projects.
+
+## Data Model
+
+- `users(uid, user_role)`
+- `categories(category_id, category)`
+- `category_option_values(option_id, option_name, category_id)`
+- `projects(project_id, ..., contact_*)`
+- `project_options(id, project_id, category_id, option_id)`
+- `team_members(member_id, project_id, name, linkedin)`

docs/internal-developer-guide.md

@@ -0,0 +1,43 @@
+# Internal Developer Guide
+
+## Tech Stack
+
+- Next.js 15 (App Router)
+- React 19
+- Drizzle ORM + PostgreSQL
+- Firebase Auth + Storage
+- TailwindCSS
+
+## Local Setup
+
+- Copy `.env.local` from a teammate or populate based on `README.md`.
+- Install: `npm install`
+- DB: `npm run db:push`
+- Dev: `npm run dev` ([http://localhost:3001](http://localhost:3001))
+
+## Useful Scripts
+
+- Build: `npm run build`
+- Lint: `npm run lint`
+- Drizzle: `npm run drizzle:studio`, `npm run db:push`, `npm run db:generate`
+- Tests: `npm test`, `npm run e2e`
+
+## Code Structure
+
+- `app/` layouts, pages, API routes
+- `components/` UI components (notably `components/repeto/*`)
+- `lib/` DB (`lib/db.ts`), schema (`lib/schema.ts`), utils (`lib/utils.ts`)
+- `util/` helpers: `uploadImage.ts`
+- `types/` shared TS types
+
+## Conventions
+
+- Use `@/` absolute imports (see `tsconfig.json` paths).
+- Keep server-only code out of client components.
+- Add unit tests for utilities and leaf UI components.
+- Add e2e tests for core flows (home, add-project, profile).
+
+## Deployment
+
+- GitHub Pages workflow exists at `.github/workflows/nextjs.yml`.
+- Cloudflare-specific artifacts are not used; `.open-next/` is ignored and should not be committed.

docs/testing.md

@@ -0,0 +1,17 @@
+# Testing Guide
+
+## Unit Tests (Jest + Testing Library)
+- Run all: `npm test`
+- Watch mode: `npm run test:watch`
+- Location: `__tests__/` with `*.test.ts|tsx`
+
+## E2E Tests (Playwright)
+- Install browsers: `npx playwright install`
+- Run: `npm run e2e`
+- Headed: `npm run e2e:headed`
+- Report: `npm run e2e:report`
+- Config: `playwright.config.ts` (starts `npm run dev` on port 3001)
+
+## Artifacts
+- Coverage: `coverage/`
+- Playwright: `test-results/`, `playwright-report/`

jest.config.mjs

@@ -0,0 +1,16 @@
+import nextJest from 'next/jest.js';
+
+const createJestConfig = nextJest({
+  dir: './',
+});
+
+const customJestConfig = {
+  testEnvironment: 'jest-environment-jsdom',
+  setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/$1',
+  },
+  testMatch: ['**/__tests__/**/*.(test|spec).(ts|tsx)'],
+};
+
+export default createJestConfig(customJestConfig);

jest.config.ts

@@ -0,0 +1,17 @@
+import nextJest from 'next/jest';
+
+const createJestConfig = nextJest({
+  dir: './',
+});
+
+const config = {
+  testEnvironment: 'jest-environment-jsdom',
+  setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/$1',
+  },
+  testMatch: ['**/__tests__/**/*.(test|spec).(ts|tsx)'],
+  transform: {}, // next/jest handles transforms via SWC
+};
+
+export default createJestConfig(config);

jest.setup.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';