giers10/lang-quiz
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add video toggle functionality on EntryPage

Browse Source
This commit is contained in:
Victor Giers
2026-01-07 23:32:58 +01:00
parent c9a59bb443
commit db05e764ff
1 changed files with 9 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
client/src/pages/EntryPage.tsx
View File

@@ -12,6 +12,7 @@ export default function EntryPage() {
const [entry, setEntry] = useState<EntryDetail | null>(null); const [entry, setEntry] = useState<EntryDetail | null>(null);
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null); const [error, setError] = useState<string | null>(null);
const [compactVideo, setCompactVideo] = useState(true);
const entryId = useMemo(() => { const entryId = useMemo(() => {
try { try {
@@ -70,7 +71,14 @@ export default function EntryPage() {
</div> </div>
</div> </div>
<VideoPlayer src={entry.video_url} /> <div className="video-row">
<VideoPlayer src={entry.video_url} variant={compactVideo ? 'compact' : 'wide'} />
<div className="video-actions">
<button className="button button--ghost" onClick={() => setCompactVideo((v) => !v)}>
{compactVideo ? 'Enlarge video' : 'Compact video'}
</button>
</div>
</div>
{ig && ( {ig && (
<div className="ig-block"> <div className="ig-block">
{ig.profile_pic_url ? ( {ig.profile_pic_url ? (