0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-04-08 02:52:39 -05:00

Added support for showing reposted posts in inbox

ref https://linear.app/ghost/issue/AP-697/add-ui-for-reposted-inbox-posts

- Updated activity filter to show posts reposted by accounts you're following in your inbox
- Updated UI to indicate when a post shown in the inbox is reposted
- Updated UI for showing reposted notes for better alignment
- Added onClick to the repost indicator so it's easy to see the details of the account that reposted the content
- Bumped the package
This commit is contained in:
Djordje Vlaisavljevic 2025-02-03 14:46:56 +00:00
parent d1f5ad7646
commit c178964d67
3 changed files with 7 additions and 14 deletions

View file

@ -1,6 +1,6 @@
{
"name": "@tryghost/admin-x-activitypub",
"version": "0.3.55",
"version": "0.3.56",
"license": "MIT",
"repository": {
"type": "git",

View file

@ -33,7 +33,7 @@ const Inbox: React.FC<InboxProps> = ({layout}) => {
// Initialise activities for the inbox or feed
const typeFilter = layout === 'inbox'
? ['Create:Article']
? ['Create:Article', 'Announce:Article']
: ['Create:Note', 'Announce:Note'];
const {getActivitiesQuery, updateActivity} = useActivitiesForUser({

View file

@ -203,7 +203,7 @@ const FeedItem: React.FC<FeedItemProps> = ({actor, object, layout, type, comment
};
let author = actor;
if (type === 'Announce' && object.type === 'Note') {
if (type === 'Announce') {
author = typeof object.attributedTo === 'object' ? object.attributedTo as ActorProperties : actor;
}
@ -240,9 +240,9 @@ const FeedItem: React.FC<FeedItemProps> = ({actor, object, layout, type, comment
<>
{object && (
<div className={`group/article relative -mx-6 -my-px cursor-pointer rounded-lg p-6 pb-[18px]`} data-layout='feed' data-object-id={object.id} onClick={onClick}>
{(type === 'Announce' && object.type === 'Note') && <div className='z-10 mb-2 flex items-center gap-3 text-grey-700'>
<div className='z-10 flex w-10 justify-end'><Icon colorClass='text-grey-700' name='reload' size={'sm'}></Icon></div>
<span className='z-10'>{actor.name} reposted</span>
{(type === 'Announce') && <div className='z-10 mb-2 flex items-center gap-2 text-grey-700'>
<div><Icon colorClass='text-grey-700' name='reload' size={'sm'}></Icon></div>
<span><span className='hover:underline' title={getUsername(actor)} onClick={e => handleProfileClick(actor, e)}>{actor.name}</span> reposted</span>
</div>}
<div className={`border-1 flex flex-col gap-2.5`} data-test-activity>
<div className='relative z-30 flex min-w-0 items-center gap-3'>
@ -311,10 +311,6 @@ const FeedItem: React.FC<FeedItemProps> = ({actor, object, layout, type, comment
{object && (
<div data-object-id={object.id}>
<div className={`group/article relative`} data-layout='modal' onClick={onClick}>
{(type === 'Announce' && object.type === 'Note') && <div className='z-10 mb-2 flex items-center gap-3 text-grey-700'>
<div className='z-10 flex w-10 justify-end'><Icon colorClass='text-grey-700' name='reload' size={'sm'}></Icon></div>
<span className='z-10'>{actor.name} reposted</span>
</div>}
<div className={`z-10 -my-1 grid grid-cols-[auto_1fr] grid-rows-[auto_1fr] gap-3 pb-3 pt-4`} data-test-activity>
{(showHeader) && <><div className='relative z-10 pt-[3px]'>
<APAvatar author={author}/>
@ -360,10 +356,6 @@ const FeedItem: React.FC<FeedItemProps> = ({actor, object, layout, type, comment
<>
{object && (
<div className={`group/article relative cursor-pointer py-5`} data-layout='reply' data-object-id={object.id} onClick={onClick}>
{(type === 'Announce' && object.type === 'Note') && <div className='z-10 mb-2 flex items-center gap-3 text-grey-700'>
<div className='z-10 flex w-10 justify-end'><Icon colorClass='text-grey-700' name='reload' size={'sm'}></Icon></div>
<span className='z-10'>{actor.name} reposted</span>
</div>}
<div className={`border-1 z-10 flex items-start gap-3 border-b-grey-200`} data-test-activity>
<div className='relative z-10 pt-[3px]'>
<APAvatar author={author}/>
@ -429,6 +421,7 @@ const FeedItem: React.FC<FeedItemProps> = ({actor, object, layout, type, comment
onClick={e => handleProfileClick(actor, e)}
>{author.name}
</span>
{(type === 'Announce') && <span className='z-10 flex items-center gap-1 text-grey-700'><Icon colorClass='text-grey-700' name='reload' size={'sm'}></Icon><span className='z-10'><span className='hover:underline' title={getUsername(actor)} onClick={e => handleProfileClick(actor, e)}>{actor.name}</span> reposted</span></span>}
<span className='shrink-0 whitespace-nowrap text-grey-600 before:mr-1 before:content-["·"]' title={`${timestamp}`}>{renderTimestamp(object)}</span>
</div>
<div className='flex'>