diff --git a/lib/shared/community-utils.js b/lib/shared/community-utils.js
index b7ba5c4a1..1cdf09e05 100644
--- a/lib/shared/community-utils.js
+++ b/lib/shared/community-utils.js
@@ -1,148 +1,149 @@
// @flow
import * as React from 'react';
import {
createOrUpdateFarcasterChannelTagActionTypes,
useCreateOrUpdateFarcasterChannelTag,
deleteFarcasterChannelTagActionTypes,
useDeleteFarcasterChannelTag,
} from '../actions/community-actions.js';
import { createLoadingStatusSelector } from '../selectors/loading-selectors.js';
import type { SetState } from '../types/hook-types.js';
import { useDispatchActionPromise } from '../utils/redux-promise-utils.js';
import { useSelector } from '../utils/redux-utils.js';
const tagFarcasterChannelCopy = {
DESCRIPTION:
'Tag a Farcaster channel so followers can find your Comm community!',
CHANNEL_NAME_HEADER: 'Selected channel:',
NO_CHANNEL_TAGGED: 'No Farcaster channel tagged',
+ REMOVE_TAG_BUTTON: 'Remove tag',
};
const tagFarcasterChannelErrorMessages: { +[string]: string } = {
already_in_use: 'This Farcaster channel is already tagged to a community.',
channel_not_found: 'Could not find a channel with the provided name.',
};
function farcasterChannelTagBlobHash(farcasterChannelID: string): string {
return `farcaster_channel_tag_${farcasterChannelID}`;
}
const createOrUpdateFarcasterChannelTagStatusSelector =
createLoadingStatusSelector(createOrUpdateFarcasterChannelTagActionTypes);
function useCreateFarcasterChannelTag(
commCommunityID: string,
setError: SetState,
onSuccessCallback?: () => mixed,
): {
+createTag: (farcasterChannelID: string) => mixed,
+isLoading: boolean,
} {
const dispatchActionPromise = useDispatchActionPromise();
const createOrUpdateFarcasterChannelTag =
useCreateOrUpdateFarcasterChannelTag();
const createCreateOrUpdateActionPromise = React.useCallback(
async (farcasterChannelID: string) => {
try {
const res = await createOrUpdateFarcasterChannelTag({
commCommunityID,
farcasterChannelID,
});
onSuccessCallback?.();
return res;
} catch (e) {
setError(e.message);
throw e;
}
},
[
commCommunityID,
createOrUpdateFarcasterChannelTag,
onSuccessCallback,
setError,
],
);
const createTag = React.useCallback(
(farcasterChannelID: string) => {
void dispatchActionPromise(
createOrUpdateFarcasterChannelTagActionTypes,
createCreateOrUpdateActionPromise(farcasterChannelID),
);
},
[createCreateOrUpdateActionPromise, dispatchActionPromise],
);
const createOrUpdateFarcasterChannelTagStatus = useSelector(
createOrUpdateFarcasterChannelTagStatusSelector,
);
const isLoading = createOrUpdateFarcasterChannelTagStatus === 'loading';
return {
createTag,
isLoading,
};
}
const deleteFarcasterChannelTagStatusSelector = createLoadingStatusSelector(
deleteFarcasterChannelTagActionTypes,
);
function useRemoveFarcasterChannelTag(
commCommunityID: string,
farcasterChannelID: string,
setError: SetState,
): {
+removeTag: () => mixed,
+isLoading: boolean,
} {
const dispatchActionPromise = useDispatchActionPromise();
const deleteFarcasterChannelTag = useDeleteFarcasterChannelTag();
const createDeleteActionPromise = React.useCallback(async () => {
try {
return await deleteFarcasterChannelTag({
commCommunityID,
farcasterChannelID,
});
} catch (e) {
setError(e.message);
throw e;
}
}, [
commCommunityID,
deleteFarcasterChannelTag,
farcasterChannelID,
setError,
]);
const removeTag = React.useCallback(() => {
void dispatchActionPromise(
deleteFarcasterChannelTagActionTypes,
createDeleteActionPromise(),
);
}, [createDeleteActionPromise, dispatchActionPromise]);
const deleteFarcasterChannelTagStatus = useSelector(
deleteFarcasterChannelTagStatusSelector,
);
const isLoading = deleteFarcasterChannelTagStatus === 'loading';
return {
removeTag,
isLoading,
};
}
export {
tagFarcasterChannelCopy,
tagFarcasterChannelErrorMessages,
farcasterChannelTagBlobHash,
useCreateFarcasterChannelTag,
useRemoveFarcasterChannelTag,
};
diff --git a/native/community-settings/tag-farcaster-channel/remove-tag-button.react.js b/native/community-settings/tag-farcaster-channel/remove-tag-button.react.js
index 840d2cfbe..b2d764d28 100644
--- a/native/community-settings/tag-farcaster-channel/remove-tag-button.react.js
+++ b/native/community-settings/tag-farcaster-channel/remove-tag-button.react.js
@@ -1,67 +1,74 @@
// @flow
import * as React from 'react';
import { View, Text, ActivityIndicator } from 'react-native';
-import { useRemoveFarcasterChannelTag } from 'lib/shared/community-utils.js';
+import {
+ tagFarcasterChannelCopy,
+ useRemoveFarcasterChannelTag,
+} from 'lib/shared/community-utils.js';
import type { SetState } from 'lib/types/hook-types.js';
import Button from '../../components/button.react.js';
import { useStyles, useColors } from '../../themes/colors.js';
type Props = {
+communityID: string,
+channelID: string,
+setError: SetState,
};
function RemoveTagButton(props: Props): React.Node {
const { communityID, channelID, setError } = props;
const styles = useStyles(unboundStyles);
const colors = useColors();
const { removeTag, isLoading } = useRemoveFarcasterChannelTag(
communityID,
channelID,
setError,
);
const buttonContent = React.useMemo(() => {
if (isLoading) {
return (