diff --git a/src/features/send-message/ui/Send.tsx b/src/features/send-message/ui/Send.tsx new file mode 100644 index 0000000..6efc978 --- /dev/null +++ b/src/features/send-message/ui/Send.tsx @@ -0,0 +1,11 @@ +const Send = () => { + return ( +
+
+

Xabar jo'natish

+
+
+ ); +}; + +export default Send; diff --git a/src/features/users/lib/api.ts b/src/features/users/lib/api.ts index f3075aa..24af254 100644 --- a/src/features/users/lib/api.ts +++ b/src/features/users/lib/api.ts @@ -47,3 +47,10 @@ export const user_api = { return res; }, }; + +export const send_message = { + async send(body: { user_ids: number[]; message: string }) { + const res = await httpClient.post(API_URLS.SEND_MESSAGE, body); + return res; + }, +}; diff --git a/src/features/users/ui/Filter.tsx b/src/features/users/ui/Filter.tsx index 0a600b5..9697434 100644 --- a/src/features/users/ui/Filter.tsx +++ b/src/features/users/ui/Filter.tsx @@ -1,5 +1,6 @@ import { region_api } from "@/features/region/lib/api"; import type { RegionListResData } from "@/features/region/lib/data"; +import { send_message } from "@/features/users/lib/api"; import type { UserListData } from "@/features/users/lib/data"; import AddUsers from "@/features/users/ui/AddUsers"; import { cn } from "@/shared/lib/utils"; @@ -14,12 +15,21 @@ import { } from "@/shared/ui/command"; import { Dialog, + DialogClose, DialogContent, DialogHeader, DialogTitle, DialogTrigger, } from "@/shared/ui/dialog"; +import { + Form, + FormControl, + FormField, + FormItem, + FormMessage, +} from "@/shared/ui/form"; import { Input } from "@/shared/ui/input"; +import { Label } from "@/shared/ui/label"; import { Popover, PopoverContent, PopoverTrigger } from "@/shared/ui/popover"; import { Select, @@ -28,9 +38,28 @@ import { SelectTrigger, SelectValue, } from "@/shared/ui/select"; -import { useQuery } from "@tanstack/react-query"; -import { Check, ChevronsUpDown, Loader2, Plus } from "lucide-react"; +import { Textarea } from "@/shared/ui/textarea"; +import { zodResolver } from "@hookform/resolvers/zod"; +import { useMutation, useQuery } from "@tanstack/react-query"; +import type { AxiosError } from "axios"; +import { + Check, + ChevronsUpDown, + Loader2, + MessageCircle, + Plus, + XIcon, +} from "lucide-react"; import { useState, type Dispatch, type SetStateAction } from "react"; +import { useForm } from "react-hook-form"; +import { toast } from "sonner"; +import z from "zod"; + +const FormSchema = z.object({ + text: z.string().min(10, { + message: "Xabar uzunligi kamida 10ta belgidan katta bolishi kerak", + }), +}); interface Props { searchTerm: string; @@ -43,6 +72,10 @@ interface Props { setDialogOpen: Dispatch>; editingUser: UserListData | null; setEditingUser: Dispatch>; + setSendMessage: Dispatch>; + setUserList: Dispatch>; + sendMessage: boolean; + userList: number[] | null; } const Filter = ({ @@ -51,14 +84,19 @@ const Filter = ({ statusFilter, setStatusFilter, regionValue, + sendMessage, setRegionValue, + userList, dialogOpen, + setUserList, setDialogOpen, editingUser, setEditingUser, + setSendMessage, }: Props) => { const [openRegion, setOpenRegion] = useState(false); const [regionSearch, setRegionSearch] = useState(""); + const [message, setMessage] = useState(false); const { data: regions, isLoading } = useQuery({ queryKey: ["region_list", regionSearch], @@ -66,6 +104,43 @@ const Filter = ({ select: (res) => res.data.data, }); + const form = useForm>({ + resolver: zodResolver(FormSchema), + defaultValues: { + text: "", + }, + }); + + const { mutate, isPending } = useMutation({ + mutationFn: (body: { user_ids: number[]; message: string }) => + send_message.send(body), + onSuccess: () => { + toast.success("Xabar jo'natildi", { + richColors: true, + position: "top-center", + }); + setMessage(false); + setSendMessage(false); + }, + onError: (err: AxiosError) => { + const errMessage = err.response?.data as { message: string }; + const messageText = errMessage.message; + toast.error(messageText || "Xatolik yuz berdi", { + richColors: true, + position: "top-center", + }); + }, + }); + + function onSubmit(data: z.infer) { + if (userList) { + mutate({ + message: data.text, + user_ids: userList, + }); + } + } + return (
{/* Search input */} @@ -179,6 +254,7 @@ const Filter = ({ variant="default" className="bg-blue-500 cursor-pointer hover:bg-blue-500" onClick={() => setEditingUser(null)} + disabled={sendMessage} > Qo'shish @@ -195,6 +271,102 @@ const Filter = ({ + + {sendMessage && ( + + )} + + + + + Xabar jo'natish + + +
+ + ( + + + +