🎨 Removed any from activitypub (#28557)

no ref

This PR is another small `any` cleanup, like the previous ones.

Removes the loose `any` index signatures from the shared ActivityPub API
types and replaces them with the props that are already consumed in the
ActivityPub app.

Author: PedroMarianoAlmeida

apps/activitypub/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tryghost/activitypub",
-  "version": "3.1.37",
+  "version": "3.1.40",
   "license": "MIT",
   "repository": {
     "type": "git",

apps/activitypub/src/components/feed/feed-item.tsx

@@ -1,6 +1,6 @@
 import FeedItemMenu from './feed-item-menu';
 import React, {useEffect, useRef, useState} from 'react';
-import {ActorProperties, ObjectProperties} from '@tryghost/admin-x-framework/api/activitypub';
+import {ActivityPubAttachment, ActorProperties, ObjectProperties} from '@tryghost/admin-x-framework/api/activitypub';
 import {Button, Skeleton} from '@tryghost/shade/components';
 import {H4} from '@tryghost/shade/primitives';
 import {LucideIcon} from '@tryghost/shade/utils';
@@ -20,11 +20,18 @@ import {renderTimestamp} from '../../utils/render-timestamp';
 import {useDeleteMutationForUser, useFollowMutationForUser, useUnfollowMutationForUser} from '../../hooks/use-activity-pub-queries';
 import {useNavigateWithBasePath} from '@src/hooks/use-navigate-with-base-path';
 
-export function getAttachment(object: ObjectProperties) {
-    let attachment;
+export function getAttachment(object: ObjectProperties): ActivityPubAttachment | ActivityPubAttachment[] | null {
+    let attachment: ActivityPubAttachment | ActivityPubAttachment[] | undefined;
 
     if (object.image) {
-        attachment = object.image;
+        attachment = typeof object.image === 'string' ? {
+            type: 'Image',
+            url: object.image
+        } : {
+            type: object.image.type ?? 'Image',
+            mediaType: object.image.mediaType,
+            url: object.image.url
+        };
     }
 
     if (object.type === 'Note' && !attachment) {

apps/activitypub/src/utils/pending-activity.ts

@@ -58,6 +58,7 @@ export function generatePendingActivity(actorProps: ActorProperties, id: string,
             // These are used in the app, but are not part of the ObjectProperties type
             id,
             replyCount: 0,
+            likeCount: 0,
             liked: false,
             reposted: false,
             repostCount: 0,

apps/activitypub/src/views/notifications/notifications.tsx

@@ -1,7 +1,7 @@
 import React, {useEffect, useRef} from 'react';
 import {ActorProperties} from '@tryghost/admin-x-framework/api/activitypub';
 import {Button, LoadingIndicator, Skeleton} from '@tryghost/shade/components';
-import {LucideIcon} from '@tryghost/shade/utils';
+import {LucideIcon, formatNumber} from '@tryghost/shade/utils';
 
 import APAvatar from '@components/global/ap-avatar';
 import AppError from '@components/layout/error';
@@ -113,6 +113,7 @@ function groupNotifications(notifications: Notification[]): NotificationGroup[]
 const NotificationGroupDescription: React.FC<NotificationGroupDescriptionProps> = ({group}) => {
     const [firstActor, ...otherActors] = group.actors;
     const hasOthers = otherActors.length > 0;
+    const otherActorsCount = otherActors.length;
 
     const actorClass = 'cursor-pointer font-semibold hover:underline text-black dark:text-white';
 
@@ -125,13 +126,15 @@ const NotificationGroupDescription: React.FC<NotificationGroupDescriptionProps>
                     className={actorClass}
                     onClick={(e) => {
                         e?.stopPropagation();
-                        handleProfileClick(firstActor.handle, navigate);
+                        if (firstActor.handle) {
+                            handleProfileClick(firstActor.handle, navigate);
+                        }
                     }}
                 >
                     {firstActor.name}
                 </span>
             </ProfilePreviewHoverCard>
-            {hasOthers && ` and ${otherActors.length} ${otherActors.length > 1 ? 'others' : 'other'}`}
+            {hasOthers && ` and ${formatNumber(otherActorsCount)} ${otherActorsCount > 1 ? 'others' : 'other'}`}
         </>
     );
 
@@ -271,7 +274,7 @@ const Notifications: React.FC = () => {
         case 'follow':
             if (group.actors.length > 1) {
                 toggleOpen(group.id || `${group.type}_${index}`);
-            } else {
+            } else if (group.actors[0]?.handle) {
                 handleProfileClick(group.actors[0].handle, navigate);
             }
             break;
@@ -349,7 +352,7 @@ const Notifications: React.FC = () => {
                                                         ))}
                                                         {group.actors.length > maxAvatars && (!openStates[group.id || `${group.type}_${index}`]) && (
                                                             <div className='absolute right-[28px] z-10 flex size-9 items-center justify-center rounded-full bg-black/50 text-base font-semibold tracking-tightest text-white'>
-                                                                {`+${group.actors.length - maxAvatars}`}
+                                                                {`+${formatNumber(group.actors.length - maxAvatars)}`}
                                                             </div>
                                                         )}
 
@@ -372,7 +375,9 @@ const Notifications: React.FC = () => {
                                                                         className='group/item break-anywhere flex items-center justify-between gap-4'
                                                                         onClick={(e) => {
                                                                             e?.stopPropagation();
-                                                                            handleProfileClick(actor.handle, navigate);
+                                                                            if (actor.handle) {
+                                                                                handleProfileClick(actor.handle, navigate);
+                                                                            }
                                                                         }}
                                                                     >
                                                                         <div className='flex min-w-0 items-center'>
@@ -386,7 +391,7 @@ const Notifications: React.FC = () => {
                                                                             <span className='ml-2 line-clamp-1 text-base font-semibold group-hover/item:underline dark:text-white'>{actor.name}</span>
                                                                             <span className='ml-1 line-clamp-1 text-base text-gray-700 dark:text-gray-600'>{actor.handle}</span>
                                                                         </div>
-                                                                        {group.type === 'follow' && !actor.followedByMe && (
+                                                                        {group.type === 'follow' && !actor.followedByMe && actor.handle && (
                                                                             <FollowButton
                                                                                 following={false}
                                                                                 handle={actor.handle}
@@ -418,7 +423,7 @@ const Notifications: React.FC = () => {
                                                                 }
                                                             </div>
                                                             {/* Follow button for singular follow, reply, and mention */}
-                                                            {group.actors.length === 1 && (group.type === 'follow' || group.type === 'reply' || group.type === 'mention') && !group.actors[0].followedByMe && (
+                                                            {group.actors.length === 1 && (group.type === 'follow' || group.type === 'reply' || group.type === 'mention') && !group.actors[0].followedByMe && group.actors[0].handle && (
                                                                 <FollowButton
                                                                     following={false}
                                                                     handle={group.actors[0].handle}

apps/activitypub/test/unit/utils/pending-activity.ts

@@ -65,6 +65,12 @@ describe('Pending Activity Utils', function () {
             expect(pendingActivity.object.preview!.type).toBe('Note');
             expect(pendingActivity.object.preview!.content).toBe(content);
             expect(pendingActivity.object.id).toBe(id);
+            expect(pendingActivity.object.attachment).toEqual([]);
+            expect(pendingActivity.object.replyCount).toBe(0);
+            expect(pendingActivity.object.liked).toBe(false);
+            expect(pendingActivity.object.reposted).toBe(false);
+            expect(pendingActivity.object.repostCount).toBe(0);
+            expect(pendingActivity.object.authored).toBe(true);
             expect(pendingActivity.object.attributedTo).toBeDefined();
             expect(pendingActivity.object.attributedTo).toBeInstanceOf(Object);
 
@@ -80,6 +86,39 @@ describe('Pending Activity Utils', function () {
             expect(attributedToName).toEqual(actor.name);
             expect(attributedToPreferredUsername).toEqual(actor.preferredUsername);
         });
+
+        it('should attach an uploaded image url to the pending activity', function () {
+            const actor: ActorProperties = {
+                id: 'https://example.com/actor',
+                icon: {
+                    url: 'https://example.com/icon.png'
+                },
+                name: 'Example Actor',
+                preferredUsername: 'example',
+                '@context': '',
+                discoverable: false,
+                featured: '',
+                followers: '',
+                following: '',
+                image: {url: ''},
+                inbox: '',
+                manuallyApprovesFollowers: false,
+                outbox: '',
+                publicKey: {
+                    id: '',
+                    owner: '',
+                    publicKeyPem: ''
+                },
+                published: '',
+                summary: '',
+                type: 'Person',
+                url: 'https://example.com/actor'
+            };
+            const id = generatePendingActivityId();
+            const pendingActivity = generatePendingActivity(actor, id, 'Pending note', 'https://example.com/image.png');
+
+            expect(pendingActivity.object.image).toBe('https://example.com/image.png');
+        });
     });
 
     describe('formatPendingActivityContent', function () {

apps/activitypub/test/unit/utils/posts.test.ts

@@ -146,9 +146,49 @@ describe('mapPostToActivity', function () {
         expect(object.preview.content).toBe('Test Excerpt');
         expect(object.id).toBe('123');
         expect(object.replyCount).toBe(3);
+        expect(object.likeCount).toBe(2);
         expect(object.liked).toBe(true);
         expect(object.reposted).toBe(false);
         expect(object.repostCount).toBe(5);
+        expect(object.authored).toBe(true);
+    });
+
+    test('it preserves object metadata', function () {
+        const object = mapPostToActivity({
+            ...post,
+            metadata: {
+                ghostAuthors: [{
+                    name: 'Ghost Author',
+                    profile_image: 'https://example.com/authors/ghost-author.jpg'
+                }]
+            }
+        }).object;
+
+        expect(object.metadata).toEqual({
+            ghostAuthors: [{
+                name: 'Ghost Author',
+                profile_image: 'https://example.com/authors/ghost-author.jpg'
+            }]
+        });
+    });
+
+    test('it maps object engagement properties', function () {
+        const object = mapPostToActivity({
+            ...post,
+            replyCount: 0,
+            likeCount: 0,
+            likedByMe: false,
+            repostedByMe: true,
+            repostCount: 0,
+            authoredByMe: false
+        }).object;
+
+        expect(object.replyCount).toBe(0);
+        expect(object.likeCount).toBe(0);
+        expect(object.liked).toBe(false);
+        expect(object.reposted).toBe(true);
+        expect(object.repostCount).toBe(0);
+        expect(object.authored).toBe(false);
     });
 
     test('it sets the correct attachments', function () {
@@ -180,6 +220,7 @@ describe('mapPostToActivity', function () {
         });
 
         expect(activity.actor.followedByMe).toBe(true);
+        expect(activity.actor.handle).toBe('@testuser@example.com');
 
         // Test for reposts
         const repostActivity = mapPostToActivity({

apps/admin-x-framework/src/api/activitypub.ts

@@ -1,33 +1,56 @@
 import {createMutation, createQueryWithId} from '../utils/api/hooks';
+import {JSONObject} from './config';
+
+export type ActivityPubContext = string | (string | JSONObject)[];
+
+export type ActivityPubAttachment = {
+    type: string;
+    mediaType?: string;
+    name?: string;
+    url: string;
+};
+
+export type ObjectMetadata = {
+    ghostAuthors?: Array<{
+        name: string;
+        profile_image: string;
+    }>;
+};
 
 export type FollowItem = {
     id: string;
-    preferredUsername: string,
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    [x: string]: any
+    preferredUsername: string;
 };
 
 export type ObjectProperties = {
-    '@context': string | (string | object)[];
+    '@context': ActivityPubContext;
+    id: string;
     type: 'Article' | 'Link' | 'Note' | 'Tombstone';
     name: string;
     content: string | null;
     summary: string | null;
     url?: string | undefined;
-    attributedTo?: object | string | object[] | undefined;
+    attributedTo?: ActorProperties | string | ActorProperties[] | JSONObject | JSONObject[];
     image?: string | {
         url: string;
         mediaType?: string;
         type?: string;
     };
+    attachment?: ActivityPubAttachment | ActivityPubAttachment[];
     published?: string;
+    createdAt?: string;
     preview?: {type: string, content: string | null};
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    [x: string]: any;
+    replyCount: number;
+    likeCount: number;
+    liked?: boolean;
+    reposted?: boolean;
+    repostCount: number;
+    authored: boolean;
+    metadata?: ObjectMetadata;
 }
 
 export type ActorProperties = {
-    '@context': string | (string | object)[];
+    '@context': ActivityPubContext;
     attachment?: {
         type: string;
         name: string;
@@ -49,6 +72,13 @@ export type ActorProperties = {
     name: string;
     outbox: string;
     preferredUsername: string;
+    handle?: string;
+    followedByMe?: boolean;
+    followsMe?: boolean;
+    followingCount?: number;
+    followerCount?: number;
+    bio?: string;
+    avatarUrl?: string | null;
     publicKey: {
         id: string;
         owner: string;
@@ -58,8 +88,6 @@ export type ActorProperties = {
     summary: string;
     type: 'Person';
     url: string;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    [x: string]: any;
 }
 
 export type Activity = {