New Interface (initial commit)

src/components/setting/mods/config-viewer.tsx

@@ -1,15 +1,18 @@
 import { forwardRef, useImperativeHandle, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Box, Chip } from "@mui/material";
 import { getRuntimeYaml } from "@/services/cmds";
 import { DialogRef } from "@/components/base";
-import { EditorViewer } from "@/components/profile/editor-viewer";
+import { EditorViewer } from "@/components/profile/editor-viewer"; // Наш обновленный компонент
+
+// Новые импорты
+import { Badge } from "@/components/ui/badge";
 
 export const ConfigViewer = forwardRef<DialogRef>((_, ref) => {
   const { t } = useTranslation();
   const [open, setOpen] = useState(false);
   const [runtimeConfig, setRuntimeConfig] = useState("");
 
+  // useImperativeHandle остается без изменений
   useImperativeHandle(ref, () => ({
     open: () => {
       getRuntimeYaml().then((data) => {
@@ -21,14 +24,18 @@ export const ConfigViewer = forwardRef<DialogRef>((_, ref) => {
   }));
 
   if (!open) return null;
+
   return (
     <EditorViewer
       open={true}
       title={
-        <Box display="flex" alignItems="center" gap={2}>
-          {t("Runtime Config")}
-          <Chip label={t("ReadOnly")} size="small" />
-        </Box>
+        // --- НАЧАЛО ИЗМЕНЕНИЙ ---
+        // Заменяем Box на div и Chip на Badge
+        <div className="flex items-center gap-2">
+          <span>{t("Runtime Config")}</span>
+          <Badge variant="secondary">{t("ReadOnly")}</Badge>
+        </div>
+        // --- КОНЕЦ ИЗМЕНЕНИЙ ---
       }
       initialData={Promise.resolve(runtimeConfig)}
       readOnly