Anjing Webshells

Website : rimsha.abasa.com
: / var / www / talha_silentcontent / src / components /
Filename : AddToOrganization.tsx
back
"use client"
import { useMutation, useQuery } from "@tanstack/react-query";
import axios from "axios";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "./../components/ui/card";
import { Input } from "@/components/ui/input";
import { useForm } from 'react-hook-form'
import { Button } from "./ui/button";
import { ReloadIcon } from "@radix-ui/react-icons";
import { toast } from "./ui/use-toast";

// @ts-ignore
export default function AddToOrganization({id}) {  

  const {register, handleSubmit, ...form} = useForm();  

  const {mutate: inviteMember, isLoading} = useMutation({
    mutationFn: async (data) => {
        const payload = {
            data,
        }
        const response = await axios.patch(`/api/organizations/${id}`, payload)
        console.log(response.data);
        return response.data;
    },
    onSuccess: () => {
      toast({
        title: "Success!",
        description: "User has been added successfully!",
      });
     form.reset();
    },
  })

    return (
          <form >
            <Card>
              <CardHeader className="pb-1">
                <CardTitle className="text-3xl font-bold ">Add members</CardTitle>
                <CardDescription className="text-foreground">Enter Email Address to add users to this organization</CardDescription>
              </CardHeader>
              <CardContent className="flex flex-col gap-4">
                <Input
                  id="name"
                  className="w-[450px] mt-[14px] inline-block mr-3"
                  size={32}
                  placeholder="abc@gmail.com"
                  {...register("email")}
                />
                {/* @ts-ignore */}
              <Button className="w-48" variant={'gradient'} type="submit" onClick={handleSubmit((email) => inviteMember(email))}>
                {isLoading && (
                        <ReloadIcon className="mr-2 h-4 w-4 animate-spin" />
                      )}
                      Admit
              </Button>
              
              </CardContent>
            </Card>
          </form>
    )
}