✨ feat: refine server management workflows

2026-09-13 18:59:25 +00:00 · 2026-08-13 02:19:26 +07:00
parent 3a09f0b571
commit bd473863f3
22 changed files with 2069 additions and 2208 deletions
@@ -0,0 +1,106 @@
+import { Plus, Trash2 } from "lucide-react";
+import { HelpTooltip } from "@/components/form-controls";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { TabsContent } from "@/components/ui/tabs";
+import { Field } from "./fields";
+import type { ServerFormPanelProps } from "./types";
+
+interface AdvancedPanelProps extends ServerFormPanelProps {
+  addEnvVar: () => void;
+  removeEnvVar: (index: number) => void;
+  updateEnvVar: (index: number, field: "key" | "value", value: string) => void;
+}
+
+export function AdvancedPanel({
+  formData,
+  updateField,
+  addEnvVar,
+  removeEnvVar,
+  updateEnvVar,
+}: AdvancedPanelProps) {
+  return (
+    <TabsContent value="advanced" className="space-y-4 mt-4">
+      <div className="grid grid-cols-3 gap-4">
+        <Field id="timezone" label="Timezone" tooltip="Timezone for server logs and scheduling (e.g., America/New_York)">
+          <Input
+            id="timezone"
+            value={formData.timezone}
+            onChange={(event) => updateField("timezone", event.target.value)}
+            placeholder="UTC"
+          />
+        </Field>
+        <Field id="uid" label="User ID (UID)" tooltip="Linux user ID for the Minecraft process">
+          <Input
+            id="uid"
+            value={formData.uid}
+            onChange={(event) => updateField("uid", event.target.value)}
+            placeholder="1000"
+          />
+        </Field>
+        <Field id="gid" label="Group ID (GID)" tooltip="Linux group ID for the Minecraft process">
+          <Input
+            id="gid"
+            value={formData.gid}
+            onChange={(event) => updateField("gid", event.target.value)}
+            placeholder="1000"
+          />
+        </Field>
+      </div>
+      <Field
+        id="stopDuration"
+        label="Graceful Shutdown Timeout (seconds)"
+        tooltip="How long to wait for graceful shutdown before forcing stop"
+      >
+        <Input
+          id="stopDuration"
+          type="number"
+          value={formData.stopDuration}
+          onChange={(event) => updateField("stopDuration", event.target.value)}
+          min="1"
+        />
+      </Field>
+      <div className="space-y-4">
+        <div className="flex items-center justify-between">
+          <Label>
+            Custom Environment Variables
+            <HelpTooltip content="Additional environment variables to pass to the container" />
+          </Label>
+          <Button type="button" variant="outline" size="sm" onClick={addEnvVar}>
+            <Plus className="h-4 w-4 mr-2" />
+            Add Variable
+          </Button>
+        </div>
+        {formData.envVars.length > 0 && (
+          <div className="space-y-3">
+            {formData.envVars.map((envVar, index) => (
+              <div key={envVar.id} className="flex gap-2">
+                <Input
+                  placeholder="KEY"
+                  value={envVar.key}
+                  onChange={(event) => updateEnvVar(index, "key", event.target.value)}
+                  className="flex-1 font-mono"
+                />
+                <Input
+                  placeholder="value"
+                  value={envVar.value}
+                  onChange={(event) => updateEnvVar(index, "value", event.target.value)}
+                  className="flex-1"
+                />
+                <Button
+                  type="button"
+                  variant="outline"
+                  size="icon"
+                  onClick={() => removeEnvVar(index)}
+                >
+                  <Trash2 className="h-4 w-4" />
+                </Button>
+              </div>
+            ))}
+          </div>
+        )}
+      </div>
+    </TabsContent>
+  );
+}