diff --git a/apps/admin-x-settings/src/components/settings/membership/portal/PortalLinks.tsx b/apps/admin-x-settings/src/components/settings/membership/portal/PortalLinks.tsx index cb794665cc..0b3cfb53bd 100644 --- a/apps/admin-x-settings/src/components/settings/membership/portal/PortalLinks.tsx +++ b/apps/admin-x-settings/src/components/settings/membership/portal/PortalLinks.tsx @@ -2,11 +2,12 @@ import Button from '../../../../admin-x-ds/global/Button'; import List from '../../../../admin-x-ds/global/List'; import ListItem from '../../../../admin-x-ds/global/ListItem'; import ModalPage from '../../../../admin-x-ds/global/modal/ModalPage'; -import React, {useContext, useState} from 'react'; +import React, {useContext, useEffect, useState} from 'react'; import Select from '../../../../admin-x-ds/global/form/Select'; import TextField from '../../../../admin-x-ds/global/form/TextField'; import {SettingsContext} from '../../../providers/SettingsProvider'; import {getHomepageUrl} from '../../../../utils/helpers'; +import {useTiers} from '../../../providers/ServiceProvider'; interface PortalLinksPrefs { @@ -41,12 +42,27 @@ const PortalLink: React.FC = ({name, value}) => { const PortalLinks: React.FC = () => { const [isDataAttributes, setIsDataAttributes] = useState(false); + const [selectedTier, setSelectedTier] = useState(''); const {siteData} = useContext(SettingsContext); + const {data: tiers} = useTiers(); const toggleIsDataAttributes = () => { setIsDataAttributes(!isDataAttributes); }; + useEffect(() => { + if (tiers?.length) { + setSelectedTier(tiers[0].id); + } + }, [tiers]); + + const tierOptions = tiers?.map((tier) => { + return { + label: tier.name, + value: tier.id + }; + }); + const homePageURL = getHomepageUrl(siteData!); return ( @@ -54,9 +70,9 @@ const PortalLinks: React.FC = () => {

Use these {isDataAttributes ? 'data attributes' : 'links'} in your theme to show pages of Portal.

} title='Generic'> - - - + + + @@ -68,32 +84,24 @@ const PortalLinks: React.FC = () => { Tier