Enhance ShowMetadataCard UI: update button labels for gallery selection, improve metadata search input with a dedicated label, and streamline provider selection functionality. Update translations for new UI elements to improve user experience.
This commit is contained in:
@@ -85,7 +85,6 @@ export function ShowMetadataCard({ show, onChanged }: { show: ShowDto; onChanged
|
|||||||
},
|
},
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
toast.success(t('settings.saved'))
|
toast.success(t('settings.saved'))
|
||||||
setQuery(originalName.trim() || show.name)
|
|
||||||
changed()
|
changed()
|
||||||
},
|
},
|
||||||
onError,
|
onError,
|
||||||
@@ -131,7 +130,7 @@ export function ShowMetadataCard({ show, onChanged }: { show: ShowDto; onChanged
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<Button size="sm" variant="outline" onClick={() => setGalleryOpen(true)}>
|
<Button size="sm" variant="outline" onClick={() => setGalleryOpen(true)}>
|
||||||
{t('admin.metadata.pickFromGallery')}
|
{t('admin.metadata.pickPoster')}
|
||||||
</Button>
|
</Button>
|
||||||
<ImageGallery
|
<ImageGallery
|
||||||
open={galleryOpen}
|
open={galleryOpen}
|
||||||
@@ -156,24 +155,8 @@ export function ShowMetadataCard({ show, onChanged }: { show: ShowDto; onChanged
|
|||||||
|
|
||||||
{providers && providers.length > 0 && (
|
{providers && providers.length > 0 && (
|
||||||
<div className="flex flex-col gap-2">
|
<div className="flex flex-col gap-2">
|
||||||
<div className="flex flex-wrap items-end gap-2">
|
<Label>{t('admin.metadata.searchLabel')}</Label>
|
||||||
<div className="flex flex-col gap-1.5">
|
|
||||||
<Label>{t('admin.metadata.source')}</Label>
|
|
||||||
<Select value={effectiveProvider} onValueChange={setProvider}>
|
|
||||||
<SelectTrigger className="w-28">
|
|
||||||
<SelectValue />
|
|
||||||
</SelectTrigger>
|
|
||||||
<SelectContent>
|
|
||||||
{providers.map((p) => (
|
|
||||||
<SelectItem key={p} value={p}>
|
|
||||||
{p.toUpperCase()}
|
|
||||||
</SelectItem>
|
|
||||||
))}
|
|
||||||
</SelectContent>
|
|
||||||
</Select>
|
|
||||||
</div>
|
|
||||||
<Input
|
<Input
|
||||||
className="min-w-40 flex-1"
|
|
||||||
value={query}
|
value={query}
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
setQuery(e.target.value)
|
setQuery(e.target.value)
|
||||||
@@ -181,10 +164,6 @@ export function ShowMetadataCard({ show, onChanged }: { show: ShowDto; onChanged
|
|||||||
}}
|
}}
|
||||||
placeholder={t('admin.metadata.searchPlaceholder')}
|
placeholder={t('admin.metadata.searchPlaceholder')}
|
||||||
/>
|
/>
|
||||||
<Button size="sm" disabled={search.isPending || !query.trim()} onClick={() => search.mutate()}>
|
|
||||||
{t('admin.metadata.searchBtn')}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{searched && results.length === 0 && (
|
{searched && results.length === 0 && (
|
||||||
<p className="text-xs text-muted-foreground">{t('admin.metadata.nothingFound')}</p>
|
<p className="text-xs text-muted-foreground">{t('admin.metadata.nothingFound')}</p>
|
||||||
@@ -245,6 +224,30 @@ export function ShowMetadataCard({ show, onChanged }: { show: ShowDto; onChanged
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex flex-wrap items-center gap-2">
|
<div className="flex flex-wrap items-center gap-2">
|
||||||
|
{providers && providers.length > 0 && (
|
||||||
|
<>
|
||||||
|
<Select value={effectiveProvider} onValueChange={setProvider}>
|
||||||
|
<SelectTrigger className="h-9 w-24">
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
<SelectContent>
|
||||||
|
{providers.map((p) => (
|
||||||
|
<SelectItem key={p} value={p}>
|
||||||
|
{p.toUpperCase()}
|
||||||
|
</SelectItem>
|
||||||
|
))}
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
<Button
|
||||||
|
size="sm"
|
||||||
|
variant="outline"
|
||||||
|
disabled={search.isPending || !query.trim()}
|
||||||
|
onClick={() => search.mutate()}
|
||||||
|
>
|
||||||
|
{t('admin.metadata.searchBtn')}
|
||||||
|
</Button>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
<Button size="sm" disabled={save.isPending} onClick={() => save.mutate()}>
|
<Button size="sm" disabled={save.isPending} onClick={() => save.mutate()}>
|
||||||
{t('common.save')}
|
{t('common.save')}
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -284,6 +284,8 @@ const resources = {
|
|||||||
metadata: {
|
metadata: {
|
||||||
title: 'Метаданные',
|
title: 'Метаданные',
|
||||||
pickFromGallery: 'Выбрать из галереи',
|
pickFromGallery: 'Выбрать из галереи',
|
||||||
|
pickPoster: 'Из галереи',
|
||||||
|
searchLabel: 'Поиск метаданных',
|
||||||
originalName: 'Оригинальное название (eng)',
|
originalName: 'Оригинальное название (eng)',
|
||||||
originalNamePlaceholder: 'Например: Family Guy',
|
originalNamePlaceholder: 'Например: Family Guy',
|
||||||
originalNameHint: 'По нему ищутся метаданные; на экранах показывается обычное название.',
|
originalNameHint: 'По нему ищутся метаданные; на экранах показывается обычное название.',
|
||||||
@@ -588,6 +590,8 @@ const resources = {
|
|||||||
metadata: {
|
metadata: {
|
||||||
title: 'Metadata',
|
title: 'Metadata',
|
||||||
pickFromGallery: 'Pick from gallery',
|
pickFromGallery: 'Pick from gallery',
|
||||||
|
pickPoster: 'From gallery',
|
||||||
|
searchLabel: 'Metadata search',
|
||||||
originalName: 'Original name (eng)',
|
originalName: 'Original name (eng)',
|
||||||
originalNamePlaceholder: 'e.g. Family Guy',
|
originalNamePlaceholder: 'e.g. Family Guy',
|
||||||
originalNameHint: 'Metadata is looked up by this; screens still show the regular name.',
|
originalNameHint: 'Metadata is looked up by this; screens still show the regular name.',
|
||||||
|
|||||||
Reference in New Issue
Block a user