@@ -3,13 +3,14 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react';
3
3
import Uppy , { UploadResult } from '@uppy/core' ;
4
4
// @ts -ignore
5
5
import { useFetch } from '@gitroom/helpers/utils/custom.fetch' ;
6
- import { getUppyUploadPlugin } from '@gitroom/react/helpers/uppy.upload' ;
6
+ import { getUppyUploadPlugin } from '@gitroom/react/helpers/uppy.upload' ;
7
7
import { FileInput , ProgressBar } from '@uppy/react' ;
8
8
9
9
// Uppy styles
10
10
import '@uppy/core/dist/style.min.css' ;
11
11
import '@uppy/dashboard/dist/style.min.css' ;
12
12
import { useVariables } from '@gitroom/react/helpers/variable.context' ;
13
+ import Compressor from '@uppy/compressor' ;
13
14
14
15
export function MultipartFileUploader ( {
15
16
onUploadSuccess,
@@ -22,10 +23,13 @@ export function MultipartFileUploader({
22
23
const [ loaded , setLoaded ] = useState ( false ) ;
23
24
const [ reload , setReload ] = useState ( false ) ;
24
25
25
- const onUploadSuccessExtended = useCallback ( ( result : UploadResult < any , any > ) => {
26
- setReload ( true ) ;
27
- onUploadSuccess ( result ) ;
28
- } , [ onUploadSuccess ] ) ;
26
+ const onUploadSuccessExtended = useCallback (
27
+ ( result : UploadResult < any , any > ) => {
28
+ setReload ( true ) ;
29
+ onUploadSuccess ( result ) ;
30
+ } ,
31
+ [ onUploadSuccess ]
32
+ ) ;
29
33
30
34
useEffect ( ( ) => {
31
35
if ( reload ) {
@@ -59,9 +63,9 @@ export function MultipartFileUploaderAfter({
59
63
onUploadSuccess : ( result : UploadResult ) => void ;
60
64
allowedFileTypes : string ;
61
65
} ) {
62
- const { storageProvider, backendUrl} = useVariables ( ) ;
66
+ const { storageProvider, backendUrl } = useVariables ( ) ;
63
67
const fetch = useFetch ( ) ;
64
-
68
+
65
69
const uppy = useMemo ( ( ) => {
66
70
const uppy2 = new Uppy ( {
67
71
autoProceed : true ,
@@ -71,16 +75,25 @@ export function MultipartFileUploaderAfter({
71
75
maxFileSize : 1000000000 ,
72
76
} ,
73
77
} ) ;
74
-
75
- const { plugin, options } = getUppyUploadPlugin ( storageProvider , fetch , backendUrl )
76
- uppy2 . use ( plugin , options )
78
+
79
+ const { plugin, options } = getUppyUploadPlugin (
80
+ storageProvider ,
81
+ fetch ,
82
+ backendUrl
83
+ ) ;
84
+ uppy2 . use ( plugin , options ) ;
85
+ uppy2 . use ( Compressor , {
86
+ convertTypes : [ 'image/jpeg' ] ,
87
+ maxWidth : 1000 ,
88
+ maxHeight : 1000 ,
89
+ } ) ;
77
90
// Set additional metadata when a file is added
78
91
uppy2 . on ( 'file-added' , ( file ) => {
79
- uppy2 . setFileMeta ( file . id , {
80
- useCloudflare : storageProvider === 'cloudflare' ? 'true' : 'false' , // Example of adding a custom field
81
- // Add more fields as needed
82
- } ) ;
92
+ uppy2 . setFileMeta ( file . id , {
93
+ useCloudflare : storageProvider === 'cloudflare' ? 'true' : 'false' , // Example of adding a custom field
94
+ // Add more fields as needed
83
95
} ) ;
96
+ } ) ;
84
97
85
98
uppy2 . on ( 'complete' , ( result ) => {
86
99
onUploadSuccess ( result ) ;
@@ -111,9 +124,9 @@ export function MultipartFileUploaderAfter({
111
124
strings : {
112
125
chooseFiles : 'Upload' ,
113
126
} ,
114
- pluralize : ( n ) => n
127
+ pluralize : ( n ) => n ,
115
128
} }
116
- />
129
+ />
117
130
</ >
118
131
) ;
119
132
}
0 commit comments