forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Fix image compression for avis and banner images
+37
-19
+25
-7
src/lib/images.ts
+25
-7
src/lib/images.ts
···
1
1
import RNFetchBlob from 'rn-fetch-blob'
2
2
import ImageResizer from '@bam.tech/react-native-image-resizer'
3
-
import {Image as PickedImage} from 'react-native-image-crop-picker'
4
3
5
4
export interface DownloadAndResizeOpts {
6
5
uri: string
···
9
8
mode: 'contain' | 'cover' | 'stretch'
10
9
maxSize: number
11
10
timeout: number
11
+
}
12
+
13
+
export interface Image {
14
+
path: string
15
+
mime: string
16
+
size: number
17
+
width: number
18
+
height: number
12
19
}
13
20
14
21
export async function downloadAndResize(opts: DownloadAndResizeOpts) {
···
58
65
maxSize: number
59
66
}
60
67
61
-
export async function resize(localUri: string, opts: ResizeOpts) {
68
+
export async function resize(
69
+
localUri: string,
70
+
opts: ResizeOpts,
71
+
): Promise<Image> {
62
72
for (let i = 0; i < 9; i++) {
63
73
const quality = 1.0 - i / 10
64
74
const resizeRes = await ImageResizer.createResizedImage(
···
73
83
{mode: opts.mode},
74
84
)
75
85
if (resizeRes.size < opts.maxSize) {
76
-
return resizeRes
86
+
return {
87
+
path: resizeRes.path,
88
+
mime: 'image/jpeg',
89
+
size: resizeRes.size,
90
+
width: resizeRes.width,
91
+
height: resizeRes.height,
92
+
}
77
93
}
78
94
}
79
95
throw new Error(
···
81
97
)
82
98
}
83
99
84
-
export async function compressIfNeeded(img: PickedImage, maxSize: number) {
100
+
export async function compressIfNeeded(
101
+
img: Image,
102
+
maxSize: number,
103
+
): Promise<Image> {
85
104
const origUri = `file://${img.path}`
86
105
if (img.size < maxSize) {
87
-
return origUri
106
+
return img
88
107
}
89
-
const resizeRez = await resize(origUri, {
108
+
return await resize(origUri, {
90
109
width: img.width,
91
110
height: img.height,
92
111
mode: 'stretch',
93
112
maxSize,
94
113
})
95
-
return resizeRez.uri
96
114
}
+6
-6
src/view/com/composer/PhotoCarouselPicker.tsx
+6
-6
src/view/com/composer/PhotoCarouselPicker.tsx
···
36
36
cropping: true,
37
37
...IMAGE_PARAMS,
38
38
})
39
-
const uri = await compressIfNeeded(cameraRes, 300000)
40
-
onSelectPhotos([uri, ...selectedPhotos])
39
+
const img = await compressIfNeeded(cameraRes, 300000)
40
+
onSelectPhotos([img.path, ...selectedPhotos])
41
41
} catch (err: any) {
42
42
// ignore
43
43
store.log.warn('Error using camera', err)
···
52
52
path: uri,
53
53
...IMAGE_PARAMS,
54
54
})
55
-
const finalUri = await compressIfNeeded(cropperRes, 300000)
56
-
onSelectPhotos([finalUri, ...selectedPhotos])
55
+
const img = await compressIfNeeded(cropperRes, 300000)
56
+
onSelectPhotos([img.path, ...selectedPhotos])
57
57
} catch (err: any) {
58
58
// ignore
59
59
store.log.warn('Error selecting photo', err)
···
76
76
path: image.path,
77
77
...IMAGE_PARAMS,
78
78
})
79
-
const finalUri = await compressIfNeeded(cropperRes, 300000)
80
-
result.push(finalUri)
79
+
const finalImg = await compressIfNeeded(cropperRes, 300000)
80
+
result.push(finalImg.path)
81
81
}
82
82
onSelectPhotos([...result, ...selectedPhotos])
83
83
})
+6
-6
src/view/com/modals/EditProfile.tsx
+6
-6
src/view/com/modals/EditProfile.tsx
···
55
55
}
56
56
const onSelectNewAvatar = async (img: PickedImage) => {
57
57
try {
58
-
setNewUserAvatar(img)
59
-
const uri = await compressIfNeeded(img, 300000)
60
-
setUserAvatar(uri)
58
+
const finalImg = await compressIfNeeded(img, 300000)
59
+
setNewUserAvatar(finalImg)
60
+
setUserAvatar(finalImg.path)
61
61
} catch (e: any) {
62
62
setError(e.message || e.toString())
63
63
}
64
64
}
65
65
const onSelectNewBanner = async (img: PickedImage) => {
66
66
try {
67
-
setNewUserBanner(img)
68
-
const uri = await compressIfNeeded(img, 500000)
69
-
setUserBanner(uri)
67
+
const finalImg = await compressIfNeeded(img, 500000)
68
+
setNewUserBanner(finalImg)
69
+
setUserBanner(finalImg.path)
70
70
} catch (e: any) {
71
71
setError(e.message || e.toString())
72
72
}