feat: add LogoManagementModal component for logo upload and management

This commit is contained in:
Lars Behrends
2025-12-28 21:19:10 +01:00
parent 2481187fe7
commit 81f1e90b85
13 changed files with 2963 additions and 52 deletions

View File

@@ -131,6 +131,61 @@ const BannerManagementModal: React.FC<BannerManagementModalProps> = ({
</p>
</div>
{/* File Upload */}
<div className="mb-6">
<h4 className="font-semibold text-textMain mb-3">Oder Bild hochladen</h4>
<div className="border-2 border-dashed border-border rounded-lg p-6 text-center hover:border-accentInfo/50 transition-colors">
<input
type="file"
accept="image/*"
onChange={async (e) => {
const file = e.target.files?.[0];
if (!file) return;
const formData = new FormData();
formData.append('banner', file);
try {
setLoading(true);
setError(null);
const response = await fetch(`https://vollidioten.ceraticsoft.de/api/projects/${projectId}/banner/upload`, {
method: 'POST',
credentials: 'include',
body: formData
});
if (response.ok) {
const data = await response.json();
setBannerUrl(data.bannerUrl);
onUpdate();
onClose();
} else {
const errorData = await response.json();
setError(errorData.error || 'Fehler beim Hochladen');
}
} catch (err) {
console.error('Error uploading banner:', err);
setError('Netzwerkfehler beim Hochladen');
} finally {
setLoading(false);
}
}}
className="hidden"
id="banner-upload"
/>
<label htmlFor="banner-upload" className="cursor-pointer">
<div className="w-12 h-12 mx-auto mb-4 bg-surfaceHighlight rounded-full flex items-center justify-center">
<svg className="w-6 h-6 text-accentInfo" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" />
</svg>
</div>
<p className="text-sm text-textMain font-medium">Bild auswählen</p>
<p className="text-xs text-textMuted mt-1">Max. 10MB, nur Bilddateien</p>
</label>
</div>
</div>
{/* Preview */}
{bannerUrl && bannerUrl !== currentBannerUrl && (
<div className="mb-6">