feat(image): use image upload field

src/components/ModForm.tsx

@@ -23,11 +23,13 @@ import {
   ModPageLoaderResult
 } from '../types'
 import { initializeFormState } from '../utils'
-import { CheckboxField, InputError, InputField } from './Inputs'
+import { CheckboxField, InputField, InputFieldWithImageUpload } from './Inputs'
 import { OriginalAuthor } from './OriginalAuthor'
 import { CategoryAutocomplete } from './CategoryAutocomplete'
 import { AlertPopup } from './AlertPopup'
 import { Editor, EditorRef } from './Markdown/Editor'
+import { MEDIA_OPTIONS } from 'controllers'
+import { InputError } from './Inputs/Error'
 
 interface GameOption {
   value: string
@@ -220,10 +222,9 @@ export const ModForm = () => {
         />
       </div>
 
-      <InputField
+      <InputFieldWithImageUpload
         label='Featured Image URL'
-        description='We recommend to upload images to https://nostr.build/'
-        type='text'
+        description={`We recommend to upload images to ${MEDIA_OPTIONS[0].host}`}
         inputMode='url'
         placeholder='Image URL'
         name='featuredImageUrl'

src/pages/write/index.tsx

@@ -7,7 +7,6 @@ import {
 } from 'react-router-dom'
 import {
   CheckboxFieldUncontrolled,
-  InputError,
   InputFieldUncontrolled
 } from '../../components/Inputs'
 import { ProfileSection } from '../../components/ProfileSection'
@@ -19,6 +18,7 @@ import '../../styles/write.css'
 import { LoadingSpinner } from 'components/LoadingSpinner'
 import { AlertPopup } from 'components/AlertPopup'
 import { Editor, EditorRef } from 'components/Markdown/Editor'
+import { InputError } from 'components/Inputs/Error'
 
 export const WritePage = () => {
   const userState = useAppSelector((state) => state.user)