Add DM Dates and DM Favorites fixes

src/dmDates/index.ts

@@ -0,0 +1,14 @@
+import { ExtensionWebpackModule } from "@moonlight-mod/types";
+
+export const webpackModules: Record<string, ExtensionWebpackModule> = {
+  dmDates: {
+    entrypoint: true,
+    dependencies: [
+      { id: "react" },
+      { id: "discord/components/common/index" },
+      { ext: "spacepack", id: "spacepack" },
+      { ext: "componentEditor", id: "dmList" },
+      moonlight.enabledExtensions.has("dmFavorites") && { ext: "dmFavorites", id: "icon" }
+    ].filter((d) => !!d)
+  }
+};

src/dmDates/manifest.json

@@ -0,0 +1,14 @@
+{
+  "$schema": "https://moonlight-mod.github.io/manifest.schema.json",
+  "id": "dmDates",
+  "version": "1.0.0",
+  "meta": {
+    "name": "DM Dates",
+    "tagline": "Implements dates next to direct messages like mobile",
+    "authors": ["Cynosphere"],
+    "tags": ["chat", "qol"],
+    "source": "https://github.com/Cynosphere/moonlight-extensions"
+  },
+  "dependencies": ["spacepack", "componentEditor"],
+  "apiLevel": 2
+}

src/dmDates/style.css

@@ -0,0 +1,3 @@
+.dmDate-date {
+  margin-right: 4px;
+}

src/dmDates/webpackModules/dmDates.tsx

@@ -0,0 +1,21 @@
+import React from "@moonlight-mod/wp/react";
+import spacepack from "@moonlight-mod/wp/spacepack_spacepack";
+import DMList from "@moonlight-mod/wp/componentEditor_dmList";
+import { Text } from "@moonlight-mod/wp/discord/components/common/index";
+
+const getTimestampString = spacepack.findByCode('["XIGt+f"]')[0].exports;
+const getAbbreviatedFormatter = spacepack.findFunctionByStrings(getTimestampString, '["XIGt+f"]');
+const SnowflakeUtils = spacepack.require("discord/utils/SnowflakeUtils").default;
+
+function DMDate({ channel }: { channel: any }) {
+  const lastMessage = SnowflakeUtils.extractTimestamp(channel.lastMessageId ?? channel.id);
+  const formattedTime = getTimestampString.ZP({ since: lastMessage, getFormatter: getAbbreviatedFormatter });
+
+  return (
+    <Text variant="text-xxs/normal" color="currentColor" className="dmDates-date">
+      {formattedTime}
+    </Text>
+  );
+}
+
+DMList.addItem("dmDates", DMDate, "close-button", true);

src/dmFavorites/manifest.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://moonlight-mod.github.io/manifest.schema.json",
   "id": "dmFavorites",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "meta": {
     "name": "DM Favorites",
     "tagline": "Implements favorited direct messages from mobile",

src/dmFavorites/style.css

@@ -0,0 +1,3 @@
+.dmFavorites-icon {
+  margin-right: 4px;
+}

src/dmFavorites/webpackModules/icon.tsx

@@ -1,16 +1,16 @@
 import React from "@moonlight-mod/wp/react";
 import spacepack from "@moonlight-mod/wp/spacepack_spacepack";
 import { UserGuildSettingsStore } from "@moonlight-mod/wp/common_stores";
+import DMList from "@moonlight-mod/wp/componentEditor_dmList";
 
-const DMList = spacepack.require("componentEditor_dmList").default;
 const { StarIcon } = spacepack.require("discord/components/common/index");
 
 function FavoritedIcon(props: any) {
   const id = props.channel.id;
   const override = UserGuildSettingsStore.getChannelOverrides("null")[id] ?? {};
   const isFavorite = (override.flags & 2048) !== 0;
 
-  return isFavorite ? <StarIcon color="currentColor" size="xxs" style={{ marginRight: "8px" }} /> : null;
+  return isFavorite ? <StarIcon color="currentColor" size="xxs" className="dmFavorites-icon" /> : null;
 }
 
 DMList.addItem("dmFavorites", FavoritedIcon, "close-button", true);