From 16e2ac9bce2d84ac4cc4a57f4ba013c182bf67e3 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Sat, 6 Jan 2024 12:31:25 +0800
Subject: [PATCH] Test better equal checks

---
 package-lock.json          | 18 +++++++++++++-----
 package.json               |  2 +-
 src/components/compose.jsx |  7 +++++--
 src/components/status.jsx  | 11 ++++++++++-
 src/utils/states.js        |  2 ++
 5 files changed, 31 insertions(+), 9 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index d3ff918c..624ef8f5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -19,7 +19,7 @@
         "dayjs": "~1.11.10",
         "dayjs-twitter": "~0.5.0",
         "fast-blurhash": "~1.1.2",
-        "fast-deep-equal": "~3.1.3",
+        "fast-equals": "~5.0.1",
         "idb-keyval": "~6.2.1",
         "just-debounce-it": "~3.2.0",
         "lz-string": "~1.5.0",
@@ -4405,13 +4405,16 @@
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
       "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/fast-equals": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-3.0.3.tgz",
-      "integrity": "sha512-NCe8qxnZFARSHGztGMZOO/PC1qa5MIFB5Hp66WdzbCRAz8U8US3bx1UTgLS49efBQPcUtO9gf5oVEY8o7y/7Kg==",
-      "license": "MIT"
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-5.0.1.tgz",
+      "integrity": "sha512-WF1Wi8PwwSY7/6Kx0vKXtw8RwuSGoM1bvDaJbu7MxDlR1vovZjIAKrnzyrThgAjm6JDTu0fVgWXDlMGspodfoQ==",
+      "engines": {
+        "node": ">=6.0.0"
+      }
     },
     "node_modules/fast-glob": {
       "version": "3.3.2",
@@ -5570,6 +5573,11 @@
         "micro-memoize": "^4.1.2"
       }
     },
+    "node_modules/moize/node_modules/fast-equals": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-3.0.3.tgz",
+      "integrity": "sha512-NCe8qxnZFARSHGztGMZOO/PC1qa5MIFB5Hp66WdzbCRAz8U8US3bx1UTgLS49efBQPcUtO9gf5oVEY8o7y/7Kg=="
+    },
     "node_modules/ms": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
diff --git a/package.json b/package.json
index b4a99541..3d691b5d 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,7 @@
     "dayjs": "~1.11.10",
     "dayjs-twitter": "~0.5.0",
     "fast-blurhash": "~1.1.2",
-    "fast-deep-equal": "~3.1.3",
+    "fast-equals": "~5.0.1",
     "idb-keyval": "~6.2.1",
     "just-debounce-it": "~3.2.0",
     "lz-string": "~1.5.0",
diff --git a/src/components/compose.jsx b/src/components/compose.jsx
index 2bcfe09e..ba0d6afc 100644
--- a/src/components/compose.jsx
+++ b/src/components/compose.jsx
@@ -2,7 +2,7 @@ import './compose.css';
 
 import '@github/text-expander-element';
 import { MenuItem } from '@szhsin/react-menu';
-import equal from 'fast-deep-equal';
+import { deepEqual } from 'fast-equals';
 import { forwardRef } from 'preact/compat';
 import { useEffect, useMemo, useRef, useState } from 'preact/hooks';
 import { useHotkeys } from 'react-hotkeys-hook';
@@ -502,7 +502,10 @@ function Compose({
         mediaAttachments,
       },
     };
-    if (!equal(backgroundDraft, prevBackgroundDraft.current) && !canClose()) {
+    if (
+      !deepEqual(backgroundDraft, prevBackgroundDraft.current) &&
+      !canClose()
+    ) {
       console.debug('not equal', backgroundDraft, prevBackgroundDraft.current);
       db.drafts
         .set(key, {
diff --git a/src/components/status.jsx b/src/components/status.jsx
index 9954a125..36baccda 100644
--- a/src/components/status.jsx
+++ b/src/components/status.jsx
@@ -9,6 +9,7 @@ import {
   MenuItem,
 } from '@szhsin/react-menu';
 import { decodeBlurHash, getBlurHashAverageColor } from 'fast-blurhash';
+import { shallowEqual } from 'fast-equals';
 import { memo } from 'preact/compat';
 import {
   useCallback,
@@ -2460,4 +2461,12 @@ const QuoteStatuses = memo(({ id, instance, level = 0 }) => {
   });
 });
 
-export default memo(Status);
+export default memo(Status, (oldProps, newProps) => {
+  // Shallow equal all props except 'status'
+  // This will be pure static until status ID changes
+  const { status, ...restOldProps } = oldProps;
+  const { status: newStatus, ...restNewProps } = newProps;
+  return (
+    status?.id === newStatus?.id && shallowEqual(restOldProps, restNewProps)
+  );
+});
diff --git a/src/utils/states.js b/src/utils/states.js
index 9f1d986a..b52db054 100644
--- a/src/utils/states.js
+++ b/src/utils/states.js
@@ -1,3 +1,4 @@
+import { deepEqual } from 'fast-equals';
 import { proxy, subscribe } from 'valtio';
 import { subscribeKey } from 'valtio/utils';
 
@@ -178,6 +179,7 @@ export function saveStatus(status, instance, opts) {
   if (!status) return;
   const oldStatus = getStatus(status.id, instance);
   if (!override && oldStatus) return;
+  if (deepEqual(status, oldStatus)) return;
   queueMicrotask(() => {
     const key = statusKey(status.id, instance);
     if (oldStatus?._pinned) status._pinned = oldStatus._pinned;