TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-11-23 03:42:27 +03:00
Code Issues Projects Releases Wiki Activity

Added icons to Activity items to make it easier to scan the page

Browse Source 
ref https://linear.app/tryghost/issue/AP-283/handle-incoming-likes
This commit is contained in:
Djordje Vlaisavljevic 2024-09-02 10:33:01 +01:00
parent c260ed5202
commit a3e498106d
2 changed files with 23 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
apps/admin-x-activitypub/src/components/Activities.tsx
View File

@ -1,4 +1,4 @@
import APAvatar from './global/APAvatar'; import APAvatar, {AvatarBadge} from './global/APAvatar';
import ActivityItem from './activities/ActivityItem'; import ActivityItem from './activities/ActivityItem';
import MainNavigation from './navigation/MainNavigation'; import MainNavigation from './navigation/MainNavigation';
import React from 'react'; import React from 'react';
@ -60,6 +60,25 @@ const getActivityUrl = (activity: Activity): string | null => {
return null; return null;
}; };
const getActorUrl = (activity: Activity): string | null => {
if (activity.actor) {
return activity.actor.url;
}
return null;
};
const getActivityBadge = (activity: Activity): AvatarBadge => {
switch (activity.type) {
case ACTVITY_TYPE.FOLLOW:
return 'user-fill';
case ACTVITY_TYPE.LIKE:
if (activity.object) {
return 'heart-fill';
}
}
};
const isFollower = (id: string, followerIds: string[]): boolean => { const isFollower = (id: string, followerIds: string[]): boolean => {
return followerIds.includes(id); return followerIds.includes(id);
}; };
@ -85,8 +104,8 @@ const Activities: React.FC<ActivitiesProps> = ({}) => {
{activities.length > 0 && ( {activities.length > 0 && (
<div className='mt-8 flex w-full max-w-[560px] flex-col'> <div className='mt-8 flex w-full max-w-[560px] flex-col'>
{activities?.map(activity => ( {activities?.map(activity => (
<ActivityItem key={activity.id} url={getActivityUrl(activity)}> <ActivityItem key={activity.id} url={getActivityUrl(activity) || getActorUrl(activity)}>
<APAvatar author={activity.actor} /> <APAvatar author={activity.actor} badge={getActivityBadge(activity)} />
<div> <div>
<div className='text-grey-600'> <div className='text-grey-600'>
<span className='mr-1 font-bold text-black'>{activity.actor.name}</span> <span className='mr-1 font-bold text-black'>{activity.actor.name}</span>

2
apps/admin-x-activitypub/src/components/activities/ActivityItem.tsx
View File

@ -17,7 +17,7 @@ const ActivityItem: React.FC<ActivityItemProps> = ({children, url = null}) => {
const Item = ( const Item = (
<div className='flex w-full max-w-[560px] flex-col hover:bg-grey-75'> <div className='flex w-full max-w-[560px] flex-col hover:bg-grey-75'>
<div className='flex w-full items-center gap-3 border-b border-grey-100 py-4'> <div className='flex w-full items-center gap-4 border-b border-grey-100 px-2 py-4'>
{childrenArray[0]} {childrenArray[0]}
{childrenArray[1]} {childrenArray[1]}
{childrenArray[2]} {childrenArray[2]}