Page MenuHomePhabricator
Differential D12786

[lib] Track progress of message processing
ClosedPublic
Actions

Authored by tomek on Jul 17 2024, 10:54 AM.
Tags
None
Referenced Files
Unknown Object (File)
Wed, Feb 26, 9:56 PM
Unknown Object (File)
Wed, Feb 26, 6:02 AM
Unknown Object (File)
Wed, Feb 26, 6:02 AM
Unknown Object (File)
Wed, Feb 26, 6:02 AM
Unknown Object (File)
Wed, Feb 26, 6:02 AM
Unknown Object (File)
Wed, Feb 26, 6:02 AM
Unknown Object (File)
Wed, Feb 26, 6:02 AM
Unknown Object (File)
Wed, Feb 26, 6:02 AM
View All Files
Subscribers
ashoat

Details

Reviewers
kamil
marcin
Commits
rCOMMd0b9971793b3: [lib] Track progress of message processing
Summary

Messages are scheduled using a function that returns a promise which is resolved after messages are sent.

https://linear.app/comm/issue/ENG-8674/track-progress-of-sending-tunnelbroker-messages

Depends on D12776

Test Plan

Tested on both native and web. Added some code

await this.props.p2p.sendDMOperation({
  op: {
    type: 'send_text_message',
    threadID: messageInfo.threadID,
    creatorID: messageInfo.creatorID,
    time: messageInfo.time,
    messageID: getUUID(),
    text: messageInfo.text,
  },
  supportsAutoRetry: false,
  recipients: 'self_devices',
});

to input state containers so that it is called after sending messages. Checked if the second device received a message after sending a text message.

Diff Detail

Repository
rCOMM Comm
Branch
dms (branched from palys-swm/dms)
Lint
No Lint Coverage
Unit
No Test Coverage

Event Timeline

tomek created this revision.Jul 17 2024, 10:54 AM
Herald added a subscriber: ashoat. · View Herald TranscriptJul 17 2024, 10:54 AM
tomek edited the summary of this revision. (Show Details)Jul 17 2024, 10:55 AM
Harbormaster completed remote builds in B30425: Diff 42397.Jul 17 2024, 11:11 AM
tomek requested review of this revision.Jul 17 2024, 11:11 AM
ashoat added a comment.Jul 17 2024, 12:57 PM

I wonder what the difference is between our terms "P2P messages" and "DM"s

I think "P2P messages" cover a superset of DMs – it's basically all client-to-client messages that are encrypted and passed via Tunnelbroker. Does that sound right? And is it consistent with our usage here?

tomek mentioned this in D12776: [lib] Generate P2P messages based on actions.Jul 18 2024, 5:22 AM
tomek added a comment.Jul 18 2024, 5:26 AM
In D12786#361905, @ashoat wrote:

I wonder what the difference is between our terms "P2P messages" and "DM"s

I think "P2P messages" cover a superset of DMs – it's basically all client-to-client messages that are encrypted and passed via Tunnelbroker. Does that sound right? And is it consistent with our usage here?

Yes, I agree - "P2P messages" cover a superset of DMs. What I'm describing here is sending P2P messages generated from a single DM operation. I'm going to review the naming and make sure it isn't confusing.

tomek updated this revision to Diff 42464.Jul 18 2024, 5:35 AM

Update naming

Harbormaster completed remote builds in B30465: Diff 42464.Jul 18 2024, 5:51 AM
tomek updated this revision to Diff 42467.Jul 18 2024, 6:53 AM

Allow processing DB ops with only p2p messages

tomek edited the test plan for this revision. (Show Details)Jul 18 2024, 6:57 AM
Harbormaster completed remote builds in B30468: Diff 42467.Jul 18 2024, 7:10 AM
kamil accepted this revision.Jul 18 2024, 7:18 AM

I think the usage of if and dmOpID can be improved and more descriptive, this might look confusing as we have plenty IDs all over the codebase - but I don't have idea about better ones

lib/tunnelbroker/peer-to-peer-context.js
10–11

can be merged

167

Shouldn't we reject with error (alternatively use mixed here)?

lib/types/dm-ops.js
100

I think is better for readability but up to you

web/shared-worker/utils/store.js
227

Happy you fixed this one

This revision is now accepted and ready to land.Jul 18 2024, 7:18 AM
tomek marked 4 inline comments as done.Jul 26 2024, 6:48 AM
In D12786#362267, @kamil wrote:

I think the usage of if and dmOpID can be improved and more descriptive, this might look confusing as we have plenty IDs all over the codebase - but I don't have idea about better ones

Makes sense. In fact id and dmOpID are the same ID.

tomek updated this revision to Diff 42838.Jul 26 2024, 6:48 AM

Rebase and improve naming

tomek updated this revision to Diff 42839.Jul 26 2024, 6:49 AM

Use UUID v4

Harbormaster completed remote builds in B30715: Diff 42838.Jul 26 2024, 7:14 AM
Harbormaster completed remote builds in B30716: Diff 42839.Jul 26 2024, 7:22 AM
Closed by commit rCOMMd0b9971793b3: [lib] Track progress of message processing (authored by tomek). · Explain WhyJul 26 2024, 8:42 AM
This revision was automatically updated to reflect the committed changes.
tomek mentioned this in rCOMMda886a2548bb: [lib] Generate P2P messages based on actions.
tomek added a commit: rCOMMd0b9971793b3: [lib] Track progress of message processing.

Revision Contents
Changeset List

PathSize
lib/
handlers/
4 lines
reducers/
12 lines
tunnelbroker/
79 lines
types/
1 line
7 lines
4 lines
web/
shared-worker/
utils/
3 lines

Diff 42467

View Options

lib/handlers/db-ops-handler.react.js

// @flow // @flow
import classNames from 'classnames'; import classNames from 'classnames';
import * as React from 'react'; import * as React from 'react';
import { import useToggleUnreadStatus from 'lib/hooks/toggle-unread-status';
setThreadUnreadStatusActionTypes,
setThreadUnreadStatus,
} from 'lib/actions/activity-actions';
import type {
SetThreadUnreadStatusPayload,
SetThreadUnreadStatusRequest,
} from 'lib/types/activity-types';
import type { ThreadInfo } from 'lib/types/thread-types'; import type { ThreadInfo } from 'lib/types/thread-types';
import {
useServerCall,
useDispatchActionPromise,
} from 'lib/utils/action-utils';
import SWMansionIcon from '../SWMansionIcon.react'; import SWMansionIcon from '../SWMansionIcon.react';
import css from './chat-thread-list.css'; import css from './chat-thread-list.css';
type Props = { type Props = {
+threadInfo: ThreadInfo, +threadInfo: ThreadInfo,
+mostRecentNonLocalMessage: ?string, +mostRecentNonLocalMessage: ?string,
+renderStyle?: 'chat' | 'thread', +renderStyle?: 'chat' | 'thread',
}; };
function ChatThreadListItemMenu(props: Props): React.Node { function ChatThreadListItemMenu(props: Props): React.Node {
const { renderStyle = 'chat' } = props; const { renderStyle = 'chat' } = props;
const [menuVisible, setMenuVisible] = React.useState(false); const [menuVisible, setMenuVisible] = React.useState(false);
const toggleMenu = React.useCallback(() => { const toggleMenu = React.useCallback(() => {
setMenuVisible(!menuVisible); setMenuVisible(!menuVisible);
}, [menuVisible]); }, [menuVisible]);
const hideMenu = React.useCallback(() => { const hideMenu = React.useCallback(() => {
setMenuVisible(false); setMenuVisible(false);
}, []); }, []);
const { threadInfo, mostRecentNonLocalMessage } = props; const { threadInfo, mostRecentNonLocalMessage } = props;
const dispatchActionPromise = useDispatchActionPromise(); const toggleUnreadStatus = useToggleUnreadStatus(
const boundSetThreadUnreadStatus: (
request: SetThreadUnreadStatusRequest,
) => Promise<SetThreadUnreadStatusPayload> = useServerCall(
setThreadUnreadStatus,
);
const toggleUnreadStatus = React.useCallback(() => {
const { unread } = threadInfo.currentUser;
const request = {
threadID: threadInfo.id,
unread: !unread,
latestMessage: mostRecentNonLocalMessage,
};
dispatchActionPromise(
setThreadUnreadStatusActionTypes,
boundSetThreadUnreadStatus(request),
undefined,
{
threadID: threadInfo.id,
unread: !unread,
},
);
hideMenu();
}, [
threadInfo, threadInfo,
mostRecentNonLocalMessage, mostRecentNonLocalMessage,
dispatchActionPromise,
hideMenu, hideMenu,
boundSetThreadUnreadStatus, );
]);
const toggleUnreadStatusButtonText = `Mark as ${ const toggleUnreadStatusButtonText = `Mark as ${
threadInfo.currentUser.unread ? 'read' : 'unread' threadInfo.currentUser.unread ? 'read' : 'unread'
}`; }`;
const menuIconSize = renderStyle === 'chat' ? 24 : 16; const menuIconSize = renderStyle === 'chat' ? 24 : 16;
const btnCls = classNames(css.menuContent, { const btnCls = classNames(css.menuContent, {
[css.menuContentVisible]: menuVisible, [css.menuContentVisible]: menuVisible,
}); });
Show All 15 Lines
View Options

lib/reducers/db-ops-reducer.js

// @flow // @flow
import classNames from 'classnames'; import classNames from 'classnames';
import * as React from 'react'; import * as React from 'react';
import { import useToggleUnreadStatus from 'lib/hooks/toggle-unread-status';
setThreadUnreadStatusActionTypes,
setThreadUnreadStatus,
} from 'lib/actions/activity-actions';
import type {
SetThreadUnreadStatusPayload,
SetThreadUnreadStatusRequest,
} from 'lib/types/activity-types';
import type { ThreadInfo } from 'lib/types/thread-types'; import type { ThreadInfo } from 'lib/types/thread-types';
import {
useServerCall,
useDispatchActionPromise,
} from 'lib/utils/action-utils';
import SWMansionIcon from '../SWMansionIcon.react'; import SWMansionIcon from '../SWMansionIcon.react';
import css from './chat-thread-list.css'; import css from './chat-thread-list.css';
type Props = { type Props = {
+threadInfo: ThreadInfo, +threadInfo: ThreadInfo,
+mostRecentNonLocalMessage: ?string, +mostRecentNonLocalMessage: ?string,
+renderStyle?: 'chat' | 'thread', +renderStyle?: 'chat' | 'thread',
}; };
function ChatThreadListItemMenu(props: Props): React.Node { function ChatThreadListItemMenu(props: Props): React.Node {
const { renderStyle = 'chat' } = props; const { renderStyle = 'chat' } = props;
const [menuVisible, setMenuVisible] = React.useState(false); const [menuVisible, setMenuVisible] = React.useState(false);
const toggleMenu = React.useCallback(() => { const toggleMenu = React.useCallback(() => {
setMenuVisible(!menuVisible); setMenuVisible(!menuVisible);
}, [menuVisible]); }, [menuVisible]);
const hideMenu = React.useCallback(() => { const hideMenu = React.useCallback(() => {
setMenuVisible(false); setMenuVisible(false);
}, []); }, []);
const { threadInfo, mostRecentNonLocalMessage } = props; const { threadInfo, mostRecentNonLocalMessage } = props;
const dispatchActionPromise = useDispatchActionPromise(); const toggleUnreadStatus = useToggleUnreadStatus(
const boundSetThreadUnreadStatus: (
request: SetThreadUnreadStatusRequest,
) => Promise<SetThreadUnreadStatusPayload> = useServerCall(
setThreadUnreadStatus,
);
const toggleUnreadStatus = React.useCallback(() => {
const { unread } = threadInfo.currentUser;
const request = {
threadID: threadInfo.id,
unread: !unread,
latestMessage: mostRecentNonLocalMessage,
};
dispatchActionPromise(
setThreadUnreadStatusActionTypes,
boundSetThreadUnreadStatus(request),
undefined,
{
threadID: threadInfo.id,
unread: !unread,
},
);
hideMenu();
}, [
threadInfo, threadInfo,
mostRecentNonLocalMessage, mostRecentNonLocalMessage,
dispatchActionPromise,
hideMenu, hideMenu,
boundSetThreadUnreadStatus, );
]);
const toggleUnreadStatusButtonText = `Mark as ${ const toggleUnreadStatusButtonText = `Mark as ${
threadInfo.currentUser.unread ? 'read' : 'unread' threadInfo.currentUser.unread ? 'read' : 'unread'
}`; }`;
const menuIconSize = renderStyle === 'chat' ? 24 : 16; const menuIconSize = renderStyle === 'chat' ? 24 : 16;
const btnCls = classNames(css.menuContent, { const btnCls = classNames(css.menuContent, {
[css.menuContentVisible]: menuVisible, [css.menuContentVisible]: menuVisible,
}); });
Show All 15 Lines
View Options

lib/tunnelbroker/peer-to-peer-context.js

// @flow // @flow
import classNames from 'classnames'; import classNames from 'classnames';
import * as React from 'react'; import * as React from 'react';
import { import useToggleUnreadStatus from 'lib/hooks/toggle-unread-status';
setThreadUnreadStatusActionTypes,
setThreadUnreadStatus,
} from 'lib/actions/activity-actions';
import type {
SetThreadUnreadStatusPayload,
SetThreadUnreadStatusRequest,
} from 'lib/types/activity-types';
import type { ThreadInfo } from 'lib/types/thread-types'; import type { ThreadInfo } from 'lib/types/thread-types';
import {
useServerCall,
useDispatchActionPromise,
} from 'lib/utils/action-utils';
import SWMansionIcon from '../SWMansionIcon.react'; import SWMansionIcon from '../SWMansionIcon.react';
import css from './chat-thread-list.css'; import css from './chat-thread-list.css';
type Props = { type Props = {
+threadInfo: ThreadInfo, +threadInfo: ThreadInfo,
+mostRecentNonLocalMessage: ?string, +mostRecentNonLocalMessage: ?string,
+renderStyle?: 'chat' | 'thread', +renderStyle?: 'chat' | 'thread',
}; };
function ChatThreadListItemMenu(props: Props): React.Node { function ChatThreadListItemMenu(props: Props): React.Node {
const { renderStyle = 'chat' } = props; const { renderStyle = 'chat' } = props;
const [menuVisible, setMenuVisible] = React.useState(false); const [menuVisible, setMenuVisible] = React.useState(false);
const toggleMenu = React.useCallback(() => { const toggleMenu = React.useCallback(() => {
setMenuVisible(!menuVisible); setMenuVisible(!menuVisible);
}, [menuVisible]); }, [menuVisible]);
const hideMenu = React.useCallback(() => { const hideMenu = React.useCallback(() => {
setMenuVisible(false); setMenuVisible(false);
}, []); }, []);
const { threadInfo, mostRecentNonLocalMessage } = props; const { threadInfo, mostRecentNonLocalMessage } = props;
const dispatchActionPromise = useDispatchActionPromise(); const toggleUnreadStatus = useToggleUnreadStatus(
const boundSetThreadUnreadStatus: (
request: SetThreadUnreadStatusRequest,
) => Promise<SetThreadUnreadStatusPayload> = useServerCall(
setThreadUnreadStatus,
);
const toggleUnreadStatus = React.useCallback(() => {
const { unread } = threadInfo.currentUser;
const request = {
threadID: threadInfo.id,
unread: !unread,
latestMessage: mostRecentNonLocalMessage,
};
dispatchActionPromise(
setThreadUnreadStatusActionTypes,
boundSetThreadUnreadStatus(request),
undefined,
{
threadID: threadInfo.id,
unread: !unread,
},
);
hideMenu();
}, [
threadInfo, threadInfo,
mostRecentNonLocalMessage, mostRecentNonLocalMessage,
dispatchActionPromise,
hideMenu, hideMenu,
boundSetThreadUnreadStatus, );
]);
const toggleUnreadStatusButtonText = `Mark as ${ const toggleUnreadStatusButtonText = `Mark as ${
threadInfo.currentUser.unread ? 'read' : 'unread' threadInfo.currentUser.unread ? 'read' : 'unread'
}`; }`;
const menuIconSize = renderStyle === 'chat' ? 24 : 16; const menuIconSize = renderStyle === 'chat' ? 24 : 16;
const btnCls = classNames(css.menuContent, { const btnCls = classNames(css.menuContent, {
[css.menuContentVisible]: menuVisible, [css.menuContentVisible]: menuVisible,
}); });
Show All 15 Lines
View Options

lib/types/db-ops-types.js

// @flow // @flow
import classNames from 'classnames'; import classNames from 'classnames';
import * as React from 'react'; import * as React from 'react';
import { import useToggleUnreadStatus from 'lib/hooks/toggle-unread-status';
setThreadUnreadStatusActionTypes,
setThreadUnreadStatus,
} from 'lib/actions/activity-actions';
import type {
SetThreadUnreadStatusPayload,
SetThreadUnreadStatusRequest,
} from 'lib/types/activity-types';
import type { ThreadInfo } from 'lib/types/thread-types'; import type { ThreadInfo } from 'lib/types/thread-types';
import {
useServerCall,
useDispatchActionPromise,
} from 'lib/utils/action-utils';
import SWMansionIcon from '../SWMansionIcon.react'; import SWMansionIcon from '../SWMansionIcon.react';
import css from './chat-thread-list.css'; import css from './chat-thread-list.css';
type Props = { type Props = {
+threadInfo: ThreadInfo, +threadInfo: ThreadInfo,
+mostRecentNonLocalMessage: ?string, +mostRecentNonLocalMessage: ?string,
+renderStyle?: 'chat' | 'thread', +renderStyle?: 'chat' | 'thread',
}; };
function ChatThreadListItemMenu(props: Props): React.Node { function ChatThreadListItemMenu(props: Props): React.Node {
const { renderStyle = 'chat' } = props; const { renderStyle = 'chat' } = props;
const [menuVisible, setMenuVisible] = React.useState(false); const [menuVisible, setMenuVisible] = React.useState(false);
const toggleMenu = React.useCallback(() => { const toggleMenu = React.useCallback(() => {
setMenuVisible(!menuVisible); setMenuVisible(!menuVisible);
}, [menuVisible]); }, [menuVisible]);
const hideMenu = React.useCallback(() => { const hideMenu = React.useCallback(() => {
setMenuVisible(false); setMenuVisible(false);
}, []); }, []);
const { threadInfo, mostRecentNonLocalMessage } = props; const { threadInfo, mostRecentNonLocalMessage } = props;
const dispatchActionPromise = useDispatchActionPromise(); const toggleUnreadStatus = useToggleUnreadStatus(
const boundSetThreadUnreadStatus: (
request: SetThreadUnreadStatusRequest,
) => Promise<SetThreadUnreadStatusPayload> = useServerCall(
setThreadUnreadStatus,
);
const toggleUnreadStatus = React.useCallback(() => {
const { unread } = threadInfo.currentUser;
const request = {
threadID: threadInfo.id,
unread: !unread,
latestMessage: mostRecentNonLocalMessage,
};
dispatchActionPromise(
setThreadUnreadStatusActionTypes,
boundSetThreadUnreadStatus(request),
undefined,
{
threadID: threadInfo.id,
unread: !unread,
},
);
hideMenu();
}, [
threadInfo, threadInfo,
mostRecentNonLocalMessage, mostRecentNonLocalMessage,
dispatchActionPromise,
hideMenu, hideMenu,
boundSetThreadUnreadStatus, );
]);
const toggleUnreadStatusButtonText = `Mark as ${ const toggleUnreadStatusButtonText = `Mark as ${
threadInfo.currentUser.unread ? 'read' : 'unread' threadInfo.currentUser.unread ? 'read' : 'unread'
}`; }`;
const menuIconSize = renderStyle === 'chat' ? 24 : 16; const menuIconSize = renderStyle === 'chat' ? 24 : 16;
const btnCls = classNames(css.menuContent, { const btnCls = classNames(css.menuContent, {
[css.menuContentVisible]: menuVisible, [css.menuContentVisible]: menuVisible,
}); });
Show All 15 Lines
View Options

lib/types/dm-ops.js

Loading...
View Options

lib/types/redux-types.js

Loading...
View Options

web/shared-worker/utils/store.js

Loading...