diff --git a/frontend/src/pages/VerifyEmail.jsx b/frontend/src/pages/VerifyEmail.jsx
new file mode 100644
index 0000000..86286a7
--- /dev/null
+++ b/frontend/src/pages/VerifyEmail.jsx
@@ -0,0 +1,64 @@
+import { useState } from 'react'
+import { Link, useLocation, useNavigate, useSearchParams } from 'react-router-dom'
+import AuthShell from '../components/AuthShell'
+import Field from '../components/Field'
+import { Alert, Button } from '../components/ui'
+import { useAuth } from '../context/AuthContext'
+import { paths } from '../routes/appRoutes'
+import { api } from '../services/api'
+
+export default function VerifyEmail() {
+ const [params] = useSearchParams()
+ const location = useLocation()
+ const navigate = useNavigate()
+ const { verifyEmail } = useAuth()
+ const [email, setEmail] = useState(params.get('email') || '')
+ const [code, setCode] = useState('')
+ const [busy, setBusy] = useState(false)
+ const [error, setError] = useState('')
+ const [notice, setNotice] = useState(location.state?.emailSent === false
+ ? 'We could not send the code yet. Try sending a new code.'
+ : params.get('email') ? 'Enter the six-digit code sent to your email.' : '')
+
+ const submit = async (event) => {
+ event.preventDefault()
+ setError('')
+ setBusy(true)
+ try {
+ await verifyEmail(email, code)
+ navigate(paths.library, { replace: true })
+ } catch (cause) {
+ setError(cause.message || 'We could not verify that code.')
+ setBusy(false)
+ }
+ }
+
+ const resend = async () => {
+ setError('')
+ setBusy(true)
+ try {
+ const response = await api.auth.resendVerification(email)
+ setNotice(response.message)
+ } catch (cause) {
+ setError(cause.message || 'A new code could not be sent.')
+ } finally {
+ setBusy(false)
+ }
+ }
+
+ return
Already verified? Log in}
+ >
+
+
+
+}
diff --git a/frontend/src/pages/admin/AdminDemoVideo.jsx b/frontend/src/pages/admin/AdminDemoVideo.jsx
new file mode 100644
index 0000000..699ae0a
--- /dev/null
+++ b/frontend/src/pages/admin/AdminDemoVideo.jsx
@@ -0,0 +1,120 @@
+import { useEffect, useState } from 'react'
+import Field from '../../components/Field'
+import { Alert, Button } from '../../components/ui'
+import { api } from '../../services/api'
+import { formatBytes, formatTime } from '../../utils/format'
+import { inspectVideoFile } from '../../utils/media'
+
+const titleFromFile = (name) => name.replace(/\.[^.]+$/, '').replace(/[-_]+/g, ' ').trim()
+
+export default function AdminDemoVideo() {
+ const [current, setCurrent] = useState(null)
+ const [file, setFile] = useState(null)
+ const [previewUrl, setPreviewUrl] = useState('')
+ const [title, setTitle] = useState('')
+ const [durationSec, setDurationSec] = useState(0)
+ const [loading, setLoading] = useState(true)
+ const [busy, setBusy] = useState(false)
+ const [confirmDelete, setConfirmDelete] = useState(false)
+ const [message, setMessage] = useState(null)
+
+ useEffect(() => {
+ let active = true
+ api.demoVideo.get()
+ .then((video) => { if (active) setCurrent(video) })
+ .catch((error) => { if (active) setMessage({ tone: 'error', text: error.message || 'Could not load the demo video.' }) })
+ .finally(() => { if (active) setLoading(false) })
+ return () => { active = false }
+ }, [])
+
+ useEffect(() => () => {
+ if (previewUrl) URL.revokeObjectURL(previewUrl)
+ }, [previewUrl])
+
+ const pick = async (event) => {
+ const selected = event.target.files?.[0]
+ setMessage(null)
+ if (!selected) {
+ setFile(null)
+ setPreviewUrl('')
+ return
+ }
+ if (!selected.type.startsWith('video/')) {
+ setFile(null)
+ setPreviewUrl('')
+ setMessage({ tone: 'error', text: 'Choose a video file (MP4, WebM or MOV).' })
+ return
+ }
+ setFile(selected)
+ setPreviewUrl(URL.createObjectURL(selected))
+ setTitle(titleFromFile(selected.name))
+ setDurationSec((await inspectVideoFile(selected)).durationSec)
+ }
+
+ const upload = async (event) => {
+ event.preventDefault()
+ if (!file || !title.trim()) return
+ setBusy(true)
+ setMessage(null)
+ try {
+ const saved = await api.demoVideo.upload({ file, title: title.trim(), durationSec })
+ setCurrent(saved)
+ setFile(null)
+ setPreviewUrl('')
+ setMessage({ tone: 'success', text: 'Demo video uploaded and live on the public demo page.' })
+ } catch (error) {
+ setMessage({ tone: 'error', text: error.message || 'The demo video could not be uploaded.' })
+ } finally {
+ setBusy(false)
+ }
+ }
+
+ const remove = async () => {
+ setBusy(true)
+ setMessage(null)
+ try {
+ await api.demoVideo.remove()
+ setCurrent(null)
+ setConfirmDelete(false)
+ setMessage({ tone: 'success', text: 'Demo video deleted from the public demo page.' })
+ } catch (error) {
+ setMessage({ tone: 'error', text: error.message || 'The demo video could not be deleted.' })
+ } finally {
+ setBusy(false)
+ }
+ }
+
+ return
+
+
Public walkthrough
Demo page video.
+ {current && !confirmDelete &&
}
+
Loading demo video…
+ : current
+ ?
+
+
{current.title} · {formatTime(current.durationSec)} · {formatBytes(current.size)}
+
No demo video is set. Upload one to show it on the public demo page.
}
+
+
+
+}
diff --git a/frontend/src/pages/admin/AdminVideos.jsx b/frontend/src/pages/admin/AdminVideos.jsx
index 7f5177a..c47b9e5 100644
--- a/frontend/src/pages/admin/AdminVideos.jsx
+++ b/frontend/src/pages/admin/AdminVideos.jsx
@@ -1,4 +1,5 @@
import { useState } from 'react'
+import AdminDemoVideo from './AdminDemoVideo'
import Field from '../../components/Field'
import { Alert, Badge, Button, SectionHeading, VideoArtwork } from '../../components/ui'
import { useLibrary } from '../../context/LibraryContext'
@@ -44,6 +45,7 @@ export default function AdminVideos() {
}
return <>
+
`${API_BASE}/auth/login`,
logout: () => `${API_BASE}/auth/logout`,
session: () => `${API_BASE}/auth/session`,
+ verifyEmail: () => `${API_BASE}/auth/verify-email`,
+ resendVerification: () => `${API_BASE}/auth/resend-verification`,
+ forgotPassword: () => `${API_BASE}/auth/forgot-password`,
+ resetPassword: () => `${API_BASE}/auth/reset-password`,
},
users: {
@@ -41,6 +45,13 @@ export const apiRoutes = {
remove: (id) => `${API_BASE}/videos/${id}`,
},
+ demoVideo: {
+ get: () => `${API_BASE}/demo-video`,
+ file: () => `${API_BASE}/demo-video/file`,
+ upload: () => `${API_BASE}/demo-video`,
+ remove: () => `${API_BASE}/demo-video`,
+ },
+
submissions: {
list: () => `${API_BASE}/submissions`,
create: () => `${API_BASE}/submissions`,
diff --git a/frontend/src/styles/admin.css b/frontend/src/styles/admin.css
index 5b0949e..1e60927 100644
--- a/frontend/src/styles/admin.css
+++ b/frontend/src/styles/admin.css
@@ -73,6 +73,7 @@
.upload-file b { @apply text-heading; }
.upload-file label { @apply ml-2; }
.upload-fields > .field:first-child { @apply mt-0; }
+ .upload-fields > .btn { @apply mt-4; }
.video-list { @apply m-0 list-none p-0; }
.video-row { @apply border-t border-line py-5; }