@frkntmbs/strapi-plugin-video-optimizer 1.0.0

package/admin/src/index.ts

@@ -0,0 +1,84 @@
+import { getTranslationKey, PLUGIN_ID } from './pluginId';
+import { MediaLibraryCacheBridge } from './components/MediaLibraryCacheBridge';
+import {
+  registerMediaLibraryDispatch,
+} from './utils/invalidateMediaLibrary';
+import { initUploadEnhancer } from './utils/initUploadEnhancer';
+import { initMediaLibraryProgress } from './utils/initMediaLibraryProgress';
+import { initMediaLibraryCardActions } from './utils/initMediaLibraryCardActions';
+import { initJobPoller } from './utils/initJobPoller';
+import { installQueryClientCapture } from './utils/captureQueryClient';
+import { installDebugMediaLibraryProgress } from './utils/debugMediaLibraryProgress';
+import { patchUploadFetch, patchUploadXHR } from './utils/uploadAssetStore';
+
+const prefixPluginTranslations = (
+  trad: Record<string, string>,
+  pluginId: string
+): Record<string, string> => {
+  return Object.entries(trad).reduce<Record<string, string>>((acc, [key, value]) => {
+    acc[`${pluginId}.${key}`] = value;
+    return acc;
+  }, {});
+};
+
+export default {
+  register(app) {
+    app.addSettingsLink('global', {
+      id: 'video-optimizer',
+      to: 'video-optimizer',
+      intlLabel: {
+        id: getTranslationKey('settings.section-label'),
+        defaultMessage: 'Video Optimizer',
+      },
+      Component: () =>
+        import('./pages/SettingsPage').then((mod) => ({
+          default: mod.ProtectedSettingsPage,
+        })),
+      permissions: [],
+    });
+
+    app.addComponents([
+      {
+        name: 'future-global::video-optimizer-cache',
+        Component: MediaLibraryCacheBridge,
+      },
+    ]);
+
+    app.addMiddlewares([
+      () => (api) => {
+        registerMediaLibraryDispatch(api.dispatch);
+
+        return (next) => (action) => next(action);
+      },
+    ]);
+  },
+
+  bootstrap() {
+    patchUploadFetch();
+    patchUploadXHR();
+    installQueryClientCapture();
+    initUploadEnhancer();
+    initMediaLibraryProgress();
+    initMediaLibraryCardActions();
+    initJobPoller();
+    installDebugMediaLibraryProgress();
+  },
+
+  async registerTrads({ locales }: { locales: string[] }) {
+    const importedTrads = await Promise.all(
+      locales.map(async (locale) => {
+        try {
+          const { default: data } = await import(`./translations/${locale}.json`);
+          return {
+            data: prefixPluginTranslations(data, PLUGIN_ID),
+            locale,
+          };
+        } catch {
+          return { data: {}, locale };
+        }
+      })
+    );
+
+    return importedTrads;
+  },
+};

package/admin/src/pages/SettingsPage.tsx

@@ -0,0 +1,208 @@
+import React, { useEffect, useState } from "react";
+import { Box, Button, Field, Flex, Grid, SingleSelect, SingleSelectOption, TextInput, Typography } from "@strapi/design-system";
+import { Check } from "@strapi/icons";
+import { Layouts, Page, useFetchClient, useNotification, useRBAC } from "@strapi/strapi/admin";
+import { useIntl } from "react-intl";
+import { OptimizationResizeFields } from "../components/OptimizationResizeFields";
+import { OptimizationVideoFields } from "../components/OptimizationVideoFields";
+import { DEFAULT_GLOBAL_SETTINGS, mergeGlobalSettings } from "../defaultGlobalSettings";
+import { getTranslationKey, PLUGIN_ID, MAX_CONCURRENT_JOBS_LIMIT, MAX_FFMPEG_THREADS_LIMIT, clampMaxConcurrentJobs, clampMaxFfmpegThreads, type GlobalOptimizationSettings, type OptimizationChoice } from "../pluginId";
+
+const SETTINGS_READ = [{ action: "plugin::video-optimizer.settings.read", subject: null }];
+const SETTINGS_UPDATE = [{ action: "plugin::video-optimizer.settings.update", subject: null }];
+
+const CHOICES: OptimizationChoice[] = ["original", "global", "custom"];
+
+export const SettingsPage = () => {
+	const { formatMessage } = useIntl();
+	const { get, put } = useFetchClient();
+	const { toggleNotification } = useNotification();
+	const { allowedActions: readActions } = useRBAC(SETTINGS_READ);
+	const { allowedActions: updateActions } = useRBAC(SETTINGS_UPDATE);
+
+	const canReadGlobal = readActions.canRead;
+	const canUpdateGlobal = updateActions.canUpdate;
+
+	const [globalSettings, setGlobalSettings] = useState<GlobalOptimizationSettings>(DEFAULT_GLOBAL_SETTINGS);
+	const [isLoading, setIsLoading] = useState(true);
+	const [isSaving, setIsSaving] = useState(false);
+
+	useEffect(() => {
+		const load = async () => {
+			if (!canReadGlobal) {
+				setIsLoading(false);
+				return;
+			}
+
+			try {
+				const { data: settings } = await get(`/${PLUGIN_ID}/settings`);
+				setGlobalSettings(mergeGlobalSettings(settings));
+			} catch {
+				toggleNotification({
+					type: "danger",
+					message: formatMessage({ id: getTranslationKey("settings.error") }),
+				});
+			} finally {
+				setIsLoading(false);
+			}
+		};
+
+		load();
+	}, [canReadGlobal, formatMessage, get, toggleNotification]);
+
+	const handleSave = async () => {
+		if (!canUpdateGlobal) {
+			return;
+		}
+
+		setIsSaving(true);
+
+		try {
+			await put(`/${PLUGIN_ID}/settings`, globalSettings);
+
+			toggleNotification({
+				type: "success",
+				message: formatMessage({ id: getTranslationKey("settings.saved") }),
+			});
+		} catch {
+			toggleNotification({
+				type: "danger",
+				message: formatMessage({ id: getTranslationKey("settings.error") }),
+			});
+		} finally {
+			setIsSaving(false);
+		}
+	};
+
+	if (isLoading) {
+		return <Page.Loading />;
+	}
+
+	if (!canReadGlobal) {
+		return (
+			<Page.Main>
+				<Page.Title>{formatMessage({ id: getTranslationKey("settings.page.title") })}</Page.Title>
+				<Layouts.Header title={formatMessage({ id: getTranslationKey("settings.page.title") })} subtitle={formatMessage({ id: getTranslationKey("settings.page.description") })} />
+				<Layouts.Content>
+					<Typography textColor="neutral600">{formatMessage({ id: getTranslationKey("settings.global.noPermission") })}</Typography>
+				</Layouts.Content>
+			</Page.Main>
+		);
+	}
+
+	return (
+		<Page.Main>
+			<Page.Title>{formatMessage({ id: getTranslationKey("settings.page.title") })}</Page.Title>
+			<Layouts.Header
+				title={formatMessage({ id: getTranslationKey("settings.page.title") })}
+				subtitle={formatMessage({ id: getTranslationKey("settings.page.description") })}
+				primaryAction={
+					canUpdateGlobal ? (
+						<Button onClick={handleSave} loading={isSaving} startIcon={<Check />} size="S">
+							{formatMessage({ id: getTranslationKey("settings.save") })}
+						</Button>
+					) : undefined
+				}
+			/>
+			<Layouts.Content>
+				<Layouts.Root>
+					<Flex direction="column" alignItems="stretch" gap={6}>
+						<Box background="neutral0" padding={6} shadow="filterShadow" hasRadius>
+							<Typography variant="delta" tag="h2">
+								{formatMessage({ id: getTranslationKey("settings.global.defaultChoiceTitle") })}
+							</Typography>
+							<Box paddingTop={2} paddingBottom={4}>
+								<Typography textColor="neutral600">{formatMessage({ id: getTranslationKey("settings.global.defaultChoiceDescription") })}</Typography>
+							</Box>
+
+							<Grid.Root gap={6}>
+								<Grid.Item col={6} xs={12} direction="column" alignItems="stretch">
+									<Field.Root name="defaultChoice">
+										<Field.Label>{formatMessage({ id: getTranslationKey("settings.global.defaultChoice") })}</Field.Label>
+										<SingleSelect value={globalSettings.defaultChoice} onChange={(value: OptimizationChoice) => setGlobalSettings((prev) => ({ ...prev, defaultChoice: value }))} disabled={!canUpdateGlobal || isSaving}>
+											{CHOICES.map((choice) => (
+												<SingleSelectOption key={choice} value={choice}>
+													{formatMessage({ id: getTranslationKey(`choice.${choice}`) })}
+												</SingleSelectOption>
+											))}
+										</SingleSelect>
+										<Field.Hint>{formatMessage({ id: getTranslationKey("settings.global.defaultChoiceHint") })}</Field.Hint>
+									</Field.Root>
+								</Grid.Item>
+							</Grid.Root>
+						</Box>
+
+						<Box background="neutral0" padding={6} shadow="filterShadow" hasRadius>
+							<Typography variant="delta" tag="h2">
+								{formatMessage({ id: getTranslationKey("settings.global.profileTitle") })}
+							</Typography>
+							<Box paddingTop={2} paddingBottom={4}>
+								<Typography textColor="neutral600">{formatMessage({ id: getTranslationKey("settings.global.profileDescription") })}</Typography>
+							</Box>
+
+							<Grid.Root gap={6}>
+								<OptimizationVideoFields value={globalSettings} onChange={(patch) => setGlobalSettings((prev) => ({ ...prev, ...patch }))} disabled={!canUpdateGlobal || isSaving} namePrefix="global" />
+
+								<OptimizationResizeFields value={globalSettings} onChange={(patch) => setGlobalSettings((prev) => ({ ...prev, ...patch }))} disabled={!canUpdateGlobal || isSaving} namePrefix="global" variant="global" />
+							</Grid.Root>
+						</Box>
+
+						<Box background="neutral0" padding={6} shadow="filterShadow" hasRadius>
+							<Typography variant="delta" tag="h2">
+								{formatMessage({ id: getTranslationKey("settings.global.concurrencyTitle") })}
+							</Typography>
+							<Box paddingTop={2} paddingBottom={4}>
+								<Typography textColor="neutral600">{formatMessage({ id: getTranslationKey("settings.global.concurrencyDescription") })}</Typography>
+							</Box>
+
+							<Grid.Root gap={6}>
+								<Grid.Item col={6} xs={12} direction="column" alignItems="stretch">
+									<Field.Root name="maxConcurrentJobs">
+										<Field.Label>{formatMessage({ id: getTranslationKey("settings.global.maxConcurrentJobs") })}</Field.Label>
+										<TextInput
+											type="number"
+											min={1}
+											max={MAX_CONCURRENT_JOBS_LIMIT}
+											value={String(globalSettings.maxConcurrentJobs)}
+											onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+												setGlobalSettings((prev) => ({
+													...prev,
+													maxConcurrentJobs: clampMaxConcurrentJobs(Number(event.target.value) || 1),
+												}))
+											}
+											disabled={!canUpdateGlobal || isSaving}
+										/>
+										<Field.Hint>{formatMessage({ id: getTranslationKey("settings.global.maxConcurrentJobsHint") })}</Field.Hint>
+									</Field.Root>
+								</Grid.Item>
+								<Grid.Item col={6} xs={12} direction="column" alignItems="stretch">
+									<Field.Root name="maxFfmpegThreads">
+										<Field.Label>{formatMessage({ id: getTranslationKey("settings.global.maxFfmpegThreads") })}</Field.Label>
+										<TextInput
+											type="number"
+											min={1}
+											max={MAX_FFMPEG_THREADS_LIMIT}
+											value={String(globalSettings.maxFfmpegThreads)}
+											onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+												setGlobalSettings((prev) => ({
+													...prev,
+													maxFfmpegThreads: clampMaxFfmpegThreads(Number(event.target.value) || 1),
+												}))
+											}
+											disabled={!canUpdateGlobal || isSaving}
+										/>
+										<Field.Hint>{formatMessage({ id: getTranslationKey("settings.global.maxFfmpegThreadsHint") })}</Field.Hint>
+									</Field.Root>
+								</Grid.Item>
+							</Grid.Root>
+						</Box>
+					</Flex>
+				</Layouts.Root>
+			</Layouts.Content>
+		</Page.Main>
+	);
+};
+
+export const ProtectedSettingsPage = () => {
+	return <SettingsPage />;
+};

package/admin/src/pluginId.ts

@@ -0,0 +1,79 @@
+export const PLUGIN_ID = 'video-optimizer';
+
+export type OptimizationChoice = 'original' | 'global' | 'custom';
+export type VideoFormat = 'mp4' | 'webm';
+export type VideoCodec = 'h264' | 'vp9';
+export type AudioMode = 'keep' | 'remove' | 'compress';
+export type FfmpegPreset =
+  | 'ultrafast'
+  | 'superfast'
+  | 'veryfast'
+  | 'faster'
+  | 'fast'
+  | 'medium'
+  | 'slow'
+  | 'slower'
+  | 'veryslow';
+
+export interface OptimizationSettings {
+  defaultFormat: VideoFormat;
+  videoCodec: VideoCodec;
+  crf: number;
+  preset: FfmpegPreset;
+  maxWidth: number;
+  maxHeight: number;
+  audioMode: AudioMode;
+  audioBitrate: string;
+}
+
+export interface AssetOptimizationPreference {
+  choice: OptimizationChoice;
+  custom?: OptimizationSettings;
+}
+
+export interface GlobalOptimizationSettings {
+  defaultChoice: OptimizationChoice;
+  defaultFormat: VideoFormat;
+  videoCodec: VideoCodec;
+  crf: number;
+  preset: FfmpegPreset;
+  maxWidth: number;
+  maxHeight: number;
+  audioMode: AudioMode;
+  audioBitrate: string;
+  maxConcurrentJobs: number;
+  maxFfmpegThreads: number;
+}
+
+export type JobStatus = 'queued' | 'processing' | 'completed' | 'failed';
+
+export interface VideoOptimizerJob {
+  id: string;
+  fileId: number;
+  fileName?: string;
+  fileHash?: string;
+  status: JobStatus;
+  stage: string;
+  progress: number;
+  settings?: OptimizationSettings;
+  error?: string;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export const getTranslationKey = (key: string) => `${PLUGIN_ID}.${key}`;
+
+export const MAX_CONCURRENT_JOBS_LIMIT = 32;
+export const MAX_FFMPEG_THREADS_LIMIT = 8;
+
+export const clampMaxConcurrentJobs = (value: number) =>
+  Math.min(MAX_CONCURRENT_JOBS_LIMIT, Math.max(1, Math.round(value)));
+
+export const clampMaxFfmpegThreads = (value: number) =>
+  Math.min(MAX_FFMPEG_THREADS_LIMIT, Math.max(1, Math.round(value)));
+
+export const codecForFormat = (format: VideoFormat): VideoCodec =>
+  format === 'webm' ? 'vp9' : 'h264';
+
+export const isVideoFileName = (name: string) =>
+  /\.(mp4|webm|mov|avi|mkv|m4v|ogv|wmv|flv|3gp)$/i.test(name);

package/admin/src/translations/en.json

@@ -0,0 +1,74 @@
+{
+  "plugin.name": "Video Optimizer",
+  "settings.section-label": "Video Optimizer",
+  "settings.page.title": "Video Optimizer Settings",
+  "settings.page.description": "Configure global defaults used when uploading videos. Each video can be overridden in the upload dialog.",
+  "settings.format.mp4": "MP4 (H.264)",
+  "settings.format.webm": "WebM (VP9)",
+  "settings.audioMode.keep": "Keep original audio",
+  "settings.audioMode.remove": "Remove audio",
+  "settings.audioMode.compress": "Compress audio",
+  "settings.global.title": "Global settings",
+  "settings.global.description": "Default optimization settings for all video uploads. Individual videos can be changed in the Media Library upload dialog.",
+  "settings.global.defaultChoiceTitle": "Default upload choice",
+  "settings.global.defaultChoiceDescription": "Choose which option is pre-selected when opening the upload dialog for a new video.",
+  "settings.global.defaultChoice": "Default choice",
+  "settings.global.defaultChoiceHint": "This choice is applied automatically unless changed per video in the upload dialog.",
+  "settings.global.profileTitle": "Global optimization profile",
+  "settings.global.profileDescription": "Used when a video is set to Apply global settings, and as the starting values for Custom.",
+  "settings.global.defaultFormat": "Output format",
+  "settings.global.videoCodec": "Video codec",
+  "settings.global.crf": "CRF (quality)",
+  "settings.global.crfHint": "Lower values mean better quality and larger files (0–51).",
+  "settings.global.preset": "Encode preset",
+  "settings.global.audioMode": "Audio handling",
+  "settings.global.audioBitrate": "Audio bitrate",
+  "settings.global.codecHint": "Codec is selected automatically based on the output format.",
+  "settings.global.concurrencyTitle": "Processing concurrency",
+  "settings.global.concurrencyDescription": "Control how many FFmpeg jobs can run at the same time on this server.",
+  "settings.global.maxConcurrentJobs": "Max concurrent jobs",
+  "settings.global.maxConcurrentJobsHint": "1 is recommended on small servers. Can be set between 1 and 32.",
+  "settings.global.maxFfmpegThreads": "Max FFmpeg threads per job",
+  "settings.global.maxFfmpegThreadsHint": "Limits CPU usage per encode. Use 1–2 on weak VPS servers. Range: 1–8.",
+  "settings.resize.title": "Output dimensions",
+  "settings.resize.width": "Width (px)",
+  "settings.resize.height": "Height (px)",
+  "settings.resize.hint": "Defaults to the original video size. Change either value to resize; the other updates to keep aspect ratio.",
+  "settings.resize.globalHint": "Videos larger than this are scaled down while preserving aspect ratio.",
+  "settings.global.noPermission": "You do not have permission to view global Video Optimizer settings.",
+  "settings.save": "Save",
+  "settings.saved": "Settings saved",
+  "settings.error": "Failed to save settings",
+  "choice.original": "Keep original",
+  "choice.original.description": "No optimization is applied. The file is uploaded exactly as selected.",
+  "choice.global": "Apply global settings",
+  "choice.global.description": "Uses the global optimization profile configured in Settings.",
+  "choice.custom": "Custom",
+  "choice.custom.description": "Configure format and quality settings specifically for this video.",
+  "upload.optimization.label": "Optimization",
+  "upload.button.label": "Optimization settings",
+  "upload.modal.title": "Video optimization",
+  "upload.modal.save": "Save",
+  "upload.modal.cancel": "Cancel",
+  "upload.mode.footer.global": "Global: {mode}",
+  "upload.mode.footer.custom": "Custom: {mode}",
+  "jobs.status.queued": "Queued for optimization",
+  "jobs.status.processing": "Optimizing",
+  "jobs.status.completed": "Optimization completed",
+  "jobs.status.failed": "Optimization failed",
+  "jobs.stage.queued": "Waiting in queue",
+  "jobs.stage.preparing": "Preparing",
+  "jobs.stage.encoding": "Encoding video",
+  "jobs.stage.finalizing": "Finalizing",
+  "jobs.stage.completed": "Completed",
+  "jobs.stage.failed": "Failed",
+  "jobs.panel.title": "Video optimization",
+  "jobs.card.progress": "Optimizing: {progress}% → {format}",
+  "jobs.card.queued": "In queue",
+  "jobs.notification.completed": "Video #{fileId} optimized successfully. Media Library refreshed.",
+  "jobs.notification.failed": "Video optimization failed: {error}",
+  "mediaLibrary.button.optimize": "Optimize video",
+  "mediaLibrary.button.cancel": "Cancel optimization",
+  "mediaLibrary.modal.title": "Video optimization",
+  "mediaLibrary.modal.start": "Start optimization"
+}

package/admin/src/translations/tr.json

@@ -0,0 +1,74 @@
+{
+  "plugin.name": "Video Optimizasyon",
+  "settings.section-label": "Video Optimizasyon",
+  "settings.page.title": "Video Optimizasyon Ayarları",
+  "settings.page.description": "Video yüklerken kullanılacak genel varsayılanları buradan ayarlayın. Her video için yükleme penceresinde ayrı seçim yapılabilir.",
+  "settings.format.mp4": "MP4 (H.264)",
+  "settings.format.webm": "WebM (VP9)",
+  "settings.audioMode.keep": "Orijinal sesi koru",
+  "settings.audioMode.remove": "Sesi kaldır",
+  "settings.audioMode.compress": "Sesi sıkıştır",
+  "settings.global.title": "Genel ayarlar",
+  "settings.global.description": "Tüm video yüklemeleri için varsayılan optimizasyon ayarları. Her video için Media Library yükleme penceresinde farklı seçim yapılabilir.",
+  "settings.global.defaultChoiceTitle": "Varsayılan yükleme seçimi",
+  "settings.global.defaultChoiceDescription": "Yeni bir video için yükleme penceresi açıldığında hangi seçeneğin önceden işaretli geleceğini belirler.",
+  "settings.global.defaultChoice": "Varsayılan seçim",
+  "settings.global.defaultChoiceHint": "Upload penceresinde video bazında değiştirilmedikçe bu seçim uygulanır.",
+  "settings.global.profileTitle": "Global optimizasyon profili",
+  "settings.global.profileDescription": "Global ayarı uygula seçildiğinde kullanılır; Özel seçeneğinin başlangıç değerlerini de belirler.",
+  "settings.global.defaultFormat": "Çıktı formatı",
+  "settings.global.videoCodec": "Video codec",
+  "settings.global.crf": "CRF (kalite)",
+  "settings.global.crfHint": "Düşük değer daha iyi kalite ve daha büyük dosya demektir (0–51).",
+  "settings.global.preset": "Encode preset",
+  "settings.global.audioMode": "Ses işleme",
+  "settings.global.audioBitrate": "Ses bitrate",
+  "settings.global.codecHint": "Codec, çıktı formatına göre otomatik seçilir.",
+  "settings.global.concurrencyTitle": "İşlem eşzamanlılığı",
+  "settings.global.concurrencyDescription": "Bu sunucuda aynı anda kaç FFmpeg işinin çalışabileceğini belirler.",
+  "settings.global.maxConcurrentJobs": "Maks. eşzamanlı iş",
+  "settings.global.maxConcurrentJobsHint": "Küçük sunucularda 1 önerilir. 1–32 arasında ayarlanabilir.",
+  "settings.global.maxFfmpegThreads": "İş başına maks. FFmpeg thread",
+  "settings.global.maxFfmpegThreadsHint": "Her encode işinin CPU kullanımını sınırlar. Zayıf VPS'lerde 1–2 önerilir. Aralık: 1–8.",
+  "settings.resize.title": "Çıktı boyutları",
+  "settings.resize.width": "Genişlik (px)",
+  "settings.resize.height": "Yükseklik (px)",
+  "settings.resize.hint": "Varsayılan olarak videonun orijinal boyutu kullanılır. Boyutlandırmak için bir değeri değiştirin; diğeri en-boy oranını korumak için güncellenir.",
+  "settings.resize.globalHint": "Video bu boyuttan büyükse en-boy oranı korunarak küçültülür.",
+  "settings.global.noPermission": "Genel Video Optimizasyon ayarlarını görüntüleme izniniz yok.",
+  "settings.save": "Kaydet",
+  "settings.saved": "Ayarlar kaydedildi",
+  "settings.error": "Ayarlar kaydedilemedi",
+  "choice.original": "Olduğu gibi bırak",
+  "choice.original.description": "Hiçbir optimizasyon uygulanmaz. Dosya seçildiği haliyle yüklenir.",
+  "choice.global": "Global ayarı uygula",
+  "choice.global.description": "Settings altındaki global optimizasyon profilini kullanır.",
+  "choice.custom": "Özel",
+  "choice.custom.description": "Bu video için format ve kalite ayarlarını ayrıca yapılandırın.",
+  "upload.optimization.label": "Optimizasyon",
+  "upload.button.label": "Optimizasyon ayarları",
+  "upload.modal.title": "Video optimizasyonu",
+  "upload.modal.save": "Kaydet",
+  "upload.modal.cancel": "İptal",
+  "upload.mode.footer.global": "Global: {mode}",
+  "upload.mode.footer.custom": "Özel: {mode}",
+  "jobs.status.queued": "Optimizasyon kuyruğunda",
+  "jobs.status.processing": "Optimize ediliyor",
+  "jobs.status.completed": "Optimizasyon tamamlandı",
+  "jobs.status.failed": "Optimizasyon başarısız",
+  "jobs.stage.queued": "Kuyrukta bekliyor",
+  "jobs.stage.preparing": "Hazırlanıyor",
+  "jobs.stage.encoding": "Video encode ediliyor",
+  "jobs.stage.finalizing": "Tamamlanıyor",
+  "jobs.stage.completed": "Tamamlandı",
+  "jobs.stage.failed": "Başarısız",
+  "jobs.panel.title": "Video optimizasyonu",
+  "jobs.card.progress": "Optimizasyon: {progress}% → {format}",
+  "jobs.card.queued": "Sırada",
+  "jobs.notification.completed": "Video #{fileId} başarıyla optimize edildi. Media Library yenilendi.",
+  "jobs.notification.failed": "Video optimizasyonu başarısız: {error}",
+  "mediaLibrary.button.optimize": "Videoyu optimize et",
+  "mediaLibrary.button.cancel": "Optimizasyonu iptal et",
+  "mediaLibrary.modal.title": "Video optimizasyonu",
+  "mediaLibrary.modal.start": "Optimizasyonu başlat"
+}

package/admin/src/utils/adminFetch.ts

@@ -0,0 +1,57 @@
+export const getAuthToken = (): string | null => {
+  const fromStorage = localStorage.getItem('jwtToken');
+
+  if (fromStorage) {
+    try {
+      return JSON.parse(fromStorage) as string;
+    } catch {
+      return null;
+    }
+  }
+
+  const match = document.cookie.match(/(?:^|;\s*)jwtToken=([^;]+)/);
+  return match?.[1] ? decodeURIComponent(match[1]) : null;
+};
+
+export const adminFetch = async <T>(
+  path: string,
+  init: RequestInit = {}
+): Promise<T | null> => {
+  const backendURL = window.strapi?.backendURL;
+
+  if (!backendURL) {
+    return null;
+  }
+
+  const token = getAuthToken();
+  const headers = new Headers(init.headers);
+
+  if (!headers.has('Accept')) {
+    headers.set('Accept', 'application/json');
+  }
+
+  if (token && !headers.has('Authorization')) {
+    headers.set('Authorization', `Bearer ${token}`);
+  }
+
+  const normalizedPath = path.startsWith('/') ? path : `/${path}`;
+  const response = await fetch(`${backendURL}${normalizedPath}`, {
+    ...init,
+    headers,
+  });
+
+  if (!response.ok) {
+    return null;
+  }
+
+  return response.json() as Promise<T>;
+};
+
+export const adminGet = <T>(path: string) => adminFetch<T>(path);
+
+export const adminPost = <T>(path: string, body: unknown) =>
+  adminFetch<T>(path, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(body),
+  });

package/admin/src/utils/captureQueryClient.ts

@@ -0,0 +1,34 @@
+import { registerMediaLibraryQueryClient } from './invalidateMediaLibrary';
+import { registerMediaLibraryQueryClientBridge } from './mediaLibraryQueryBridge';
+
+let installed = false;
+
+export const installQueryClientCapture = () => {
+  if (installed || typeof window === 'undefined') {
+    return;
+  }
+
+  installed = true;
+
+  void import('react-query')
+    .then((reactQuery) => {
+      const original = reactQuery.useQueryClient;
+
+      if ((original as { __videoOptimizerPatched?: boolean }).__videoOptimizerPatched) {
+        return;
+      }
+
+      const patched = () => {
+        const client = original();
+        registerMediaLibraryQueryClientBridge(client);
+        registerMediaLibraryQueryClient(client);
+        return client;
+      };
+
+      (patched as { __videoOptimizerPatched?: boolean }).__videoOptimizerPatched = true;
+      Object.assign(reactQuery, { useQueryClient: patched });
+    })
+    .catch(() => {
+      installed = false;
+    });
+};