Page MenuHomePhabricator
Differential D7559

[native] Handle error state when joining a community
ClosedPublic
Actions

Authored by tomek on Apr 21 2023, 4:06 AM.
Tags
None
Referenced Files
Unknown Object (File)
Sat, Apr 19, 8:42 AM
Unknown Object (File)
Sat, Apr 19, 7:29 AM
Unknown Object (File)
Sat, Apr 19, 1:55 AM
Unknown Object (File)
Fri, Apr 18, 11:13 PM
Unknown Object (File)
Fri, Apr 18, 9:37 PM
Unknown Object (File)
Thu, Apr 17, 11:33 PM
Unknown Object (File)
Fri, Mar 28, 7:28 PM
Unknown Object (File)
Mar 26 2025, 6:16 AM
View All Files
Subscribers
ashoat
atul

Details

Reviewers
bartek
kamil
inka
Commits
rCOMMecb0feb66ee3: [native] Handle error state when joining a community
Summary

When an error occurs, we're updating the params to let the user know that the link is invalid. This isn't ideal, as the error might be caused by e.g. a timeout and a link is still valid, but it is by far the simplest solution.

Depends on D7558

Test Plan

Introduce a sleep on server side and the throw. Check if the error state becomes enabled.

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

tomek created this revision.Apr 21 2023, 4:06 AM
Herald added subscribers: atul, ashoat. · View Herald TranscriptApr 21 2023, 4:06 AM
tomek edited the summary of this revision. (Show Details)Apr 21 2023, 4:07 AM
tomek updated this revision to Diff 25513.Apr 21 2023, 4:09 AM

Rethrow

Harbormaster completed remote builds in B18622: Diff 25512.Apr 21 2023, 4:24 AM
Harbormaster completed remote builds in B18623: Diff 25513.
tomek requested review of this revision.Apr 21 2023, 4:26 AM
bartek added inline comments.Apr 24 2023, 8:41 PM
native/navigation/invite-link-modal.react.js
106 ↗(On Diff #25513)

Where this rethrow is caught?

ashoat added inline comments.Apr 25 2023, 3:52 AM
native/navigation/invite-link-modal.react.js
106 ↗(On Diff #25513)

Since it is dispatched by dispatchActionPromise, it gets caught here: https://github.com/CommE2E/comm/blob/master/lib/utils/action-utils.js#L88

bartek accepted this revision.Apr 25 2023, 4:20 AM
bartek added inline comments.
native/navigation/invite-link-modal.react.js
106 ↗(On Diff #25513)

Ah right, I missed the dispatchActionPromise, thanks for the explanation!

This revision is now accepted and ready to land.Apr 25 2023, 4:20 AM
tomek updated this revision to Diff 25779.Apr 26 2023, 12:53 PM

Rebase

Harbormaster completed remote builds in B18819: Diff 25779.Apr 26 2023, 1:11 PM
Closed by commit rCOMMecb0feb66ee3: [native] Handle error state when joining a community (authored by tomek). · Explain WhyApr 27 2023, 7:15 AM
This revision was automatically updated to reflect the committed changes.
tomek added a commit: rCOMMecb0feb66ee3: [native] Handle error state when joining a community.

Revision Contents
Changeset List

PathSize
native/
navigation/
38 lines

Diff 25843

View Options

native/navigation/invite-link-modal.react.js

// @flow // @flow
import * as FileSystem from 'expo-file-system'; import * as FileSystem from 'expo-file-system';
import invariant from 'invariant'; import invariant from 'invariant';
import * as React from 'react'; import * as React from 'react';
import { Platform } from 'react-native'; import { Platform } from 'react-native';
import { useDispatch } from 'react-redux'; import { useDispatch } from 'react-redux';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import * as uuid from 'uuid';
import { import {
createLocalMessageActionType, createLocalMessageActionType,
sendMultimediaMessageActionTypes, sendMultimediaMessageActionTypes,
sendMultimediaMessage, sendMultimediaMessage,
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,
blobServiceUpload,
type MultimediaUploadCallbacks, type MultimediaUploadCallbacks,
type MultimediaUploadExtras, type MultimediaUploadExtras,
type BlobServiceUploadAction,
} from 'lib/actions/upload-actions.js'; } from 'lib/actions/upload-actions.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 { pathFromURI, replaceExtension } from 'lib/media/file-utils.js'; import { pathFromURI, replaceExtension } from 'lib/media/file-utils.js';
import { import {
isLocalUploadID, isLocalUploadID,
getNextLocalUploadID, getNextLocalUploadID,
} from 'lib/media/media-utils.js'; } from 'lib/media/media-utils.js';
import { videoDurationLimit } from 'lib/media/video-utils.js'; import { videoDurationLimit } from 'lib/media/video-utils.js';
import { import {
Show All 10 Linesimport {
createRealThreadFromPendingThread, createRealThreadFromPendingThread,
threadIsPending, threadIsPending,
threadIsPendingSidebar, threadIsPendingSidebar,
patchThreadInfoToIncludeMentionedMembersOfParent, patchThreadInfoToIncludeMentionedMembersOfParent,
threadInfoInsideCommunity, threadInfoInsideCommunity,
} from 'lib/shared/thread-utils.js'; } from 'lib/shared/thread-utils.js';
import type { CalendarQuery } from 'lib/types/entry-types.js'; import type { CalendarQuery } from 'lib/types/entry-types.js';
import type { import type {
Dimensions,
UploadMultimediaResult, UploadMultimediaResult,
Media, Media,
NativeMediaSelection, NativeMediaSelection,
MediaMissionResult, MediaMissionResult,
MediaMission, MediaMission,
UploadMediaMetadataRequest, UploadMediaMetadataRequest,
} 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';
Show All 21 Linesimport {
type NewThreadResult, type NewThreadResult,
type ThreadInfo, type ThreadInfo,
} 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 { makeBlobServiceEndpointURL } from 'lib/utils/blob-service.js';
import type { import type {
CallServerEndpointOptions, CallServerEndpointOptions,
CallServerEndpointResponse, CallServerEndpointResponse,
} from 'lib/utils/call-server-endpoint.js'; } 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 { values } from 'lib/utils/objects.js'; import { values } from 'lib/utils/objects.js';
import { import {
generateReportID, generateReportID,
useIsReportEnabled, useIsReportEnabled,
} from 'lib/utils/report-utils.js'; } from 'lib/utils/report-utils.js';
import { handleHTTPResponseError } from 'lib/utils/services-utils.js';
import { import {
type EditInputBarMessageParameters, type EditInputBarMessageParameters,
InputStateContext, InputStateContext,
type PendingMultimediaUploads, type PendingMultimediaUploads,
type MultimediaProcessingStep, type MultimediaProcessingStep,
} from './input-state.js'; } from './input-state.js';
import { encryptMedia } from '../media/encryption-utils.js'; import { encryptMedia } from '../media/encryption-utils.js';
import { disposeTempFile } from '../media/file-utils.js'; import { disposeTempFile } from '../media/file-utils.js';
import { processMedia } from '../media/media-utils.js'; import { processMedia } from '../media/media-utils.js';
import { displayActionResultModal } from '../navigation/action-result-modal.js'; import { displayActionResultModal } from '../navigation/action-result-modal.js';
import { useCalendarQuery } from '../navigation/nav-selectors.js'; import { useCalendarQuery } from '../navigation/nav-selectors.js';
import { useSelector } from '../redux/redux-utils.js'; import { useSelector } from '../redux/redux-utils.js';
import blobServiceUploadHandler from '../utils/blob-service-upload.js';
import { useStaffCanSee } from '../utils/staff-utils.js'; import { useStaffCanSee } from '../utils/staff-utils.js';
type MediaIDs = type MediaIDs =
| { +type: 'photo', +localMediaID: string } | { +type: 'photo', +localMediaID: string }
| { +type: 'video', +localMediaID: string, +localThumbnailID: string }; | { +type: 'video', +localMediaID: string, +localThumbnailID: string };
type UploadFileInput = { type UploadFileInput = {
+selection: NativeMediaSelection, +selection: NativeMediaSelection,
+ids: MediaIDs, +ids: MediaIDs,
Show All 18 Linestype Props = {
+uploadMultimedia: ( +uploadMultimedia: (
multimedia: Object, multimedia: Object,
extras: MultimediaUploadExtras, extras: MultimediaUploadExtras,
callbacks: MultimediaUploadCallbacks, callbacks: MultimediaUploadCallbacks,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+uploadMediaMetadata: ( +uploadMediaMetadata: (
input: UploadMediaMetadataRequest, input: UploadMediaMetadataRequest,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+blobServiceUpload: BlobServiceUploadAction,
+sendMultimediaMessage: ( +sendMultimediaMessage: (
threadID: string, threadID: string,
localID: string, localID: string,
mediaMessageContents: $ReadOnlyArray<MediaMessageServerDBContent>, mediaMessageContents: $ReadOnlyArray<MediaMessageServerDBContent>,
sidebarCreation?: boolean, sidebarCreation?: boolean,
) => Promise<SendMessageResult>, ) => Promise<SendMessageResult>,
+sendTextMessage: ( +sendTextMessage: (
threadID: string, threadID: string,
▲ Show 20 Lines • Show All 669 Lines • ▼ Show 20 Lines ): Promise<?string> {
try { try {
const uploadPromises = []; const uploadPromises = [];
if ( if (
this.useBlobServiceUploads && this.useBlobServiceUploads &&
(processedMedia.mediaType === 'encrypted_photo' || (processedMedia.mediaType === 'encrypted_photo' ||
processedMedia.mediaType === 'encrypted_video') processedMedia.mediaType === 'encrypted_video')
) { ) {
uploadPromises.push( uploadPromises.push(
this.blobServiceUpload( this.props.blobServiceUpload({
{ input: {
blobInput: {
type: 'uri',
uri: uploadURI, uri: uploadURI,
filename: filename, filename: filename,
mimeType: mime, mimeType: mime,
},
blobHash: processedMedia.blobHash, blobHash: processedMedia.blobHash,
encryptionKey: processedMedia.encryptionKey, encryptionKey: processedMedia.encryptionKey,
dimensions: processedMedia.dimensions, dimensions: processedMedia.dimensions,
thumbHash: thumbHash:
processedMedia.mediaType === 'encrypted_photo' processedMedia.mediaType === 'encrypted_photo'
? processedMedia.thumbHash ? processedMedia.thumbHash
: null, : null,
}, },
{ callbacks: {
blobServiceUploadHandler,
onProgress: (percent: number) => { onProgress: (percent: number) => {
this.setProgress( this.setProgress(
localMessageID, localMessageID,
localMediaID, localMediaID,
'uploading', 'uploading',
percent, percent,
); );
}, },
}, },
), }),
); );
if (processedMedia.mediaType === 'encrypted_video') { if (processedMedia.mediaType === 'encrypted_video') {
uploadPromises.push( uploadPromises.push(
this.blobServiceUpload({ this.props.blobServiceUpload({
input: {
blobInput: {
type: 'uri',
uri: processedMedia.uploadThumbnailURI, uri: processedMedia.uploadThumbnailURI,
filename: replaceExtension(`thumb${filename}`, 'jpg'), filename: replaceExtension(`thumb${filename}`, 'jpg'),
mimeType: 'image/jpeg', mimeType: 'image/jpeg',
},
blobHash: processedMedia.thumbnailBlobHash, blobHash: processedMedia.thumbnailBlobHash,
encryptionKey: processedMedia.thumbnailEncryptionKey, encryptionKey: processedMedia.thumbnailEncryptionKey,
loop: false, loop: false,
dimensions: processedMedia.dimensions, dimensions: processedMedia.dimensions,
thumbHash: processedMedia.thumbHash, thumbHash: processedMedia.thumbHash,
},
callbacks: {
blobServiceUploadHandler,
},
}), }),
); );
} }
[uploadResult, uploadThumbnailResult] = await Promise.all( [uploadResult, uploadThumbnailResult] = await Promise.all(
uploadPromises, uploadPromises,
); );
} else { } else {
uploadPromises.push( uploadPromises.push(
▲ Show 20 Lines • Show All 265 Lines • ▼ Show 20 Lines this.setState(prevState => {
pendingUploads: { pendingUploads: {
...prevState.pendingUploads, ...prevState.pendingUploads,
[localMessageID]: newPendingUploads, [localMessageID]: newPendingUploads,
}, },
}; };
}); });
} }
async blobServiceUpload(
input: {
+uri: string,
+filename: string,
+mimeType: string,
+blobHash: string,
+encryptionKey: string,
+dimensions: Dimensions,
+loop?: boolean,
+thumbHash: ?string,
},
options?: ?CallServerEndpointOptions,
): Promise<void> {
const newHolder = 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: newHolder,
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) {
let path = input.uri;
if (Platform.OS === 'android') {
const resolvedPath = pathFromURI(input.uri);
if (resolvedPath) {
path = resolvedPath;
}
}
const uploadEndpoint = blobService.httpEndpoints.UPLOAD_BLOB;
const { method } = uploadEndpoint;
const uploadTask = FileSystem.createUploadTask(
makeBlobServiceEndpointURL(uploadEndpoint),
path,
{
uploadType: FileSystem.FileSystemUploadType.MULTIPART,
fieldName: 'blob_data',
httpMethod: method,
parameters: { blob_hash: blobHash },
},
uploadProgress => {
if (options && options.onProgress) {
const { totalByteSent, totalBytesExpectedToSend } = uploadProgress;
options.onProgress(totalByteSent / totalBytesExpectedToSend);
}
},
);
if (options && options.abortHandler) {
options.abortHandler(() => uploadTask.cancelAsync());
}
try {
await uploadTask.uploadAsync();
} catch (e) {
throw new Error(
`Failed to upload blob: ${
getMessageForException(e) ?? 'unknown error'
}`,
);
}
}
// 3. Send upload metadata to the keyserver, return response
const { filename, mimeType, loop, dimensions, encryptionKey, thumbHash } =
input;
return await this.props.uploadMediaMetadata({
...dimensions,
filename,
mimeType,
blobHolder: newHolder,
blobHash,
encryptionKey,
loop: loop ?? false,
...(thumbHash ? { thumbHash } : null),
});
}
uploadBlob = async ( uploadBlob = async (
url: string, url: string,
cookie: ?string, cookie: ?string,
sessionID: ?string, sessionID: ?string,
input: { [key: string]: mixed }, input: { [key: string]: mixed },
options?: ?CallServerEndpointOptions, options?: ?CallServerEndpointOptions,
): Promise<CallServerEndpointResponse> => { ): Promise<CallServerEndpointResponse> => {
invariant( invariant(
▲ Show 20 Lines • Show All 522 Lines • ▼ Show 20 Lines const ongoingMessageCreation = useSelector(
mediaCreationLoadingStatusSelector(state), mediaCreationLoadingStatusSelector(state),
textCreationLoadingStatusSelector(state), textCreationLoadingStatusSelector(state),
) === 'loading', ) === 'loading',
); );
const hasWiFi = useSelector(state => state.connectivity.hasWiFi); const hasWiFi = useSelector(state => state.connectivity.hasWiFi);
const calendarQuery = useCalendarQuery(); const calendarQuery = useCalendarQuery();
const callUploadMultimedia = useServerCall(uploadMultimedia); const callUploadMultimedia = useServerCall(uploadMultimedia);
const callUploadMediaMetadata = useServerCall(uploadMediaMetadata); const callUploadMediaMetadata = useServerCall(uploadMediaMetadata);
const callBlobServiceUpload = useServerCall(blobServiceUpload);
const callSendMultimediaMessage = useServerCall(sendMultimediaMessage); const callSendMultimediaMessage = useServerCall(sendMultimediaMessage);
const callSendTextMessage = useServerCall(sendTextMessage); const callSendTextMessage = useServerCall(sendTextMessage);
const callNewThread = useServerCall(newThread); const callNewThread = useServerCall(newThread);
const dispatchActionPromise = useDispatchActionPromise(); const dispatchActionPromise = useDispatchActionPromise();
const dispatch = useDispatch(); const dispatch = useDispatch();
const mediaReportsEnabled = useIsReportEnabled('mediaReports'); const mediaReportsEnabled = useIsReportEnabled('mediaReports');
const staffCanSee = useStaffCanSee(); const staffCanSee = useStaffCanSee();
const textMessageCreationSideEffectsFunc = const textMessageCreationSideEffectsFunc =
useMessageCreationSideEffectsFunc(messageTypes.TEXT); useMessageCreationSideEffectsFunc(messageTypes.TEXT);
return ( return (
<InputStateContainer <InputStateContainer
{...props} {...props}
uploadMediaMetadata={callUploadMediaMetadata} uploadMediaMetadata={callUploadMediaMetadata}
viewerID={viewerID} viewerID={viewerID}
nextLocalID={nextLocalID} nextLocalID={nextLocalID}
messageStoreMessages={messageStoreMessages} messageStoreMessages={messageStoreMessages}
ongoingMessageCreation={ongoingMessageCreation} ongoingMessageCreation={ongoingMessageCreation}
hasWiFi={hasWiFi} hasWiFi={hasWiFi}
mediaReportsEnabled={mediaReportsEnabled} mediaReportsEnabled={mediaReportsEnabled}
calendarQuery={calendarQuery} calendarQuery={calendarQuery}
uploadMultimedia={callUploadMultimedia} uploadMultimedia={callUploadMultimedia}
blobServiceUpload={callBlobServiceUpload}
sendMultimediaMessage={callSendMultimediaMessage} sendMultimediaMessage={callSendMultimediaMessage}
sendTextMessage={callSendTextMessage} sendTextMessage={callSendTextMessage}
newThread={callNewThread} newThread={callNewThread}
dispatchActionPromise={dispatchActionPromise} dispatchActionPromise={dispatchActionPromise}
dispatch={dispatch} dispatch={dispatch}
staffCanSee={staffCanSee} staffCanSee={staffCanSee}
textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc} textMessageCreationSideEffectsFunc={textMessageCreationSideEffectsFunc}
/> />
); );
}); });
export default ConnectedInputStateContainer; export default ConnectedInputStateContainer;