tqt/Ghost
2
1
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2023-12-13 21:00:40 +01:00
Code Issues 1 Releases Wiki Activity

Improved recommendations stats design

Browse source 
refs https://github.com/TryGhost/Product/issues/4024
This commit is contained in:
Djordje Vlaisavljevic 2023-10-11 16:55:48 +01:00
parent f917cf91ef
commit 8822725c01
2 changed files with 26 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
apps/admin-x-settings/src/components/settings/site/recommendations/IncomingRecommendationList.tsx
View file

@ -9,6 +9,7 @@ import useRouting from '../../../../hooks/useRouting';
import {IncomingRecommendation} from '../../../../api/recommendations';
import {PaginationData} from '../../../../hooks/usePagination';
import {ReferrerHistoryItem} from '../../../../api/referrers';
import {numberWithCommas} from '../../../../utils/helpers';
interface IncomingRecommendationListProps {
incomingRecommendations: IncomingRecommendation[],
@ -67,10 +68,19 @@ const IncomingRecommendationItem: React.FC<{incomingRecommendation: IncomingReco
</div>
</div>
</TableCell>
<TableCell className='hidden align-middle md:!visible md:!table-cell' onClick={showDetails}>
{signups === 0 ? <span className="text-grey-500">-</span> : (<div className='-mt-px flex grow items-end gap-1'><span>{signups}</span><span className='-mb-px whitespace-nowrap text-sm lowercase text-grey-700'>{freeMembersLabel}</span></div>)}
<TableCell className='hidden !pr-1 pl-0 text-right align-middle md:!visible md:!table-cell' onClick={showDetails}>
{(signups === 0) ? (<span className="text-grey-500 dark:text-grey-900">-</span>) : (<div className='-mt-px text-right'>
<span className='text-right'>{numberWithCommas(signups)}</span>
</div>)}
</TableCell>
{incomingRecommendation.recommending_back && <TableCell className='group-hover/table-row:visible md:invisible'><div className='mt-1 whitespace-nowrap text-right text-sm leading-[1.8] text-grey-700'>Recommending back</div></TableCell>}
<TableCell className='hidden align-middle md:!visible md:!table-cell' onClick={showDetails}>
{(signups === 0) ? (null) : (<div className='-mt-px text-left'>
<span className='-mb-px inline-block min-w-[60px] whitespace-nowrap text-left text-sm lowercase text-grey-700'>{freeMembersLabel}</span>
</div>)}
</TableCell>
{incomingRecommendation.recommending_back && <TableCell className='group-hover/table-row:visible md:invisible'><div className='mt-1 whitespace-nowrap text-right text-sm text-grey-700'>Recommending back</div></TableCell>}
</TableRow>
);
};

22
apps/admin-x-settings/src/components/settings/site/recommendations/RecommendationList.tsx
View file

@ -1,19 +1,19 @@
import Button from '../../../../admin-x-ds/global/Button';
import EditRecommendationModal from './EditRecommendationModal';
import Link from '../../../../admin-x-ds/global/Link';
import NiceModal from '@ebay/nice-modal-react';
import NoValueLabel from '../../../../admin-x-ds/global/NoValueLabel';
import React, {useState} from 'react';
import RecommendationIcon from './RecommendationIcon';
import Table, {ShowMoreData} from '../../../../admin-x-ds/global/Table';
import TableCell from '../../../../admin-x-ds/global/TableCell';
// import TableHead from '../../../../admin-x-ds/global/TableHead';
import Button from '../../../../admin-x-ds/global/Button';
import EditRecommendationModal from './EditRecommendationModal';
import Link from '../../../../admin-x-ds/global/Link';
import NiceModal from '@ebay/nice-modal-react';
import TableRow from '../../../../admin-x-ds/global/TableRow';
import Tooltip from '../../../../admin-x-ds/global/Tooltip';
import useRouting from '../../../../hooks/useRouting';
import useSettingGroup from '../../../../hooks/useSettingGroup';
import {PaginationData} from '../../../../hooks/usePagination';
import {Recommendation} from '../../../../api/recommendations';
import {numberWithCommas} from '../../../../utils/helpers';
interface RecommendationListProps {
recommendations: Recommendation[],
@ -53,10 +53,14 @@ const RecommendationItem: React.FC<{recommendation: Recommendation}> = ({recomme
</div>
</div>
</TableCell>
<TableCell className='hidden w-8 align-middle md:!visible md:!table-cell' onClick={showDetails}>
{(count === 0) ? (<span className="text-grey-500 dark:text-grey-900">-</span>) : (<div className='-mt-px flex grow items-end gap-1'>
<span>{count}</span>
<span className='-mb-px whitespace-nowrap text-sm lowercase text-grey-700'>{showSubscribers ? newMembers : clicks}</span>
<TableCell className='hidden !pr-1 pl-0 text-right align-middle md:!visible md:!table-cell' onClick={showDetails}>
{(count === 0) ? (<span className="text-grey-500 dark:text-grey-900">-</span>) : (<div className='-mt-px items-end gap-1 text-right'>
<span className='text-right'>{numberWithCommas(count)}</span>
</div>)}
</TableCell>
<TableCell className='hidden align-middle md:!visible md:!table-cell' onClick={showDetails}>
{(count === 0) ? (null) : (<div className='-mt-px items-end gap-1 text-left'>
<span className='-mb-px inline-block min-w-[60px] whitespace-nowrap text-left text-sm lowercase text-grey-700'>{showSubscribers ? newMembers : clicks}</span>
</div>)}
</TableCell>
</TableRow>