icon selected

src/pages/food/Category.tsx

@@ -25,6 +25,7 @@ type CategoryFormValues = {
 const CategoryFood: FC = () => {
     const [isActive, setIsActive] = useState<boolean>(true)
     const [iconFiles, setIconFiles] = useState<File[]>([])
+    const [selectedIconUrl, setSelectedIconUrl] = useState<string>('')
     const [editingCategory, setEditingCategory] = useState<Category | null>(null)
     const [filters, setFilters] = useState<{ search?: string | null }>({})
 
@@ -56,7 +57,7 @@ const CategoryFood: FC = () => {
                 const categoryData: CreateCategoryType = {
                     title: values.title,
                     isActive,
-                    avatarUrl: avatarUrl || editingCategory?.avatarUrl || ''
+                    avatarUrl: avatarUrl || selectedIconUrl || editingCategory?.avatarUrl || ''
                 }
 
                 if (editingCategory) {
@@ -85,7 +86,9 @@ const CategoryFood: FC = () => {
                 }
             }
 
-            if (iconFiles.length > 0) {
+            if (selectedIconUrl) {
+                submitCategory(selectedIconUrl)
+            } else if (iconFiles.length > 0) {
                 singleUpload(iconFiles[0], {
                     onSuccess: (response) => {
                         const avatarUrl = response?.data?.url || ''
@@ -105,6 +108,7 @@ const CategoryFood: FC = () => {
         formik.resetForm()
         setIsActive(true)
         setIconFiles([])
+        setSelectedIconUrl('')
         setEditingCategory(null)
     }
 
@@ -115,9 +119,21 @@ const CategoryFood: FC = () => {
         })
         setIsActive(category.isActive)
         setIconFiles([])
+        setSelectedIconUrl(category.avatarUrl || '')
         setEditingCategory(category)
     }
 
+    const handleIconUrlChange = (url: string) => {
+        setSelectedIconUrl(url)
+        setIconFiles([])
+        formik.setFieldValue('icon', [])
+    }
+
+    const handleIconFileChange = (files: File[]) => {
+        setIconFiles(files)
+        setSelectedIconUrl('')
+    }
+
     const handleDelete = (id: string) => {
         deleteCategory(id, {
             onSuccess: () => {
@@ -189,10 +205,12 @@ const CategoryFood: FC = () => {
                 formik={formik}
                 isActive={isActive}
                 onActiveChange={setIsActive}
-                onIconChange={setIconFiles}
+                onIconChange={handleIconFileChange}
                 iconFiles={iconFiles}
                 isSubmitting={isCreating || isUpdating || isUploading}
                 isEditing={!!editingCategory}
+                onIconUrlChange={handleIconUrlChange}
+                selectedIconUrl={selectedIconUrl}
             />
         </div>
     )