Function ModEditor

apps/webuiapps/src/components/ChatPanel/ModPanel.tsx:245–376

({ entry, onSave, onClose })

  onSave: (entry: ModEntry) => void;
  onClose: () => void;
}> = ({ entry, onSave, onClose }) => {
  const config = entry.config;
  const state = entry.state;

  const [modName, setModName] = useState(config.mod_name);
  const [modNameEn, setModNameEn] = useState(config.mod_name_en);
  const [modDescription, setModDescription] = useState(config.mod_description);
  const [stages, setStages] = useState<EditableStage[]>(configToEditable(config));
  const [activeTab, setActiveTab] = useState<'progress' | 'edit'>('progress');
  const [currentState] = useState<ModState>({ ...state });

  const handleAddStage = () => {
    setStages([
      ...stages,
      {
        stage_name: `Stage ${stages.length + 1}`,
        stage_description: '',
        targets: [{ id: nextTargetId++, description: '' }],
      },
    ]);
  };

  const handleRemoveStage = (index: number) => {
    setStages(stages.filter((_, i) => i !== index));
  };

  const updateStage = (index: number, field: keyof EditableStage, value: string) => {
    const updated = [...stages];
    (updated[index] as Record<string, unknown>)[field] = value;
    setStages(updated);
  };

  const handleAddTarget = (stageIndex: number) => {
    const updated = [...stages];
    updated[stageIndex].targets.push({ id: nextTargetId++, description: '' });
    setStages(updated);
  };

  const handleRemoveTarget = (stageIndex: number, targetIndex: number) => {
    const updated = [...stages];
    updated[stageIndex].targets = updated[stageIndex].targets.filter((_, i) => i !== targetIndex);
    setStages(updated);
  };

  const updateTarget = (stageIndex: number, targetIndex: number, value: string) => {
    const updated = [...stages];
    updated[stageIndex].targets[targetIndex].description = value;
    setStages(updated);
  };

  const handleSave = () => {
    const newConfig = editableToConfig(stages, config.id, modName, modNameEn, modDescription);
    onSave({ config: newConfig, state: currentState });
  };

  const handleSaveAndReset = () => {
    const newConfig = editableToConfig(stages, config.id, modName, modNameEn, modDescription);
    onSave({