CI/CD

ui/src/components/StackPresetToolbar.jsx

@@ -0,0 +1,75 @@
+import { postJson } from "../api/controlApi";
+
+export function StackPresetToolbar({
+  presetName,
+  selectedPresetName,
+  stackPresets,
+  onPresetNameChange,
+  onSelectedPresetNameChange,
+}) {
+  return (
+    <section className="toolbar">
+      <div className="toolbar__group toolbar__group--wide">
+        <label htmlFor="preset-name">Save Stack</label>
+        <div className="toolbar__inline">
+          <input
+            id="preset-name"
+            type="text"
+            placeholder="Preset name"
+            value={presetName}
+            onChange={(event) => onPresetNameChange(event.target.value)}
+          />
+          <button
+            type="button"
+            disabled={!presetName.trim()}
+            onClick={() => {
+              const trimmedName = presetName.trim();
+              if (!trimmedName) {
+                return;
+              }
+              postJson("/api/stack-presets/save", { presetName: trimmedName });
+              onSelectedPresetNameChange(
+                trimmedName.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, ""),
+              );
+            }}
+          >
+            Save
+          </button>
+        </div>
+      </div>
+
+      <div className="toolbar__group toolbar__group--wide">
+        <label htmlFor="preset-select">Recall Stack</label>
+        <div className="toolbar__inline">
+          <select
+            id="preset-select"
+            value={selectedPresetName}
+            onChange={(event) => onSelectedPresetNameChange(event.target.value)}
+          >
+            {stackPresets.length === 0 ? <option value="">No presets</option> : null}
+            {stackPresets.map((preset) => (
+              <option key={preset} value={preset}>
+                {preset}
+              </option>
+            ))}
+          </select>
+          <button
+            type="button"
+            disabled={!selectedPresetName}
+            onClick={() => {
+              if (selectedPresetName) {
+                postJson("/api/stack-presets/load", { presetName: selectedPresetName });
+              }
+            }}
+          >
+            Recall
+          </button>
+        </div>
+      </div>
+
+      <button type="button" onClick={() => postJson("/api/reload", {})}>
+        Reload Shader
+      </button>
+    </section>
+  );
+}