From cdf8fad847ba92866fb28a92abcae5c1e18403f8 Mon Sep 17 00:00:00 2001
From: Justin <dice.warrant-02@icloud.com>
Date: Mon, 16 May 2022 11:40:44 -0400
Subject: [PATCH] Use new FileInput component in profile settings

---
 app/soapbox/features/edit_profile/index.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/app/soapbox/features/edit_profile/index.tsx b/app/soapbox/features/edit_profile/index.tsx
index 5853d2796..d7f60b572 100644
--- a/app/soapbox/features/edit_profile/index.tsx
+++ b/app/soapbox/features/edit_profile/index.tsx
@@ -9,7 +9,7 @@ import { useAppSelector, useAppDispatch, useOwnAccount, useFeatures } from 'soap
 import { normalizeAccount } from 'soapbox/normalizers';
 import resizeImage from 'soapbox/utils/resize_image';
 
-import { Button, Column, Form, FormActions, FormGroup, Input, Textarea, HStack, Toggle } from '../../components/ui';
+import { Button, Column, Form, FormActions, FormGroup, Input, Textarea, HStack, Toggle, FileInput } from '../../components/ui';
 import Streamfield, { StreamfieldComponent } from '../../components/ui/streamfield/streamfield';
 
 import ProfilePreview from './components/profile-preview';
@@ -179,8 +179,8 @@ const EditProfile: React.FC = () => {
   const intl = useIntl();
   const dispatch = useAppDispatch();
 
-  const account   = useOwnAccount();
-  const features  = useFeatures();
+  const account = useOwnAccount();
+  const features = useFeatures();
   const maxFields = useAppSelector(state => state.instance.pleroma.getIn(['metadata', 'fields_limits', 'max_fields'], 4) as number);
 
   const [isLoading, setLoading] = useState(false);
@@ -378,14 +378,14 @@ const EditProfile: React.FC = () => {
               labelText={<FormattedMessage id='edit_profile.fields.header_label' defaultMessage='Choose Background Picture' />}
               hintText={<FormattedMessage id='edit_profile.hints.header' defaultMessage='PNG, GIF or JPG. Will be downscaled to {size}' values={{ size: '1920x1080px' }} />}
             >
-              <input type='file' onChange={handleFileChange('header', 1920 * 1080)} className='text-sm' />
+              <FileInput onChange={handleFileChange('header', 1920 * 1080)} />
             </FormGroup>
 
             <FormGroup
               labelText={<FormattedMessage id='edit_profile.fields.avatar_label' defaultMessage='Choose Profile Picture' />}
               hintText={<FormattedMessage id='edit_profile.hints.avatar' defaultMessage='PNG, GIF or JPG. Will be downscaled to {size}' values={{ size: '400x400px' }} />}
             >
-              <input type='file' onChange={handleFileChange('avatar', 400 * 400)} className='text-sm' />
+              <FileInput onChange={handleFileChange('avatar', 400 * 400)} />
             </FormGroup>
           </div>
         </div>