add: template editor

2025-04-14 17:02:22 +01:00
parent 09338a2683
commit 947b59e3ea
29 changed files with 1277 additions and 166 deletions
--- a/src/components/MarkdownTemplate/ParametersManager.js
+++ b/src/components/MarkdownTemplate/ParametersManager.js
@@ -0,0 +1,84 @@
+import React, { useState } from "react";
+import TypeEditor from "./TypeEditor";
+
+const ParametersManager = ({ parameters, onChange }) => {
+    const [_parameters, setParameters] = useState(parameters || []);
+
+    const handleAdd = () => {
+        const updated = [
+            ..._parameters,
+            {
+                name: "",
+                type: { base_type: "string" }
+            }
+        ];
+        setParameters(updated);
+        onChange(updated);
+    };
+
+    const handleNameChange = (index, newName) => {
+        const updated = [..._parameters];
+        updated[index].name = newName;
+        setParameters(updated);
+        onChange(updated);
+    };
+
+    const handleDelete = (index) => {
+        const updated = [..._parameters];
+        updated.splice(index, 1);
+        setParameters(updated);
+        onChange(updated);
+    };
+
+    return (
+        <div className="box">
+            <div className="field">
+                <div className="control">
+                    <button className="button is-primary" onClick={handleAdd}>
+                        Add Parameter
+                    </button>
+                </div>
+            </div>
+            {_parameters.map((param, index) => (
+                <div key={index} className="box" style={{ marginBottom: "1rem" }}>
+                    <div className="field is-grouped is-grouped-multiline">
+                        <div className="control is-expanded">
+                            <label className="label">Name:</label>
+                            <input
+                                type="text"
+                                className="input"
+                                value={param.name}
+                                onChange={(e) => handleNameChange(index, e.target.value)}
+                                placeholder="Parameter name"
+                            />
+                        </div>
+                        <div className="control">
+                            <button
+                                className="button is-danger"
+                                onClick={() => handleDelete(index)}
+                            >
+                                Delete
+                            </button>
+                        </div>
+                    </div>
+                    <div className="field">
+                        <label className="label">Type:</label>
+                        <div className="control">
+                            <TypeEditor
+                                type={param.type}
+                                onChange={(newType) => {
+                                    const updated = [..._parameters];
+                                    updated[index].type = newType;
+                                    setParameters(updated);
+                                    onChange(updated);
+                                }}
+                            />
+                        </div>
+                    </div>
+                </div>
+            ))}
+        </div>
+    );
+};
+
+export default ParametersManager;