@@ -22,9 +22,14 @@ export default function Home() {
2222
2323 const [ duration , setDuration ] = useState ( - 1 ) ;
2424 const [ progress , setProgress ] = useState ( 0 ) ;
25+ const [ videoProcessProgress , setVideoProcessProgress ] = useState ( 0 ) ;
2526
2627 const { data : lastFile } = api . video . getLastVideo . useQuery ( ) ;
2728
29+ if ( lastFile && lastFile . progress !== videoProcessProgress ) {
30+ setVideoProcessProgress ( lastFile . progress ) ;
31+ }
32+
2833 const { data : isInstanceStopped , isLoading } =
2934 api . aws . isInstanceStopped . useQuery ( ) ;
3035
@@ -60,7 +65,8 @@ export default function Home() {
6065 }
6166 } ,
6267 } ) ;
63- alert ( "El archivo se subió correctamente." ) ;
68+ setVideoProcessProgress ( 5 ) ;
69+ alert ( "El archivo se subió correctamente. Y se está procesando." ) ;
6470 } catch ( error ) {
6571 console . error ( "Error uploading file:" , error ) ;
6672 alert ( "Hubo un error al subir el archivo." ) ;
@@ -192,11 +198,16 @@ export default function Home() {
192198
193199 < button
194200 disabled = {
195- isLoading || ! isInstanceStopped || sizeMB > SIZE_LIMIT_MB || progress !== 0
201+ isLoading ||
202+ ! isInstanceStopped ||
203+ sizeMB > SIZE_LIMIT_MB ||
204+ progress !== 0
196205 }
197206 className = { twMerge (
198207 "rounded-lg bg-gray-400 p-2 px-12 py-3 text-center text-sm font-bold text-white md:p-3 md:text-2xl" ,
199- isInstanceStopped && ( sizeMB <= SIZE_LIMIT_MB ) ? "bg-verde" : "" ,
208+ isInstanceStopped && sizeMB <= SIZE_LIMIT_MB
209+ ? "bg-verde"
210+ : "" ,
200211 ) }
201212 onClick = { async ( ) => {
202213 if (
@@ -275,8 +286,8 @@ export default function Home() {
275286 backgroundColor : "#00A94F" ,
276287 pathColor : "#00A94F" ,
277288 } ) }
278- value = { lastFile ?. progress ?? 0 }
279- text = { `${ lastFile ?. progress ?? 0 } %` }
289+ value = { videoProcessProgress }
290+ text = { `${ videoProcessProgress } %` }
280291 />
281292 < button
282293 disabled = { ! lastFile || lastFile ?. progress !== 100 }
0 commit comments