diff --git a/native/community-settings/tag-farcaster-channel/tag-farcaster-channel-by-name.react.js b/native/community-settings/tag-farcaster-channel/tag-farcaster-channel-by-name.react.js --- a/native/community-settings/tag-farcaster-channel/tag-farcaster-channel-by-name.react.js +++ b/native/community-settings/tag-farcaster-channel/tag-farcaster-channel-by-name.react.js @@ -12,6 +12,7 @@ import { useDispatchActionPromise } from 'lib/utils/redux-promise-utils.js'; import type { TagFarcasterChannelNavigationProp } from './tag-farcaster-channel-navigator.react.js'; +import { tagFarcasterChannelErrorMessages } from './tag-farcaster-channel-utils.js'; import RegistrationButton from '../../account/registration/registration-button.react.js'; import TextInput from '../../components/text-input.react.js'; import type { NavigationRoute } from '../../navigation/route-names.js'; @@ -37,6 +38,7 @@ const [channelSelectionText, setChannelSelectionText] = React.useState(''); + const [error, setError] = React.useState(null); const neynarClientContext = React.useContext(NeynarClientContext); invariant(neynarClientContext, 'NeynarClientContext is missing'); @@ -54,8 +56,7 @@ farcasterChannelID: channelID, }); } catch (e) { - // TODO: Improve error handling - console.log(e.message); + setError(e.message); throw e; } }, @@ -69,7 +70,7 @@ ); if (!channelInfo) { - // TODO: Improve error handling + setError('channel_not_found'); return; } @@ -87,6 +88,18 @@ neynarClientContext.client, ]); + const errorMessage = React.useMemo(() => { + if (!error) { + return null; + } + + return ( + + {tagFarcasterChannelErrorMessages[error] ?? 'Unknown error.'} + + ); + }, [error, styles.error]); + const submitButtonVariant = channelSelectionText.length > 0 ? 'enabled' : 'disabled'; @@ -105,13 +118,12 @@ autoCapitalize="none" /> - - - + {errorMessage} + ); @@ -144,13 +156,18 @@ borderWidth: 1, borderColor: 'panelSecondaryForegroundBorder', borderRadius: 8, + marginBottom: 8, }, input: { color: 'panelForegroundLabel', fontSize: 16, }, - buttonContainer: { - marginTop: 16, + error: { + fontSize: 12, + fontWeight: '400', + lineHeight: 18, + textAlign: 'center', + color: 'redText', }, }; diff --git a/native/community-settings/tag-farcaster-channel/tag-farcaster-channel-utils.js b/native/community-settings/tag-farcaster-channel/tag-farcaster-channel-utils.js new file mode 100644 --- /dev/null +++ b/native/community-settings/tag-farcaster-channel/tag-farcaster-channel-utils.js @@ -0,0 +1,8 @@ +// @flow + +const tagFarcasterChannelErrorMessages: { +[string]: string } = { + already_in_use: 'This Farcaster channel is already tagged to a community.', + channel_not_found: 'Cannot find a channel with the provided name.', +}; + +export { tagFarcasterChannelErrorMessages }; diff --git a/native/community-settings/tag-farcaster-channel/tag-farcaster-channel.react.js b/native/community-settings/tag-farcaster-channel/tag-farcaster-channel.react.js --- a/native/community-settings/tag-farcaster-channel/tag-farcaster-channel.react.js +++ b/native/community-settings/tag-farcaster-channel/tag-farcaster-channel.react.js @@ -16,16 +16,13 @@ import { useDispatchActionPromise } from 'lib/utils/redux-promise-utils.js'; import type { TagFarcasterChannelNavigationProp } from './tag-farcaster-channel-navigator.react.js'; +import { tagFarcasterChannelErrorMessages } from './tag-farcaster-channel-utils.js'; import RegistrationButton from '../../account/registration/registration-button.react.js'; import SWMansionIcon from '../../components/swmansion-icon.react.js'; import { type NavigationRoute } from '../../navigation/route-names.js'; import { useSelector } from '../../redux/redux-utils.js'; import { useStyles, useColors } from '../../themes/colors.js'; -const tagFarcasterErrorMessages: { +[string]: string } = { - already_in_use: 'This Farcaster channel is already tagged to a community.', -}; - export type TagFarcasterChannelParams = { +communityID: string, }; @@ -160,7 +157,7 @@ return ( - {tagFarcasterErrorMessages[error] ?? 'Unknown error.'} + {tagFarcasterChannelErrorMessages[error] ?? 'Unknown error.'} ); }, [error, styles.error]);