Skip to content

Commit

Permalink
Fix rebase
Browse files Browse the repository at this point in the history
  • Loading branch information
oandregal committed Feb 4, 2025
1 parent 4d53f33 commit a1297b3
Showing 1 changed file with 15 additions and 96 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,11 @@ const SubscriberName = ( { displayName, email }: { displayName: string; email: s

const defaultView: View = {
type: 'table',
titleField: 'name',
mediaField: 'media',
showTitle: true,
showMedia: true,
fields: [ 'plan', 'date_subscribed' ],
layout: {
styles: {
media: { width: '60px' },
Expand All @@ -50,11 +55,8 @@ const defaultView: View = {
date_subscribed: { width: '25%' },
},
},
fields: [ 'name', 'plan', 'date_subscribed' ],
};

const getSubscriberId = ( subscriber: Subscriber ) => subscriber.subscription_id.toString();

const SubscriberDataViews = ( {
siteId = undefined,
isUnverified = false,
Expand All @@ -65,43 +67,6 @@ const SubscriberDataViews = ( {
const [ searchTerm, setSearchTerm ] = useState( '' );
const [ filterOption, setFilterOption ] = useState( SubscribersFilterBy.All );
const [ selectedSubscriber, setSelectedSubscriber ] = useState< Subscriber | null >( null );
const couponsAndGiftsEnabled = useSelector( ( state ) =>
getCouponsAndGiftsEnabledForSiteId( state, siteId )
);

const {
grandTotal,
page,
pageChangeCallback,
searchTerm,
isLoading,
subscribers,
pages,
isOwnerSubscribed,
perPage,
setPerPage,
handleSearch,
sortTerm,
sortOrder,
filterOption,
setSortTerm,
setSortOrder,
setFilterOption,
} = useSubscribersPage();

const [ currentView, setCurrentView ] = useState< View >( {
type: 'table',
layout: {},
page,
perPage,
titleField: 'name',
mediaField: 'media',
sort: {
field: sortTerm,
direction: 'desc',
},
} );

const { isSimple, isAtomic } = useSelector( ( state ) => ( {
isSimple: isSimpleSite( state ),
isAtomic: isAtomicSite( state, siteId ),
Expand Down Expand Up @@ -199,6 +164,7 @@ const SubscriberDataViews = ( {
() => [
{
id: 'media',
label: translate( 'Media' ),
getValue: ( { item }: { item: Subscriber } ) => item.avatar,
render: ( { item }: { item: Subscriber } ) => (
<Gravatar
Expand Down Expand Up @@ -246,7 +212,7 @@ const SubscriberDataViews = ( {
enableSorting: true,
},
],
[ translate ]
[]
);

const actions = useMemo< Action< Subscriber >[] >( () => {
Expand Down Expand Up @@ -294,31 +260,32 @@ const SubscriberDataViews = ( {
handleUnsubscribe,
onGiftSubscription,
couponsAndGiftsEnabled,
getSubscriberId,
] );

useEffect( () => {
// If we're on mobile, we only want to show the name field.
if ( isMobile ) {
setCurrentView( ( prevView ) => ( {
...prevView,
fields: [ 'name' ],
showMedia: false,
fields: [],
} ) );
} else if ( selectedSubscriber ) {
// If we're on subscribers page, we want to show the list view.
// If we're on subscribers page, we want to show the list view (name & media).
setCurrentView( ( prevView ) => ( {
...prevView,
type: 'list',
fields: [ 'media', 'name' ],
layout: {
primaryField: 'name',
mediaField: 'media',
},
showTitle: true,
showMedia: true,
fields: [],
} ) );
} else {
// Otherwise, we want to show the table view.
setCurrentView( ( prevView ) => ( {
...prevView,
...defaultView,
layout: defaultView.layout,
} ) );
}
}, [ isMobile, selectedSubscriber ] );
Expand All @@ -344,54 +311,6 @@ const SubscriberDataViews = ( {
};
}, [ subscribers, grandTotal, pages ] );

// Update the view when a subscriber is selected
useEffect( () => {
const commonViewProps = {
page,
perPage,
sort: {
field: sortTerm,
direction: sortOrder,
},
filters: [
...( filterOption !== SubscribersFilterBy.All
? [ { field: 'plan', operator: 'is', value: [ filterOption ] } ]
: [] ),
],
};

setCurrentView( ( oldCurrentView ) => {
const baseView = {
...oldCurrentView,
...commonViewProps,
};

if ( selectedSubscriber ) {
return {
...baseView,
type: 'list',
fields: [],
titleField: 'name',
mediaField: 'media',
} as View;
}

return {
...baseView,
type: 'table',
fields: [ ...( ! isMobile ? [ 'subscription_type', 'date_subscribed' ] : [] ) ],
layout: {
styles: {
media: { width: '60px' },
name: { width: '55%', minWidth: '195px' },
plan: { width: '25%' },
date_subscribed: { width: '25%' },
},
},
} as View;
} );
}, [ isMobile, selectedSubscriber, page, perPage, sortTerm, sortOrder, filterOption ] );

return (
<div
className={ `subscriber-data-views ${ selectedSubscriber ? 'has-selected-subscriber' : '' }` }
Expand Down

0 comments on commit a1297b3

Please sign in to comment.