forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Pre-web image changes refactor (#560)
* Pre-web image changes refactor
* Remove unneeded async behavior
+22
-35
+6
-14
src/lib/media/alt-text.ts
+6
-14
src/lib/media/alt-text.ts
···
1
1
import {RootStoreModel} from 'state/index'
2
+
import {ImageModel} from 'state/models/media/image'
2
3
3
4
export async function openAltTextModal(
4
5
store: RootStoreModel,
5
-
prevAltText: string,
6
-
): Promise<string> {
7
-
return new Promise((resolve, reject) => {
8
-
store.shell.openModal({
9
-
name: 'alt-text-image',
10
-
prevAltText,
11
-
onAltTextSet: (altText?: string) => {
12
-
if (altText) {
13
-
resolve(altText)
14
-
} else {
15
-
reject(new Error('Canceled'))
16
-
}
17
-
},
18
-
})
6
+
image: ImageModel,
7
+
) {
8
+
store.shell.openModal({
9
+
name: 'alt-text-image',
10
+
image,
19
11
})
20
12
}
+2
-11
src/state/models/media/image.ts
+2
-11
src/state/models/media/image.ts
···
5
5
import {openCropper} from 'lib/media/picker'
6
6
import {POST_IMG_MAX} from 'lib/constants'
7
7
import {scaleDownDimensions} from 'lib/media/util'
8
-
import {openAltTextModal} from 'lib/media/alt-text'
9
8
10
9
// TODO: EXIF embed
11
10
// Cases to consider: ExternalEmbed
···
43
42
this.scaledHeight = height
44
43
}
45
44
46
-
async setAltText() {
47
-
try {
48
-
const altText = await openAltTextModal(this.rootStore, this.altText)
49
-
50
-
runInAction(() => {
51
-
this.altText = altText
52
-
})
53
-
} catch (err) {
54
-
this.rootStore.log.error('Failed to set alt text', err)
55
-
}
45
+
async setAltText(altText: string) {
46
+
this.altText = altText
56
47
}
57
48
58
49
async crop() {
+2
-2
src/state/models/ui/shell.ts
+2
-2
src/state/models/ui/shell.ts
···
4
4
import {ProfileModel} from '../content/profile'
5
5
import {isObj, hasProp} from 'lib/type-guards'
6
6
import {Image as RNImage} from 'react-native-image-crop-picker'
7
+
import {ImageModel} from '../media/image'
7
8
8
9
export interface ConfirmModal {
9
10
name: 'confirm'
···
43
44
44
45
export interface AltTextImageModal {
45
46
name: 'alt-text-image'
46
-
prevAltText: string
47
-
onAltTextSet: (altText?: string) => void
47
+
image: ImageModel
48
48
}
49
49
50
50
export interface AltTextImageReadModal {
+5
-2
src/view/com/composer/photos/Gallery.tsx
+5
-2
src/view/com/composer/photos/Gallery.tsx
···
9
9
import {Image} from 'expo-image'
10
10
import {Text} from 'view/com/util/text/Text'
11
11
import {isDesktopWeb} from 'platform/detection'
12
+
import {openAltTextModal} from 'lib/media/alt-text'
13
+
import {useStores} from 'state/index'
12
14
13
15
interface Props {
14
16
gallery: GalleryModel
15
17
}
16
18
17
19
export const Gallery = observer(function ({gallery}: Props) {
20
+
const store = useStores()
18
21
const getImageStyle = useCallback(() => {
19
22
let side: number
20
23
···
34
37
const handleAddImageAltText = useCallback(
35
38
(image: ImageModel) => {
36
39
Keyboard.dismiss()
37
-
gallery.setAltText(image)
40
+
openAltTextModal(store, image)
38
41
},
39
-
[gallery],
42
+
[store],
40
43
)
41
44
const handleRemovePhoto = useCallback(
42
45
(image: ImageModel) => {
+7
-6
src/view/com/modals/AltImage.tsx
+7
-6
src/view/com/modals/AltImage.tsx
···
11
11
import LinearGradient from 'react-native-linear-gradient'
12
12
import {useStores} from 'state/index'
13
13
import {isDesktopWeb} from 'platform/detection'
14
+
import {ImageModel} from 'state/models/media/image'
14
15
15
16
export const snapPoints = ['80%']
16
17
17
18
interface Props {
18
-
prevAltText: string
19
-
onAltTextSet: (altText?: string | undefined) => void
19
+
image: ImageModel
20
20
}
21
21
22
-
export function Component({prevAltText, onAltTextSet}: Props) {
22
+
export function Component({image}: Props) {
23
23
const pal = usePalette('default')
24
24
const store = useStores()
25
25
const theme = useTheme()
26
-
const [altText, setAltText] = useState(prevAltText)
26
+
const [altText, setAltText] = useState(image.altText)
27
27
28
28
const onPressSave = useCallback(() => {
29
-
onAltTextSet(altText)
29
+
setAltText(altText)
30
+
image.setAltText(altText)
30
31
store.shell.closeModal()
31
-
}, [store, altText, onAltTextSet])
32
+
}, [store, image, altText])
32
33
33
34
const onPressCancel = () => {
34
35
store.shell.closeModal()