[CRM/OA][Fullstack] - Repository Cleanup (#285)

* repo cleanup

* prettier

* lint

Author: LOTaher

docker-compose.yaml

@@ -30,6 +30,8 @@ services:
         build:
             context: ./src/ws/
             dockerfile: Dockerfile
+        env_file:
+            - .env
         ports:
             - 8080:8080
         volumes:

package.json

@@ -6,6 +6,7 @@
     "scripts": {
         "dev:migrate": "npx prisma migrate dev",
         "dev:start": "next dev",
+        "dev:ws": "node --env-file .env src/ws/index.js",
         "dev": "npm run dev:migrate && npm run dev:start",
         "build": "prisma generate && next build",
         "start": "next start",

src/lib/components/core/Sidebar.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { Home, File, Users, Book, Archive, Settings, ChevronDown } from 'lucide-react';
+import { Home, File, Users, Settings, ChevronDown } from 'lucide-react';
 import { useAuth } from '@/lib/auth/auth-context';
 import Image from 'next/image';
 import useOnboardingState from '@/lib/hooks/useOnboardingState';
@@ -694,16 +694,6 @@ const sidebarMenuItems = [
         url: '/crm/positions',
         icon: Users,
     },
-    {
-        title: 'Live Assessments',
-        url: '#',
-        icon: Book,
-    },
-    {
-        title: 'Archived Assessments',
-        url: '#',
-        icon: Archive,
-    },
 ];
 
 export function Sidebar() {

src/lib/components/modal/LostConnectionModal.tsx

@@ -9,7 +9,11 @@ export type LostConnectionModalProps = {
 export function LostConnectionModal({ open, onOpenChange }: LostConnectionModalProps) {
     return (
         <Dialog open={open} onOpenChange={onOpenChange}>
-            <DialogContent className="h-[180px] w-[340px] gap-4" showCloseButton={false}>
+            <DialogContent
+                className="h-[184px] w-[361px] gap-4"
+                backgroundClassName="backdrop-blur-md"
+                showCloseButton={false}
+            >
                 <VisuallyHidden>
                     <DialogTitle>Network Disconnected</DialogTitle>
                 </VisuallyHidden>

src/lib/components/modal/WindowUnfocusedModal.tsx

@@ -1,26 +1,35 @@
 import { Button } from '@/lib/components/ui/Button';
+import { Dialog, DialogContent, DialogTitle } from '@/lib/components/ui/Modal';
+import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
 
 type WindowUnfocusedModalProps = {
     open: boolean;
     onAcknowledge: () => void;
 };
 
 export function WindowUnfocusedModal({ open, onAcknowledge }: WindowUnfocusedModalProps) {
-    if (!open) return null;
-
     return (
-        <div className="fixed inset-0 z-50 flex items-center justify-center bg-white/25 p-4 backdrop-blur-md">
-            <div className="bg-sarge-gray-0 border-sarge-gray-200 flex w-full max-w-[380px] flex-col items-center gap-4 rounded-lg border px-8 py-7 text-center shadow-lg">
-                <div className="space-y-3">
-                    <h2 className="text-sarge-gray-900 text-base leading-snug font-bold">
-                        You can&apos;t unfocus your assessment window during the exam
-                    </h2>
-                    <p className="text-sarge-gray-600 text-sm">The admin has been notified.</p>
+        <Dialog open={open} onOpenChange={() => {}}>
+            <DialogContent
+                className="h-[184px] w-[361px] gap-4"
+                backgroundClassName="bg-white/25 backdrop-blur-md"
+                showCloseButton={false}
+            >
+                <VisuallyHidden>
+                    <DialogTitle>Window Unfocused</DialogTitle>
+                </VisuallyHidden>
+                <div className="flex h-full flex-col items-center justify-center gap-4 px-6 text-center">
+                    <div className="space-y-1">
+                        <p className="text-md font-semibold tracking-wide">
+                            You can&apos;t unfocus your window during the exam
+                        </p>
+                        <p className="text-sm">The admin has been notified.</p>
+                    </div>
+                    <Button className="h-9 min-w-28 px-5" onClick={onAcknowledge}>
+                        I understand
+                    </Button>
                 </div>
-                <Button className="h-9 min-w-28 px-5" onClick={onAcknowledge}>
-                    I understand
-                </Button>
-            </div>
-        </div>
+            </DialogContent>
+        </Dialog>
     );
 }

src/lib/components/ui/Modal.tsx

@@ -40,15 +40,17 @@ function DialogOverlay({
 
 function DialogContent({
     className,
+    backgroundClassName,
     children,
     showCloseButton = true,
     ...props
 }: React.ComponentProps<typeof DialogPrimitive.Content> & {
     showCloseButton?: boolean;
+    backgroundClassName?: string;
 }) {
     return (
         <DialogPortal data-slot="dialog-portal">
-            <DialogOverlay />
+            <DialogOverlay className={backgroundClassName} />
             <DialogPrimitive.Content
                 data-slot="dialog-content"
                 className={cn(

src/lib/hooks/useHeartbeat.ts

@@ -1,7 +1,7 @@
 import useWebSocket from 'react-use-websocket';
 import { ReadyState } from 'react-use-websocket';
 
-const WS_URL = 'ws://localhost:8080';
+const WS_URL = process.env.NEXT_PUBLIC_WS_URL ?? 'ws://localhost:8080';
 
 export function useHeartbeat(token: string | null) {
     const ws = useWebSocket(token ? `${WS_URL}?token=${token}` : null, {

src/lib/utils/token.utils.ts

@@ -1,7 +1,7 @@
 import { SignJWT } from 'jose';
 
 export async function generateToken(email: string) {
-    const secret = new TextEncoder().encode('SECRET');
+    const secret = new TextEncoder().encode(process.env.JWT_SECRET);
 
     const jwt = await new SignJWT({ email })
         .setProtectedHeader({ alg: 'HS256' })

src/ws/index.js

@@ -2,7 +2,7 @@ import { WebSocketServer } from 'ws';
 import { jwtVerify } from 'jose';
 
 const ws = new WebSocketServer({ port: 8080 });
-const secret = new TextEncoder().encode('SECRET');
+const secret = new TextEncoder().encode(process.env.JWT_SECRET);
 
 console.log('Sarge WS server listening on 8080');
 
@@ -46,6 +46,7 @@ ws.on('connection', async (socket, request) => {
         clients.set(payload.candidateEmail, socket);
     } catch {
         socket.close(1008, 'Unauthorized');
+        console.log(`[${new Date().toISOString()}] Unauthorized connection. Closing.`);
         return;
     }
 

src/ws/package.json

@@ -5,8 +5,8 @@
     "main": "index.js",
     "type": "module",
     "scripts": {
-        "start": "node index.js",
-        "dev": "nodemon index.js"
+        "start": "node --env-file ../../.env index.js",
+        "dev": "nodemon --exec 'node --env-file ../../.env' index.js"
     },
     "keywords": [],
     "author": "",