zebflow 0.9.1

Reactive web automation platform — pipelines, templates, and real-time collaboration in a single binary.
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

import { useState, useEffect } from "zeb/react";
import { Dialog } from "@/components/ui/dialog";
import DialogContent from "@/components/ui/dialog-content";
import DialogHeader from "@/components/ui/dialog-header";
import DialogTitle from "@/components/ui/dialog-title";
import DialogFooter from "@/components/ui/dialog-footer";
import Input from "@/components/ui/input";
import Button from "@/components/ui/button";

export default function CommitDialog({ open, section, defaultMessage, onConfirm, onCancel }: any) {
  const [message, setMessage] = useState(defaultMessage ?? "");

  useEffect(() => {
    if (open) setMessage(defaultMessage ?? "");
  }, [open, defaultMessage]);

  function handleSubmit(e: any) {
    e.preventDefault();
    onConfirm((message ?? "").trim() || (defaultMessage ?? "chore: update settings"));
  }

  return (
    <Dialog open={open} onOpenChange={(v: boolean) => !v && onCancel()}>
      <DialogContent>
        <DialogHeader>
          <DialogTitle>
            Commit changes{section ? <span className="project-inline-chip ml-2">{section}</span> : null}
          </DialogTitle>
        </DialogHeader>
        <p className="text-xs text-muted-foreground">
          Your changes will be saved and committed to the project repository.
        </p>
        <form onSubmit={handleSubmit} className="flex flex-col gap-3">
          <div className="flex flex-col gap-1.5">
            <label className="text-xs font-medium text-muted-foreground">Commit message</label>
            <Input
              name="commit_message"
              value={message}
              onInput={(e: any) => setMessage(e.currentTarget.value)}
              autoComplete="off"
              className="font-mono"
            />
          </div>
          <DialogFooter>
            <Button type="button" variant="outline" size="sm" label="Cancel" onClick={onCancel} />
            <Button type="submit" variant="primary" size="sm" label="Commit & Save" />
          </DialogFooter>
        </form>
      </DialogContent>
    </Dialog>
  );
}