Page MenuHomePhabricator
Differential D11980

[web] Replace `threadInChatList` with `useThreadsInChatList` in `SidebarsModal`
ClosedPublic
Actions

Authored by atul on May 9 2024, 2:08 PM.
Tags
None
Referenced Files
Unknown Object (File)
Sun, Mar 2, 1:18 PM
Unknown Object (File)
Wed, Feb 26, 8:53 PM
Unknown Object (File)
Wed, Feb 26, 2:21 AM
Unknown Object (File)
Wed, Feb 26, 2:06 AM
Unknown Object (File)
Mon, Feb 24, 9:28 AM
Unknown Object (File)
Jan 24 2025, 8:18 PM
Unknown Object (File)
Jan 24 2025, 5:59 AM
Unknown Object (File)
Jan 24 2025, 5:59 AM
View All Files
Subscribers
None

Details

Reviewers
ashoat
ginsu
tomek
varun
Commits
rCOMM9789033fdcb4: [web] Replace `threadInChatList` with `useThreadsInChatList` in `SidebarsModal`
Summary

Part of replacing threadInChatList with useThread[s]InChatList hooks, which in turn is part of replacing threadHasPermission with the useThreadHasPermission hook.

Depends on D11950

Test Plan

flow + close reading

Add log statements to SidebarsModal on web and ensure that threadInChatList and useThreadsInChatList return same results.

Diff Detail

Repository
rCOMM Comm
Lint
No Lint Coverage
Unit
No Test Coverage

Revision Contents
Changeset List

PathSize
web/
modals/
threads/
sidebars/
21 lines

Diff 40191

View Options

web/modals/threads/sidebars/sidebars-modal.react.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 * as React from 'react'; import * as React from 'react';
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import uuid from 'uuid';
import type { import type {
LegacySendMultimediaMessageInput, LegacySendMultimediaMessageInput,
SendTextMessageInput, SendTextMessageInput,
} from 'lib/actions/message-actions.js'; } from 'lib/actions/message-actions.js';
import { import {
createLocalMessageActionType, createLocalMessageActionType,
sendMultimediaMessageActionTypes, sendMultimediaMessageActionTypes,
Show All 17 Linesimport {
type PushModal, type PushModal,
useModalContext, useModalContext,
} 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 { useLegacyAshoatKeyserverCall } from 'lib/keyserver-conn/legacy-keyserver-call.js'; import { useLegacyAshoatKeyserverCall } from 'lib/keyserver-conn/legacy-keyserver-call.js';
import { getNextLocalUploadID } from 'lib/media/media-utils.js'; import { getNextLocalUploadID } from 'lib/media/media-utils.js';
import { pendingToRealizedThreadIDsSelector } from 'lib/selectors/thread-selectors.js'; import { pendingToRealizedThreadIDsSelector } from 'lib/selectors/thread-selectors.js';
import {
dmOperationSpecificationTypes,
type OutboundDMOperationSpecification,
} from 'lib/shared/dm-ops/dm-op-utils.js';
import { useProcessAndSendDMOperation } from 'lib/shared/dm-ops/process-dm-ops.js';
import { IdentityClientContext } from 'lib/shared/identity-client-context.js'; import { IdentityClientContext } from 'lib/shared/identity-client-context.js';
import type { IdentityClientContextType } from 'lib/shared/identity-client-context.js'; import type { IdentityClientContextType } from 'lib/shared/identity-client-context.js';
import { import {
createMediaMessageInfo, createMediaMessageInfo,
localIDPrefix, localIDPrefix,
useMessageCreationSideEffectsFunc, useMessageCreationSideEffectsFunc,
getNextLocalID, getNextLocalID,
} from 'lib/shared/message-utils.js'; } from 'lib/shared/message-utils.js';
Show All 22 Linesimport {
type SendMessageResult, type SendMessageResult,
} from 'lib/types/message-types.js'; } from 'lib/types/message-types.js';
import type { RawImagesMessageInfo } from 'lib/types/messages/images.js'; import type { RawImagesMessageInfo } from 'lib/types/messages/images.js';
import type { RawMediaMessageInfo } from 'lib/types/messages/media.js'; import type { RawMediaMessageInfo } from 'lib/types/messages/media.js';
import type { RawTextMessageInfo } from 'lib/types/messages/text.js'; import type { RawTextMessageInfo } from 'lib/types/messages/text.js';
import type { ThreadInfo } from 'lib/types/minimally-encoded-thread-permissions-types.js'; import type { ThreadInfo } from 'lib/types/minimally-encoded-thread-permissions-types.js';
import type { Dispatch } from 'lib/types/redux-types.js'; import type { Dispatch } from 'lib/types/redux-types.js';
import { reportTypes } from 'lib/types/report-types.js'; import { reportTypes } from 'lib/types/report-types.js';
import { threadTypeIsSidebar } from 'lib/types/thread-types-enum.js'; import {
threadTypeIsSidebar,
threadTypeIsThick,
} from 'lib/types/thread-types-enum.js';
import { import {
type ClientNewThinThreadRequest, type ClientNewThinThreadRequest,
type NewThreadResult, type NewThreadResult,
} from 'lib/types/thread-types.js'; } from 'lib/types/thread-types.js';
import { import {
blobHashFromBlobServiceURI, blobHashFromBlobServiceURI,
isBlobServiceURI, isBlobServiceURI,
makeBlobServiceEndpointURL, makeBlobServiceEndpointURL,
▲ Show 20 Lines • Show All 52 Lines • ▼ Show 20 Lines +uploadMultimedia: (
callbacks: MultimediaUploadCallbacks, callbacks: MultimediaUploadCallbacks,
) => Promise<UploadMultimediaResult>, ) => Promise<UploadMultimediaResult>,
+blobServiceUpload: BlobServiceUploadAction, +blobServiceUpload: BlobServiceUploadAction,
+deleteUpload: (input: DeleteUploadInput) => Promise<void>, +deleteUpload: (input: DeleteUploadInput) => Promise<void>,
+sendMultimediaMessage: ( +sendMultimediaMessage: (
input: LegacySendMultimediaMessageInput, input: LegacySendMultimediaMessageInput,
) => Promise<SendMessageResult>, ) => Promise<SendMessageResult>,
+sendTextMessage: (input: SendTextMessageInput) => Promise<SendMessageResult>, +sendTextMessage: (input: SendTextMessageInput) => Promise<SendMessageResult>,
+processAndSendDMOperation: (
dmOperationSpecification: OutboundDMOperationSpecification,
) => Promise<void>,
+newThinThread: ( +newThinThread: (
request: ClientNewThinThreadRequest, request: ClientNewThinThreadRequest,
) => Promise<NewThreadResult>, ) => Promise<NewThreadResult>,
+pushModal: PushModal, +pushModal: PushModal,
+sendCallbacks: $ReadOnlyArray<() => mixed>, +sendCallbacks: $ReadOnlyArray<() => mixed>,
+registerSendCallback: (() => mixed) => void, +registerSendCallback: (() => mixed) => void,
+unregisterSendCallback: (() => mixed) => void, +unregisterSendCallback: (() => mixed) => void,
+textMessageCreationSideEffectsFunc: CreationSideEffectsFunc<RawTextMessageInfo>, +textMessageCreationSideEffectsFunc: CreationSideEffectsFunc<RawTextMessageInfo>,
▲ Show 20 Lines • Show All 1,103 Lines • ▼ Show 20 Lines
async sendTextMessage( async sendTextMessage(
messageInfo: RawTextMessageInfo, messageInfo: RawTextMessageInfo,
inputThreadInfo: ThreadInfo, inputThreadInfo: ThreadInfo,
parentThreadInfo: ?ThreadInfo, parentThreadInfo: ?ThreadInfo,
) { ) {
this.props.sendCallbacks.forEach(callback => callback()); this.props.sendCallbacks.forEach(callback => callback());
// TODO: this should be update according to thread creation logic
// (ENG-8567)
if (threadTypeIsThick(inputThreadInfo.type)) {
const recipientIDs = inputThreadInfo.members.map(member => member.id);
void this.props.processAndSendDMOperation({
type: dmOperationSpecificationTypes.OUTBOUND,
op: {
type: 'send_text_message',
threadID: inputThreadInfo.id,
creatorID: messageInfo.creatorID,
time: Date.now(),
messageID: uuid.v4(),
text: messageInfo.text,
},
recipients: {
type: 'some_users',
userIDs: recipientIDs,
},
});
return;
}
const { localID } = messageInfo; const { localID } = messageInfo;
invariant( invariant(
localID !== null && localID !== undefined, localID !== null && localID !== undefined,
'localID should be set', 'localID should be set',
); );
if (threadIsPendingSidebar(inputThreadInfo.id)) { if (threadIsPendingSidebar(inputThreadInfo.id)) {
this.pendingSidebarCreationMessageLocalIDs.add(localID); this.pendingSidebarCreationMessageLocalIDs.add(localID);
} }
▲ Show 20 Lines • Show All 394 Lines • ▼ Show 20 Lines React.memo<BaseProps>(function ConnectedInputStateContainer(props) {
const callDeleteUpload = useDeleteUpload(); const callDeleteUpload = useDeleteUpload();
const callSendMultimediaMessage = useLegacySendMultimediaMessage(); const callSendMultimediaMessage = useLegacySendMultimediaMessage();
const callSendTextMessage = useSendTextMessage(); const callSendTextMessage = useSendTextMessage();
const callNewThinThread = useNewThinThread(); const callNewThinThread = useNewThinThread();
const dispatch = useDispatch(); const dispatch = useDispatch();
const dispatchActionPromise = useDispatchActionPromise(); const dispatchActionPromise = useDispatchActionPromise();
const modalContext = useModalContext(); const modalContext = useModalContext();
const identityContext = React.useContext(IdentityClientContext); const identityContext = React.useContext(IdentityClientContext);
const processAndSendDMOperation = useProcessAndSendDMOperation();
const [sendCallbacks, setSendCallbacks] = React.useState< const [sendCallbacks, setSendCallbacks] = React.useState<
$ReadOnlyArray<() => mixed>, $ReadOnlyArray<() => mixed>,
>([]); >([]);
const registerSendCallback = React.useCallback((callback: () => mixed) => { const registerSendCallback = React.useCallback((callback: () => mixed) => {
setSendCallbacks(prevCallbacks => [...prevCallbacks, callback]); setSendCallbacks(prevCallbacks => [...prevCallbacks, callback]);
}, []); }, []);
const unregisterSendCallback = React.useCallback( const unregisterSendCallback = React.useCallback(
Show All 16 Lines return (
messageStoreMessages={messageStoreMessages} messageStoreMessages={messageStoreMessages}
pendingRealizedThreadIDs={pendingToRealizedThreadIDs} pendingRealizedThreadIDs={pendingToRealizedThreadIDs}
calendarQuery={calendarQuery} calendarQuery={calendarQuery}
uploadMultimedia={callUploadMultimedia} uploadMultimedia={callUploadMultimedia}
blobServiceUpload={callBlobServiceUpload} blobServiceUpload={callBlobServiceUpload}
deleteUpload={callDeleteUpload} deleteUpload={callDeleteUpload}
sendMultimediaMessage={callSendMultimediaMessage} sendMultimediaMessage={callSendMultimediaMessage}
sendTextMessage={callSendTextMessage} sendTextMessage={callSendTextMessage}
processAndSendDMOperation={processAndSendDMOperation}
newThinThread={callNewThinThread} newThinThread={callNewThinThread}
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}
identityContext={identityContext} identityContext={identityContext}
/> />
); );
}); });
export default ConnectedInputStateContainer; export default ConnectedInputStateContainer;