Convert EmojiReaction to zod

app/soapbox/features/chats/components/__tests__/chat-message-reaction.test.tsx

@@ -1,12 +1,10 @@
 import userEvent from '@testing-library/user-event';
 import React from 'react';
 
-import { normalizeEmojiReaction } from 'soapbox/normalizers/emoji-reaction';
-
 import { render, screen } from '../../../../jest/test-helpers';
 import ChatMessageReaction from '../chat-message-reaction';
 
-const emojiReaction = normalizeEmojiReaction({
+const emojiReaction = ({
   name: '👍',
   count: 1,
   me: false,
@@ -56,7 +54,7 @@ describe('<ChatMessageReaction />', () => {
 
     render(
       <ChatMessageReaction
-        emojiReaction={normalizeEmojiReaction({
+        emojiReaction={({
           name: '👍',
           count: 1,
           me: true,

app/soapbox/features/chats/components/chat-message.tsx

@@ -312,7 +312,7 @@ const ChatMessage = (props: IChatMessage) => {
           </Stack>
         </HStack>
 
-        {(chatMessage.emoji_reactions?.size) ? (
+        {(chatMessage.emoji_reactions?.length) ? (
           <div
             className={clsx({
               'space-y-1': true,

app/soapbox/normalizers/chat-message.ts

@@ -6,8 +6,8 @@ import {
 } from 'immutable';
 
 import { normalizeAttachment } from 'soapbox/normalizers/attachment';
-
-import { normalizeEmojiReaction } from './emoji-reaction';
+import { emojiReactionSchema } from 'soapbox/schemas';
+import { filteredArray } from 'soapbox/schemas/utils';
 
 import type { Attachment, Card, Emoji, EmojiReaction } from 'soapbox/types/entities';
 
@@ -20,7 +20,7 @@ export const ChatMessageRecord = ImmutableRecord({
   created_at: '',
   emojis: ImmutableList<Emoji>(),
   expiration: null as number | null,
-  emoji_reactions: null as ImmutableList<EmojiReaction> | null,
+  emoji_reactions: null as readonly EmojiReaction[] | null,
   id: '',
   unread: false,
   deleting: false,
@@ -41,13 +41,8 @@ const normalizeMedia = (status: ImmutableMap<string, any>) => {
 };
 
 const normalizeChatMessageEmojiReaction = (chatMessage: ImmutableMap<string, any>) => {
-  const emojiReactions = chatMessage.get('emoji_reactions');
-
-  if (emojiReactions) {
-    return chatMessage.set('emoji_reactions', ImmutableList(emojiReactions.map(normalizeEmojiReaction)));
-  } else {
-    return chatMessage;
-  }
+  const emojiReactions = chatMessage.get('emoji_reactions') || ImmutableList();
+  return chatMessage.set('emoji_reactions', filteredArray(emojiReactionSchema).parse(emojiReactions.toJS()));
 };
 
 /** Rewrite `<p></p>` to empty string. */

app/soapbox/normalizers/emoji-reaction.ts

@@ -1,14 +0,0 @@
-import { Map as ImmutableMap, Record as ImmutableRecord, fromJS } from 'immutable';
-
-// https://docs.joinmastodon.org/entities/emoji/
-export const EmojiReactionRecord = ImmutableRecord({
-  name: '',
-  count: null as number | null,
-  me: false,
-});
-
-export const normalizeEmojiReaction = (emojiReaction: Record<string, any>) => {
-  return EmojiReactionRecord(
-    ImmutableMap(fromJS(emojiReaction)),
-  );
-};

app/soapbox/normalizers/index.ts

@@ -7,7 +7,6 @@ export { AttachmentRecord, normalizeAttachment } from './attachment';
 export { ChatRecord, normalizeChat } from './chat';
 export { ChatMessageRecord, normalizeChatMessage } from './chat-message';
 export { EmojiRecord, normalizeEmoji } from './emoji';
-export { EmojiReactionRecord } from './emoji-reaction';
 export { FilterRecord, normalizeFilter } from './filter';
 export { FilterKeywordRecord, normalizeFilterKeyword } from './filter-keyword';
 export { FilterStatusRecord, normalizeFilterStatus } from './filter-status';

app/soapbox/queries/__tests__/chats.test.ts

@@ -1,4 +1,4 @@
-import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
+import { Map as ImmutableMap } from 'immutable';
 import sumBy from 'lodash/sumBy';
 import { useEffect } from 'react';
 
@@ -6,7 +6,6 @@ import { __stub } from 'soapbox/api';
 import { buildRelationship } from 'soapbox/jest/factory';
 import { createTestStore, mockStore, queryClient, renderHook, rootState, waitFor } from 'soapbox/jest/test-helpers';
 import { normalizeChatMessage } from 'soapbox/normalizers';
-import { normalizeEmojiReaction } from 'soapbox/normalizers/emoji-reaction';
 import { Store } from 'soapbox/store';
 import { ChatMessage } from 'soapbox/types/entities';
 import { flattenPages } from 'soapbox/utils/queries';
@@ -426,11 +425,11 @@ describe('useChatActions', () => {
       });
 
       const updatedChatMessage = (queryClient.getQueryData(ChatKeys.chatMessages(chat.id)) as any).pages[0].result[0] as ChatMessage;
-      expect(updatedChatMessage.emoji_reactions).toEqual(ImmutableList([normalizeEmojiReaction({
+      expect(updatedChatMessage.emoji_reactions).toEqual([{
         name: '👍',
         count: 1,
         me: true,
-      })]));
+      }]);
     });
   });
 });

app/soapbox/schemas/emoji-reaction.ts

@@ -0,0 +1,15 @@
+import { z } from 'zod';
+
+/** Validates the string as an emoji. */
+const emojiSchema = z.string().refine((v) => /\p{Extended_Pictographic}/u.test(v));
+
+/** Pleroma emoji reaction. */
+const emojiReactionSchema = z.object({
+  name: emojiSchema,
+  count: z.number().nullable().catch(null),
+  me: z.boolean().catch(false),
+});
+
+type EmojiReaction = z.infer<typeof emojiReactionSchema>;
+
+export { emojiReactionSchema, EmojiReaction };

app/soapbox/schemas/index.ts

@@ -1,6 +1,7 @@
 export { accountSchema, type Account } from './account';
 export { cardSchema, type Card } from './card';
 export { customEmojiSchema, type CustomEmoji } from './custom-emoji';
+export { emojiReactionSchema, type EmojiReaction } from './emoji-reaction';
 export { groupSchema, type Group } from './group';
 export { groupMemberSchema, type GroupMember } from './group-member';
 export { groupRelationshipSchema, type GroupRelationship } from './group-relationship';

app/soapbox/types/entities.ts

@@ -8,7 +8,6 @@ import {
   ChatRecord,
   ChatMessageRecord,
   EmojiRecord,
-  EmojiReactionRecord,
   FieldRecord,
   FilterRecord,
   FilterKeywordRecord,
@@ -38,7 +37,6 @@ type Attachment = ReturnType<typeof AttachmentRecord>;
 type Chat = ReturnType<typeof ChatRecord>;
 type ChatMessage = ReturnType<typeof ChatMessageRecord>;
 type Emoji = ReturnType<typeof EmojiRecord>;
-type EmojiReaction = ReturnType<typeof EmojiReactionRecord>;
 type Field = ReturnType<typeof FieldRecord>;
 type Filter = ReturnType<typeof FilterRecord>;
 type FilterKeyword = ReturnType<typeof FilterKeywordRecord>;
@@ -81,7 +79,6 @@ export {
   Chat,
   ChatMessage,
   Emoji,
-  EmojiReaction,
   Field,
   Filter,
   FilterKeyword,
@@ -105,6 +102,7 @@ export {
 
 export type {
   Card,
+  EmojiReaction,
   Group,
   GroupMember,
   GroupRelationship,

app/soapbox/utils/features.ts

@@ -254,7 +254,7 @@ const getInstanceFeatures = (instance: Instance) => {
     /**
      * Ability to add reactions to chat messages.
      */
-    chatEmojiReactions: v.software === TRUTHSOCIAL && v.build === UNRELEASED,
+    chatEmojiReactions: v.software === TRUTHSOCIAL,
 
     /**
      * Pleroma chats API.