Leonid Pershin
287ed5aa12
Consolidated imports in ChannelDetail and replaced the SchedulePreview component with AirSchedule for enhanced scheduling display. Updated the MediaImportDialog to prioritize the manual tab and adjusted localization strings for clarity in both English and Russian. These changes aim to streamline user interactions and improve the overall user experience in managing channels and media imports.
67 lines
3.0 KiB
TypeScript
67 lines
3.0 KiB
TypeScript
import { useState } from 'react'
|
|
import { useTranslation } from 'react-i18next'
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogDescription,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
} from '@/shared/ui/dialog'
|
|
import { ManualInboxPanel } from './ManualInboxPanel'
|
|
import { MovieImportPanel } from './MovieImportPanel'
|
|
import { UploadToShowPanel } from './UploadToShowPanel'
|
|
|
|
/** Способы пополнить библиотеку: серии из manual/, фильмы пачкой, загрузка файлов в шоу. */
|
|
type Tab = 'manual' | 'movies' | 'toShow'
|
|
|
|
/**
|
|
* Одно окно на все способы завести медиа: серии из `manual/` в шоу, фильмы пачкой и загрузка
|
|
* выбранных файлов в шоу. Раньше это были три кнопки и три окна — а выбор между ними делается
|
|
* один раз и по одному признаку: что за контент кладём.
|
|
*
|
|
* Первой открывается вкладка серий: сериалами библиотека пополняется чаще, и попасть в неё сразу
|
|
* важнее, чем в разбор фильмов, который делают раз на пачку.
|
|
*/
|
|
export function MediaImportDialog({ onClose }: Readonly<{ onClose: () => void }>) {
|
|
const { t } = useTranslation()
|
|
const [tab, setTab] = useState<Tab>('manual')
|
|
|
|
const tabs: Tab[] = ['manual', 'movies', 'toShow']
|
|
|
|
return (
|
|
<Dialog open onOpenChange={(open) => !open && onClose()}>
|
|
{/* Высота фиксирована: вкладки разного роста, и окно, прыгающее при переключении,
|
|
сбивает — то, на что метился курсор, уезжает из-под него. */}
|
|
<DialogContent className="flex h-[min(88vh,56rem)] w-full max-w-[min(96vw,80rem)] flex-col">
|
|
<DialogHeader>
|
|
<DialogTitle>{t('admin.media.importTitle')}</DialogTitle>
|
|
<DialogDescription>{t('admin.media.importHint')}</DialogDescription>
|
|
</DialogHeader>
|
|
|
|
<div className="flex gap-1 border-b border-border">
|
|
{tabs.map((item) => (
|
|
<button
|
|
key={item}
|
|
type="button"
|
|
onClick={() => setTab(item)}
|
|
className={`-mb-px border-b-2 px-3 py-1.5 text-sm ${
|
|
tab === item
|
|
? 'border-primary text-foreground'
|
|
: 'border-transparent text-muted-foreground hover:text-foreground'
|
|
}`}
|
|
>
|
|
{t(`admin.media.importTabs.${item}`)}
|
|
</button>
|
|
))}
|
|
</div>
|
|
|
|
<div className="flex min-h-0 flex-1 flex-col gap-3 pt-3">
|
|
{tab === 'movies' && <MovieImportPanel onClose={onClose} />}
|
|
{tab === 'manual' && <ManualInboxPanel onClose={onClose} />}
|
|
{tab === 'toShow' && <UploadToShowPanel onClose={onClose} />}
|
|
</div>
|
|
</DialogContent>
|
|
</Dialog>
|
|
)
|
|
}
|