diff --git a/jsapp/js/account/accountSettingsRoute.tsx b/jsapp/js/account/accountSettingsRoute.tsx index bdaf7368ce..3a145b44e1 100644 --- a/jsapp/js/account/accountSettingsRoute.tsx +++ b/jsapp/js/account/accountSettingsRoute.tsx @@ -20,6 +20,7 @@ import type { } from './account.constants'; import {HELP_ARTICLE_ANON_SUBMISSIONS_URL} from 'js/constants'; import {useSession} from '../stores/useSession'; +import {useOrganizationQuery} from './organization/organizationQuery'; bem.AccountSettings = makeBem(null, 'account-settings', 'form'); bem.AccountSettings__left = makeBem(bem.AccountSettings, 'left'); @@ -39,12 +40,17 @@ const AccountSettings = () => { const {currentLoggedAccount, refreshAccount} = useSession(); + const [displayedFields, setDisplayedFields] = useState>([]); + + const orgQuery = useOrganizationQuery(); + useEffect(() => { - if (!currentLoggedAccount) { + + if (!currentLoggedAccount || !orgQuery.data) { return; } - setFormFields({ + const fields = { name: currentLoggedAccount.extra_details.name, organization_type: currentLoggedAccount.extra_details.organization_type, organization: currentLoggedAccount.extra_details.organization, @@ -60,8 +66,29 @@ const AccountSettings = () => { instagram: currentLoggedAccount.extra_details.instagram, newsletter_subscription: currentLoggedAccount.extra_details.newsletter_subscription, - }); - }, [currentLoggedAccount]); + }; + + setFormFields(fields); + + const fieldKeys = Object.keys(fields) as Array; + + const organization = orgQuery.data; + + // We will not display organization fields if user is a member of an MMO, + // only displaying these fields in organization settings view + setDisplayedFields( + !organization?.is_mmo + ? fieldKeys + : fieldKeys.filter((key) => + ![ + 'organization', + 'organization_website', + 'organization_type', + ].includes(key) + ) + ); + + }, [currentLoggedAccount, orgQuery.data]); usePrompt({ when: !isPristine, @@ -159,6 +186,7 @@ const AccountSettings = () => { errors={fieldErrors} values={formFields} onFieldChange={onFieldChange} + displayedFields={displayedFields} /> )}