Page MenuHomePhabricator
Differential D3939

[native] Make `ColorSelector` fully functional
ClosedPublic
Actions

Authored by • abosh on May 6 2022, 12:28 AM.
Tags
None
Referenced Files
Unknown Object (File)
Thu, Apr 24, 8:29 PM
Unknown Object (File)
Sun, Apr 20, 2:04 PM
Unknown Object (File)
Sun, Apr 20, 12:22 AM
Unknown Object (File)
Sun, Apr 20, 12:22 AM
Unknown Object (File)
Sat, Apr 19, 8:33 PM
Unknown Object (File)
Thu, Apr 17, 3:37 PM
Unknown Object (File)
Thu, Apr 17, 3:17 PM
Unknown Object (File)
Thu, Apr 17, 9:33 AM
View All Files
Subscribers
• adrian
ashoat
tomek

Details

Reviewers
atul
Commits
rCOMMb18185e5a9d7: [native] Make `ColorSelector` fully functional
Summary

Made ColorSelector fully functional: added onPress handling, save buttons for the thread color, and modified the ColorPickerModal height to fit the smaller size of ColorSelector (as opposed to ColorPicker).

Full context in Linear issue. Phasing out ColorPicker can be handled in a future diff. Depends on D3868.

Test Plan

Tested on iOS 15.4 and works as expected:

Diff Detail

Repository
rCOMM Comm
Branch
master
Lint
No Lint Coverage
Unit
No Test Coverage

Event Timeline

• abosh created this revision.May 6 2022, 12:28 AM
Herald added subscribers: • karol, • adrian, tomek, ashoat. · View Herald TranscriptMay 6 2022, 12:28 AM
• abosh edited the summary of this revision. (Show Details)May 6 2022, 12:30 AM
• abosh edited the test plan for this revision. (Show Details)
• abosh added 1 blocking reviewer(s): atul.
Harbormaster completed remote builds in B8833: Diff 12317.May 6 2022, 12:33 AM
• abosh requested review of this revision.May 6 2022, 12:33 AM
• abosh added inline comments.May 6 2022, 12:34 AM
native/chat/settings/color-picker-modal.react.js
58

This is the only change made in ColorPickerModal because it reflects the smaller modal size in the video in the Test Plan.

native/components/color-selector.react.js
37

Opted to make the background color of the button change to the selected color (see in the video in the Test Plan). Currently on web, the button is either #404040 if disabled and purple if not. Not sure if we want to keep it that way (change on native to match web purple) or adopt this style, where the button background color changes based on the selected color.

My rationale was that the color splotch might not be big enough to see the true color, whereas the button provides a larger canvas that a user can use to see the color (with some text in front of it). Plus, it's a color selector — it can be colorful! 😆

• abosh edited the summary of this revision. (Show Details)May 6 2022, 8:47 AM
• abosh added a parent revision: D3868: [native] Add active state to `ColorSelector`.
• abosh added inline comments.May 6 2022, 8:49 AM
native/chat/settings/color-picker-modal.react.js
58

In the final commit, this won't be there because it'll break the current ColorPicker (since it doesn't fit in this new modal size). It's just included so you can see the new size that's in the video in the Test Plan. Not sure if this is the best practice or not, but wanted to include it for transparency.

• karol removed a subscriber: • karol.May 6 2022, 9:18 AM
atul requested changes to this revision.May 9 2022, 11:29 AM

Looks good at a high level, some questions/suggestions inline

native/chat/settings/color-picker-modal.react.js
58

Thanks for pointing this out. We want diffs to be exactly what we plan on landing so it's best to avoid "temporary" accommodating changes.

It's something you should still mention in the "Summary" section or by annotating a line(s) in the diff, but we usually don't want to leave in temporary code changes like this,

native/components/color-selector-button.react.js
10

We actually have a SetState<T> type in lib/types/hook-types.js that we'll want to use here. After importing that type we should have something like:

+setPendingColor: SetState<string>,
19–21

Nice job realizing that we want to memoize this function with the useCallback hook

native/components/color-selector.react.js
33–38

I think we can simplify the logic here:

const saveButtonStyle = React.useMemo(
  () => [
    styles.saveButton,
    { backgroundColor: !saveButtonDisabled ? `#${pendingColor}` : "#404040" },
  ],
  [saveButtonDisabled, pendingColor]
);
40

Should this be onColorSplotchSaved?

This revision now requires changes to proceed.May 9 2022, 11:29 AM
• abosh updated this revision to Diff 12564.May 11 2022, 9:42 AM
• abosh marked 5 inline comments as done.

Address inline feedback

Harbormaster completed remote builds in B9026: Diff 12564.May 11 2022, 10:33 AM
atul accepted this revision.May 12 2022, 8:18 AM

Looks good!

This revision is now accepted and ready to land.May 12 2022, 8:18 AM
Closed by commit rCOMMb18185e5a9d7: [native] Make `ColorSelector` fully functional (authored by • abosh). · Explain WhyMay 12 2022, 5:36 PM
This revision was automatically updated to reflect the committed changes.
• abosh added a commit: rCOMMb18185e5a9d7: [native] Make `ColorSelector` fully functional.
• abosh added a child revision: D4254: [web] Finish styling `ColorSelector` on iOS and Android.Jun 13 2022, 12:50 PM

Revision Contents
Changeset List

PathSize
native/
chat/
settings/
2 lines
components/
17 lines
52 lines

Diff 12317

View Options

native/chat/settings/color-picker-modal.react.js

// @flow // @flow
import invariant from 'invariant';
import { import {
setThreadUnreadStatusActionTypes, setThreadUnreadStatusActionTypes,
updateActivityActionTypes, updateActivityActionTypes,
} from '../actions/activity-actions.js'; } from '../actions/activity-actions.js';
import { setClientDBStoreActionType } from '../actions/client-db-store-actions.js'; import { setClientDBStoreActionType } from '../actions/client-db-store-actions.js';
import { saveMessagesActionType } from '../actions/message-actions.js'; import { saveMessagesActionType } from '../actions/message-actions.js';
import { siweAuthActionTypes } from '../actions/siwe-actions.js'; import { siweAuthActionTypes } from '../actions/siwe-actions.js';
import { import {
Show All 15 Linesimport {
updateSubscriptionActionTypes, updateSubscriptionActionTypes,
} from '../actions/user-actions.js'; } from '../actions/user-actions.js';
import { import {
type ThreadStoreOperation, type ThreadStoreOperation,
threadStoreOpsHandlers, threadStoreOpsHandlers,
} from '../ops/thread-store-ops.js'; } from '../ops/thread-store-ops.js';
import { stateSyncSpecs } from '../shared/state-sync/state-sync-specs.js'; import { stateSyncSpecs } from '../shared/state-sync/state-sync-specs.js';
import { updateSpecs } from '../shared/updates/update-specs.js'; import { updateSpecs } from '../shared/updates/update-specs.js';
import type { MinimallyEncodedRawThreadInfo } from '../types/minimally-encoded-thread-permissions-types.js';
import type { BaseAction } from '../types/redux-types.js'; import type { BaseAction } from '../types/redux-types.js';
import { type ClientThreadInconsistencyReportCreationRequest } from '../types/report-types.js'; import { type ClientThreadInconsistencyReportCreationRequest } from '../types/report-types.js';
import { import {
serverRequestTypes, serverRequestTypes,
processServerRequestsActionType, processServerRequestsActionType,
} from '../types/request-types.js'; } from '../types/request-types.js';
import { import {
fullStateSyncActionType, fullStateSyncActionType,
incrementalStateSyncActionType, incrementalStateSyncActionType,
} from '../types/socket-types.js'; } from '../types/socket-types.js';
import type { import type {
RawThreadInfo, MinimallyEncodedRawThreadInfos,
RawThreadInfos,
ThreadStore, ThreadStore,
} from '../types/thread-types.js'; } from '../types/thread-types.js';
import { import {
type ClientUpdateInfo, type ClientUpdateInfo,
processUpdatesActionType, processUpdatesActionType,
} from '../types/update-types.js'; } from '../types/update-types.js';
import { setNewSessionActionType } from '../utils/action-utils.js'; import { setNewSessionActionType } from '../utils/action-utils.js';
const { processStoreOperations: processThreadStoreOperations } = const { processStoreOperations: processThreadStoreOperations } =
threadStoreOpsHandlers; threadStoreOpsHandlers;
function generateOpsForThreadUpdates( function generateOpsForThreadUpdates(
threadInfos: RawThreadInfos, threadInfos: MinimallyEncodedRawThreadInfos,
payload: { payload: {
+updatesResult: { +newUpdates: $ReadOnlyArray<ClientUpdateInfo>, ... }, +updatesResult: { +newUpdates: $ReadOnlyArray<ClientUpdateInfo>, ... },
... ...
}, },
): $ReadOnlyArray<ThreadStoreOperation> { ): $ReadOnlyArray<ThreadStoreOperation> {
return payload.updatesResult.newUpdates return payload.updatesResult.newUpdates
.map(update => .map(update =>
updateSpecs[update.type].generateOpsForThreadUpdates?.( updateSpecs[update.type].generateOpsForThreadUpdates?.(
Show All 19 Lines if (
action.type === registerActionTypes.success || action.type === registerActionTypes.success ||
action.type === fullStateSyncActionType action.type === fullStateSyncActionType
) { ) {
const newThreadInfos = action.payload.threadInfos; const newThreadInfos = action.payload.threadInfos;
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'remove_all', type: 'remove_all',
}, },
...Object.keys(newThreadInfos).map((id: string) => ({ ...Object.keys(newThreadInfos).map((id: string) => {
invariant(
newThreadInfos[id].minimallyEncoded,
'newThreadInfos must be minimallyEncoded for current clients',
);
atulAuthorUnsubmitted
Done
Inline Actions

I thought putting an invariant here was a reasonable trade-off vs. refactoring the types in the fullStateSyncActionType payload (specifically StateSyncFullActionPayload which is derived from ClientFullStateSync which is derived from BaseFullStateSync) which are used across clients and keyserver.

Open to re-exploring if that would be preferred.

atul: I thought putting an `invariant` here was a reasonable trade-off vs. refactoring the types in…
return {
type: 'replace', type: 'replace',
payload: { id, threadInfo: newThreadInfos[id] }, payload: { id, threadInfo: newThreadInfos[id] },
})), };
}),
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
▲ Show 20 Lines • Show All 58 Lines • ▼ Show 20 Lines ) {
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
} else if (action.type === updateSubscriptionActionTypes.success) { } else if (action.type === updateSubscriptionActionTypes.success) {
const { threadID, subscription } = action.payload; const { threadID, subscription } = action.payload;
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
const newThreadInfo = {
...threadInfo,
currentUser: {
...threadInfo.currentUser,
subscription,
},
};
const threadStoreOperations = [
{
type: 'replace',
payload: {
id: threadID,
threadInfo: newThreadInfo,
},
},
];
const updatedThreadStore = processThreadStoreOperations(
state,
threadStoreOperations,
);
return {
threadStore: updatedThreadStore,
newThreadInconsistencies: [],
threadStoreOperations,
};
} else {
const newThreadInfo = { const newThreadInfo = {
...threadInfo, ...threadInfo,
currentUser: { currentUser: {
...threadInfo.currentUser, ...threadInfo.currentUser,
subscription, subscription,
}, },
}; };
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'replace', type: 'replace',
payload: { payload: {
id: threadID, id: threadID,
threadInfo: newThreadInfo, threadInfo: newThreadInfo,
}, },
}, },
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
}
} else if (action.type === saveMessagesActionType) { } else if (action.type === saveMessagesActionType) {
const threadIDToMostRecentTime = new Map<string, number>(); const threadIDToMostRecentTime = new Map<string, number>();
for (const messageInfo of action.payload.rawMessageInfos) { for (const messageInfo of action.payload.rawMessageInfos) {
const current = threadIDToMostRecentTime.get(messageInfo.threadID); const current = threadIDToMostRecentTime.get(messageInfo.threadID);
if (!current || current < messageInfo.time) { if (!current || current < messageInfo.time) {
threadIDToMostRecentTime.set(messageInfo.threadID, messageInfo.time); threadIDToMostRecentTime.set(messageInfo.threadID, messageInfo.time);
} }
} }
const changedThreadInfos: { [string]: RawThreadInfo } = {}; const changedThreadInfos: { [string]: MinimallyEncodedRawThreadInfo } = {};
for (const [threadID, mostRecentTime] of threadIDToMostRecentTime) { for (const [threadID, mostRecentTime] of threadIDToMostRecentTime) {
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
if ( if (
!threadInfo || !threadInfo ||
threadInfo.currentUser.unread || threadInfo.currentUser.unread ||
action.payload.updatesCurrentAsOf > mostRecentTime action.payload.updatesCurrentAsOf > mostRecentTime
) { ) {
continue; continue;
} }
const changedThreadInfo = state.threadInfos[threadID]; const changedThreadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (changedThreadInfo.minimallyEncoded) {
changedThreadInfos[threadID] = {
...changedThreadInfo,
currentUser: {
...changedThreadInfo.currentUser,
unread: true,
},
};
} else {
changedThreadInfos[threadID] = { changedThreadInfos[threadID] = {
...changedThreadInfo, ...changedThreadInfo,
currentUser: { currentUser: {
...changedThreadInfo.currentUser, ...changedThreadInfo.currentUser,
unread: true, unread: true,
}, },
}; };
} }
}
if (Object.keys(changedThreadInfos).length !== 0) { if (Object.keys(changedThreadInfos).length !== 0) {
const threadStoreOperations = Object.keys(changedThreadInfos).map(id => ({ const threadStoreOperations = Object.keys(changedThreadInfos).map(id => ({
type: 'replace', type: 'replace',
payload: { payload: {
id, id,
threadInfo: changedThreadInfos[id], threadInfo: changedThreadInfos[id],
}, },
})); }));
Show All 25 Lines if (!rawThreadInfos && !deleteThreadIDs) {
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
const threadStoreOperations: ThreadStoreOperation[] = []; const threadStoreOperations: ThreadStoreOperation[] = [];
if (rawThreadInfos) { if (rawThreadInfos) {
for (const rawThreadInfo of rawThreadInfos) { for (const rawThreadInfo of rawThreadInfos) {
invariant(
rawThreadInfo.minimallyEncoded,
'rawThreadInfo must be minimallyEncoded on new clients',
);
atulAuthorUnsubmitted
Done
Inline Actions

Similarly thought this was a reasonable trade-off to avoid having to refactor types related to state check mechanism.

Open to re-exploring if that would be preferred.

atul: Similarly thought this was a reasonable trade-off to avoid having to refactor types related to…
threadStoreOperations.push({ threadStoreOperations.push({
type: 'replace', type: 'replace',
payload: { payload: {
id: rawThreadInfo.id, id: rawThreadInfo.id,
threadInfo: rawThreadInfo, threadInfo: rawThreadInfo,
}, },
}); });
} }
Show All 20 Lines const newThreadInconsistencies =
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies, newThreadInconsistencies,
threadStoreOperations, threadStoreOperations,
}; };
} else if (action.type === updateActivityActionTypes.success) { } else if (action.type === updateActivityActionTypes.success) {
const updatedThreadInfos: { [string]: RawThreadInfo } = {}; const updatedThreadInfos: { [string]: MinimallyEncodedRawThreadInfo } = {};
for (const setToUnread of action.payload.result.unfocusedToUnread) { for (const setToUnread of action.payload.result.unfocusedToUnread) {
const threadInfo = state.threadInfos[setToUnread]; const threadInfo = state.threadInfos[setToUnread];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
if (threadInfo && !threadInfo.currentUser.unread) {
updatedThreadInfos[setToUnread] = {
...threadInfo,
currentUser: {
...threadInfo.currentUser,
unread: true,
},
};
}
} else {
if (threadInfo && !threadInfo.currentUser.unread) { if (threadInfo && !threadInfo.currentUser.unread) {
updatedThreadInfos[setToUnread] = { updatedThreadInfos[setToUnread] = {
...threadInfo, ...threadInfo,
currentUser: { currentUser: {
...threadInfo.currentUser, ...threadInfo.currentUser,
unread: true, unread: true,
}, },
}; };
} }
} }
}
if (Object.keys(updatedThreadInfos).length === 0) { if (Object.keys(updatedThreadInfos).length === 0) {
return { return {
threadStore: state, threadStore: state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
const threadStoreOperations = Object.keys(updatedThreadInfos).map(id => ({ const threadStoreOperations = Object.keys(updatedThreadInfos).map(id => ({
Show All 10 Lines ) {
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
} else if (action.type === setThreadUnreadStatusActionTypes.started) { } else if (action.type === setThreadUnreadStatusActionTypes.started) {
const { threadID, unread } = action.payload; const { threadID, unread } = action.payload;
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
const updatedThreadInfo = {
...threadInfo,
currentUser: {
...threadInfo.currentUser,
unread,
},
};
const threadStoreOperations = [
{
type: 'replace',
payload: {
id: threadID,
threadInfo: updatedThreadInfo,
},
},
];
const updatedThreadStore = processThreadStoreOperations(
state,
threadStoreOperations,
);
return {
threadStore: updatedThreadStore,
newThreadInconsistencies: [],
threadStoreOperations,
};
} else {
const updatedThreadInfo = { const updatedThreadInfo = {
...threadInfo, ...threadInfo,
currentUser: { currentUser: {
...threadInfo.currentUser, ...threadInfo.currentUser,
unread, unread,
}, },
}; };
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'replace', type: 'replace',
payload: { payload: {
id: threadID, id: threadID,
threadInfo: updatedThreadInfo, threadInfo: updatedThreadInfo,
}, },
}, },
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
}
} else if (action.type === setThreadUnreadStatusActionTypes.success) { } else if (action.type === setThreadUnreadStatusActionTypes.success) {
const { threadID, resetToUnread } = action.payload; const { threadID, resetToUnread } = action.payload;
const currentUser = state.threadInfos[threadID].currentUser; const currentUser = state.threadInfos[threadID].currentUser;
if (!resetToUnread || currentUser.unread) { if (!resetToUnread || currentUser.unread) {
return { return {
threadStore: state, threadStore: state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
const updatedThread = { const updatedThread = {
...threadInfo, ...threadInfo,
currentUser: { ...threadInfo.currentUser, unread: true }, currentUser: { ...threadInfo.currentUser, unread: true },
}; };
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'replace', type: 'replace',
payload: { payload: {
id: threadID, id: threadID,
threadInfo: updatedThread, threadInfo: updatedThread,
}, },
}, },
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
} else {
const updatedThread = {
...threadInfo,
currentUser: { ...threadInfo.currentUser, unread: true },
};
const threadStoreOperations = [
{
type: 'replace',
payload: {
id: threadID,
threadInfo: updatedThread,
},
},
];
const updatedThreadStore = processThreadStoreOperations(
state,
threadStoreOperations,
);
return {
threadStore: updatedThreadStore,
newThreadInconsistencies: [],
threadStoreOperations,
};
}
} else if (action.type === setClientDBStoreActionType) { } else if (action.type === setClientDBStoreActionType) {
return { return {
threadStore: action.payload.threadStore ?? state, threadStore: action.payload.threadStore ?? state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
return { return {
threadStore: state, threadStore: state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
export { reduceThreadInfos }; export { reduceThreadInfos };
View Options

native/components/color-selector-button.react.js

// @flow // @flow
import invariant from 'invariant';
import { import {
setThreadUnreadStatusActionTypes, setThreadUnreadStatusActionTypes,
updateActivityActionTypes, updateActivityActionTypes,
} from '../actions/activity-actions.js'; } from '../actions/activity-actions.js';
import { setClientDBStoreActionType } from '../actions/client-db-store-actions.js'; import { setClientDBStoreActionType } from '../actions/client-db-store-actions.js';
import { saveMessagesActionType } from '../actions/message-actions.js'; import { saveMessagesActionType } from '../actions/message-actions.js';
import { siweAuthActionTypes } from '../actions/siwe-actions.js'; import { siweAuthActionTypes } from '../actions/siwe-actions.js';
import { import {
Show All 15 Linesimport {
updateSubscriptionActionTypes, updateSubscriptionActionTypes,
} from '../actions/user-actions.js'; } from '../actions/user-actions.js';
import { import {
type ThreadStoreOperation, type ThreadStoreOperation,
threadStoreOpsHandlers, threadStoreOpsHandlers,
} from '../ops/thread-store-ops.js'; } from '../ops/thread-store-ops.js';
import { stateSyncSpecs } from '../shared/state-sync/state-sync-specs.js'; import { stateSyncSpecs } from '../shared/state-sync/state-sync-specs.js';
import { updateSpecs } from '../shared/updates/update-specs.js'; import { updateSpecs } from '../shared/updates/update-specs.js';
import type { MinimallyEncodedRawThreadInfo } from '../types/minimally-encoded-thread-permissions-types.js';
import type { BaseAction } from '../types/redux-types.js'; import type { BaseAction } from '../types/redux-types.js';
import { type ClientThreadInconsistencyReportCreationRequest } from '../types/report-types.js'; import { type ClientThreadInconsistencyReportCreationRequest } from '../types/report-types.js';
import { import {
serverRequestTypes, serverRequestTypes,
processServerRequestsActionType, processServerRequestsActionType,
} from '../types/request-types.js'; } from '../types/request-types.js';
import { import {
fullStateSyncActionType, fullStateSyncActionType,
incrementalStateSyncActionType, incrementalStateSyncActionType,
} from '../types/socket-types.js'; } from '../types/socket-types.js';
import type { import type {
RawThreadInfo, MinimallyEncodedRawThreadInfos,
RawThreadInfos,
ThreadStore, ThreadStore,
} from '../types/thread-types.js'; } from '../types/thread-types.js';
import { import {
type ClientUpdateInfo, type ClientUpdateInfo,
processUpdatesActionType, processUpdatesActionType,
} from '../types/update-types.js'; } from '../types/update-types.js';
import { setNewSessionActionType } from '../utils/action-utils.js'; import { setNewSessionActionType } from '../utils/action-utils.js';
const { processStoreOperations: processThreadStoreOperations } = const { processStoreOperations: processThreadStoreOperations } =
threadStoreOpsHandlers; threadStoreOpsHandlers;
function generateOpsForThreadUpdates( function generateOpsForThreadUpdates(
threadInfos: RawThreadInfos, threadInfos: MinimallyEncodedRawThreadInfos,
payload: { payload: {
+updatesResult: { +newUpdates: $ReadOnlyArray<ClientUpdateInfo>, ... }, +updatesResult: { +newUpdates: $ReadOnlyArray<ClientUpdateInfo>, ... },
... ...
}, },
): $ReadOnlyArray<ThreadStoreOperation> { ): $ReadOnlyArray<ThreadStoreOperation> {
return payload.updatesResult.newUpdates return payload.updatesResult.newUpdates
.map(update => .map(update =>
updateSpecs[update.type].generateOpsForThreadUpdates?.( updateSpecs[update.type].generateOpsForThreadUpdates?.(
Show All 19 Lines if (
action.type === registerActionTypes.success || action.type === registerActionTypes.success ||
action.type === fullStateSyncActionType action.type === fullStateSyncActionType
) { ) {
const newThreadInfos = action.payload.threadInfos; const newThreadInfos = action.payload.threadInfos;
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'remove_all', type: 'remove_all',
}, },
...Object.keys(newThreadInfos).map((id: string) => ({ ...Object.keys(newThreadInfos).map((id: string) => {
invariant(
newThreadInfos[id].minimallyEncoded,
'newThreadInfos must be minimallyEncoded for current clients',
);
atulAuthorUnsubmitted
Done
Inline Actions

I thought putting an invariant here was a reasonable trade-off vs. refactoring the types in the fullStateSyncActionType payload (specifically StateSyncFullActionPayload which is derived from ClientFullStateSync which is derived from BaseFullStateSync) which are used across clients and keyserver.

Open to re-exploring if that would be preferred.

atul: I thought putting an `invariant` here was a reasonable trade-off vs. refactoring the types in…
return {
type: 'replace', type: 'replace',
payload: { id, threadInfo: newThreadInfos[id] }, payload: { id, threadInfo: newThreadInfos[id] },
})), };
}),
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
▲ Show 20 Lines • Show All 58 Lines • ▼ Show 20 Lines ) {
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
} else if (action.type === updateSubscriptionActionTypes.success) { } else if (action.type === updateSubscriptionActionTypes.success) {
const { threadID, subscription } = action.payload; const { threadID, subscription } = action.payload;
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
const newThreadInfo = {
...threadInfo,
currentUser: {
...threadInfo.currentUser,
subscription,
},
};
const threadStoreOperations = [
{
type: 'replace',
payload: {
id: threadID,
threadInfo: newThreadInfo,
},
},
];
const updatedThreadStore = processThreadStoreOperations(
state,
threadStoreOperations,
);
return {
threadStore: updatedThreadStore,
newThreadInconsistencies: [],
threadStoreOperations,
};
} else {
const newThreadInfo = { const newThreadInfo = {
...threadInfo, ...threadInfo,
currentUser: { currentUser: {
...threadInfo.currentUser, ...threadInfo.currentUser,
subscription, subscription,
}, },
}; };
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'replace', type: 'replace',
payload: { payload: {
id: threadID, id: threadID,
threadInfo: newThreadInfo, threadInfo: newThreadInfo,
}, },
}, },
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
}
} else if (action.type === saveMessagesActionType) { } else if (action.type === saveMessagesActionType) {
const threadIDToMostRecentTime = new Map<string, number>(); const threadIDToMostRecentTime = new Map<string, number>();
for (const messageInfo of action.payload.rawMessageInfos) { for (const messageInfo of action.payload.rawMessageInfos) {
const current = threadIDToMostRecentTime.get(messageInfo.threadID); const current = threadIDToMostRecentTime.get(messageInfo.threadID);
if (!current || current < messageInfo.time) { if (!current || current < messageInfo.time) {
threadIDToMostRecentTime.set(messageInfo.threadID, messageInfo.time); threadIDToMostRecentTime.set(messageInfo.threadID, messageInfo.time);
} }
} }
const changedThreadInfos: { [string]: RawThreadInfo } = {}; const changedThreadInfos: { [string]: MinimallyEncodedRawThreadInfo } = {};
for (const [threadID, mostRecentTime] of threadIDToMostRecentTime) { for (const [threadID, mostRecentTime] of threadIDToMostRecentTime) {
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
if ( if (
!threadInfo || !threadInfo ||
threadInfo.currentUser.unread || threadInfo.currentUser.unread ||
action.payload.updatesCurrentAsOf > mostRecentTime action.payload.updatesCurrentAsOf > mostRecentTime
) { ) {
continue; continue;
} }
const changedThreadInfo = state.threadInfos[threadID]; const changedThreadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (changedThreadInfo.minimallyEncoded) {
changedThreadInfos[threadID] = {
...changedThreadInfo,
currentUser: {
...changedThreadInfo.currentUser,
unread: true,
},
};
} else {
changedThreadInfos[threadID] = { changedThreadInfos[threadID] = {
...changedThreadInfo, ...changedThreadInfo,
currentUser: { currentUser: {
...changedThreadInfo.currentUser, ...changedThreadInfo.currentUser,
unread: true, unread: true,
}, },
}; };
} }
}
if (Object.keys(changedThreadInfos).length !== 0) { if (Object.keys(changedThreadInfos).length !== 0) {
const threadStoreOperations = Object.keys(changedThreadInfos).map(id => ({ const threadStoreOperations = Object.keys(changedThreadInfos).map(id => ({
type: 'replace', type: 'replace',
payload: { payload: {
id, id,
threadInfo: changedThreadInfos[id], threadInfo: changedThreadInfos[id],
}, },
})); }));
Show All 25 Lines if (!rawThreadInfos && !deleteThreadIDs) {
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
const threadStoreOperations: ThreadStoreOperation[] = []; const threadStoreOperations: ThreadStoreOperation[] = [];
if (rawThreadInfos) { if (rawThreadInfos) {
for (const rawThreadInfo of rawThreadInfos) { for (const rawThreadInfo of rawThreadInfos) {
invariant(
rawThreadInfo.minimallyEncoded,
'rawThreadInfo must be minimallyEncoded on new clients',
);
atulAuthorUnsubmitted
Done
Inline Actions

Similarly thought this was a reasonable trade-off to avoid having to refactor types related to state check mechanism.

Open to re-exploring if that would be preferred.

atul: Similarly thought this was a reasonable trade-off to avoid having to refactor types related to…
threadStoreOperations.push({ threadStoreOperations.push({
type: 'replace', type: 'replace',
payload: { payload: {
id: rawThreadInfo.id, id: rawThreadInfo.id,
threadInfo: rawThreadInfo, threadInfo: rawThreadInfo,
}, },
}); });
} }
Show All 20 Lines const newThreadInconsistencies =
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies, newThreadInconsistencies,
threadStoreOperations, threadStoreOperations,
}; };
} else if (action.type === updateActivityActionTypes.success) { } else if (action.type === updateActivityActionTypes.success) {
const updatedThreadInfos: { [string]: RawThreadInfo } = {}; const updatedThreadInfos: { [string]: MinimallyEncodedRawThreadInfo } = {};
for (const setToUnread of action.payload.result.unfocusedToUnread) { for (const setToUnread of action.payload.result.unfocusedToUnread) {
const threadInfo = state.threadInfos[setToUnread]; const threadInfo = state.threadInfos[setToUnread];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
if (threadInfo && !threadInfo.currentUser.unread) {
updatedThreadInfos[setToUnread] = {
...threadInfo,
currentUser: {
...threadInfo.currentUser,
unread: true,
},
};
}
} else {
if (threadInfo && !threadInfo.currentUser.unread) { if (threadInfo && !threadInfo.currentUser.unread) {
updatedThreadInfos[setToUnread] = { updatedThreadInfos[setToUnread] = {
...threadInfo, ...threadInfo,
currentUser: { currentUser: {
...threadInfo.currentUser, ...threadInfo.currentUser,
unread: true, unread: true,
}, },
}; };
} }
} }
}
if (Object.keys(updatedThreadInfos).length === 0) { if (Object.keys(updatedThreadInfos).length === 0) {
return { return {
threadStore: state, threadStore: state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
const threadStoreOperations = Object.keys(updatedThreadInfos).map(id => ({ const threadStoreOperations = Object.keys(updatedThreadInfos).map(id => ({
Show All 10 Lines ) {
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
} else if (action.type === setThreadUnreadStatusActionTypes.started) { } else if (action.type === setThreadUnreadStatusActionTypes.started) {
const { threadID, unread } = action.payload; const { threadID, unread } = action.payload;
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
const updatedThreadInfo = {
...threadInfo,
currentUser: {
...threadInfo.currentUser,
unread,
},
};
const threadStoreOperations = [
{
type: 'replace',
payload: {
id: threadID,
threadInfo: updatedThreadInfo,
},
},
];
const updatedThreadStore = processThreadStoreOperations(
state,
threadStoreOperations,
);
return {
threadStore: updatedThreadStore,
newThreadInconsistencies: [],
threadStoreOperations,
};
} else {
const updatedThreadInfo = { const updatedThreadInfo = {
...threadInfo, ...threadInfo,
currentUser: { currentUser: {
...threadInfo.currentUser, ...threadInfo.currentUser,
unread, unread,
}, },
}; };
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'replace', type: 'replace',
payload: { payload: {
id: threadID, id: threadID,
threadInfo: updatedThreadInfo, threadInfo: updatedThreadInfo,
}, },
}, },
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
}
} else if (action.type === setThreadUnreadStatusActionTypes.success) { } else if (action.type === setThreadUnreadStatusActionTypes.success) {
const { threadID, resetToUnread } = action.payload; const { threadID, resetToUnread } = action.payload;
const currentUser = state.threadInfos[threadID].currentUser; const currentUser = state.threadInfos[threadID].currentUser;
if (!resetToUnread || currentUser.unread) { if (!resetToUnread || currentUser.unread) {
return { return {
threadStore: state, threadStore: state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
const updatedThread = { const updatedThread = {
...threadInfo, ...threadInfo,
currentUser: { ...threadInfo.currentUser, unread: true }, currentUser: { ...threadInfo.currentUser, unread: true },
}; };
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'replace', type: 'replace',
payload: { payload: {
id: threadID, id: threadID,
threadInfo: updatedThread, threadInfo: updatedThread,
}, },
}, },
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
} else {
const updatedThread = {
...threadInfo,
currentUser: { ...threadInfo.currentUser, unread: true },
};
const threadStoreOperations = [
{
type: 'replace',
payload: {
id: threadID,
threadInfo: updatedThread,
},
},
];
const updatedThreadStore = processThreadStoreOperations(
state,
threadStoreOperations,
);
return {
threadStore: updatedThreadStore,
newThreadInconsistencies: [],
threadStoreOperations,
};
}
} else if (action.type === setClientDBStoreActionType) { } else if (action.type === setClientDBStoreActionType) {
return { return {
threadStore: action.payload.threadStore ?? state, threadStore: action.payload.threadStore ?? state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
return { return {
threadStore: state, threadStore: state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
export { reduceThreadInfos }; export { reduceThreadInfos };
View Options

native/components/color-selector.react.js

// @flow // @flow
import invariant from 'invariant';
import { import {
setThreadUnreadStatusActionTypes, setThreadUnreadStatusActionTypes,
updateActivityActionTypes, updateActivityActionTypes,
} from '../actions/activity-actions.js'; } from '../actions/activity-actions.js';
import { setClientDBStoreActionType } from '../actions/client-db-store-actions.js'; import { setClientDBStoreActionType } from '../actions/client-db-store-actions.js';
import { saveMessagesActionType } from '../actions/message-actions.js'; import { saveMessagesActionType } from '../actions/message-actions.js';
import { siweAuthActionTypes } from '../actions/siwe-actions.js'; import { siweAuthActionTypes } from '../actions/siwe-actions.js';
import { import {
Show All 15 Linesimport {
updateSubscriptionActionTypes, updateSubscriptionActionTypes,
} from '../actions/user-actions.js'; } from '../actions/user-actions.js';
import { import {
type ThreadStoreOperation, type ThreadStoreOperation,
threadStoreOpsHandlers, threadStoreOpsHandlers,
} from '../ops/thread-store-ops.js'; } from '../ops/thread-store-ops.js';
import { stateSyncSpecs } from '../shared/state-sync/state-sync-specs.js'; import { stateSyncSpecs } from '../shared/state-sync/state-sync-specs.js';
import { updateSpecs } from '../shared/updates/update-specs.js'; import { updateSpecs } from '../shared/updates/update-specs.js';
import type { MinimallyEncodedRawThreadInfo } from '../types/minimally-encoded-thread-permissions-types.js';
import type { BaseAction } from '../types/redux-types.js'; import type { BaseAction } from '../types/redux-types.js';
import { type ClientThreadInconsistencyReportCreationRequest } from '../types/report-types.js'; import { type ClientThreadInconsistencyReportCreationRequest } from '../types/report-types.js';
import { import {
serverRequestTypes, serverRequestTypes,
processServerRequestsActionType, processServerRequestsActionType,
} from '../types/request-types.js'; } from '../types/request-types.js';
import { import {
fullStateSyncActionType, fullStateSyncActionType,
incrementalStateSyncActionType, incrementalStateSyncActionType,
} from '../types/socket-types.js'; } from '../types/socket-types.js';
import type { import type {
RawThreadInfo, MinimallyEncodedRawThreadInfos,
RawThreadInfos,
ThreadStore, ThreadStore,
} from '../types/thread-types.js'; } from '../types/thread-types.js';
import { import {
type ClientUpdateInfo, type ClientUpdateInfo,
processUpdatesActionType, processUpdatesActionType,
} from '../types/update-types.js'; } from '../types/update-types.js';
import { setNewSessionActionType } from '../utils/action-utils.js'; import { setNewSessionActionType } from '../utils/action-utils.js';
const { processStoreOperations: processThreadStoreOperations } = const { processStoreOperations: processThreadStoreOperations } =
threadStoreOpsHandlers; threadStoreOpsHandlers;
function generateOpsForThreadUpdates( function generateOpsForThreadUpdates(
threadInfos: RawThreadInfos, threadInfos: MinimallyEncodedRawThreadInfos,
payload: { payload: {
+updatesResult: { +newUpdates: $ReadOnlyArray<ClientUpdateInfo>, ... }, +updatesResult: { +newUpdates: $ReadOnlyArray<ClientUpdateInfo>, ... },
... ...
}, },
): $ReadOnlyArray<ThreadStoreOperation> { ): $ReadOnlyArray<ThreadStoreOperation> {
return payload.updatesResult.newUpdates return payload.updatesResult.newUpdates
.map(update => .map(update =>
updateSpecs[update.type].generateOpsForThreadUpdates?.( updateSpecs[update.type].generateOpsForThreadUpdates?.(
Show All 19 Lines if (
action.type === registerActionTypes.success || action.type === registerActionTypes.success ||
action.type === fullStateSyncActionType action.type === fullStateSyncActionType
) { ) {
const newThreadInfos = action.payload.threadInfos; const newThreadInfos = action.payload.threadInfos;
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'remove_all', type: 'remove_all',
}, },
...Object.keys(newThreadInfos).map((id: string) => ({ ...Object.keys(newThreadInfos).map((id: string) => {
invariant(
newThreadInfos[id].minimallyEncoded,
'newThreadInfos must be minimallyEncoded for current clients',
);
atulAuthorUnsubmitted
Done
Inline Actions

I thought putting an invariant here was a reasonable trade-off vs. refactoring the types in the fullStateSyncActionType payload (specifically StateSyncFullActionPayload which is derived from ClientFullStateSync which is derived from BaseFullStateSync) which are used across clients and keyserver.

Open to re-exploring if that would be preferred.

atul: I thought putting an `invariant` here was a reasonable trade-off vs. refactoring the types in…
return {
type: 'replace', type: 'replace',
payload: { id, threadInfo: newThreadInfos[id] }, payload: { id, threadInfo: newThreadInfos[id] },
})), };
}),
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
▲ Show 20 Lines • Show All 58 Lines • ▼ Show 20 Lines ) {
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
} else if (action.type === updateSubscriptionActionTypes.success) { } else if (action.type === updateSubscriptionActionTypes.success) {
const { threadID, subscription } = action.payload; const { threadID, subscription } = action.payload;
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
const newThreadInfo = {
...threadInfo,
currentUser: {
...threadInfo.currentUser,
subscription,
},
};
const threadStoreOperations = [
{
type: 'replace',
payload: {
id: threadID,
threadInfo: newThreadInfo,
},
},
];
const updatedThreadStore = processThreadStoreOperations(
state,
threadStoreOperations,
);
return {
threadStore: updatedThreadStore,
newThreadInconsistencies: [],
threadStoreOperations,
};
} else {
const newThreadInfo = { const newThreadInfo = {
...threadInfo, ...threadInfo,
currentUser: { currentUser: {
...threadInfo.currentUser, ...threadInfo.currentUser,
subscription, subscription,
}, },
}; };
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'replace', type: 'replace',
payload: { payload: {
id: threadID, id: threadID,
threadInfo: newThreadInfo, threadInfo: newThreadInfo,
}, },
}, },
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
}
} else if (action.type === saveMessagesActionType) { } else if (action.type === saveMessagesActionType) {
const threadIDToMostRecentTime = new Map<string, number>(); const threadIDToMostRecentTime = new Map<string, number>();
for (const messageInfo of action.payload.rawMessageInfos) { for (const messageInfo of action.payload.rawMessageInfos) {
const current = threadIDToMostRecentTime.get(messageInfo.threadID); const current = threadIDToMostRecentTime.get(messageInfo.threadID);
if (!current || current < messageInfo.time) { if (!current || current < messageInfo.time) {
threadIDToMostRecentTime.set(messageInfo.threadID, messageInfo.time); threadIDToMostRecentTime.set(messageInfo.threadID, messageInfo.time);
} }
} }
const changedThreadInfos: { [string]: RawThreadInfo } = {}; const changedThreadInfos: { [string]: MinimallyEncodedRawThreadInfo } = {};
for (const [threadID, mostRecentTime] of threadIDToMostRecentTime) { for (const [threadID, mostRecentTime] of threadIDToMostRecentTime) {
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
if ( if (
!threadInfo || !threadInfo ||
threadInfo.currentUser.unread || threadInfo.currentUser.unread ||
action.payload.updatesCurrentAsOf > mostRecentTime action.payload.updatesCurrentAsOf > mostRecentTime
) { ) {
continue; continue;
} }
const changedThreadInfo = state.threadInfos[threadID]; const changedThreadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (changedThreadInfo.minimallyEncoded) {
changedThreadInfos[threadID] = {
...changedThreadInfo,
currentUser: {
...changedThreadInfo.currentUser,
unread: true,
},
};
} else {
changedThreadInfos[threadID] = { changedThreadInfos[threadID] = {
...changedThreadInfo, ...changedThreadInfo,
currentUser: { currentUser: {
...changedThreadInfo.currentUser, ...changedThreadInfo.currentUser,
unread: true, unread: true,
}, },
}; };
} }
}
if (Object.keys(changedThreadInfos).length !== 0) { if (Object.keys(changedThreadInfos).length !== 0) {
const threadStoreOperations = Object.keys(changedThreadInfos).map(id => ({ const threadStoreOperations = Object.keys(changedThreadInfos).map(id => ({
type: 'replace', type: 'replace',
payload: { payload: {
id, id,
threadInfo: changedThreadInfos[id], threadInfo: changedThreadInfos[id],
}, },
})); }));
Show All 25 Lines if (!rawThreadInfos && !deleteThreadIDs) {
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
const threadStoreOperations: ThreadStoreOperation[] = []; const threadStoreOperations: ThreadStoreOperation[] = [];
if (rawThreadInfos) { if (rawThreadInfos) {
for (const rawThreadInfo of rawThreadInfos) { for (const rawThreadInfo of rawThreadInfos) {
invariant(
rawThreadInfo.minimallyEncoded,
'rawThreadInfo must be minimallyEncoded on new clients',
);
atulAuthorUnsubmitted
Done
Inline Actions

Similarly thought this was a reasonable trade-off to avoid having to refactor types related to state check mechanism.

Open to re-exploring if that would be preferred.

atul: Similarly thought this was a reasonable trade-off to avoid having to refactor types related to…
threadStoreOperations.push({ threadStoreOperations.push({
type: 'replace', type: 'replace',
payload: { payload: {
id: rawThreadInfo.id, id: rawThreadInfo.id,
threadInfo: rawThreadInfo, threadInfo: rawThreadInfo,
}, },
}); });
} }
Show All 20 Lines const newThreadInconsistencies =
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies, newThreadInconsistencies,
threadStoreOperations, threadStoreOperations,
}; };
} else if (action.type === updateActivityActionTypes.success) { } else if (action.type === updateActivityActionTypes.success) {
const updatedThreadInfos: { [string]: RawThreadInfo } = {}; const updatedThreadInfos: { [string]: MinimallyEncodedRawThreadInfo } = {};
for (const setToUnread of action.payload.result.unfocusedToUnread) { for (const setToUnread of action.payload.result.unfocusedToUnread) {
const threadInfo = state.threadInfos[setToUnread]; const threadInfo = state.threadInfos[setToUnread];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
if (threadInfo && !threadInfo.currentUser.unread) {
updatedThreadInfos[setToUnread] = {
...threadInfo,
currentUser: {
...threadInfo.currentUser,
unread: true,
},
};
}
} else {
if (threadInfo && !threadInfo.currentUser.unread) { if (threadInfo && !threadInfo.currentUser.unread) {
updatedThreadInfos[setToUnread] = { updatedThreadInfos[setToUnread] = {
...threadInfo, ...threadInfo,
currentUser: { currentUser: {
...threadInfo.currentUser, ...threadInfo.currentUser,
unread: true, unread: true,
}, },
}; };
} }
} }
}
if (Object.keys(updatedThreadInfos).length === 0) { if (Object.keys(updatedThreadInfos).length === 0) {
return { return {
threadStore: state, threadStore: state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
const threadStoreOperations = Object.keys(updatedThreadInfos).map(id => ({ const threadStoreOperations = Object.keys(updatedThreadInfos).map(id => ({
Show All 10 Lines ) {
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
} else if (action.type === setThreadUnreadStatusActionTypes.started) { } else if (action.type === setThreadUnreadStatusActionTypes.started) {
const { threadID, unread } = action.payload; const { threadID, unread } = action.payload;
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
const updatedThreadInfo = {
...threadInfo,
currentUser: {
...threadInfo.currentUser,
unread,
},
};
const threadStoreOperations = [
{
type: 'replace',
payload: {
id: threadID,
threadInfo: updatedThreadInfo,
},
},
];
const updatedThreadStore = processThreadStoreOperations(
state,
threadStoreOperations,
);
return {
threadStore: updatedThreadStore,
newThreadInconsistencies: [],
threadStoreOperations,
};
} else {
const updatedThreadInfo = { const updatedThreadInfo = {
...threadInfo, ...threadInfo,
currentUser: { currentUser: {
...threadInfo.currentUser, ...threadInfo.currentUser,
unread, unread,
}, },
}; };
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'replace', type: 'replace',
payload: { payload: {
id: threadID, id: threadID,
threadInfo: updatedThreadInfo, threadInfo: updatedThreadInfo,
}, },
}, },
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
}
} else if (action.type === setThreadUnreadStatusActionTypes.success) { } else if (action.type === setThreadUnreadStatusActionTypes.success) {
const { threadID, resetToUnread } = action.payload; const { threadID, resetToUnread } = action.payload;
const currentUser = state.threadInfos[threadID].currentUser; const currentUser = state.threadInfos[threadID].currentUser;
if (!resetToUnread || currentUser.unread) { if (!resetToUnread || currentUser.unread) {
return { return {
threadStore: state, threadStore: state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
const threadInfo = state.threadInfos[threadID]; const threadInfo = state.threadInfos[threadID];
// TODO (atul): Try to get rid of this ridiculous branching.
if (threadInfo.minimallyEncoded) {
const updatedThread = { const updatedThread = {
...threadInfo, ...threadInfo,
currentUser: { ...threadInfo.currentUser, unread: true }, currentUser: { ...threadInfo.currentUser, unread: true },
}; };
const threadStoreOperations = [ const threadStoreOperations = [
{ {
type: 'replace', type: 'replace',
payload: { payload: {
id: threadID, id: threadID,
threadInfo: updatedThread, threadInfo: updatedThread,
}, },
}, },
]; ];
const updatedThreadStore = processThreadStoreOperations( const updatedThreadStore = processThreadStoreOperations(
state, state,
threadStoreOperations, threadStoreOperations,
); );
return { return {
threadStore: updatedThreadStore, threadStore: updatedThreadStore,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations, threadStoreOperations,
}; };
} else {
const updatedThread = {
...threadInfo,
currentUser: { ...threadInfo.currentUser, unread: true },
};
const threadStoreOperations = [
{
type: 'replace',
payload: {
id: threadID,
threadInfo: updatedThread,
},
},
];
const updatedThreadStore = processThreadStoreOperations(
state,
threadStoreOperations,
);
return {
threadStore: updatedThreadStore,
newThreadInconsistencies: [],
threadStoreOperations,
};
}
} else if (action.type === setClientDBStoreActionType) { } else if (action.type === setClientDBStoreActionType) {
return { return {
threadStore: action.payload.threadStore ?? state, threadStore: action.payload.threadStore ?? state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
return { return {
threadStore: state, threadStore: state,
newThreadInconsistencies: [], newThreadInconsistencies: [],
threadStoreOperations: [], threadStoreOperations: [],
}; };
} }
export { reduceThreadInfos }; export { reduceThreadInfos };