diff --git a/client/my-sites/subscribers/components/subscriber-data-views/subscriber-data-views.tsx b/client/my-sites/subscribers/components/subscriber-data-views/subscriber-data-views.tsx index c2962f0d4ef30..8f999bc0ba029 100644 --- a/client/my-sites/subscribers/components/subscriber-data-views/subscriber-data-views.tsx +++ b/client/my-sites/subscribers/components/subscriber-data-views/subscriber-data-views.tsx @@ -5,6 +5,7 @@ import TimeSince from 'calypso/components/time-since'; import { EmptyListView } from 'calypso/my-sites/subscribers/components/empty-list-view'; import { SubscriberLaunchpad } from 'calypso/my-sites/subscribers/components/subscriber-launchpad'; import { useSubscribersPage } from 'calypso/my-sites/subscribers/components/subscribers-page/subscribers-page-context'; +import { useSubscriptionPlans } from 'calypso/my-sites/subscribers/hooks'; import { Subscriber } from 'calypso/my-sites/subscribers/types'; import { useSelector } from 'calypso/state'; import isAtomicSite from 'calypso/state/selectors/is-site-automated-transfer'; @@ -13,6 +14,17 @@ import { SubscribersSortBy } from '../../constants'; import type { View, Field, Action } from '@wordpress/dataviews'; import './style.scss'; +const SubscriptionTypeCell = ( { subscriber }: { subscriber: Subscriber } ) => { + const plans = useSubscriptionPlans( subscriber ); + return ( + <> + { plans.map( ( plan, index ) => ( +
{ plan.plan }
+ ) ) } + + ); +}; + type SubscriberDataViewsProps = { siteId: number | null; onClickView: ( subscriber: Subscriber ) => void; @@ -65,6 +77,8 @@ const SubscriberDataViews = ( { { id: 'subscription_type', label: translate( 'Subscription type' ), + getValue: ( { item }: { item: Subscriber } ) => ( item.plans?.length ? 'Paid' : 'Free' ), + render: ( { item }: { item: Subscriber } ) => , enableHiding: false, enableSorting: true, },