feat: add immersive writer sanctuary dashboard Closes #34

package.json

@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "framer-motion": "^12.40.0"
+  }
+}

server/src/config/env.ts

@@ -24,4 +24,5 @@ export const env = {
 
   FRONTEND_URL: process.env.FRONTEND_URL || 'http://localhost:3000',
   ALLOW_DEGRADED_START: process.env.ALLOW_DEGRADED_START === 'true',
+  INTERNAL_AUTH_SHARED_SECRET: process.env.INTERNAL_AUTH_SHARED_SECRET || 'fallback_dev_secret',
 };

server/src/controllers/auth.controller.ts

@@ -1,8 +1,47 @@
 import { Request, Response, NextFunction } from 'express';
 import { authService } from '../services/auth.service';
 import { AppError } from '../middleware/errorHandler';
+import crypto from 'crypto';
+import { env } from '../config/env';
 
 export const authController = {
+  async oauthLogin(req: Request, res: Response, next: NextFunction) {
+    try {
+      const { email, displayName, avatarUrl, provider, providerId, signature } = req.body;
+
+      if (!email || !provider || !providerId || !signature) {
+        throw new AppError('Missing required OAuth parameters', 400);
+      }
+
+      // Secure backend verification using a shared secret
+      const expectedSignature = crypto
+        .createHmac('sha256', env.INTERNAL_AUTH_SHARED_SECRET)
+        .update(`${providerId}:${email}`)
+        .digest('hex');
+
+      if (signature !== expectedSignature) {
+        throw new AppError('Unauthorized internal request signature', 403);
+      }
+
+      const result = await authService.oauthLogin({
+        email,
+        displayName,
+        avatarUrl,
+        provider,
+        providerId,
+      });
+
+      const { user, tokens } = result;
+
+      res.status(200).json({
+        success: true,
+        user,
+        token: tokens.accessToken,
+        data: result,
+      });
+    } catch (err) { next(err); }
+  },
+
   async register(req: Request, res: Response, next: NextFunction) {
     try {
       const { email, password, displayName, name, role } = req.body;

server/src/routes/auth.routes.ts

@@ -45,6 +45,7 @@ const refreshSchema = z.object({
 router.post('/register', authLimiter, validate(registerSchema), authController.register);
 router.post('/signup', authLimiter, validate(registerSchema), authController.register);
 router.post('/login', authLimiter, validate(loginSchema), authController.login);
+router.post('/oauth-login', authLimiter, authController.oauthLogin);
 router.post('/refresh', validate(refreshSchema), authController.refresh);
 router.post('/logout', authenticate, authController.logout);
 router.get('/me', authenticate, authController.getMe);

server/src/services/auth.service.ts

@@ -20,6 +20,67 @@ function generateTokens(user: { id: string; email: string; role: UserRole }): Au
 }
 
 export const authService = {
+  async oauthLogin(data: {
+    email: string;
+    displayName: string;
+    avatarUrl?: string;
+    provider: 'google' | 'facebook';
+    providerId: string;
+  }) {
+    if (!data?.email || !data.email.trim()) {
+      throw new AppError('Email is required', 400);
+    }
+    if (!data?.provider || !data?.providerId) {
+      throw new AppError('OAuth provider and provider ID are required', 400);
+    }
+
+    const normalizedEmail = data.email.trim().toLowerCase();
+
+    // 1. Check if user already exists (by email or oauth credentials)
+    let userDoc = await UserModel.findOne({
+      $or: [
+        { email: normalizedEmail },
+        { oauth_provider: data.provider, oauth_id: data.providerId }
+      ]
+    });
+
+    if (!userDoc) {
+      // 2. Register new OAuth user
+      userDoc = await UserModel.create({
+        email: normalizedEmail,
+        display_name: data.displayName.trim(),
+        avatar_url: data.avatarUrl || null,
+        oauth_provider: data.provider,
+        oauth_id: data.providerId,
+        role: 'writer', // Default role
+        is_verified: true, // OAuth verified users are pre-verified
+      });
+    } else {
+      // 3. User exists, link OAuth provider credentials if missing
+      let needsUpdate = false;
+      if (!userDoc.oauth_provider) {
+        userDoc.oauth_provider = data.provider;
+        userDoc.oauth_id = data.providerId;
+        needsUpdate = true;
+      }
+      if (data.avatarUrl && !userDoc.avatar_url) {
+        userDoc.avatar_url = data.avatarUrl;
+        needsUpdate = true;
+      }
+      if (needsUpdate) {
+        await userDoc.save();
+      }
+    }
+
+    // 4. Generate backend custom tokens
+    const user = normalize(userDoc);
+    const tokens = generateTokens({ id: user.id, email: user.email, role: user.role });
+    await UserModel.findByIdAndUpdate(user.id, { refresh_token: tokens.refreshToken });
+
+    const { password_hash, refresh_token, ...safeUser } = user as any;
+    return { user: safeUser, tokens };
+  },
+
   async register(data: { email: string; password: string; displayName: string; role?: UserRole }) {
     if (!data?.email || !data.email.trim()) {
       throw new AppError('Email is required', 400);

server/tsconfig.json

@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
     "target": "ES2022",
-    "module": "commonjs",
+    "module": "node16",
     "lib": ["ES2022"],
     "outDir": "./dist",
     "rootDir": "./src",
@@ -12,8 +12,7 @@
     "declaration": true,
     "declarationMap": true,
     "sourceMap": true,
-    "moduleResolution": "node",
-    "ignoreDeprecations": "6.0",
+    "moduleResolution": "node16",
     "strict": false,
     "skipLibCheck": true,
     "noImplicitAny": false

web/lint8.txt

@@ -0,0 +1,84 @@
+
+> web@0.1.0 lint
+> eslint
+
+
+E:\Projects\writers-pub\web\src\app\agora\[id]\page.tsx
+  14:10  warning  'FeedbackItemSkeleton' is defined but never used         @typescript-eslint/no-unused-vars
+  50:9   warning  'draftDateFormatted' is assigned a value but never used  @typescript-eslint/no-unused-vars
+
+E:\Projects\writers-pub\web\src\app\agora\leaderboard\page.tsx
+  74:64  error  `'` can be escaped with `'`, `‘`, `'`, `’`  react/no-unescaped-entities
+
+E:\Projects\writers-pub\web\src\app\agora\page.tsx
+   8:10  warning  'Badge' is defined but never used               @typescript-eslint/no-unused-vars
+  11:3   warning  'MessageSquare' is defined but never used       @typescript-eslint/no-unused-vars
+  12:3   warning  'BookOpen' is defined but never used            @typescript-eslint/no-unused-vars
+  13:3   warning  'Clock' is defined but never used               @typescript-eslint/no-unused-vars
+  18:3   warning  'Eye' is defined but never used                 @typescript-eslint/no-unused-vars
+  23:10  warning  'useFormattedDate' is defined but never used    @typescript-eslint/no-unused-vars
+  23:28  warning  'useFormattedNumber' is defined but never used  @typescript-eslint/no-unused-vars
+
+E:\Projects\writers-pub\web\src\app\studio\brainstorm\page.tsx
+  53:14  warning  'error' is defined but never used  @typescript-eslint/no-unused-vars
+
+E:\Projects\writers-pub\web\src\components\DraftCard.tsx
+  47:72  error  Unexpected any. Specify a different type  @typescript-eslint/no-explicit-any
+
+E:\Projects\writers-pub\web\src\components\layout\MainLayout.tsx
+  27:5  error  Error: Calling setState synchronously within an effect can trigger cascading renders
+
+Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following:
+* Update external systems with the latest state from React.
+* Subscribe for updates from some external system, calling setState in a callback function when external state changes.
+
+Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect).
+
+E:\Projects\writers-pub\web\src\components\layout\MainLayout.tsx:27:5
+  25 |
+  26 |   useEffect(() => {
+> 27 |     setIsMounted(true);
+     |     ^^^^^^^^^^^^ Avoid calling setState() directly within an effect
+  28 |   }, []);
+  29 |
+  30 |   useEffect(() => {  react-hooks/set-state-in-effect
+
+E:\Projects\writers-pub\web\src\components\ui\Avatar.tsx
+  38:9  warning  Using `<img>` could result in slower LCP and higher bandwidth. Consider using `<Image />` from `next/image` or a custom image loader to automatically optimize images. This may incur additional usage or cost from your provider. See: https://nextjs.org/docs/messages/no-img-element  @next/next/no-img-element
+
+E:\Projects\writers-pub\web\src\lib\useFormatDate.ts
+  16:7  error  Error: Calling setState synchronously within an effect can trigger cascading renders
+
+Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following:
+* Update external systems with the latest state from React.
+* Subscribe for updates from some external system, calling setState in a callback function when external state changes.
+
+Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect).
+
+E:\Projects\writers-pub\web\src\lib\useFormatDate.ts:16:7
+  14 |       const day = date.getDate();
+  15 |       const year = date.getFullYear();
+> 16 |       setFormatted(`${month} ${day}, ${year}`);
+     |       ^^^^^^^^^^^^ Avoid calling setState() directly within an effect
+  17 |     } catch {
+  18 |       setFormatted('Unknown date');
+  19 |     }  react-hooks/set-state-in-effect
+  34:7  error  Error: Calling setState synchronously within an effect can trigger cascading renders
+
+Effects are intended to synchronize state between React and external systems such as manually updating the DOM, state management libraries, or other platform APIs. In general, the body of an effect should do one or both of the following:
+* Update external systems with the latest state from React.
+* Subscribe for updates from some external system, calling setState in a callback function when external state changes.
+
+Calling setState synchronously within an effect body causes cascading renders that can hurt performance, and is not recommended. (https://react.dev/learn/you-might-not-need-an-effect).
+
+E:\Projects\writers-pub\web\src\lib\useFormatDate.ts:34:7
+  32 |   useEffect(() => {
+  33 |     try {
+> 34 |       setFormatted(new Intl.NumberFormat('en-US').format(num));
+     |       ^^^^^^^^^^^^ Avoid calling setState() directly within an effect
+  35 |     } catch {
+  36 |       setFormatted(String(num));
+  37 |     }                                react-hooks/set-state-in-effect
+
+Γ£û 16 problems (5 errors, 11 warnings)
+