Add presentation upload and management features to room functionality

src/components/Layout.jsx

@@ -1,10 +1,40 @@
 import { Outlet } from 'react-router-dom';
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 import Navbar from './Navbar';
 import Sidebar from './Sidebar';
+import { useAuth } from '../contexts/AuthContext';
+import { useLanguage } from '../contexts/LanguageContext';
+import { AlertTriangle, RefreshCw } from 'lucide-react';
+import api from '../services/api';
+import toast from 'react-hot-toast';
 
 export default function Layout() {
   const [sidebarOpen, setSidebarOpen] = useState(false);
+  const { user } = useAuth();
+  const { t } = useLanguage();
+  const [resendCooldown, setResendCooldown] = useState(0);
+  const [resending, setResending] = useState(false);
+
+  // Countdown timer for resend cooldown
+  useEffect(() => {
+    if (resendCooldown <= 0) return;
+    const timer = setTimeout(() => setResendCooldown(c => c - 1), 1000);
+    return () => clearTimeout(timer);
+  }, [resendCooldown]);
+
+  const handleResendVerification = async () => {
+    if (resendCooldown > 0 || resending) return;
+    setResending(true);
+    try {
+      await api.post('/auth/resend-verification', { email: user.email });
+      toast.success(t('auth.emailVerificationResendSuccess'));
+      setResendCooldown(60);
+    } catch {
+      toast.error(t('auth.emailVerificationResendFailed'));
+    } finally {
+      setResending(false);
+    }
+  };
 
   return (
     <div className="min-h-screen bg-th-bg flex">
@@ -14,6 +44,25 @@ export default function Layout() {
       {/* Main content */}
       <div className="flex-1 flex flex-col min-h-screen lg:ml-64">
         <Navbar onMenuClick={() => setSidebarOpen(true)} />
+
+        {/* Email verification banner */}
+        {user && user.email_verified === 0 && (
+          <div className="bg-amber-500/15 border-b border-amber-500/30 px-4 py-2.5 flex items-center justify-center gap-3 text-sm">
+            <AlertTriangle size={15} className="text-amber-400 flex-shrink-0" />
+            <span className="text-amber-200">{t('auth.emailVerificationBanner')}</span>
+            <button
+              onClick={handleResendVerification}
+              disabled={resendCooldown > 0 || resending}
+              className="flex items-center gap-1.5 text-amber-400 hover:text-amber-300 underline underline-offset-2 transition-colors disabled:opacity-60 disabled:no-underline disabled:cursor-not-allowed"
+            >
+              <RefreshCw size={13} className={resending ? 'animate-spin' : ''} />
+              {resendCooldown > 0
+                ? t('auth.emailVerificationResendCooldown').replace('{seconds}', resendCooldown)
+                : t('auth.emailVerificationResend')}
+            </button>
+          </div>
+        )}
+
         <main className="flex-1 p-4 md:p-6 lg:p-8 max-w-7xl w-full mx-auto">
           <Outlet />
         </main>
@@ -29,3 +78,4 @@ export default function Layout() {
     </div>
   );
 }
+

src/i18n/de.json

@@ -81,7 +81,12 @@
     "usernameTaken": "Benutzername ist bereits vergeben",
     "usernameInvalid": "Benutzername darf nur Buchstaben, Zahlen, _ und - enthalten (3–30 Zeichen)",
     "usernameRequired": "Benutzername ist erforderlich",
-    "displayNameRequired": "Anzeigename ist erforderlich"
+    "displayNameRequired": "Anzeigename ist erforderlich",
+    "emailVerificationBanner": "Deine E-Mail-Adresse wurde noch nicht verifiziert.",
+    "emailVerificationResend": "Hier klicken um eine neue Verifizierungsmail zu erhalten",
+    "emailVerificationResendCooldown": "Erneut senden in {seconds}s",
+    "emailVerificationResendSuccess": "Verifizierungsmail wurde gesendet!",
+    "emailVerificationResendFailed": "Verifizierungsmail konnte nicht gesendet werden"
   },
   "home": {
     "poweredBy": "Powered by BigBlueButton",
@@ -213,7 +218,16 @@
     "guestRecordingNotice": "Dieses Meeting könnte aufgenommen werden, inkl. Ihrer Audio / Video.",
     "guestRecordingConsent": "Ich bin damit einverstanden, dass dieses Meeting aufgenommen werden kann.",
     "shared": "Geteilt",
-    "shareTitle": "Raum teilen",
+    "presentationTitle": "Standard-Präsentation",
+    "presentationDesc": "Diese Datei wird beim Start des Meetings automatisch in BBB vorgeladen.",
+    "presentationUpload": "Präsentation hochladen",
+    "presentationRemove": "Präsentation entfernen",
+    "presentationUploaded": "Präsentation hochgeladen",
+    "presentationRemoved": "Präsentation entfernt",
+    "presentationUploadFailed": "Präsentation konnte nicht hochgeladen werden",
+    "presentationRemoveFailed": "Präsentation konnte nicht entfernt werden",
+    "presentationAllowedTypes": "PDF, PPT, PPTX, ODP, DOC, DOCX · max. 50 MB",
+    "presentationCurrent": "Aktuell:",
     "shareDescription": "Teilen Sie diesen Raum mit anderen Benutzern, damit diese ihn in ihrem Dashboard sehen und beitreten k\u00f6nnen.",
     "shareSearchPlaceholder": "Benutzer suchen (Name oder E-Mail)...",
     "shareAdded": "Benutzer hinzugef\u00fcgt",

src/i18n/en.json

@@ -81,7 +81,12 @@
     "usernameTaken": "Username is already taken",
     "usernameInvalid": "Username may only contain letters, numbers, _ and - (3–30 chars)",
     "usernameRequired": "Username is required",
-    "displayNameRequired": "Display name is required"
+    "displayNameRequired": "Display name is required",
+    "emailVerificationBanner": "Your email address has not been verified yet.",
+    "emailVerificationResend": "Click here to receive a new verification email",
+    "emailVerificationResendCooldown": "Resend in {seconds}s",
+    "emailVerificationResendSuccess": "Verification email sent!",
+    "emailVerificationResendFailed": "Could not send verification email"
   },
   "home": {
     "poweredBy": "Powered by BigBlueButton",
@@ -213,7 +218,16 @@
     "guestRecordingNotice": "This meeting may be recorded, including your audio and video.",
     "guestRecordingConsent": "I understand that this meeting may be recorded.",
     "shared": "Shared",
-    "shareTitle": "Share room",
+    "presentationTitle": "Default Presentation",
+    "presentationDesc": "This file will be automatically pre-loaded in BBB when the meeting starts.",
+    "presentationUpload": "Upload presentation",
+    "presentationRemove": "Remove presentation",
+    "presentationUploaded": "Presentation uploaded",
+    "presentationRemoved": "Presentation removed",
+    "presentationUploadFailed": "Could not upload presentation",
+    "presentationRemoveFailed": "Could not remove presentation",
+    "presentationAllowedTypes": "PDF, PPT, PPTX, ODP, DOC, DOCX · max. 50 MB",
+    "presentationCurrent": "Current:" room",
     "shareDescription": "Share this room with other users so they can see it in their dashboard and join meetings.",
     "shareSearchPlaceholder": "Search users (name or email)...",
     "shareAdded": "User added",

src/pages/RoomDetail.jsx

@@ -1,9 +1,10 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useRef } from 'react';
 import { useParams, useNavigate } from 'react-router-dom';
 import {
   ArrowLeft, Play, Square, Users, Settings, FileVideo, Radio,
   Loader2, Copy, ExternalLink, Lock, Mic, MicOff, UserCheck,
   Shield, Save, UserPlus, X, Share2, Globe, Send,
+  FileText, Upload, Trash2,
 } from 'lucide-react';
 import Modal from '../components/Modal';
 import api from '../services/api';
@@ -37,6 +38,11 @@ export default function RoomDetail() {
   const [fedMessage, setFedMessage] = useState('');
   const [fedSending, setFedSending] = useState(false);
 
+  // Presentation state
+  const [uploadingPresentation, setUploadingPresentation] = useState(false);
+  const [removingPresentation, setRemovingPresentation] = useState(false);
+  const presentationInputRef = useRef(null);
+
   const isOwner = room && user && room.user_id === user.id;
   const isShared = room && !!room.shared;
   const canManage = isOwner || isShared;
@@ -159,6 +165,52 @@ export default function RoomDetail() {
   };
 
   // Federation invite handler
+  const handlePresentationUpload = async (e) => {
+    const file = e.target.files?.[0];
+    if (!file) return;
+    const allowedTypes = [
+      'application/pdf',
+      'application/vnd.ms-powerpoint',
+      'application/vnd.openxmlformats-officedocument.presentationml.presentation',
+      'application/vnd.oasis.opendocument.presentation',
+      'application/msword',
+      'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+    ];
+    if (!allowedTypes.includes(file.type)) {
+      toast.error('Unsupported file type. Allowed: PDF, PPT, PPTX, ODP, DOC, DOCX');
+      return;
+    }
+    setUploadingPresentation(true);
+    try {
+      const arrayBuffer = await file.arrayBuffer();
+      const res = await api.post(`/rooms/${uid}/presentation`, arrayBuffer, {
+        headers: { 'Content-Type': file.type },
+      });
+      setRoom(res.data.room);
+      setEditRoom(res.data.room);
+      toast.success(t('room.presentationUploaded'));
+    } catch (err) {
+      toast.error(err.response?.data?.error || t('room.presentationUploadFailed'));
+    } finally {
+      setUploadingPresentation(false);
+      if (presentationInputRef.current) presentationInputRef.current.value = '';
+    }
+  };
+
+  const handlePresentationRemove = async () => {
+    setRemovingPresentation(true);
+    try {
+      const res = await api.delete(`/rooms/${uid}/presentation`);
+      setRoom(res.data.room);
+      setEditRoom(res.data.room);
+      toast.success(t('room.presentationRemoved'));
+    } catch (err) {
+      toast.error(err.response?.data?.error || t('room.presentationRemoveFailed'));
+    } finally {
+      setRemovingPresentation(false);
+    }
+  };
+
   const handleFedInvite = async (e) => {
     e.preventDefault();
     if (!fedAddress.includes('@')) {
@@ -538,6 +590,60 @@ export default function RoomDetail() {
             </div>
           </div>
 
+          {/* Presentation section */}
+          <div className="pt-4 border-t border-th-border space-y-4">
+            <div>
+              <h3 className="text-sm font-semibold text-th-text flex items-center gap-2 mb-1">
+                <FileText size={16} />
+                {t('room.presentationTitle')}
+              </h3>
+              <p className="text-xs text-th-text-s">{t('room.presentationDesc')}</p>
+            </div>
+
+            {room.presentation_file ? (
+              <div className="flex items-center justify-between gap-3 p-3 bg-th-bg-s rounded-lg border border-th-border">
+                <div className="flex items-center gap-2 min-w-0">
+                  <FileText size={16} className="text-th-accent flex-shrink-0" />
+                  <div className="min-w-0">
+                    <p className="text-xs text-th-text-s">{t('room.presentationCurrent')}</p>
+                    <p className="text-sm text-th-text font-medium truncate">
+                      presentation.{room.presentation_file.split('.').pop()}
+                    </p>
+                  </div>
+                </div>
+                <button
+                  type="button"
+                  onClick={handlePresentationRemove}
+                  disabled={removingPresentation}
+                  className="btn-ghost text-th-error hover:bg-th-error/10 flex-shrink-0 text-xs py-1.5 px-3"
+                >
+                  {removingPresentation ? <Loader2 size={14} className="animate-spin" /> : <Trash2 size={14} />}
+                  {t('room.presentationRemove')}
+                </button>
+              </div>
+            ) : (
+              <div className="text-xs text-th-text-s italic">{/* no presentation */}</div>
+            )}
+
+            <input
+              ref={presentationInputRef}
+              type="file"
+              accept=".pdf,.ppt,.pptx,.odp,.doc,.docx"
+              className="hidden"
+              onChange={handlePresentationUpload}
+            />
+            <button
+              type="button"
+              onClick={() => presentationInputRef.current?.click()}
+              disabled={uploadingPresentation}
+              className="btn-secondary text-sm flex items-center gap-2"
+            >
+              {uploadingPresentation ? <Loader2 size={15} className="animate-spin" /> : <Upload size={15} />}
+              {t('room.presentationUpload')}
+            </button>
+            <p className="text-xs text-th-text-s">{t('room.presentationAllowedTypes')}</p>
+          </div>
+
           {/* Share section */}
           <div className="pt-4 border-t border-th-border space-y-4">
             <h3 className="text-sm font-semibold text-th-text flex items-center gap-2">