filter users

src/pages/order/ConvertToOrders.tsx

@@ -12,7 +12,7 @@ import { useMultiUpload } from '@/pages/uploader/hooks/useUploader'
 import type { ConvertToOrderItemType } from './types/Types'
 import { useConverToOrder, useGetProducts } from './hooks/useOrderData'
 import { useGetCategory } from '@/pages/product/hooks/useProductData'
-import { useGetUsers } from '@/pages/user/hooks/useUserData'
+import UserSearch from '@/pages/user/UserSearch'
 import { toast } from 'react-toastify'
 import { Paths } from '@/config/Paths'
 import { extractErrorMessage } from '@/config/func'
@@ -57,7 +57,6 @@ const ConvertToOrders: FC = () => {
     const multiUpload = useMultiUpload()
     const [attachmentFiles, setAttachmentFiles] = useState<File[]>([])
     const { data: categories } = useGetCategory()
-    const { data: users } = useGetUsers()
     const { data: products } = useGetProducts()
     const { data: admins } = useGetAdmins(1, 50)
     const { data: invoiceItemData, isLoading: isInvoiceItemLoading } = useGetInvoiceItem(invoiceItemId)
@@ -201,20 +200,22 @@ const ConvertToOrders: FC = () => {
                 >
                     {!invoiceItemId && (
                         <div className="rowTwoInput">
-                            <Select
-                                items={
-                                    users?.data?.map((item) => ({
-                                        label: item.firstName ? `${item.firstName} ${item.lastName}` : item.phone,
-                                        value: item.id,
-                                    })) ?? []
-                                }
-                                label="کاربر"
-                                placeholder="انتخاب کاربر"
-                                {...formik.getFieldProps('userId')}
-                                error_text={
-                                    formik.touched.userId && formik.errors.userId ? formik.errors.userId : ''
-                                }
-                            />
+                            <div className="w-full">
+                                <UserSearch
+                                    label="کاربر"
+                                    placeholder="جستجوی کاربر (نام، موبایل، ...)"
+                                    value={formik.values.userId}
+                                    onChange={(id) => {
+                                        formik.setFieldValue('userId', id)
+                                        formik.setFieldTouched('userId', true)
+                                    }}
+                                />
+                                {formik.touched.userId && formik.errors.userId ? (
+                                    <div className="text-xs text-right text-red-600 mt-2 mr-2 font-medium">
+                                        {formik.errors.userId}
+                                    </div>
+                                ) : null}
+                            </div>
                             <Select
                                 items={
                                     products?.data?.map((item) => ({