[Glitch] Fix bugs with upload progress

Port 65c553ab59 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>

app/javascript/flavours/glitch/features/compose/components/upload_progress.tsx

@@ -9,48 +9,39 @@ import { reduceMotion } from 'flavours/glitch/initial_state';
 interface UploadProgressProps {
   active: boolean;
   progress: number;
-  isProcessing: boolean;
+  isProcessing?: boolean;
 }
 
 export const UploadProgress: React.FC<UploadProgressProps> = ({
   active,
   progress,
-  isProcessing,
+  isProcessing = false,
 }) => {
   const styles = useSpring({
     from: { width: '0%' },
     to: { width: `${progress}%` },
-    reset: true,
-    immediate: reduceMotion,
+    immediate: reduceMotion || !active, // If this is not active, update the UI immediately.
   });
   if (!active) {
     return null;
   }
 
-  let message;
-
-  if (isProcessing) {
-    message = (
-      <FormattedMessage
-        id='upload_progress.processing'
-        defaultMessage='Processing…'
-      />
-    );
-  } else {
-    message = (
-      <FormattedMessage
-        id='upload_progress.label'
-        defaultMessage='Uploading…'
-      />
-    );
-  }
-
   return (
     <div className='upload-progress'>
       <Icon id='upload' icon={UploadFileIcon} />
 
       <div className='upload-progress__message'>
-        {message}
+        {isProcessing ? (
+          <FormattedMessage
+            id='upload_progress.processing'
+            defaultMessage='Processing…'
+          />
+        ) : (
+          <FormattedMessage
+            id='upload_progress.label'
+            defaultMessage='Uploading…'
+          />
+        )}
 
         <div className='upload-progress__backdrop'>
           <animated.div className='upload-progress__tracker' style={styles} />