Diff 42410

View Options

lib/shared/thread-utils.js

// @flow // @flow

import invariant from 'invariant'; import invariant from 'invariant';

import _pickBy from 'lodash/fp/pickBy.js';

import * as React from 'react'; import * as React from 'react';

import {

joinThreadActionTypes,

useJoinThread,

} from 'lib/actions/thread-actions.js';

import { NeynarClientContext } from 'lib/components/neynar-client-provider.react.js'; import { NeynarClientContext } from 'lib/components/neynar-client-provider.react.js';

import blobService from 'lib/facts/blob-service.js'; import blobService from 'lib/facts/blob-service.js';

import { extractKeyserverIDFromID } from 'lib/keyserver-conn/keyserver-call-utils.js'; import { extractKeyserverIDFromID } from 'lib/keyserver-conn/keyserver-call-utils.js';

import { isLoggedInToIdentityAndAuthoritativeKeyserver } from 'lib/selectors/user-selectors.js'; import { isLoggedInToIdentityAndAuthoritativeKeyserver } from 'lib/selectors/user-selectors.js';

import { farcasterChannelTagBlobHash } from 'lib/shared/community-utils.js'; import {

farcasterChannelTagBlobHash,

useJoinCommunity,

} from 'lib/shared/community-utils.js';

import type { AuthMetadata } from 'lib/shared/identity-client-context.js'; import type { AuthMetadata } from 'lib/shared/identity-client-context.js';

import { IdentityClientContext } from 'lib/shared/identity-client-context.js'; import { IdentityClientContext } from 'lib/shared/identity-client-context.js';

import type { KeyserverOverride } from 'lib/shared/invite-links.js';

import type {

OngoingJoinCommunityData,

JoinCommunityStep,

} from 'lib/types/community-types.js';

import { defaultThreadSubscription } from 'lib/types/subscription-types.js'; import { defaultThreadSubscription } from 'lib/types/subscription-types.js';

import { getBlobFetchableURL } from 'lib/utils/blob-service.js'; import { getBlobFetchableURL } from 'lib/utils/blob-service.js';

import { useCurrentUserFID } from 'lib/utils/farcaster-utils.js'; import { useCurrentUserFID } from 'lib/utils/farcaster-utils.js';

import { useDispatchActionPromise } from 'lib/utils/redux-promise-utils.js'; import { values } from 'lib/utils/objects.js';

import { promiseAll } from 'lib/utils/promises.js';

import { import {

usingCommServicesAccessToken, usingCommServicesAccessToken,

createDefaultHTTPRequestHeaders, createDefaultHTTPRequestHeaders,

} from 'lib/utils/services-utils.js'; } from 'lib/utils/services-utils.js';

import { nonThreadCalendarQuery } from '../navigation/nav-selectors.js'; import { nonThreadCalendarQuery } from '../navigation/nav-selectors.js';

import { NavContext } from '../navigation/navigation-context.js'; import { NavContext } from '../navigation/navigation-context.js';

import { useSelector } from '../redux/redux-utils.js'; import { useSelector } from '../redux/redux-utils.js';

type CommunityToAutoJoin = {

+communityID: string,

+keyserverOverride: ?KeyserverOverride,

};

function AutoJoinCommunityHandler(): React.Node { function AutoJoinCommunityHandler(): React.Node {

const isActive = useSelector(state => state.lifecycleState !== 'background'); const isActive = useSelector(state => state.lifecycleState !== 'background');

const loggedIn = useSelector(isLoggedInToIdentityAndAuthoritativeKeyserver); const loggedIn = useSelector(isLoggedInToIdentityAndAuthoritativeKeyserver);

const fid = useCurrentUserFID(); const fid = useCurrentUserFID();

const neynarClient = React.useContext(NeynarClientContext)?.client; const neynarClient = React.useContext(NeynarClientContext)?.client;

const navContext = React.useContext(NavContext);

const identityClientContext = React.useContext(IdentityClientContext); const identityClientContext = React.useContext(IdentityClientContext);

invariant(identityClientContext, 'IdentityClientContext should be set'); invariant(identityClientContext, 'IdentityClientContext should be set');

const { getAuthMetadata } = identityClientContext; const { getAuthMetadata } = identityClientContext;

const calendarQuery = useSelector(state =>

nonThreadCalendarQuery({

redux: state,

navContext,

}),

);

ginsuAuthorUnsubmitted

Done

This got moved to JoinHandler

ginsu: This got moved to `JoinHandler`

const joinThread = useJoinThread();

const joinThreadActionPromise = React.useCallback(

async (communityID: string) => {

const query = calendarQuery();

return await joinThread({

threadID: communityID,

calendarQuery: {

startDate: query.startDate,

endDate: query.endDate,

filters: [

...query.filters,

{ type: 'threads', threadIDs: [communityID] },

defaultSubscription: defaultThreadSubscription,

});

[calendarQuery, joinThread],

);

ginsuAuthorUnsubmitted

Done

This is now handled in useJoinCommunity

ginsu: This is now handled in `useJoinCommunity`

const dispatchActionPromise = useDispatchActionPromise();

const threadInfos = useSelector(state => state.threadStore.threadInfos); const threadInfos = useSelector(state => state.threadStore.threadInfos);

const keyserverInfos = useSelector( const keyserverInfos = useSelector(

state => state.keyserverStore.keyserverInfos, state => state.keyserverStore.keyserverInfos,

); );

const [communitiesToAuoJoin, setCommunitiesToAutoJoin] =

ashoatUnsubmitted

Not Done

state => state.keyserverStore.keyserverInfos,

);

- const [communitiesToAuoJoin, setCommunitiesToAutoJoin] =

+ const [communitiesToAutoJoin, setCommunitiesToAutoJoin] =

React.useState<?$ReadOnlyArray<CommunityToAutoJoin>>();

Typo

ashoat: Typo

React.useState<?$ReadOnlyArray<CommunityToAutoJoin>>();

React.useEffect(() => { React.useEffect(() => {

ashoatUnsubmitted

Not Done

What do you think about making sure this effect is only run once per app startup?

I'm a bit concerned that it's going to run every time the keyserver connection status flips

ashoat: What do you think about making sure this effect is only run once per app startup? I'm a bit…

if (!loggedIn || !isActive || !fid || !neynarClient || !threadInfos) { if (!loggedIn || !isActive || !fid || !neynarClient || !threadInfos) {

return; return;

} }

void (async () => { void (async () => {

const authMetadataPromise: Promise<?AuthMetadata> = (async () => { const authMetadataPromise: Promise<?AuthMetadata> = (async () => {

if (!usingCommServicesAccessToken) { if (!usingCommServicesAccessToken) {

return undefined; return undefined;

Show All 12 Lines void (async () => {

const headers = authMetadata const headers = authMetadata

? createDefaultHTTPRequestHeaders(authMetadata) ? createDefaultHTTPRequestHeaders(authMetadata)

: {}; : {};

const followedFarcasterChannelIDs = followedFarcasterChannels.map( const followedFarcasterChannelIDs = followedFarcasterChannels.map(

channel => channel.id, channel => channel.id,

); );

const promises = followedFarcasterChannelIDs.map(async channelID => { const promises: { [string]: Promise<?CommunityToAutoJoin> } = {};

ginsuAuthorUnsubmitted

Done

Flow was not happy when I tried to initially pass in an array of promises to Promise.all() where the promises could either return null or CommunityToAutoJoin

Screenshot 2024-07-10 at 5.04.37 AM.png (732×1 px, 152 KB)

Creating an obj of promises then using promiseAll seemed to do the trick

ginsu: Flow was not happy when I tried to initially pass in an array of promises to `Promise.all()`…

for (const channelID of followedFarcasterChannelIDs) {

promises[channelID] = (async () => {

const blobHash = farcasterChannelTagBlobHash(channelID); const blobHash = farcasterChannelTagBlobHash(channelID);

const blobURL = getBlobFetchableURL(blobHash); const blobURL = getBlobFetchableURL(blobHash);

const blobResult = await fetch(blobURL, { const blobResult = await fetch(blobURL, {

method: blobService.httpEndpoints.GET_BLOB.method, method: blobService.httpEndpoints.GET_BLOB.method,

headers, headers,

}); });

if (blobResult.status !== 200) { if (blobResult.status !== 200) {

return; return null;

} }

const { commCommunityID } = await blobResult.json(); const { commCommunityID, keyserverURL } = await blobResult.json();

const keyserverID = extractKeyserverIDFromID(commCommunityID); const keyserverID = extractKeyserverIDFromID(commCommunityID);

if (!keyserverInfos[keyserverID]) {

return;

}

// The user is already in the community // The user is already in the community

if (threadInfos[commCommunityID]) { if (threadInfos[commCommunityID]) {

return; return null;

} }

void dispatchActionPromise( const keyserverOverride = !keyserverInfos[keyserverID]

joinThreadActionTypes, ? {

joinThreadActionPromise(commCommunityID), keyserverID,

); keyserverURL: keyserverURL.replace(/\/$/, ''),

}); }

: null;

return {

communityID: commCommunityID,

keyserverOverride,

};

})();

}

const communitiesObj = await promiseAll(promises);

const filteredCommunitiesObj = _pickBy(Boolean)(communitiesObj);

const communities = values(filteredCommunitiesObj);

await Promise.all(promises); if (communities.length === 0) {

return;

}

setCommunitiesToAutoJoin(communities);

})(); })();

}, [ }, [

threadInfos, threadInfos,

dispatchActionPromise,

fid, fid,

isActive, isActive,

joinThreadActionPromise,

loggedIn, loggedIn,

neynarClient, neynarClient,

getAuthMetadata, getAuthMetadata,

keyserverInfos, keyserverInfos,

]); ]);

const joinHandlers = React.useMemo(

() =>

communitiesToAuoJoin?.map((communityToAutoJoin, index) => (

<JoinHandler

key={index}

ashoatUnsubmitted

Not Done

Using index here as the key is dangerous. You're relying on the array index inside communitiesToAutoJoin to not change, but it can totally change if eg. the user follows a new channel on Farcaster.

Instead, can we use the communityID as the key? That will make sure that if communitiesToAutoJoin changes, we don't change the communityID we're passing to any individual JoinHandler component.

ashoat: Using `index` here as the key is dangerous. You're relying on the array index inside…

communityID={communityToAutoJoin.communityID}

keyserverOverride={communityToAutoJoin.keyserverOverride}

)),

[communitiesToAuoJoin],

);

return joinHandlers;

}

type JoinHandlerProps = {

+communityID: string,

+keyserverOverride: ?KeyserverOverride,

};

function JoinHandler(props: JoinHandlerProps) {

const { communityID, keyserverOverride } = props;

const navContext = React.useContext(NavContext);

const calendarQuery = useSelector(state =>

nonThreadCalendarQuery({

redux: state,

navContext,

}),

);

const [ongoingJoinData, setOngoingJoinData] =

React.useState<?OngoingJoinCommunityData>(null);

const [step, setStep] = React.useState<JoinCommunityStep>('inactive');

const joinCommunity = useJoinCommunity({

ashoatUnsubmitted

Not Done

When does this get regenerated? I'm worried about a risk of joinCommunity being called multiple times for a single community. Note that this will continue to be a risk even if you make sure setCommunitiesToAutoJoin is only ever called once in AutoJoinCommunityHandler

ashoat: When does this get regenerated? I'm worried about a risk of `joinCommunity` being called…

ginsuAuthorUnsubmitted

Done

Logged out when we were regenerating joinCommunity and it definitely was getting regenerated many more times than needed.

I added the check to make sure the effect in AutoJoinCommunityHandler is only ever called once and additionally also called setCommunitiesToAutoJoin(null); if we try to run that effect again. With these two changes we significantly cut down the amount of times joinCommunity gets regenerated. Will keep investigating if there are better ways to do this, but wanted to check in with what I found

Before the changes when I try to auto join 3 different communities:

Screenshot 2024-07-10 at 4.36.18 PM.png (1×768 px, 378 KB)

After the changes when I tried to auto join 3 different communities:

Screenshot 2024-07-10 at 4.36.44 PM.png (360×666 px, 73 KB)

ginsu: Logged out when we were regenerating `joinCommunity ` and it definitely was getting regenerated…

communityID,

keyserverOverride,

calendarQuery,

ongoingJoinData,

setOngoingJoinData,

step,

setStep,

defaultSubscription: defaultThreadSubscription,

});

React.useEffect(() => {

void (async () => {

await joinCommunity();

})();

ashoatUnsubmitted

Not Done

React.useEffect(() => {

- void (async () => {

- await joinCommunity();

- })();

+ void joinCommunity();

}, [joinCommunity]);

There is no reason for this indirection

ashoat: There is no reason for this indirection

}, [joinCommunity]);

return null; return null;

} }

export { AutoJoinCommunityHandler }; export { AutoJoinCommunityHandler };

[lib] Fix construction of `ThinRawThreadInfo` in `createPendingThread`
ClosedPublic
Actions

Details

Diff Detail

Event Timeline

Revision Contents
Changeset List

Diff 42410

lib/shared/thread-utils.js

[lib] Fix construction of `ThinRawThreadInfo` in `createPendingThread`ClosedPublicActions

Details

Diff Detail

Event Timeline

Revision ContentsChangeset List

Diff 42410

lib/shared/thread-utils.js

[lib] Fix construction of `ThinRawThreadInfo` in `createPendingThread`
ClosedPublic
Actions

Revision Contents
Changeset List