feat(playlists): библиотека плейлистов приложения

CRUD в редакторе, read-only окно на пульте, отдельный аудиоканал, экспорт/импорт и маппинг из Foundry. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-09-03 10:37:21 +08:00
parent cfb6e62331
commit 278eb78637
46 changed files with 2438 additions and 41 deletions
@@ -0,0 +1,52 @@
+import React, { useMemo } from 'react';
+import { createPortal } from 'react-dom';
+
+import { Button } from '../shared/ui/controls';
+import {
+  PlaylistsPanel,
+  playlistsPanelLabelsFromT,
+} from '../shared/playlists/PlaylistsPanel';
+
+import styles from './EditorApp.module.css';
+import { useEditorI18n } from './i18n/EditorI18nContext';
+import panelStyles from './PlaylistsModal.module.css';
+
+export function PlaylistsManagerModal({
+  open,
+  onClose,
+}: {
+  open: boolean;
+  onClose: () => void;
+}) {
+  const { t } = useEditorI18n();
+  const labels = useMemo(() => playlistsPanelLabelsFromT(t), [t]);
+  if (!open) return null;
+
+  return createPortal(
+    <>
+      <div className={styles.modalBackdrop} aria-hidden onClick={onClose} />
+      <div
+        className={[styles.modalDialog, panelStyles.dialog].join(' ')}
+        role="dialog"
+        aria-modal="true"
+        data-testid="playlists-modal"
+      >
+        <div className={styles.modalHeader}>
+          <div className={styles.modalTitle}>{t('playlists.title')}</div>
+          <button type="button" aria-label={t('common.close')} onClick={onClose} className={styles.modalClose}>
+            ×
+          </button>
+        </div>
+        <div className={panelStyles.body}>
+          <PlaylistsPanel labels={labels} />
+        </div>
+        <div className={styles.modalFooter}>
+          <Button variant="ghost" onClick={onClose}>
+            {t('common.close')}
+          </Button>
+        </div>
+      </div>
+    </>,
+    document.body,
+  );
+}