Refactor LayerApplicabilityDialog and RulesCard components to utilize useKeyedList for managing lists, improving state handling and performance. Update ScheduleGrid to enhance key assignment for mapped elements, ensuring better React reconciliation. Modify ManualInboxDialog to use unique keys for parts in sample name processing, and improve ToastProvider and ThemeProvider by memoizing context values to prevent unnecessary re-renders.

frontend/src/features/admin/media/ManualInboxDialog.tsx

@@ -112,16 +112,22 @@ export function ManualInboxDialog({ onClose }: { onClose: () => void }) {
   const sampleParts = useMemo(() => {
     if (!sample) return []
     const numbers = findNumbers(sample.name)
-    const parts: { text: string; number: number | null }[] = []
+    // start — позиция куска в имени файла: она уникальна в пределах образца и годится как key,
+    // в отличие от индекса (куски одинакового текста встречаются в имени по нескольку раз).
+    const parts: { start: number; text: string; number: number | null }[] = []
     let cursor = 0
     for (const number of numbers) {
       if (number.start > cursor)
-        parts.push({ text: sample.name.slice(cursor, number.start), number: null })
-      parts.push({ text: number.text, number: number.index })
+        parts.push({
+          start: cursor,
+          text: sample.name.slice(cursor, number.start),
+          number: null,
+        })
+      parts.push({ start: number.start, text: number.text, number: number.index })
       cursor = number.start + number.text.length
     }
     if (cursor < sample.name.length)
-      parts.push({ text: sample.name.slice(cursor), number: null })
+      parts.push({ start: cursor, text: sample.name.slice(cursor), number: null })
     return parts
   }, [sample])
   /**
@@ -264,14 +270,14 @@ export function ManualInboxDialog({ onClose }: { onClose: () => void }) {
                 {t('admin.media.regexPickHint')}
               </span>
               <div className="flex flex-wrap items-center gap-0.5 font-mono text-xs">
-                {sampleParts.map((part, index) =>
+                {sampleParts.map((part) =>
                   part.number === null ? (
-                    <span key={index} className="text-muted-foreground">
+                    <span key={part.start} className="text-muted-foreground">
                       {part.text}
                     </span>
                   ) : (
                     <button
-                      key={index}
+                      key={part.start}
                       type="button"
                       title={t('admin.media.regexPickTitle')}
                       className="rounded border border-primary/60 bg-primary/10 px-1 text-primary hover:bg-primary/25"