Test better equal checks
This commit is contained in:
parent
1574be2b35
commit
16e2ac9bce
18
package-lock.json
generated
18
package-lock.json
generated
|
@ -19,7 +19,7 @@
|
||||||
"dayjs": "~1.11.10",
|
"dayjs": "~1.11.10",
|
||||||
"dayjs-twitter": "~0.5.0",
|
"dayjs-twitter": "~0.5.0",
|
||||||
"fast-blurhash": "~1.1.2",
|
"fast-blurhash": "~1.1.2",
|
||||||
"fast-deep-equal": "~3.1.3",
|
"fast-equals": "~5.0.1",
|
||||||
"idb-keyval": "~6.2.1",
|
"idb-keyval": "~6.2.1",
|
||||||
"just-debounce-it": "~3.2.0",
|
"just-debounce-it": "~3.2.0",
|
||||||
"lz-string": "~1.5.0",
|
"lz-string": "~1.5.0",
|
||||||
|
@ -4405,13 +4405,16 @@
|
||||||
"version": "3.1.3",
|
"version": "3.1.3",
|
||||||
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
||||||
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
|
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
|
||||||
|
"dev": true,
|
||||||
"license": "MIT"
|
"license": "MIT"
|
||||||
},
|
},
|
||||||
"node_modules/fast-equals": {
|
"node_modules/fast-equals": {
|
||||||
"version": "3.0.3",
|
"version": "5.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-3.0.3.tgz",
|
"resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-5.0.1.tgz",
|
||||||
"integrity": "sha512-NCe8qxnZFARSHGztGMZOO/PC1qa5MIFB5Hp66WdzbCRAz8U8US3bx1UTgLS49efBQPcUtO9gf5oVEY8o7y/7Kg==",
|
"integrity": "sha512-WF1Wi8PwwSY7/6Kx0vKXtw8RwuSGoM1bvDaJbu7MxDlR1vovZjIAKrnzyrThgAjm6JDTu0fVgWXDlMGspodfoQ==",
|
||||||
"license": "MIT"
|
"engines": {
|
||||||
|
"node": ">=6.0.0"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"node_modules/fast-glob": {
|
"node_modules/fast-glob": {
|
||||||
"version": "3.3.2",
|
"version": "3.3.2",
|
||||||
|
@ -5570,6 +5573,11 @@
|
||||||
"micro-memoize": "^4.1.2"
|
"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": {
|
"node_modules/ms": {
|
||||||
"version": "2.1.2",
|
"version": "2.1.2",
|
||||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
||||||
|
|
|
@ -21,7 +21,7 @@
|
||||||
"dayjs": "~1.11.10",
|
"dayjs": "~1.11.10",
|
||||||
"dayjs-twitter": "~0.5.0",
|
"dayjs-twitter": "~0.5.0",
|
||||||
"fast-blurhash": "~1.1.2",
|
"fast-blurhash": "~1.1.2",
|
||||||
"fast-deep-equal": "~3.1.3",
|
"fast-equals": "~5.0.1",
|
||||||
"idb-keyval": "~6.2.1",
|
"idb-keyval": "~6.2.1",
|
||||||
"just-debounce-it": "~3.2.0",
|
"just-debounce-it": "~3.2.0",
|
||||||
"lz-string": "~1.5.0",
|
"lz-string": "~1.5.0",
|
||||||
|
|
|
@ -2,7 +2,7 @@ import './compose.css';
|
||||||
|
|
||||||
import '@github/text-expander-element';
|
import '@github/text-expander-element';
|
||||||
import { MenuItem } from '@szhsin/react-menu';
|
import { MenuItem } from '@szhsin/react-menu';
|
||||||
import equal from 'fast-deep-equal';
|
import { deepEqual } from 'fast-equals';
|
||||||
import { forwardRef } from 'preact/compat';
|
import { forwardRef } from 'preact/compat';
|
||||||
import { useEffect, useMemo, useRef, useState } from 'preact/hooks';
|
import { useEffect, useMemo, useRef, useState } from 'preact/hooks';
|
||||||
import { useHotkeys } from 'react-hotkeys-hook';
|
import { useHotkeys } from 'react-hotkeys-hook';
|
||||||
|
@ -502,7 +502,10 @@ function Compose({
|
||||||
mediaAttachments,
|
mediaAttachments,
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
if (!equal(backgroundDraft, prevBackgroundDraft.current) && !canClose()) {
|
if (
|
||||||
|
!deepEqual(backgroundDraft, prevBackgroundDraft.current) &&
|
||||||
|
!canClose()
|
||||||
|
) {
|
||||||
console.debug('not equal', backgroundDraft, prevBackgroundDraft.current);
|
console.debug('not equal', backgroundDraft, prevBackgroundDraft.current);
|
||||||
db.drafts
|
db.drafts
|
||||||
.set(key, {
|
.set(key, {
|
||||||
|
|
|
@ -9,6 +9,7 @@ import {
|
||||||
MenuItem,
|
MenuItem,
|
||||||
} from '@szhsin/react-menu';
|
} from '@szhsin/react-menu';
|
||||||
import { decodeBlurHash, getBlurHashAverageColor } from 'fast-blurhash';
|
import { decodeBlurHash, getBlurHashAverageColor } from 'fast-blurhash';
|
||||||
|
import { shallowEqual } from 'fast-equals';
|
||||||
import { memo } from 'preact/compat';
|
import { memo } from 'preact/compat';
|
||||||
import {
|
import {
|
||||||
useCallback,
|
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)
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
import { deepEqual } from 'fast-equals';
|
||||||
import { proxy, subscribe } from 'valtio';
|
import { proxy, subscribe } from 'valtio';
|
||||||
import { subscribeKey } from 'valtio/utils';
|
import { subscribeKey } from 'valtio/utils';
|
||||||
|
|
||||||
|
@ -178,6 +179,7 @@ export function saveStatus(status, instance, opts) {
|
||||||
if (!status) return;
|
if (!status) return;
|
||||||
const oldStatus = getStatus(status.id, instance);
|
const oldStatus = getStatus(status.id, instance);
|
||||||
if (!override && oldStatus) return;
|
if (!override && oldStatus) return;
|
||||||
|
if (deepEqual(status, oldStatus)) return;
|
||||||
queueMicrotask(() => {
|
queueMicrotask(() => {
|
||||||
const key = statusKey(status.id, instance);
|
const key = statusKey(status.id, instance);
|
||||||
if (oldStatus?._pinned) status._pinned = oldStatus._pinned;
|
if (oldStatus?._pinned) status._pinned = oldStatus._pinned;
|
||||||
|
|
Loading…
Reference in a new issue