Swap to stable recent emojis key

.changeset/feat-stable-recent-emoji.md

@@ -0,0 +1,5 @@
+---
+default: patch
+---
+
+Swap to using the stable identifier `m.recent_emoji` for recent emojis and add migration logic.

src/app/hooks/useRecentEmoji.ts

@@ -11,7 +11,12 @@ export const useRecentEmoji = (mx: MatrixClient, limit?: number): IEmoji[] => {
 
   useEffect(() => {
     const handleAccountData = (event: MatrixEvent) => {
-      if (event.getType() !== (CustomAccountDataEvent.ElementRecentEmoji as string)) return;
+      if (
+        event.getType() !== (CustomAccountDataEvent.RecentEmoji as string) &&
+        event.getType() !== (CustomAccountDataEvent.LegacyElementRecentEmoji as string)
+      ) {
+        return;
+      }
       setRecentEmoji(getRecentEmojis(mx, limit));
     };
 

src/app/plugins/recent-emoji.ts

@@ -13,8 +13,20 @@ export type IRecentEmojiContent = {
 };
 
 export const getRecentEmojis = (mx: MatrixClient, limit?: number): IEmoji[] => {
-  const recentEmojiEvent = getAccountData(mx, CustomAccountDataEvent.ElementRecentEmoji);
+  let recentEmojiEvent = getAccountData(mx, CustomAccountDataEvent.RecentEmoji);
+  let isLegacy = false;
+  if (!recentEmojiEvent) {
+    recentEmojiEvent = getAccountData(mx, CustomAccountDataEvent.LegacyElementRecentEmoji);
+    isLegacy = true;
+  }
   const recentEmoji = recentEmojiEvent?.getContent<IRecentEmojiContent>().recent_emoji;
+
+  if (isLegacy && Array.isArray(recentEmoji)) {
+    mx.setAccountData(CustomAccountDataEvent.RecentEmoji, {
+      recent_emoji: recentEmoji,
+    }).catch(() => {});
+  }
+
   if (!Array.isArray(recentEmoji)) return [];
 
   return recentEmoji
@@ -28,7 +40,10 @@ export const getRecentEmojis = (mx: MatrixClient, limit?: number): IEmoji[] => {
 };
 
 export function addRecentEmoji(mx: MatrixClient, unicode: string) {
-  const recentEmojiEvent = getAccountData(mx, CustomAccountDataEvent.ElementRecentEmoji);
+  let recentEmojiEvent = getAccountData(mx, CustomAccountDataEvent.RecentEmoji);
+  if (!recentEmojiEvent) {
+    recentEmojiEvent = getAccountData(mx, CustomAccountDataEvent.LegacyElementRecentEmoji);
+  }
   const recentEmojiContent = recentEmojiEvent?.getContent<IRecentEmojiContent>();
   const recentEmoji =
     recentEmojiContent && Array.isArray(recentEmojiContent.recent_emoji)
@@ -45,7 +60,7 @@ export function addRecentEmoji(mx: MatrixClient, unicode: string) {
     entry[1] += 1;
   }
   recentEmoji.unshift(entry);
-  mx.setAccountData(CustomAccountDataEvent.ElementRecentEmoji, {
+  mx.setAccountData(CustomAccountDataEvent.RecentEmoji, {
     recent_emoji: recentEmoji.slice(0, 100),
   });
 }

src/types/matrix-sdk-events.d.ts

@@ -50,7 +50,8 @@ declare module 'matrix-js-sdk/lib/@types/event' {
 
   interface AccountDataEvents {
     [prefix.MATRIX_CINNY_UNSTABLE_ACCOUNT_SPACES_PROPERTY_NAME]: InCinnySpacesContent;
-    [prefix.MATRIX_ELEMENT_UNSTABLE_ACCOUNT_RECENT_EMOJIS_PROPERTY_NAME]: IRecentEmojiContent;
+    [prefix.MATRIX_ACCOUNT_RECENT_EMOJIS_PROPERTY_NAME]: IRecentEmojiContent;
+    [prefix.MATRIX_LEGACY_ELEMENT_UNSTABLE_ACCOUNT_RECENT_EMOJIS_PROPERTY_NAME]: IRecentEmojiContent;
     [prefix.MATRIX_UNSTABLE_ACCOUNT_USER_EMOTES_PROPERTY_NAME]: PackContent;
     [prefix.MATRIX_UNSTABLE_ACCOUNT_EMOTE_ROOMS_PROPERTY_NAME]: EmoteRoomsContent;
     [prefix.MATRIX_SABLE_UNSTABLE_ACCOUNT_NICKNAMES_PROPERTY_NAME]: Record<string, string>;

src/types/matrix/accountData.ts

@@ -2,7 +2,9 @@ import * as prefix from '$unstable/prefixes';
 
 export const CustomAccountDataEvent = {
   CinnySpaces: prefix.MATRIX_CINNY_UNSTABLE_ACCOUNT_SPACES_PROPERTY_NAME,
-  ElementRecentEmoji: prefix.MATRIX_ELEMENT_UNSTABLE_ACCOUNT_RECENT_EMOJIS_PROPERTY_NAME,
+  LegacyElementRecentEmoji:
+    prefix.MATRIX_LEGACY_ELEMENT_UNSTABLE_ACCOUNT_RECENT_EMOJIS_PROPERTY_NAME,
+  RecentEmoji: prefix.MATRIX_ACCOUNT_RECENT_EMOJIS_PROPERTY_NAME,
   PoniesUserEmotes: prefix.MATRIX_UNSTABLE_ACCOUNT_USER_EMOTES_PROPERTY_NAME,
   PoniesEmoteRooms: prefix.MATRIX_UNSTABLE_ACCOUNT_EMOTE_ROOMS_PROPERTY_NAME,
   SableNicknames: prefix.MATRIX_SABLE_UNSTABLE_ACCOUNT_NICKNAMES_PROPERTY_NAME,

src/unstable/prefixes/misc.ts

@@ -12,8 +12,9 @@ export const MATRIX_COMMET_UNSTABLE_PROFILE_STATUS_PROPERTY_NAME = 'chat.commet.
 export const MATRIX_CINNY_UNSTABLE_ACCOUNT_SPACES_PROPERTY_NAME = 'in.cinny.spaces';
 export const MATRIX_CINNY_UNSTABLE_STATE_ROOM_POWER_LEVELS_LABEL_PROPERTY_NAME =
   'in.cinny.room.power_level_tags';
-export const MATRIX_ELEMENT_UNSTABLE_ACCOUNT_RECENT_EMOJIS_PROPERTY_NAME =
+export const MATRIX_LEGACY_ELEMENT_UNSTABLE_ACCOUNT_RECENT_EMOJIS_PROPERTY_NAME =
   'io.element.recent_emoji';
+export const MATRIX_ACCOUNT_RECENT_EMOJIS_PROPERTY_NAME = 'm.recent_emoji';
 export const MATRIX_ELEMENT_UNSTABLE_STATE_ROOM_WIDGET_PROPERTY_NAME = 'im.vector.modular.widgets';
 
 export const MATRIX_UNSTABLE_STATE_ROOM_BANNER_PROPERTY_NAME =