feat(builder): implement reusable media library

Media dashboard (real total/images/SVG/logos/unused/storage/alt-coverage, computed from actual assets + a bootstrap usage scan, no fabricated stats); gallery gets grid/list toggle, type filter, sort, drag-and-drop + multi-file upload with cancel/retry and friendly error mapping, lazy thumbnails, multi-select with bulk delete/download/export-metadata; asset details drawer shows real dimensions/size/format/date/usage locations (walks bootstrap config for exact URL matches, reports not-used rather than guessing) plus editable alt text/caption/description/decorative flag with missing-alt warning; shared MediaPickerComponent (already the one reusable picker used by content management) gains type filter, a recent shortcut, and keyboard grid navigation.
This commit is contained in:
sdarbinyan
2026-07-18 16:09:47 +04:00
parent b31c75214d
commit 5d52d81c7d
21 changed files with 1255 additions and 136 deletions

View File

@@ -1152,6 +1152,71 @@ export const en: Translations = {
confirm: 'Delete',
emptyTitle: 'No files yet',
emptyDescription: 'Upload an image or document to get started.',
allFolders: 'All folders',
newFolder: 'New folder',
editTags: 'Edit tags',
totalAssets: 'Total assets',
logos: 'Logos',
unused: 'Unused',
storageUsed: 'Storage used',
altCoverage: 'Alt text coverage',
allTypes: 'All types',
typeImage: 'Images',
typeSvg: 'SVG',
typePdf: 'PDF',
sortRecent: 'Recent',
sortName: 'Name',
sortSize: 'Size',
viewMode: 'View',
viewGrid: 'Grid',
viewList: 'List',
dropHint: 'Drag and drop images here, or use Upload above.',
cancelUpload: 'Cancel',
retry: 'Retry',
errorTooLarge: 'That file is too large. Try a smaller file.',
errorUnsupportedType: 'That file type is not supported. Use JPG, PNG, WebP, GIF, SVG, or PDF.',
errorGeneric: 'Upload failed. Please try again.',
selectedCount: 'selected',
download: 'Download',
exportMetadata: 'Export metadata',
bulkDelete: 'Delete selected',
bulkDeleteConfirm: 'Delete the selected files? This cannot be undone.',
clearSelection: 'Clear selection',
guideCopy: 'Reusing an existing asset avoids duplicate uploads and keeps your storage tidy. For best results upload images around 1200×1200px for hero/banner use and compress large photos before uploading.',
missingAlt: 'Missing alt text',
usageCount: 'uses',
detailsTitle: 'Asset details',
filename: 'Filename',
format: 'Format',
fileSize: 'File size',
dimensions: 'Dimensions',
uploadDate: 'Uploaded',
lastUsed: 'Last used',
usageCountLabel: 'Usage count',
usedIn: 'Used in',
notUsed: 'Not currently used anywhere.',
unknownValue: 'Unknown',
altText: 'Alt text',
altTextHelp: 'Describes the image for screen readers and search engines.',
decorative: 'Decorative (no alt text needed)',
missingAltWarning: 'This image has no alt text and is not marked decorative — screen reader users wont know what it shows.',
caption: 'Caption',
description: 'Description',
usage: {
brand: 'Logo',
theme: 'Theme',
header: 'Header',
footer: 'Footer',
staticPage: 'Static page',
homepage: 'Homepage',
catalog: 'Catalog',
productPage: 'Product page',
widget: 'Widget',
company: 'Company info',
seo: 'SEO',
navigation: 'Navigation',
other: 'Other',
},
},
adminCategories: {
chooseImage: 'Choose image',