Page MenuHomePhabricator
Differential D9949

[web/keyserver] make InitialReduxStateResponder configurable
ClosedPublic
Actions

Authored by kamil on Nov 22 2023, 4:27 AM.
Tags
None
Referenced Files
Unknown Object (File)
Feb 20 2025, 11:44 AM
Unknown Object (File)
Feb 20 2025, 11:44 AM
Unknown Object (File)
Feb 20 2025, 11:44 AM
Unknown Object (File)
Feb 20 2025, 11:39 AM
Unknown Object (File)
Feb 3 2025, 7:38 PM
Unknown Object (File)
Jan 28 2025, 4:33 PM
Unknown Object (File)
Jan 15 2025, 2:14 AM
Unknown Object (File)
Dec 29 2024, 11:45 PM
View All 68 Files
Subscribers
ashoat

Details

Reviewers
tomek
michal
Commits
rCOMMeb4b2ed4962a: [web/keyserver] make InitialReduxStateResponder configurable
Summary

The purpose is to start rely on data in DB.
This change is allow endpoint to return only needed data, avoid fetching data persisted in DB.

This is safe for old clients, as this endpoint is only called after refresh/initial load, and those two things are equal with getting the newest version of the webapp.

This is only about changing endpoint, actual excluding data is implemented later in the stack.

Depends on D9948

Test Plan

Check if app still loads after refresh

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Revision Contents
Changeset List

PathSize
keyserver/
src/
4 lines
responders/
17 lines
web/
redux/
13 lines
5 lines
types/
10 lines

Diff 33732

View Options

keyserver/src/endpoints.js

// @flow // @flow
import invariant from 'invariant'; import invariant from 'invariant';
import _groupBy from 'lodash/fp/groupBy.js'; import _groupBy from 'lodash/fp/groupBy.js';
import _keyBy from 'lodash/fp/keyBy.js'; import _keyBy from 'lodash/fp/keyBy.js';
import _omit from 'lodash/fp/omit.js'; import _omit from 'lodash/fp/omit.js';
import _partition from 'lodash/fp/partition.js'; import _partition from 'lodash/fp/partition.js';
import _sortBy from 'lodash/fp/sortBy.js'; import _sortBy from 'lodash/fp/sortBy.js';
import _memoize from 'lodash/memoize.js'; import _memoize from 'lodash/memoize.js';
import _throttle from 'lodash/throttle.js';
import * as React from 'react'; import * as React from 'react';
import { useDispatch } from 'react-redux'; import { useDispatch } from 'react-redux';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import uuid from 'uuid';
import { import {
createLocalMessageActionType, createLocalMessageActionType,
sendMultimediaMessageActionTypes, sendMultimediaMessageActionTypes,
legacySendMultimediaMessage, legacySendMultimediaMessage,
sendTextMessageActionTypes, sendTextMessageActionTypes,
sendTextMessage, sendTextMessage,
} from 'lib/actions/message-actions.js'; } from 'lib/actions/message-actions.js';
import { queueReportsActionType } from 'lib/actions/report-actions.js'; import { queueReportsActionType } from 'lib/actions/report-actions.js';
import { newThread } from 'lib/actions/thread-actions.js'; import { newThread } from 'lib/actions/thread-actions.js';
import { import {
uploadMultimedia, uploadMultimedia,
uploadMediaMetadata, uploadMediaMetadata,
updateMultimediaMessageMediaActionType, updateMultimediaMessageMediaActionType,
deleteUpload, deleteUpload,
blobServiceUpload,
type MultimediaUploadCallbacks, type MultimediaUploadCallbacks,
type MultimediaUploadExtras, type MultimediaUploadExtras,
type BlobServiceUploadAction,
} from 'lib/actions/upload-actions.js'; } from 'lib/actions/upload-actions.js';
import { import {
useModalContext, useModalContext,
type PushModal, type PushModal,
} from 'lib/components/modal-provider.react.js'; } from 'lib/components/modal-provider.react.js';
import blobService from 'lib/facts/blob-service.js'; import blobService from 'lib/facts/blob-service.js';
import commStaffCommunity from 'lib/facts/comm-staff-community.js'; import commStaffCommunity from 'lib/facts/comm-staff-community.js';
import { getNextLocalUploadID } from 'lib/media/media-utils.js'; import { getNextLocalUploadID } from 'lib/media/media-utils.js';
Show All 15 Lines
import type { CalendarQuery } from 'lib/types/entry-types.js'; import type { CalendarQuery } from 'lib/types/entry-types.js';
import type { import type {
UploadMultimediaResult, UploadMultimediaResult,
UploadMediaMetadataRequest, UploadMediaMetadataRequest,
MediaMissionStep, MediaMissionStep,
MediaMissionFailure, MediaMissionFailure,
MediaMissionResult, MediaMissionResult,
MediaMission, MediaMission,
Dimensions,
} from 'lib/types/media-types.js'; } from 'lib/types/media-types.js';
import { messageTypes } from 'lib/types/message-types-enum.js'; import { messageTypes } from 'lib/types/message-types-enum.js';
import { import {
type RawMessageInfo, type RawMessageInfo,
type RawMultimediaMessageInfo, type RawMultimediaMessageInfo,
type SendMessageResult, type SendMessageResult,
type SendMessagePayload, type SendMessagePayload,
} from 'lib/types/message-types.js'; } from 'lib/types/message-types.js';
Show All 9 Linesimport {
type ThreadInfo, type ThreadInfo,
type RawThreadInfo, type RawThreadInfo,
} from 'lib/types/thread-types.js'; } from 'lib/types/thread-types.js';
import { import {
type DispatchActionPromise, type DispatchActionPromise,
useServerCall, useServerCall,
useDispatchActionPromise, useDispatchActionPromise,
} from 'lib/utils/action-utils.js'; } from 'lib/utils/action-utils.js';
import { toBase64URL } from 'lib/utils/base64.js';
import { import {
makeBlobServiceEndpointURL, makeBlobServiceEndpointURL,
isBlobServiceURI, isBlobServiceURI,
blobHashFromBlobServiceURI, blobHashFromBlobServiceURI,
} from 'lib/utils/blob-service.js'; } from 'lib/utils/blob-service.js';
import type { CallServerEndpointOptions } from 'lib/utils/call-server-endpoint.js';
import { getConfig } from 'lib/utils/config.js'; import { getConfig } from 'lib/utils/config.js';
import { getMessageForException, cloneError } from 'lib/utils/errors.js'; import { getMessageForException, cloneError } from 'lib/utils/errors.js';
import { generateReportID } from 'lib/utils/report-utils.js'; import { generateReportID } from 'lib/utils/report-utils.js';
import { handleHTTPResponseError } from 'lib/utils/services-utils.js';
import { import {
type PendingMultimediaUpload, type PendingMultimediaUpload,
type TypeaheadState, type TypeaheadState,
InputStateContext, InputStateContext,
} from './input-state.js'; } from './input-state.js';
import { encryptFile } from '../media/encryption-utils.js'; import { encryptFile } from '../media/encryption-utils.js';
import { generateThumbHash } from '../media/image-utils.js'; import { generateThumbHash } from '../media/image-utils.js';
Show All 21 Linestype Props = {
+dispatch: Dispatch, +dispatch: Dispatch,
+dispatchActionPromise: DispatchActionPromise, +dispatchActionPromise: DispatchActionPromise,
+calendarQuery: () => CalendarQuery, +calendarQuery: () => CalendarQuery,
+uploadMultimedia: ( +uploadMultimedia: (
multimedia: Object, multimedia: Object,
extras: MultimediaUploadExtras, extras: MultimediaUploadExtras,
callbacks: MultimediaUploadCallbacks, callbacks: MultimediaUploadCallbacks,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+blobServiceUpload: BlobServiceUploadAction,
+uploadMediaMetadata: ( +uploadMediaMetadata: (
input: UploadMediaMetadataRequest, input: UploadMediaMetadataRequest,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+deleteUpload: (id: string) => Promise<void>, +deleteUpload: (id: string) => Promise<void>,
+sendMultimediaMessage: ( +sendMultimediaMessage: (
threadID: string, threadID: string,
localID: string, localID: string,
mediaIDs: $ReadOnlyArray<string>, mediaIDs: $ReadOnlyArray<string>,
▲ Show 20 Lines • Show All 729 Lines • ▼ Show 20 Lines try {
(upload.mediaType === 'encrypted_photo' || (upload.mediaType === 'encrypted_photo' ||
upload.mediaType === 'encrypted_video') upload.mediaType === 'encrypted_video')
) { ) {
const { blobHash, dimensions, thumbHash } = upload; const { blobHash, dimensions, thumbHash } = upload;
invariant( invariant(
encryptionKey && blobHash && dimensions, encryptionKey && blobHash && dimensions,
'incomplete encrypted upload', 'incomplete encrypted upload',
); );
uploadResult = await this.blobServiceUpload( uploadResult = await this.props.blobServiceUpload({
{ input: {
blobInput: {
type: 'file',
file: upload.file, file: upload.file,
},
blobHash, blobHash,
encryptionKey, encryptionKey,
dimensions, dimensions,
loop: false, loop: false,
...(thumbHash ? { thumbHash } : undefined), thumbHash,
}, },
{ ...callbacks }, callbacks,
); });
} else { } else {
let uploadExtras = { let uploadExtras = {
...upload.dimensions, ...upload.dimensions,
loop: false, loop: false,
thumbHash: upload.thumbHash, thumbHash: upload.thumbHash,
}; };
if (encryptionKey) { if (encryptionKey) {
uploadExtras = { ...uploadExtras, encryptionKey }; uploadExtras = { ...uploadExtras, encryptionKey };
▲ Show 20 Lines • Show All 159 Lines • ▼ Show 20 Lines this.setState(prevState => {
loop: result.loop, loop: result.loop,
}, },
}, },
}, },
}; };
}); });
} }
async blobServiceUpload(
input: {
+file: File,
+blobHash: string,
+encryptionKey: string,
+dimensions: Dimensions,
+loop?: boolean,
+thumbHash?: string,
},
options?: ?CallServerEndpointOptions,
): Promise<{
...UploadMultimediaResult,
+blobHolder: string,
}> {
const blobHolder = uuid.v4();
const blobHash = toBase64URL(input.blobHash);
// 1. Assign new holder for blob with given blobHash
let blobAlreadyExists: boolean;
try {
const assignHolderEndpoint = blobService.httpEndpoints.ASSIGN_HOLDER;
const assignHolderResponse = await fetch(
makeBlobServiceEndpointURL(assignHolderEndpoint),
{
method: assignHolderEndpoint.method,
body: JSON.stringify({
holder: blobHolder,
blob_hash: blobHash,
}),
headers: {
'content-type': 'application/json',
},
},
);
handleHTTPResponseError(assignHolderResponse);
const { data_exists: dataExistsResponse } =
await assignHolderResponse.json();
blobAlreadyExists = dataExistsResponse;
} catch (e) {
throw new Error(
`Failed to assign holder: ${
getMessageForException(e) ?? 'unknown error'
}`,
);
}
// 2. Upload blob contents if blob doesn't exist
if (!blobAlreadyExists) {
const formData = new FormData();
formData.append('blob_hash', blobHash);
formData.append('blob_data', input.file);
const xhr = new XMLHttpRequest();
const uploadEndpoint = blobService.httpEndpoints.UPLOAD_BLOB;
xhr.open(
uploadEndpoint.method,
makeBlobServiceEndpointURL(uploadEndpoint),
);
if (options?.timeout) {
xhr.timeout = options.timeout;
}
if (options && options.onProgress) {
const { onProgress } = options;
xhr.upload.onprogress = _throttle(
({ loaded, total }) => onProgress(loaded / total),
50,
);
}
let failed = false;
const responsePromise = new Promise((resolve, reject) => {
xhr.onload = () => {
if (failed) {
return;
}
resolve();
};
xhr.onabort = () => {
failed = true;
reject(new Error('request aborted'));
};
xhr.onerror = event => {
failed = true;
reject(event);
};
if (options && options.timeout) {
xhr.ontimeout = event => {
failed = true;
reject(event);
};
}
if (options && options.abortHandler) {
options.abortHandler(() => {
failed = true;
reject(new Error('request aborted'));
xhr.abort();
});
}
});
if (!failed) {
xhr.send(formData);
}
await responsePromise;
}
// 3. Send upload metadata to the keyserver, return response
const result = await this.props.uploadMediaMetadata({
...input.dimensions,
loop: input.loop ?? false,
blobHolder,
blobHash,
encryptionKey: input.encryptionKey,
mimeType: input.file.type,
filename: input.file.name,
thumbHash: input.thumbHash,
});
return { ...result, blobHolder };
}
handleAbortCallback( handleAbortCallback(
threadID: string, threadID: string,
localUploadID: string, localUploadID: string,
abort: () => void, abort: () => void,
) { ) {
this.setState(prevState => { this.setState(prevState => {
const newThreadID = this.getRealizedOrPendingThreadID(threadID); const newThreadID = this.getRealizedOrPendingThreadID(threadID);
const uploads = prevState.pendingUploads[newThreadID]; const uploads = prevState.pendingUploads[newThreadID];
▲ Show 20 Lines • Show All 533 Lines • ▼ Show 20 Lines React.memo<BaseProps>(function ConnectedInputStateContainer(props) {
const threadStoreThreadInfos = useSelector( const threadStoreThreadInfos = useSelector(
state => state.threadStore.threadInfos, state => state.threadStore.threadInfos,
); );
const pendingToRealizedThreadIDs = useSelector(state => const pendingToRealizedThreadIDs = useSelector(state =>
pendingToRealizedThreadIDsSelector(state.threadStore.threadInfos), pendingToRealizedThreadIDsSelector(state.threadStore.threadInfos),
); );
const calendarQuery = useSelector(nonThreadCalendarQuery); const calendarQuery = useSelector(nonThreadCalendarQuery);
const callUploadMultimedia = useServerCall(uploadMultimedia); const callUploadMultimedia = useServerCall(uploadMultimedia);
const callBlobServiceUpload = useServerCall(blobServiceUpload);
const callUploadMediaMetadata = useServerCall(uploadMediaMetadata); const callUploadMediaMetadata = useServerCall(uploadMediaMetadata);
const callDeleteUpload = useServerCall(deleteUpload); const callDeleteUpload = useServerCall(deleteUpload);
const callSendMultimediaMessage = useServerCall( const callSendMultimediaMessage = useServerCall(
legacySendMultimediaMessage, legacySendMultimediaMessage,
); );
const callSendTextMessage = useServerCall(sendTextMessage); const callSendTextMessage = useServerCall(sendTextMessage);
const callNewThread = useServerCall(newThread); const callNewThread = useServerCall(newThread);
const dispatch = useDispatch(); const dispatch = useDispatch();
Show All 24 Lines return (
drafts={drafts} drafts={drafts}
viewerID={viewerID} viewerID={viewerID}
messageStoreMessages={messageStoreMessages} messageStoreMessages={messageStoreMessages}
threadStoreThreadInfos={threadStoreThreadInfos} threadStoreThreadInfos={threadStoreThreadInfos}
pendingRealizedThreadIDs={pendingToRealizedThreadIDs} pendingRealizedThreadIDs={pendingToRealizedThreadIDs}
calendarQuery={calendarQuery} calendarQuery={calendarQuery}
uploadMultimedia={callUploadMultimedia} uploadMultimedia={callUploadMultimedia}
uploadMediaMetadata={callUploadMediaMetadata} uploadMediaMetadata={callUploadMediaMetadata}
blobServiceUpload={callBlobServiceUpload}
deleteUpload={callDeleteUpload} deleteUpload={callDeleteUpload}
sendMultimediaMessage={callSendMultimediaMessage} sendMultimediaMessage={callSendMultimediaMessage}
sendTextMessage={callSendTextMessage} sendTextMessage={callSendTextMessage}
newThread={callNewThread} newThread={callNewThread}
dispatch={dispatch} dispatch={dispatch}
dispatchActionPromise={dispatchActionPromise} dispatchActionPromise={dispatchActionPromise}
pushModal={modalContext.pushModal} pushModal={modalContext.pushModal}
sendCallbacks={sendCallbacks} sendCallbacks={sendCallbacks}
registerSendCallback={registerSendCallback} registerSendCallback={registerSendCallback}
unregisterSendCallback={unregisterSendCallback} unregisterSendCallback={unregisterSendCallback}
textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc} textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc}
/> />
); );
}); });
export default ConnectedInputStateContainer; export default ConnectedInputStateContainer;
View Options

keyserver/src/responders/redux-state-responders.js

// @flow // @flow
import invariant from 'invariant'; import invariant from 'invariant';
import _groupBy from 'lodash/fp/groupBy.js'; import _groupBy from 'lodash/fp/groupBy.js';
import _keyBy from 'lodash/fp/keyBy.js'; import _keyBy from 'lodash/fp/keyBy.js';
import _omit from 'lodash/fp/omit.js'; import _omit from 'lodash/fp/omit.js';
import _partition from 'lodash/fp/partition.js'; import _partition from 'lodash/fp/partition.js';
import _sortBy from 'lodash/fp/sortBy.js'; import _sortBy from 'lodash/fp/sortBy.js';
import _memoize from 'lodash/memoize.js'; import _memoize from 'lodash/memoize.js';
import _throttle from 'lodash/throttle.js';
import * as React from 'react'; import * as React from 'react';
import { useDispatch } from 'react-redux'; import { useDispatch } from 'react-redux';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import uuid from 'uuid';
import { import {
createLocalMessageActionType, createLocalMessageActionType,
sendMultimediaMessageActionTypes, sendMultimediaMessageActionTypes,
legacySendMultimediaMessage, legacySendMultimediaMessage,
sendTextMessageActionTypes, sendTextMessageActionTypes,
sendTextMessage, sendTextMessage,
} from 'lib/actions/message-actions.js'; } from 'lib/actions/message-actions.js';
import { queueReportsActionType } from 'lib/actions/report-actions.js'; import { queueReportsActionType } from 'lib/actions/report-actions.js';
import { newThread } from 'lib/actions/thread-actions.js'; import { newThread } from 'lib/actions/thread-actions.js';
import { import {
uploadMultimedia, uploadMultimedia,
uploadMediaMetadata, uploadMediaMetadata,
updateMultimediaMessageMediaActionType, updateMultimediaMessageMediaActionType,
deleteUpload, deleteUpload,
blobServiceUpload,
type MultimediaUploadCallbacks, type MultimediaUploadCallbacks,
type MultimediaUploadExtras, type MultimediaUploadExtras,
type BlobServiceUploadAction,
} from 'lib/actions/upload-actions.js'; } from 'lib/actions/upload-actions.js';
import { import {
useModalContext, useModalContext,
type PushModal, type PushModal,
} from 'lib/components/modal-provider.react.js'; } from 'lib/components/modal-provider.react.js';
import blobService from 'lib/facts/blob-service.js'; import blobService from 'lib/facts/blob-service.js';
import commStaffCommunity from 'lib/facts/comm-staff-community.js'; import commStaffCommunity from 'lib/facts/comm-staff-community.js';
import { getNextLocalUploadID } from 'lib/media/media-utils.js'; import { getNextLocalUploadID } from 'lib/media/media-utils.js';
Show All 15 Lines
import type { CalendarQuery } from 'lib/types/entry-types.js'; import type { CalendarQuery } from 'lib/types/entry-types.js';
import type { import type {
UploadMultimediaResult, UploadMultimediaResult,
UploadMediaMetadataRequest, UploadMediaMetadataRequest,
MediaMissionStep, MediaMissionStep,
MediaMissionFailure, MediaMissionFailure,
MediaMissionResult, MediaMissionResult,
MediaMission, MediaMission,
Dimensions,
} from 'lib/types/media-types.js'; } from 'lib/types/media-types.js';
import { messageTypes } from 'lib/types/message-types-enum.js'; import { messageTypes } from 'lib/types/message-types-enum.js';
import { import {
type RawMessageInfo, type RawMessageInfo,
type RawMultimediaMessageInfo, type RawMultimediaMessageInfo,
type SendMessageResult, type SendMessageResult,
type SendMessagePayload, type SendMessagePayload,
} from 'lib/types/message-types.js'; } from 'lib/types/message-types.js';
Show All 9 Linesimport {
type ThreadInfo, type ThreadInfo,
type RawThreadInfo, type RawThreadInfo,
} from 'lib/types/thread-types.js'; } from 'lib/types/thread-types.js';
import { import {
type DispatchActionPromise, type DispatchActionPromise,
useServerCall, useServerCall,
useDispatchActionPromise, useDispatchActionPromise,
} from 'lib/utils/action-utils.js'; } from 'lib/utils/action-utils.js';
import { toBase64URL } from 'lib/utils/base64.js';
import { import {
makeBlobServiceEndpointURL, makeBlobServiceEndpointURL,
isBlobServiceURI, isBlobServiceURI,
blobHashFromBlobServiceURI, blobHashFromBlobServiceURI,
} from 'lib/utils/blob-service.js'; } from 'lib/utils/blob-service.js';
import type { CallServerEndpointOptions } from 'lib/utils/call-server-endpoint.js';
import { getConfig } from 'lib/utils/config.js'; import { getConfig } from 'lib/utils/config.js';
import { getMessageForException, cloneError } from 'lib/utils/errors.js'; import { getMessageForException, cloneError } from 'lib/utils/errors.js';
import { generateReportID } from 'lib/utils/report-utils.js'; import { generateReportID } from 'lib/utils/report-utils.js';
import { handleHTTPResponseError } from 'lib/utils/services-utils.js';
import { import {
type PendingMultimediaUpload, type PendingMultimediaUpload,
type TypeaheadState, type TypeaheadState,
InputStateContext, InputStateContext,
} from './input-state.js'; } from './input-state.js';
import { encryptFile } from '../media/encryption-utils.js'; import { encryptFile } from '../media/encryption-utils.js';
import { generateThumbHash } from '../media/image-utils.js'; import { generateThumbHash } from '../media/image-utils.js';
Show All 21 Linestype Props = {
+dispatch: Dispatch, +dispatch: Dispatch,
+dispatchActionPromise: DispatchActionPromise, +dispatchActionPromise: DispatchActionPromise,
+calendarQuery: () => CalendarQuery, +calendarQuery: () => CalendarQuery,
+uploadMultimedia: ( +uploadMultimedia: (
multimedia: Object, multimedia: Object,
extras: MultimediaUploadExtras, extras: MultimediaUploadExtras,
callbacks: MultimediaUploadCallbacks, callbacks: MultimediaUploadCallbacks,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+blobServiceUpload: BlobServiceUploadAction,
+uploadMediaMetadata: ( +uploadMediaMetadata: (
input: UploadMediaMetadataRequest, input: UploadMediaMetadataRequest,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+deleteUpload: (id: string) => Promise<void>, +deleteUpload: (id: string) => Promise<void>,
+sendMultimediaMessage: ( +sendMultimediaMessage: (
threadID: string, threadID: string,
localID: string, localID: string,
mediaIDs: $ReadOnlyArray<string>, mediaIDs: $ReadOnlyArray<string>,
▲ Show 20 Lines • Show All 729 Lines • ▼ Show 20 Lines try {
(upload.mediaType === 'encrypted_photo' || (upload.mediaType === 'encrypted_photo' ||
upload.mediaType === 'encrypted_video') upload.mediaType === 'encrypted_video')
) { ) {
const { blobHash, dimensions, thumbHash } = upload; const { blobHash, dimensions, thumbHash } = upload;
invariant( invariant(
encryptionKey && blobHash && dimensions, encryptionKey && blobHash && dimensions,
'incomplete encrypted upload', 'incomplete encrypted upload',
); );
uploadResult = await this.blobServiceUpload( uploadResult = await this.props.blobServiceUpload({
{ input: {
blobInput: {
type: 'file',
file: upload.file, file: upload.file,
},
blobHash, blobHash,
encryptionKey, encryptionKey,
dimensions, dimensions,
loop: false, loop: false,
...(thumbHash ? { thumbHash } : undefined), thumbHash,
}, },
{ ...callbacks }, callbacks,
); });
} else { } else {
let uploadExtras = { let uploadExtras = {
...upload.dimensions, ...upload.dimensions,
loop: false, loop: false,
thumbHash: upload.thumbHash, thumbHash: upload.thumbHash,
}; };
if (encryptionKey) { if (encryptionKey) {
uploadExtras = { ...uploadExtras, encryptionKey }; uploadExtras = { ...uploadExtras, encryptionKey };
▲ Show 20 Lines • Show All 159 Lines • ▼ Show 20 Lines this.setState(prevState => {
loop: result.loop, loop: result.loop,
}, },
}, },
}, },
}; };
}); });
} }
async blobServiceUpload(
input: {
+file: File,
+blobHash: string,
+encryptionKey: string,
+dimensions: Dimensions,
+loop?: boolean,
+thumbHash?: string,
},
options?: ?CallServerEndpointOptions,
): Promise<{
...UploadMultimediaResult,
+blobHolder: string,
}> {
const blobHolder = uuid.v4();
const blobHash = toBase64URL(input.blobHash);
// 1. Assign new holder for blob with given blobHash
let blobAlreadyExists: boolean;
try {
const assignHolderEndpoint = blobService.httpEndpoints.ASSIGN_HOLDER;
const assignHolderResponse = await fetch(
makeBlobServiceEndpointURL(assignHolderEndpoint),
{
method: assignHolderEndpoint.method,
body: JSON.stringify({
holder: blobHolder,
blob_hash: blobHash,
}),
headers: {
'content-type': 'application/json',
},
},
);
handleHTTPResponseError(assignHolderResponse);
const { data_exists: dataExistsResponse } =
await assignHolderResponse.json();
blobAlreadyExists = dataExistsResponse;
} catch (e) {
throw new Error(
`Failed to assign holder: ${
getMessageForException(e) ?? 'unknown error'
}`,
);
}
// 2. Upload blob contents if blob doesn't exist
if (!blobAlreadyExists) {
const formData = new FormData();
formData.append('blob_hash', blobHash);
formData.append('blob_data', input.file);
const xhr = new XMLHttpRequest();
const uploadEndpoint = blobService.httpEndpoints.UPLOAD_BLOB;
xhr.open(
uploadEndpoint.method,
makeBlobServiceEndpointURL(uploadEndpoint),
);
if (options?.timeout) {
xhr.timeout = options.timeout;
}
if (options && options.onProgress) {
const { onProgress } = options;
xhr.upload.onprogress = _throttle(
({ loaded, total }) => onProgress(loaded / total),
50,
);
}
let failed = false;
const responsePromise = new Promise((resolve, reject) => {
xhr.onload = () => {
if (failed) {
return;
}
resolve();
};
xhr.onabort = () => {
failed = true;
reject(new Error('request aborted'));
};
xhr.onerror = event => {
failed = true;
reject(event);
};
if (options && options.timeout) {
xhr.ontimeout = event => {
failed = true;
reject(event);
};
}
if (options && options.abortHandler) {
options.abortHandler(() => {
failed = true;
reject(new Error('request aborted'));
xhr.abort();
});
}
});
if (!failed) {
xhr.send(formData);
}
await responsePromise;
}
// 3. Send upload metadata to the keyserver, return response
const result = await this.props.uploadMediaMetadata({
...input.dimensions,
loop: input.loop ?? false,
blobHolder,
blobHash,
encryptionKey: input.encryptionKey,
mimeType: input.file.type,
filename: input.file.name,
thumbHash: input.thumbHash,
});
return { ...result, blobHolder };
}
handleAbortCallback( handleAbortCallback(
threadID: string, threadID: string,
localUploadID: string, localUploadID: string,
abort: () => void, abort: () => void,
) { ) {
this.setState(prevState => { this.setState(prevState => {
const newThreadID = this.getRealizedOrPendingThreadID(threadID); const newThreadID = this.getRealizedOrPendingThreadID(threadID);
const uploads = prevState.pendingUploads[newThreadID]; const uploads = prevState.pendingUploads[newThreadID];
▲ Show 20 Lines • Show All 533 Lines • ▼ Show 20 Lines React.memo<BaseProps>(function ConnectedInputStateContainer(props) {
const threadStoreThreadInfos = useSelector( const threadStoreThreadInfos = useSelector(
state => state.threadStore.threadInfos, state => state.threadStore.threadInfos,
); );
const pendingToRealizedThreadIDs = useSelector(state => const pendingToRealizedThreadIDs = useSelector(state =>
pendingToRealizedThreadIDsSelector(state.threadStore.threadInfos), pendingToRealizedThreadIDsSelector(state.threadStore.threadInfos),
); );
const calendarQuery = useSelector(nonThreadCalendarQuery); const calendarQuery = useSelector(nonThreadCalendarQuery);
const callUploadMultimedia = useServerCall(uploadMultimedia); const callUploadMultimedia = useServerCall(uploadMultimedia);
const callBlobServiceUpload = useServerCall(blobServiceUpload);
const callUploadMediaMetadata = useServerCall(uploadMediaMetadata); const callUploadMediaMetadata = useServerCall(uploadMediaMetadata);
const callDeleteUpload = useServerCall(deleteUpload); const callDeleteUpload = useServerCall(deleteUpload);
const callSendMultimediaMessage = useServerCall( const callSendMultimediaMessage = useServerCall(
legacySendMultimediaMessage, legacySendMultimediaMessage,
); );
const callSendTextMessage = useServerCall(sendTextMessage); const callSendTextMessage = useServerCall(sendTextMessage);
const callNewThread = useServerCall(newThread); const callNewThread = useServerCall(newThread);
const dispatch = useDispatch(); const dispatch = useDispatch();
Show All 24 Lines return (
drafts={drafts} drafts={drafts}
viewerID={viewerID} viewerID={viewerID}
messageStoreMessages={messageStoreMessages} messageStoreMessages={messageStoreMessages}
threadStoreThreadInfos={threadStoreThreadInfos} threadStoreThreadInfos={threadStoreThreadInfos}
pendingRealizedThreadIDs={pendingToRealizedThreadIDs} pendingRealizedThreadIDs={pendingToRealizedThreadIDs}
calendarQuery={calendarQuery} calendarQuery={calendarQuery}
uploadMultimedia={callUploadMultimedia} uploadMultimedia={callUploadMultimedia}
uploadMediaMetadata={callUploadMediaMetadata} uploadMediaMetadata={callUploadMediaMetadata}
blobServiceUpload={callBlobServiceUpload}
deleteUpload={callDeleteUpload} deleteUpload={callDeleteUpload}
sendMultimediaMessage={callSendMultimediaMessage} sendMultimediaMessage={callSendMultimediaMessage}
sendTextMessage={callSendTextMessage} sendTextMessage={callSendTextMessage}
newThread={callNewThread} newThread={callNewThread}
dispatch={dispatch} dispatch={dispatch}
dispatchActionPromise={dispatchActionPromise} dispatchActionPromise={dispatchActionPromise}
pushModal={modalContext.pushModal} pushModal={modalContext.pushModal}
sendCallbacks={sendCallbacks} sendCallbacks={sendCallbacks}
registerSendCallback={registerSendCallback} registerSendCallback={registerSendCallback}
unregisterSendCallback={unregisterSendCallback} unregisterSendCallback={unregisterSendCallback}
textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc} textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc}
/> />
); );
}); });
export default ConnectedInputStateContainer; export default ConnectedInputStateContainer;
View Options

web/redux/action-types.js

// @flow // @flow
import invariant from 'invariant'; import invariant from 'invariant';
import _groupBy from 'lodash/fp/groupBy.js'; import _groupBy from 'lodash/fp/groupBy.js';
import _keyBy from 'lodash/fp/keyBy.js'; import _keyBy from 'lodash/fp/keyBy.js';
import _omit from 'lodash/fp/omit.js'; import _omit from 'lodash/fp/omit.js';
import _partition from 'lodash/fp/partition.js'; import _partition from 'lodash/fp/partition.js';
import _sortBy from 'lodash/fp/sortBy.js'; import _sortBy from 'lodash/fp/sortBy.js';
import _memoize from 'lodash/memoize.js'; import _memoize from 'lodash/memoize.js';
import _throttle from 'lodash/throttle.js';
import * as React from 'react'; import * as React from 'react';
import { useDispatch } from 'react-redux'; import { useDispatch } from 'react-redux';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import uuid from 'uuid';
import { import {
createLocalMessageActionType, createLocalMessageActionType,
sendMultimediaMessageActionTypes, sendMultimediaMessageActionTypes,
legacySendMultimediaMessage, legacySendMultimediaMessage,
sendTextMessageActionTypes, sendTextMessageActionTypes,
sendTextMessage, sendTextMessage,
} from 'lib/actions/message-actions.js'; } from 'lib/actions/message-actions.js';
import { queueReportsActionType } from 'lib/actions/report-actions.js'; import { queueReportsActionType } from 'lib/actions/report-actions.js';
import { newThread } from 'lib/actions/thread-actions.js'; import { newThread } from 'lib/actions/thread-actions.js';
import { import {
uploadMultimedia, uploadMultimedia,
uploadMediaMetadata, uploadMediaMetadata,
updateMultimediaMessageMediaActionType, updateMultimediaMessageMediaActionType,
deleteUpload, deleteUpload,
blobServiceUpload,
type MultimediaUploadCallbacks, type MultimediaUploadCallbacks,
type MultimediaUploadExtras, type MultimediaUploadExtras,
type BlobServiceUploadAction,
} from 'lib/actions/upload-actions.js'; } from 'lib/actions/upload-actions.js';
import { import {
useModalContext, useModalContext,
type PushModal, type PushModal,
} from 'lib/components/modal-provider.react.js'; } from 'lib/components/modal-provider.react.js';
import blobService from 'lib/facts/blob-service.js'; import blobService from 'lib/facts/blob-service.js';
import commStaffCommunity from 'lib/facts/comm-staff-community.js'; import commStaffCommunity from 'lib/facts/comm-staff-community.js';
import { getNextLocalUploadID } from 'lib/media/media-utils.js'; import { getNextLocalUploadID } from 'lib/media/media-utils.js';
Show All 15 Lines
import type { CalendarQuery } from 'lib/types/entry-types.js'; import type { CalendarQuery } from 'lib/types/entry-types.js';
import type { import type {
UploadMultimediaResult, UploadMultimediaResult,
UploadMediaMetadataRequest, UploadMediaMetadataRequest,
MediaMissionStep, MediaMissionStep,
MediaMissionFailure, MediaMissionFailure,
MediaMissionResult, MediaMissionResult,
MediaMission, MediaMission,
Dimensions,
} from 'lib/types/media-types.js'; } from 'lib/types/media-types.js';
import { messageTypes } from 'lib/types/message-types-enum.js'; import { messageTypes } from 'lib/types/message-types-enum.js';
import { import {
type RawMessageInfo, type RawMessageInfo,
type RawMultimediaMessageInfo, type RawMultimediaMessageInfo,
type SendMessageResult, type SendMessageResult,
type SendMessagePayload, type SendMessagePayload,
} from 'lib/types/message-types.js'; } from 'lib/types/message-types.js';
Show All 9 Linesimport {
type ThreadInfo, type ThreadInfo,
type RawThreadInfo, type RawThreadInfo,
} from 'lib/types/thread-types.js'; } from 'lib/types/thread-types.js';
import { import {
type DispatchActionPromise, type DispatchActionPromise,
useServerCall, useServerCall,
useDispatchActionPromise, useDispatchActionPromise,
} from 'lib/utils/action-utils.js'; } from 'lib/utils/action-utils.js';
import { toBase64URL } from 'lib/utils/base64.js';
import { import {
makeBlobServiceEndpointURL, makeBlobServiceEndpointURL,
isBlobServiceURI, isBlobServiceURI,
blobHashFromBlobServiceURI, blobHashFromBlobServiceURI,
} from 'lib/utils/blob-service.js'; } from 'lib/utils/blob-service.js';
import type { CallServerEndpointOptions } from 'lib/utils/call-server-endpoint.js';
import { getConfig } from 'lib/utils/config.js'; import { getConfig } from 'lib/utils/config.js';
import { getMessageForException, cloneError } from 'lib/utils/errors.js'; import { getMessageForException, cloneError } from 'lib/utils/errors.js';
import { generateReportID } from 'lib/utils/report-utils.js'; import { generateReportID } from 'lib/utils/report-utils.js';
import { handleHTTPResponseError } from 'lib/utils/services-utils.js';
import { import {
type PendingMultimediaUpload, type PendingMultimediaUpload,
type TypeaheadState, type TypeaheadState,
InputStateContext, InputStateContext,
} from './input-state.js'; } from './input-state.js';
import { encryptFile } from '../media/encryption-utils.js'; import { encryptFile } from '../media/encryption-utils.js';
import { generateThumbHash } from '../media/image-utils.js'; import { generateThumbHash } from '../media/image-utils.js';
Show All 21 Linestype Props = {
+dispatch: Dispatch, +dispatch: Dispatch,
+dispatchActionPromise: DispatchActionPromise, +dispatchActionPromise: DispatchActionPromise,
+calendarQuery: () => CalendarQuery, +calendarQuery: () => CalendarQuery,
+uploadMultimedia: ( +uploadMultimedia: (
multimedia: Object, multimedia: Object,
extras: MultimediaUploadExtras, extras: MultimediaUploadExtras,
callbacks: MultimediaUploadCallbacks, callbacks: MultimediaUploadCallbacks,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+blobServiceUpload: BlobServiceUploadAction,
+uploadMediaMetadata: ( +uploadMediaMetadata: (
input: UploadMediaMetadataRequest, input: UploadMediaMetadataRequest,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+deleteUpload: (id: string) => Promise<void>, +deleteUpload: (id: string) => Promise<void>,
+sendMultimediaMessage: ( +sendMultimediaMessage: (
threadID: string, threadID: string,
localID: string, localID: string,
mediaIDs: $ReadOnlyArray<string>, mediaIDs: $ReadOnlyArray<string>,
▲ Show 20 Lines • Show All 729 Lines • ▼ Show 20 Lines try {
(upload.mediaType === 'encrypted_photo' || (upload.mediaType === 'encrypted_photo' ||
upload.mediaType === 'encrypted_video') upload.mediaType === 'encrypted_video')
) { ) {
const { blobHash, dimensions, thumbHash } = upload; const { blobHash, dimensions, thumbHash } = upload;
invariant( invariant(
encryptionKey && blobHash && dimensions, encryptionKey && blobHash && dimensions,
'incomplete encrypted upload', 'incomplete encrypted upload',
); );
uploadResult = await this.blobServiceUpload( uploadResult = await this.props.blobServiceUpload({
{ input: {
blobInput: {
type: 'file',
file: upload.file, file: upload.file,
},
blobHash, blobHash,
encryptionKey, encryptionKey,
dimensions, dimensions,
loop: false, loop: false,
...(thumbHash ? { thumbHash } : undefined), thumbHash,
}, },
{ ...callbacks }, callbacks,
); });
} else { } else {
let uploadExtras = { let uploadExtras = {
...upload.dimensions, ...upload.dimensions,
loop: false, loop: false,
thumbHash: upload.thumbHash, thumbHash: upload.thumbHash,
}; };
if (encryptionKey) { if (encryptionKey) {
uploadExtras = { ...uploadExtras, encryptionKey }; uploadExtras = { ...uploadExtras, encryptionKey };
▲ Show 20 Lines • Show All 159 Lines • ▼ Show 20 Lines this.setState(prevState => {
loop: result.loop, loop: result.loop,
}, },
}, },
}, },
}; };
}); });
} }
async blobServiceUpload(
input: {
+file: File,
+blobHash: string,
+encryptionKey: string,
+dimensions: Dimensions,
+loop?: boolean,
+thumbHash?: string,
},
options?: ?CallServerEndpointOptions,
): Promise<{
...UploadMultimediaResult,
+blobHolder: string,
}> {
const blobHolder = uuid.v4();
const blobHash = toBase64URL(input.blobHash);
// 1. Assign new holder for blob with given blobHash
let blobAlreadyExists: boolean;
try {
const assignHolderEndpoint = blobService.httpEndpoints.ASSIGN_HOLDER;
const assignHolderResponse = await fetch(
makeBlobServiceEndpointURL(assignHolderEndpoint),
{
method: assignHolderEndpoint.method,
body: JSON.stringify({
holder: blobHolder,
blob_hash: blobHash,
}),
headers: {
'content-type': 'application/json',
},
},
);
handleHTTPResponseError(assignHolderResponse);
const { data_exists: dataExistsResponse } =
await assignHolderResponse.json();
blobAlreadyExists = dataExistsResponse;
} catch (e) {
throw new Error(
`Failed to assign holder: ${
getMessageForException(e) ?? 'unknown error'
}`,
);
}
// 2. Upload blob contents if blob doesn't exist
if (!blobAlreadyExists) {
const formData = new FormData();
formData.append('blob_hash', blobHash);
formData.append('blob_data', input.file);
const xhr = new XMLHttpRequest();
const uploadEndpoint = blobService.httpEndpoints.UPLOAD_BLOB;
xhr.open(
uploadEndpoint.method,
makeBlobServiceEndpointURL(uploadEndpoint),
);
if (options?.timeout) {
xhr.timeout = options.timeout;
}
if (options && options.onProgress) {
const { onProgress } = options;
xhr.upload.onprogress = _throttle(
({ loaded, total }) => onProgress(loaded / total),
50,
);
}
let failed = false;
const responsePromise = new Promise((resolve, reject) => {
xhr.onload = () => {
if (failed) {
return;
}
resolve();
};
xhr.onabort = () => {
failed = true;
reject(new Error('request aborted'));
};
xhr.onerror = event => {
failed = true;
reject(event);
};
if (options && options.timeout) {
xhr.ontimeout = event => {
failed = true;
reject(event);
};
}
if (options && options.abortHandler) {
options.abortHandler(() => {
failed = true;
reject(new Error('request aborted'));
xhr.abort();
});
}
});
if (!failed) {
xhr.send(formData);
}
await responsePromise;
}
// 3. Send upload metadata to the keyserver, return response
const result = await this.props.uploadMediaMetadata({
...input.dimensions,
loop: input.loop ?? false,
blobHolder,
blobHash,
encryptionKey: input.encryptionKey,
mimeType: input.file.type,
filename: input.file.name,
thumbHash: input.thumbHash,
});
return { ...result, blobHolder };
}
handleAbortCallback( handleAbortCallback(
threadID: string, threadID: string,
localUploadID: string, localUploadID: string,
abort: () => void, abort: () => void,
) { ) {
this.setState(prevState => { this.setState(prevState => {
const newThreadID = this.getRealizedOrPendingThreadID(threadID); const newThreadID = this.getRealizedOrPendingThreadID(threadID);
const uploads = prevState.pendingUploads[newThreadID]; const uploads = prevState.pendingUploads[newThreadID];
▲ Show 20 Lines • Show All 533 Lines • ▼ Show 20 Lines React.memo<BaseProps>(function ConnectedInputStateContainer(props) {
const threadStoreThreadInfos = useSelector( const threadStoreThreadInfos = useSelector(
state => state.threadStore.threadInfos, state => state.threadStore.threadInfos,
); );
const pendingToRealizedThreadIDs = useSelector(state => const pendingToRealizedThreadIDs = useSelector(state =>
pendingToRealizedThreadIDsSelector(state.threadStore.threadInfos), pendingToRealizedThreadIDsSelector(state.threadStore.threadInfos),
); );
const calendarQuery = useSelector(nonThreadCalendarQuery); const calendarQuery = useSelector(nonThreadCalendarQuery);
const callUploadMultimedia = useServerCall(uploadMultimedia); const callUploadMultimedia = useServerCall(uploadMultimedia);
const callBlobServiceUpload = useServerCall(blobServiceUpload);
const callUploadMediaMetadata = useServerCall(uploadMediaMetadata); const callUploadMediaMetadata = useServerCall(uploadMediaMetadata);
const callDeleteUpload = useServerCall(deleteUpload); const callDeleteUpload = useServerCall(deleteUpload);
const callSendMultimediaMessage = useServerCall( const callSendMultimediaMessage = useServerCall(
legacySendMultimediaMessage, legacySendMultimediaMessage,
); );
const callSendTextMessage = useServerCall(sendTextMessage); const callSendTextMessage = useServerCall(sendTextMessage);
const callNewThread = useServerCall(newThread); const callNewThread = useServerCall(newThread);
const dispatch = useDispatch(); const dispatch = useDispatch();
Show All 24 Lines return (
drafts={drafts} drafts={drafts}
viewerID={viewerID} viewerID={viewerID}
messageStoreMessages={messageStoreMessages} messageStoreMessages={messageStoreMessages}
threadStoreThreadInfos={threadStoreThreadInfos} threadStoreThreadInfos={threadStoreThreadInfos}
pendingRealizedThreadIDs={pendingToRealizedThreadIDs} pendingRealizedThreadIDs={pendingToRealizedThreadIDs}
calendarQuery={calendarQuery} calendarQuery={calendarQuery}
uploadMultimedia={callUploadMultimedia} uploadMultimedia={callUploadMultimedia}
uploadMediaMetadata={callUploadMediaMetadata} uploadMediaMetadata={callUploadMediaMetadata}
blobServiceUpload={callBlobServiceUpload}
deleteUpload={callDeleteUpload} deleteUpload={callDeleteUpload}
sendMultimediaMessage={callSendMultimediaMessage} sendMultimediaMessage={callSendMultimediaMessage}
sendTextMessage={callSendTextMessage} sendTextMessage={callSendTextMessage}
newThread={callNewThread} newThread={callNewThread}
dispatch={dispatch} dispatch={dispatch}
dispatchActionPromise={dispatchActionPromise} dispatchActionPromise={dispatchActionPromise}
pushModal={modalContext.pushModal} pushModal={modalContext.pushModal}
sendCallbacks={sendCallbacks} sendCallbacks={sendCallbacks}
registerSendCallback={registerSendCallback} registerSendCallback={registerSendCallback}
unregisterSendCallback={unregisterSendCallback} unregisterSendCallback={unregisterSendCallback}
textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc} textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc}
/> />
); );
}); });
export default ConnectedInputStateContainer; export default ConnectedInputStateContainer;
View Options

web/redux/initial-state-gate.js

// @flow // @flow
import invariant from 'invariant'; import invariant from 'invariant';
import _groupBy from 'lodash/fp/groupBy.js'; import _groupBy from 'lodash/fp/groupBy.js';
import _keyBy from 'lodash/fp/keyBy.js'; import _keyBy from 'lodash/fp/keyBy.js';
import _omit from 'lodash/fp/omit.js'; import _omit from 'lodash/fp/omit.js';
import _partition from 'lodash/fp/partition.js'; import _partition from 'lodash/fp/partition.js';
import _sortBy from 'lodash/fp/sortBy.js'; import _sortBy from 'lodash/fp/sortBy.js';
import _memoize from 'lodash/memoize.js'; import _memoize from 'lodash/memoize.js';
import _throttle from 'lodash/throttle.js';
import * as React from 'react'; import * as React from 'react';
import { useDispatch } from 'react-redux'; import { useDispatch } from 'react-redux';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import uuid from 'uuid';
import { import {
createLocalMessageActionType, createLocalMessageActionType,
sendMultimediaMessageActionTypes, sendMultimediaMessageActionTypes,
legacySendMultimediaMessage, legacySendMultimediaMessage,
sendTextMessageActionTypes, sendTextMessageActionTypes,
sendTextMessage, sendTextMessage,
} from 'lib/actions/message-actions.js'; } from 'lib/actions/message-actions.js';
import { queueReportsActionType } from 'lib/actions/report-actions.js'; import { queueReportsActionType } from 'lib/actions/report-actions.js';
import { newThread } from 'lib/actions/thread-actions.js'; import { newThread } from 'lib/actions/thread-actions.js';
import { import {
uploadMultimedia, uploadMultimedia,
uploadMediaMetadata, uploadMediaMetadata,
updateMultimediaMessageMediaActionType, updateMultimediaMessageMediaActionType,
deleteUpload, deleteUpload,
blobServiceUpload,
type MultimediaUploadCallbacks, type MultimediaUploadCallbacks,
type MultimediaUploadExtras, type MultimediaUploadExtras,
type BlobServiceUploadAction,
} from 'lib/actions/upload-actions.js'; } from 'lib/actions/upload-actions.js';
import { import {
useModalContext, useModalContext,
type PushModal, type PushModal,
} from 'lib/components/modal-provider.react.js'; } from 'lib/components/modal-provider.react.js';
import blobService from 'lib/facts/blob-service.js'; import blobService from 'lib/facts/blob-service.js';
import commStaffCommunity from 'lib/facts/comm-staff-community.js'; import commStaffCommunity from 'lib/facts/comm-staff-community.js';
import { getNextLocalUploadID } from 'lib/media/media-utils.js'; import { getNextLocalUploadID } from 'lib/media/media-utils.js';
Show All 15 Lines
import type { CalendarQuery } from 'lib/types/entry-types.js'; import type { CalendarQuery } from 'lib/types/entry-types.js';
import type { import type {
UploadMultimediaResult, UploadMultimediaResult,
UploadMediaMetadataRequest, UploadMediaMetadataRequest,
MediaMissionStep, MediaMissionStep,
MediaMissionFailure, MediaMissionFailure,
MediaMissionResult, MediaMissionResult,
MediaMission, MediaMission,
Dimensions,
} from 'lib/types/media-types.js'; } from 'lib/types/media-types.js';
import { messageTypes } from 'lib/types/message-types-enum.js'; import { messageTypes } from 'lib/types/message-types-enum.js';
import { import {
type RawMessageInfo, type RawMessageInfo,
type RawMultimediaMessageInfo, type RawMultimediaMessageInfo,
type SendMessageResult, type SendMessageResult,
type SendMessagePayload, type SendMessagePayload,
} from 'lib/types/message-types.js'; } from 'lib/types/message-types.js';
Show All 9 Linesimport {
type ThreadInfo, type ThreadInfo,
type RawThreadInfo, type RawThreadInfo,
} from 'lib/types/thread-types.js'; } from 'lib/types/thread-types.js';
import { import {
type DispatchActionPromise, type DispatchActionPromise,
useServerCall, useServerCall,
useDispatchActionPromise, useDispatchActionPromise,
} from 'lib/utils/action-utils.js'; } from 'lib/utils/action-utils.js';
import { toBase64URL } from 'lib/utils/base64.js';
import { import {
makeBlobServiceEndpointURL, makeBlobServiceEndpointURL,
isBlobServiceURI, isBlobServiceURI,
blobHashFromBlobServiceURI, blobHashFromBlobServiceURI,
} from 'lib/utils/blob-service.js'; } from 'lib/utils/blob-service.js';
import type { CallServerEndpointOptions } from 'lib/utils/call-server-endpoint.js';
import { getConfig } from 'lib/utils/config.js'; import { getConfig } from 'lib/utils/config.js';
import { getMessageForException, cloneError } from 'lib/utils/errors.js'; import { getMessageForException, cloneError } from 'lib/utils/errors.js';
import { generateReportID } from 'lib/utils/report-utils.js'; import { generateReportID } from 'lib/utils/report-utils.js';
import { handleHTTPResponseError } from 'lib/utils/services-utils.js';
import { import {
type PendingMultimediaUpload, type PendingMultimediaUpload,
type TypeaheadState, type TypeaheadState,
InputStateContext, InputStateContext,
} from './input-state.js'; } from './input-state.js';
import { encryptFile } from '../media/encryption-utils.js'; import { encryptFile } from '../media/encryption-utils.js';
import { generateThumbHash } from '../media/image-utils.js'; import { generateThumbHash } from '../media/image-utils.js';
Show All 21 Linestype Props = {
+dispatch: Dispatch, +dispatch: Dispatch,
+dispatchActionPromise: DispatchActionPromise, +dispatchActionPromise: DispatchActionPromise,
+calendarQuery: () => CalendarQuery, +calendarQuery: () => CalendarQuery,
+uploadMultimedia: ( +uploadMultimedia: (
multimedia: Object, multimedia: Object,
extras: MultimediaUploadExtras, extras: MultimediaUploadExtras,
callbacks: MultimediaUploadCallbacks, callbacks: MultimediaUploadCallbacks,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+blobServiceUpload: BlobServiceUploadAction,
+uploadMediaMetadata: ( +uploadMediaMetadata: (
input: UploadMediaMetadataRequest, input: UploadMediaMetadataRequest,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+deleteUpload: (id: string) => Promise<void>, +deleteUpload: (id: string) => Promise<void>,
+sendMultimediaMessage: ( +sendMultimediaMessage: (
threadID: string, threadID: string,
localID: string, localID: string,
mediaIDs: $ReadOnlyArray<string>, mediaIDs: $ReadOnlyArray<string>,
▲ Show 20 Lines • Show All 729 Lines • ▼ Show 20 Lines try {
(upload.mediaType === 'encrypted_photo' || (upload.mediaType === 'encrypted_photo' ||
upload.mediaType === 'encrypted_video') upload.mediaType === 'encrypted_video')
) { ) {
const { blobHash, dimensions, thumbHash } = upload; const { blobHash, dimensions, thumbHash } = upload;
invariant( invariant(
encryptionKey && blobHash && dimensions, encryptionKey && blobHash && dimensions,
'incomplete encrypted upload', 'incomplete encrypted upload',
); );
uploadResult = await this.blobServiceUpload( uploadResult = await this.props.blobServiceUpload({
{ input: {
blobInput: {
type: 'file',
file: upload.file, file: upload.file,
},
blobHash, blobHash,
encryptionKey, encryptionKey,
dimensions, dimensions,
loop: false, loop: false,
...(thumbHash ? { thumbHash } : undefined), thumbHash,
}, },
{ ...callbacks }, callbacks,
); });
} else { } else {
let uploadExtras = { let uploadExtras = {
...upload.dimensions, ...upload.dimensions,
loop: false, loop: false,
thumbHash: upload.thumbHash, thumbHash: upload.thumbHash,
}; };
if (encryptionKey) { if (encryptionKey) {
uploadExtras = { ...uploadExtras, encryptionKey }; uploadExtras = { ...uploadExtras, encryptionKey };
▲ Show 20 Lines • Show All 159 Lines • ▼ Show 20 Lines this.setState(prevState => {
loop: result.loop, loop: result.loop,
}, },
}, },
}, },
}; };
}); });
} }
async blobServiceUpload(
input: {
+file: File,
+blobHash: string,
+encryptionKey: string,
+dimensions: Dimensions,
+loop?: boolean,
+thumbHash?: string,
},
options?: ?CallServerEndpointOptions,
): Promise<{
...UploadMultimediaResult,
+blobHolder: string,
}> {
const blobHolder = uuid.v4();
const blobHash = toBase64URL(input.blobHash);
// 1. Assign new holder for blob with given blobHash
let blobAlreadyExists: boolean;
try {
const assignHolderEndpoint = blobService.httpEndpoints.ASSIGN_HOLDER;
const assignHolderResponse = await fetch(
makeBlobServiceEndpointURL(assignHolderEndpoint),
{
method: assignHolderEndpoint.method,
body: JSON.stringify({
holder: blobHolder,
blob_hash: blobHash,
}),
headers: {
'content-type': 'application/json',
},
},
);
handleHTTPResponseError(assignHolderResponse);
const { data_exists: dataExistsResponse } =
await assignHolderResponse.json();
blobAlreadyExists = dataExistsResponse;
} catch (e) {
throw new Error(
`Failed to assign holder: ${
getMessageForException(e) ?? 'unknown error'
}`,
);
}
// 2. Upload blob contents if blob doesn't exist
if (!blobAlreadyExists) {
const formData = new FormData();
formData.append('blob_hash', blobHash);
formData.append('blob_data', input.file);
const xhr = new XMLHttpRequest();
const uploadEndpoint = blobService.httpEndpoints.UPLOAD_BLOB;
xhr.open(
uploadEndpoint.method,
makeBlobServiceEndpointURL(uploadEndpoint),
);
if (options?.timeout) {
xhr.timeout = options.timeout;
}
if (options && options.onProgress) {
const { onProgress } = options;
xhr.upload.onprogress = _throttle(
({ loaded, total }) => onProgress(loaded / total),
50,
);
}
let failed = false;
const responsePromise = new Promise((resolve, reject) => {
xhr.onload = () => {
if (failed) {
return;
}
resolve();
};
xhr.onabort = () => {
failed = true;
reject(new Error('request aborted'));
};
xhr.onerror = event => {
failed = true;
reject(event);
};
if (options && options.timeout) {
xhr.ontimeout = event => {
failed = true;
reject(event);
};
}
if (options && options.abortHandler) {
options.abortHandler(() => {
failed = true;
reject(new Error('request aborted'));
xhr.abort();
});
}
});
if (!failed) {
xhr.send(formData);
}
await responsePromise;
}
// 3. Send upload metadata to the keyserver, return response
const result = await this.props.uploadMediaMetadata({
...input.dimensions,
loop: input.loop ?? false,
blobHolder,
blobHash,
encryptionKey: input.encryptionKey,
mimeType: input.file.type,
filename: input.file.name,
thumbHash: input.thumbHash,
});
return { ...result, blobHolder };
}
handleAbortCallback( handleAbortCallback(
threadID: string, threadID: string,
localUploadID: string, localUploadID: string,
abort: () => void, abort: () => void,
) { ) {
this.setState(prevState => { this.setState(prevState => {
const newThreadID = this.getRealizedOrPendingThreadID(threadID); const newThreadID = this.getRealizedOrPendingThreadID(threadID);
const uploads = prevState.pendingUploads[newThreadID]; const uploads = prevState.pendingUploads[newThreadID];
▲ Show 20 Lines • Show All 533 Lines • ▼ Show 20 Lines React.memo<BaseProps>(function ConnectedInputStateContainer(props) {
const threadStoreThreadInfos = useSelector( const threadStoreThreadInfos = useSelector(
state => state.threadStore.threadInfos, state => state.threadStore.threadInfos,
); );
const pendingToRealizedThreadIDs = useSelector(state => const pendingToRealizedThreadIDs = useSelector(state =>
pendingToRealizedThreadIDsSelector(state.threadStore.threadInfos), pendingToRealizedThreadIDsSelector(state.threadStore.threadInfos),
); );
const calendarQuery = useSelector(nonThreadCalendarQuery); const calendarQuery = useSelector(nonThreadCalendarQuery);
const callUploadMultimedia = useServerCall(uploadMultimedia); const callUploadMultimedia = useServerCall(uploadMultimedia);
const callBlobServiceUpload = useServerCall(blobServiceUpload);
const callUploadMediaMetadata = useServerCall(uploadMediaMetadata); const callUploadMediaMetadata = useServerCall(uploadMediaMetadata);
const callDeleteUpload = useServerCall(deleteUpload); const callDeleteUpload = useServerCall(deleteUpload);
const callSendMultimediaMessage = useServerCall( const callSendMultimediaMessage = useServerCall(
legacySendMultimediaMessage, legacySendMultimediaMessage,
); );
const callSendTextMessage = useServerCall(sendTextMessage); const callSendTextMessage = useServerCall(sendTextMessage);
const callNewThread = useServerCall(newThread); const callNewThread = useServerCall(newThread);
const dispatch = useDispatch(); const dispatch = useDispatch();
Show All 24 Lines return (
drafts={drafts} drafts={drafts}
viewerID={viewerID} viewerID={viewerID}
messageStoreMessages={messageStoreMessages} messageStoreMessages={messageStoreMessages}
threadStoreThreadInfos={threadStoreThreadInfos} threadStoreThreadInfos={threadStoreThreadInfos}
pendingRealizedThreadIDs={pendingToRealizedThreadIDs} pendingRealizedThreadIDs={pendingToRealizedThreadIDs}
calendarQuery={calendarQuery} calendarQuery={calendarQuery}
uploadMultimedia={callUploadMultimedia} uploadMultimedia={callUploadMultimedia}
uploadMediaMetadata={callUploadMediaMetadata} uploadMediaMetadata={callUploadMediaMetadata}
blobServiceUpload={callBlobServiceUpload}
deleteUpload={callDeleteUpload} deleteUpload={callDeleteUpload}
sendMultimediaMessage={callSendMultimediaMessage} sendMultimediaMessage={callSendMultimediaMessage}
sendTextMessage={callSendTextMessage} sendTextMessage={callSendTextMessage}
newThread={callNewThread} newThread={callNewThread}
dispatch={dispatch} dispatch={dispatch}
dispatchActionPromise={dispatchActionPromise} dispatchActionPromise={dispatchActionPromise}
pushModal={modalContext.pushModal} pushModal={modalContext.pushModal}
sendCallbacks={sendCallbacks} sendCallbacks={sendCallbacks}
registerSendCallback={registerSendCallback} registerSendCallback={registerSendCallback}
unregisterSendCallback={unregisterSendCallback} unregisterSendCallback={unregisterSendCallback}
textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc} textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc}
/> />
); );
}); });
export default ConnectedInputStateContainer; export default ConnectedInputStateContainer;
View Options

web/types/redux-types.js

Loading...