119 lines
3.1 KiB
TypeScript
119 lines
3.1 KiB
TypeScript
"use client";
|
|
|
|
import type React from "react";
|
|
|
|
import { useState } from "react";
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogDescription,
|
|
DialogFooter,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
} from "@/components/ui/dialog";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Label } from "@/components/ui/label";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Textarea } from "@/components/ui/textarea";
|
|
import { useMutation } from "@tanstack/react-query";
|
|
import { inviteUser } from "@/app/protected/(admin)/dashboard/user-management/action";
|
|
import { toast } from "sonner";
|
|
|
|
interface InviteUserDialogProps {
|
|
open: boolean;
|
|
onOpenChange: (open: boolean) => void;
|
|
onUserInvited: () => void;
|
|
}
|
|
|
|
export function InviteUserDialog({
|
|
open,
|
|
onOpenChange,
|
|
onUserInvited,
|
|
}: InviteUserDialogProps) {
|
|
const [formData, setFormData] = useState({
|
|
email: "",
|
|
metadata: "{}",
|
|
});
|
|
|
|
const inviteUserMutation = useMutation({
|
|
mutationFn: async () => {
|
|
let metadata = {};
|
|
try {
|
|
metadata = JSON.parse(formData.metadata);
|
|
} catch (error) {
|
|
toast.error("Invalid JSON. Please check your metadata format.");
|
|
throw new Error("Invalid JSON");
|
|
}
|
|
|
|
return inviteUser({
|
|
email: formData.email,
|
|
user_metadata: metadata,
|
|
});
|
|
},
|
|
onSuccess: () => {
|
|
toast.success("Invitation sent");
|
|
onUserInvited();
|
|
onOpenChange(false);
|
|
setFormData({
|
|
email: "",
|
|
metadata: "{}",
|
|
});
|
|
},
|
|
onError: () => {
|
|
toast.error("Failed to send invitation");
|
|
},
|
|
});
|
|
|
|
const handleInputChange = (
|
|
e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
|
|
) => {
|
|
const { name, value } = e.target;
|
|
setFormData((prev) => ({ ...prev, [name]: value }));
|
|
};
|
|
|
|
const handleSubmit = (e: React.FormEvent) => {
|
|
e.preventDefault();
|
|
inviteUserMutation.mutate();
|
|
};
|
|
|
|
return (
|
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
|
<DialogContent className="sm:max-w-md">
|
|
<DialogHeader>
|
|
<DialogTitle>Invite User</DialogTitle>
|
|
<DialogDescription>
|
|
Send an invitation email to a new user.
|
|
</DialogDescription>
|
|
</DialogHeader>
|
|
<form onSubmit={handleSubmit} className="space-y-4">
|
|
<div className="space-y-2">
|
|
<Label htmlFor="invite-email">Email *</Label>
|
|
<Input
|
|
id="invite-email"
|
|
name="email"
|
|
type="email"
|
|
required
|
|
value={formData.email}
|
|
onChange={handleInputChange}
|
|
placeholder="example@gmail.com"
|
|
/>
|
|
</div>
|
|
|
|
<DialogFooter>
|
|
<Button
|
|
type="button"
|
|
variant="outline"
|
|
onClick={() => onOpenChange(false)}
|
|
>
|
|
Cancel
|
|
</Button>
|
|
<Button type="submit" disabled={inviteUserMutation.isPending}>
|
|
{inviteUserMutation.isPending ? "Sending..." : "Send Invitation"}
|
|
</Button>
|
|
</DialogFooter>
|
|
</form>
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
}
|