Minor appearance changes, sharing live preview
All checks were successful
Automated Container Build / build-and-push (push) Successful in 1m16s

This commit is contained in:
Elijah 2026-05-22 19:06:21 -07:00
parent 2bcfca983c
commit 27fd6fa4f5
3 changed files with 25 additions and 2 deletions

View file

@ -11,7 +11,7 @@ export default function PublicSharePage({ params }: { params: Promise<{ id: stri
const [error, setError] = useState<string | null>(null);
const [requirePassword, setRequirePassword] = useState(false);
const [password, setPassword] = useState('');
const [fileInfo, setFileInfo] = useState<{ name: string; size: number; is_dir: boolean } | null>(null);
const [fileInfo, setFileInfo] = useState<{ name: string; size: number; is_dir: boolean; mime_type?: string } | null>(null);
useEffect(() => {
fetchShareInfo();
@ -112,6 +112,11 @@ export default function PublicSharePage({ params }: { params: Promise<{ id: stri
</div>
);
}
const isImage = fileInfo?.mime_type?.startsWith('image/');
const isVideo = fileInfo?.mime_type?.startsWith('video/');
const isAudio = fileInfo?.mime_type?.startsWith('audio/');
const isPdf = fileInfo?.mime_type === 'application/pdf';
const downloadUrl = fileInfo ? api.getPublicDownloadUrl(id, password) : '';
return (
<div className="min-h-screen flex items-center justify-center p-4" style={{ backgroundColor: 'var(--color-bg-primary)' }}>
@ -121,6 +126,14 @@ export default function PublicSharePage({ params }: { params: Promise<{ id: stri
<div className="w-24 h-24 rounded-2xl flex items-center justify-center" style={{ backgroundColor: 'var(--color-accent-subtle)' }}>
<Folder className="w-12 h-12" style={{ color: 'var(--color-accent)' }} />
</div>
) : isImage ? (
<img src={downloadUrl} alt={fileInfo?.name} className="w-full max-h-48 object-contain rounded-xl" />
) : isVideo ? (
<video src={downloadUrl} controls className="w-full max-h-48 rounded-xl" />
) : isAudio ? (
<audio src={downloadUrl} controls className="w-full mt-4" />
) : isPdf ? (
<iframe src={downloadUrl} className="w-full h-64 rounded-xl border-none" />
) : (
<div className="w-24 h-24 rounded-2xl flex items-center justify-center" style={{ backgroundColor: 'var(--color-accent-subtle)' }}>
<File className="w-12 h-12" style={{ color: 'var(--color-accent)' }} />