0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-17 23:44:39 -05:00

Added total count of recommendations on the tabs (#18303)

closes https://github.com/TryGhost/Product/issues/3941
This commit is contained in:
Sag 2023-09-22 15:25:20 +02:00 committed by GitHub
parent 23ec56bedf
commit 9c9f0ebadf
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 37 additions and 40 deletions

View file

@ -1,5 +1,5 @@
import Button from '../../../admin-x-ds/global/Button';
import IncomingRecommendations from './recommendations/IncomingRecommendations';
import IncomingRecommendationList from './recommendations/IncomingRecommendationList';
import React, {useState} from 'react';
import RecommendationList from './recommendations/RecommendationList';
import SettingGroup from '../../../admin-x-ds/settings/SettingGroup';
@ -7,7 +7,9 @@ import TabView from '../../../admin-x-ds/global/TabView';
import useRouting from '../../../hooks/useRouting';
import useSettingGroup from '../../../hooks/useSettingGroup';
import {ShowMoreData} from '../../../admin-x-ds/global/Table';
import {useBrowseMentions} from '../../../api/mentions';
import {useBrowseRecommendations} from '../../../api/recommendations';
import {useReferrerHistory} from '../../../api/referrers';
import {withErrorBoundary} from '../../../admin-x-ds/global/ErrorBoundary';
const Recommendations: React.FC<{ keywords: string[] }> = ({keywords}) => {
@ -16,7 +18,8 @@ const Recommendations: React.FC<{ keywords: string[] }> = ({keywords}) => {
handleSave
} = useSettingGroup();
const {data: {recommendations} = {}, isLoading, hasNextPage, fetchNextPage} = useBrowseRecommendations({
// Fetch "Your recommendations"
const {data: {meta: recommendationsMeta, recommendations} = {}, isLoading: areRecommendationsLoading, hasNextPage, fetchNextPage} = useBrowseRecommendations({
searchParams: {
include: 'count.clicks,count.subscribers',
limit: '5'
@ -43,12 +46,43 @@ const Recommendations: React.FC<{ keywords: string[] }> = ({keywords}) => {
keepPreviousData: true
});
const showMore: ShowMoreData = {
const showMoreRecommendations: ShowMoreData = {
hasMore: !!hasNextPage,
loadMore: fetchNextPage
};
// Fetch "Recommending you" (mentions & stats)
const {data: {mentions} = {}, pagination: mentionsPagination, isLoading: areMentionsLoading} = useBrowseMentions({
searchParams: {
limit: '5',
filter: `source:~$'/.well-known/recommendations.json'+verified:true`,
order: 'created_at desc'
}
});
const {data: {stats: mentionsStats} = {}, isLoading: areSourcesLoading} = useReferrerHistory({});
// Select "Your recommendations" by default
const [selectedTab, setSelectedTab] = useState('your-recommendations');
const tabs = [
{
id: 'your-recommendations',
title: `Your recommendations ${recommendationsMeta?.pagination?.total ? `(${recommendationsMeta.pagination.total})` : ''}`,
contents: <RecommendationList isLoading={areRecommendationsLoading} recommendations={recommendations ?? []} showMore={showMoreRecommendations}/>
},
{
id: 'recommending-you',
title: `Recommending you ${mentionsPagination?.total ? `(${mentionsPagination.total})` : ''}`,
contents: <IncomingRecommendationList isLoading={areMentionsLoading || areSourcesLoading} mentions={mentions ?? []} pagination={mentionsPagination} stats={mentionsStats ?? []}/>
}
];
const groupDescription = (
<>Recommend any publication you think your audience will find valuable, and find out when others are recommending you.</>
);
// Add a new recommendation
const {updateRoute} = useRouting();
const openAddNewRecommendationModal = () => {
updateRoute('recommendations/add');
@ -60,23 +94,6 @@ const Recommendations: React.FC<{ keywords: string[] }> = ({keywords}) => {
}} />
);
const tabs = [
{
id: 'your-recommendations',
title: 'Your recommendations',
contents: (<RecommendationList isLoading={isLoading} recommendations={recommendations ?? []} showMore={showMore}/>)
},
{
id: 'recommending-you',
title: 'Recommending you',
contents: (<IncomingRecommendations />)
}
];
const groupDescription = (
<>Recommend any publication you think your audience will find valuable, and find out when others are recommending you.</>
);
return (
<SettingGroup
customButtons={buttons}

View file

@ -1,20 +0,0 @@
import IncomingRecommendationList from './IncomingRecommendationList';
import {useBrowseMentions} from '../../../../api/mentions';
import {useReferrerHistory} from '../../../../api/referrers';
const IncomingRecommendations: React.FC = () => {
const {data: {mentions} = {}, pagination, isLoading} = useBrowseMentions({
searchParams: {
limit: '5',
filter: `source:~$'/.well-known/recommendations.json'+verified:true`,
order: 'created_at desc'
}
});
// Also fetch sources
const {data: {stats} = {}, isLoading: areSourcesLoading} = useReferrerHistory({});
return (<IncomingRecommendationList isLoading={isLoading || areSourcesLoading} mentions={mentions ?? []} pagination={pagination} stats={stats ?? []}/>);
};
export default IncomingRecommendations;