Merge pull request #67 from artemploxoyy/feature/select-field-type

mmeerrkkaa · web-flow · commit b54562c04398 · 2025-12-15T11:53:39.000+03:00
feat: добавлена поддержка типа select для настроек плагинов
diff --git a/backend/src/ai/plugin-assistant-system-prompt.md b/backend/src/ai/plugin-assistant-system-prompt.md
@@ -412,6 +412,26 @@ bot.events.on('core:raw_message', (rawText, jsonMsg) => {
         "defaultPath": "config/default.json"
       },
 
+      "mode": {
+        "type": "select",
+        "label": "Режим работы",
+        "description": "Выберите режим работы плагина",
+        "options": ["easy", "normal", "hard"],
+        "default": "normal"
+      },
+
+      "language": {
+        "type": "select",
+        "label": "Язык",
+        "description": "Выберите язык интерфейса",
+        "options": [
+          { "value": "ru", "label": "Русский" },
+          { "value": "en", "label": "English" },
+          { "value": "uk", "label": "Українська" }
+        ],
+        "default": "ru"
+      },
+
       "proxy": {
         "type": "proxy",
         "label": "Прокси для запросов",
@@ -434,6 +454,7 @@ bot.events.on('core:raw_message', (rawText, jsonMsg) => {
 | `string[]` | Массив строк | `["a", "b"]` |
 | `json` | JSON объект | `{"key": "value"}` |
 | `json_file` | JSON из файла | Путь к файлу |
+| `select` | Выпадающий список | `"normal"` (строка или объект) |
 | `proxy` | Выбор прокси (из списка или вручную) | `{ enabled: true, host: "...", port: 1080 }` |
 
 ### Структура объекта proxy
@@ -454,6 +475,44 @@ bot.events.on('core:raw_message', (rawText, jsonMsg) => {
 
 Если прокси отключен: `{ enabled: false }`
 
+### Структура настройки select
+
+Настройка типа `select` позволяет пользователю выбрать одно значение из предопределенного списка опций.
+
+**Формат options:**
+
+1. **Простой массив строк** - когда значение и label совпадают:
+
+```javascript
+"options": ["easy", "normal", "hard"]
+```
+
+1. **Массив объектов** - когда нужны разные value и label:
+
+```javascript
+"options": [
+    { "value": "ru", "label": "Русский" },
+    { "value": "en", "label": "English" },
+    { "value": "uk", "label": "Українська" }
+]
+```
+
+**Результат:**
+Сохраненное значение всегда будет строкой (например: `"normal"`, `"ru"`)
+
+**Пример использования в плагине:**
+
+```javascript
+module.exports = (bot, { settings }) => {
+    const mode = settings.mode; // "easy" | "normal" | "hard"
+    const language = settings.language; // "ru" | "en" | "uk"
+
+    if (mode === 'hard') {
+        console.log('Включён сложный режим');
+    }
+};
+```
+
 ### Доступ к настройкам
 
 ```javascript
diff --git a/frontend/src/components/PluginSettingsDialog.jsx b/frontend/src/components/PluginSettingsDialog.jsx
@@ -15,6 +15,7 @@ import { apiHelper } from '@/lib/api';
 import PluginDetailInfo from './PluginDetailInfo';
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { useAppStore } from '@/stores/appStore';
+import { shouldShowField } from '@/lib/pluginSettingsUtils';
 
 function JsonEditorDialog({ initialValue, onSave, onCancel }) {
     const [jsonString, setJsonString] = useState('');
@@ -201,6 +202,29 @@ function SettingField({ settingKey, config, value, onChange, readOnly }) {
                     {config.description && <p className="text-sm text-muted-foreground">{config.description}</p>}
                 </div>
             );
+        case 'select':
+            return (
+                <div className="space-y-2">
+                    <Label htmlFor={id}>{config.label}</Label>
+                    <Select value={value ?? config.default ?? ''} onValueChange={readOnly ? undefined : ((newValue) => onChange(settingKey, newValue))} disabled={readOnly}>
+                        <SelectTrigger id={id}>
+                            <SelectValue placeholder="Выберите значение" />
+                        </SelectTrigger>
+                        <SelectContent>
+                            {(config.options || []).map((option) => {
+                                const optionValue = typeof option === 'string' ? option : option.value;
+                                const optionLabel = typeof option === 'string' ? option : option.label;
+                                return (
+                                    <SelectItem key={optionValue} value={optionValue}>
+                                        {optionLabel}
+                                    </SelectItem>
+                                );
+                            })}
+                        </SelectContent>
+                    </Select>
+                    {config.description && <p className="text-sm text-muted-foreground">{config.description}</p>}
+                </div>
+            );
         case 'json_file':
             return (
                 <div className="space-y-2">
@@ -372,16 +396,19 @@ export default function PluginSettingsDialog({ bot, plugin, onOpenChange, onSave
                         <AccordionItem key={categoryKey} value={categoryKey} className="border rounded-lg bg-muted/20 px-4">
                             <AccordionTrigger className="text-base font-semibold hover:no-underline">{categoryConfig.label}</AccordionTrigger>
                             <AccordionContent className="pt-4 border-t space-y-4">
-                                {Object.entries(categoryConfig).filter(([key]) => key !== 'label').map(([key, config]) => (
-                                     <SettingField
-                                        key={key}
-                                        settingKey={key}
-                                        config={config}
-                                        value={settings[key]}
-                                        onChange={handleSettingChange}
-                                        readOnly={readOnly}
-                                    />
-                                ))}
+                                {Object.entries(categoryConfig)
+                                    .filter(([key]) => key !== 'label')
+                                    .filter(([key, config]) => shouldShowField(key, settings?.actionsPreset))
+                                    .map(([key, config]) => (
+                                        <SettingField
+                                            key={key}
+                                            settingKey={key}
+                                            config={config}
+                                            value={settings[key]}
+                                            onChange={handleSettingChange}
+                                            readOnly={readOnly}
+                                        />
+                                    ))}
                             </AccordionContent>
                         </AccordionItem>
                     ))}
@@ -391,16 +418,18 @@ export default function PluginSettingsDialog({ bot, plugin, onOpenChange, onSave
 
         return (
             <div className="space-y-4">
-                {Object.entries(manifestSettings).map(([key, config]) => (
-                    <SettingField
-                        key={key}
-                        settingKey={key}
-                        config={config}
-                        value={settings[key]}
-                        onChange={handleSettingChange}
-                        readOnly={readOnly}
-                    />
-                ))}
+                {Object.entries(manifestSettings)
+                    .filter(([key, config]) => shouldShowField(key, settings?.actionsPreset))
+                    .map(([key, config]) => (
+                        <SettingField
+                            key={key}
+                            settingKey={key}
+                            config={config}
+                            value={settings[key]}
+                            onChange={handleSettingChange}
+                            readOnly={readOnly}
+                        />
+                    ))}
             </div>
         );
     };
diff --git a/frontend/src/components/PluginSettingsForm.jsx b/frontend/src/components/PluginSettingsForm.jsx
@@ -9,6 +9,7 @@ import { Edit } from 'lucide-react';
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogFooter, DialogTrigger } from "@/components/ui/dialog";
 import Editor from '@monaco-editor/react';
 import { useAppStore } from '@/stores/appStore';
+import { shouldShowField } from '@/lib/pluginSettingsUtils';
 
 function JsonEditorDialog({ initialValue, onSave, onCancel }) {
     const [jsonString, setJsonString] = useState('');
@@ -197,6 +198,29 @@ function SettingField({ settingKey, config, value, onChange }) {
                     {config.description && <p className="text-sm text-muted-foreground">{config.description}</p>}
                 </div>
             );
+        case 'select':
+            return (
+                <div className="space-y-2">
+                    <Label htmlFor={id}>{config.label}</Label>
+                    <Select value={value ?? config.default ?? ''} onValueChange={(newValue) => onChange(settingKey, newValue)}>
+                        <SelectTrigger id={id}>
+                            <SelectValue placeholder="Выберите значение" />
+                        </SelectTrigger>
+                        <SelectContent>
+                            {(config.options || []).map((option) => {
+                                const optionValue = typeof option === 'string' ? option : option.value;
+                                const optionLabel = typeof option === 'string' ? option : option.label;
+                                return (
+                                    <SelectItem key={optionValue} value={optionValue}>
+                                        {optionLabel}
+                                    </SelectItem>
+                                );
+                            })}
+                        </SelectContent>
+                    </Select>
+                    {config.description && <p className="text-sm text-muted-foreground">{config.description}</p>}
+                </div>
+            );
         case 'json':
         case 'json_file':
              return (
@@ -236,15 +260,17 @@ export default function PluginSettingsForm({ plugin, onSettingsChange }) {
 
     return (
         <div className="space-y-6">
-            {Object.entries(plugin.manifest.settings).map(([key, config]) => (
-                <SettingField
-                    key={key}
-                    settingKey={key}
-                    config={config}
-                    value={plugin.settings[key]}
-                    onChange={handleFieldChange}
-                />
-            ))}
+            {Object.entries(plugin.manifest.settings)
+                .filter(([key, config]) => shouldShowField(key, plugin.settings?.actionsPreset))
+                .map(([key, config]) => (
+                    <SettingField
+                        key={key}
+                        settingKey={key}
+                        config={config}
+                        value={plugin.settings[key]}
+                        onChange={handleFieldChange}
+                    />
+                ))}
         </div>
     );
 }
diff --git a/frontend/src/lib/pluginSettingsUtils.js b/frontend/src/lib/pluginSettingsUtils.js
@@ -0,0 +1,15 @@
+/**
+ * Определяет, должно ли поле настройки плагина отображаться
+ * на основе условий (например, actionsPreset)
+ *
+ * @param {string} key - Ключ поля настройки
+ * @param {any} actionsPresetValue - Значение поля actionsPreset (если есть)
+ * @returns {boolean} - Должно ли поле отображаться
+ */
+export const shouldShowField = (key, actionsPresetValue) => {
+    // Если есть поле actionsPreset, то поля enable* показываем только при custom
+    if (actionsPresetValue !== undefined && key.startsWith('enable')) {
+        return actionsPresetValue === 'custom';
+    }
+    return true;
+};
