odd-box 0.1.10

a dead simple reverse proxy server and web server
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
53
54
55
56
57
58

import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle,
} from "@/components/dialog/dialog";
import { Button } from "../../ui/button";
import { ReactNode } from "react";
import { Loader2 } from "lucide-react";
export function ConfirmationDialog({
  title,
  subtitle,
  onConfirm,
  onClose,
  show,
  noBtnText,
  yesBtnText,
  isDangerAction,
  isSuccessLoading,
  inProgressText
}: {
  inProgressText?:string
  isDangerAction?: boolean;
  noBtnText?: string;
  yesBtnText?: string;
  title: ReactNode;
  subtitle: ReactNode;
  onConfirm: () => Promise<void>;
  onClose: () => void;
  show: boolean;
  isSuccessLoading?:boolean
}) {
  return (
    <Dialog open={show} onOpenChange={onClose}>
      <DialogContent className="sm:max-w-[425px] bg-[var(--modal-bg)] border border-[#242424]">
        <DialogHeader>
          <DialogTitle>{title}</DialogTitle>
          <DialogDescription>{subtitle}</DialogDescription>
        </DialogHeader>
        <DialogFooter className="gap-2">
          <Button onClick={onClose} variant="secondary" type="button">
            {noBtnText ?? "No, cancel"}
          </Button>
          <Button
            disabled={isSuccessLoading}
            onClick={onConfirm}
            variant={isDangerAction ? "destructive" : "default"}
          >
            {isSuccessLoading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
            {isSuccessLoading && inProgressText ? inProgressText : (yesBtnText ?? "Yes, confirm")}
          </Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  );
}