Add support for MSC4193: Spoilers on Media

This commit is contained in:
Ginger 2025-02-15 18:06:47 -05:00
parent 09d85d6c31
commit d7d7428ec9
9 changed files with 175 additions and 52 deletions

View file

@ -167,15 +167,29 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
const encryptFiles = fulfilledPromiseSettledResult(
await Promise.allSettled(safeFiles.map((f) => encryptFile(f)))
);
encryptFiles.forEach((ef) => fileItems.push(ef));
encryptFiles.forEach((ef) =>
fileItems.push({
...ef,
metadata: {
spoiled: false,
},
})
);
} else {
safeFiles.forEach((f) =>
fileItems.push({ file: f, originalFile: f, encInfo: undefined })
fileItems.push({
file: f,
originalFile: f,
encInfo: undefined,
metadata: {
spoiled: false,
},
})
);
}
setSelectedFiles({
type: 'PUT',
item: fileItems,
items: fileItems,
});
},
[setSelectedFiles, room]
@ -213,7 +227,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
const uploads = Array.isArray(upload) ? upload : [upload];
setSelectedFiles({
type: 'DELETE',
item: selectedFiles.filter((f) => uploads.find((u) => u === f.file)),
items: selectedFiles.filter((f) => uploads.find((u) => u === f.file)),
});
uploads.forEach((u) => roomUploadAtomFamily.remove(u));
},
@ -420,7 +434,10 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
// eslint-disable-next-line react/no-array-index-key
key={index}
isEncrypted={!!fileItem.encInfo}
uploadAtom={roomUploadAtomFamily(fileItem.file)}
fileItem={fileItem}
setMetadata={(metadata) =>
setSelectedFiles({ type: 'MODIFY', item: fileItem, metadata })
}
onRemove={handleRemoveUpload}
/>
))}

View file

@ -1,6 +1,10 @@
import { IContent, MatrixClient, MsgType } from 'matrix-js-sdk';
import to from 'await-to-js';
import { IThumbnailContent, MATRIX_BLUR_HASH_PROPERTY_NAME } from '../../../types/matrix/common';
import {
IThumbnailContent,
MATRIX_BLUR_HASH_PROPERTY_NAME,
MATRIX_SPOILER_PROPERTY_NAME,
} from '../../../types/matrix/common';
import {
getImageFileUrl,
getThumbnail,
@ -42,9 +46,9 @@ const generateThumbnailContent = async (
export const getImageMsgContent = async (
mx: MatrixClient,
item: TUploadItem,
mxc: string,
mxc: string
): Promise<IContent> => {
const { file, originalFile, encInfo } = item;
const { file, originalFile, encInfo, metadata } = item;
const [imgError, imgEl] = await to(loadImageElement(getImageFileUrl(originalFile)));
if (imgError) console.warn(imgError);
@ -52,6 +56,7 @@ export const getImageMsgContent = async (
msgtype: MsgType.Image,
filename: file.name,
body: file.name,
[MATRIX_SPOILER_PROPERTY_NAME]: metadata.spoiled,
};
if (imgEl) {
const blurHash = encodeBlurHash(imgEl, 512, scaleYDimension(imgEl.width, 512, imgEl.height));
@ -75,7 +80,7 @@ export const getImageMsgContent = async (
export const getVideoMsgContent = async (
mx: MatrixClient,
item: TUploadItem,
mxc: string,
mxc: string
): Promise<IContent> => {
const { file, originalFile, encInfo } = item;