From 487b56febb070c05d2858db86de49e061ca6d759 Mon Sep 17 00:00:00 2001
From: Phil Pluckthun <phil@kitten.sh>
Date: Mon, 12 Jun 2023 23:55:26 +0100
Subject: [PATCH] fix(preact): Check operations for key difference only

---
 .changeset/yellow-shrimps-admire.md         |  5 +++++
 packages/preact-urql/src/hooks/useSource.ts | 18 +++++++++++++++++-
 2 files changed, 22 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/yellow-shrimps-admire.md

diff --git a/.changeset/yellow-shrimps-admire.md b/.changeset/yellow-shrimps-admire.md
new file mode 100644
index 0000000000..f3314fda85
--- /dev/null
+++ b/.changeset/yellow-shrimps-admire.md
@@ -0,0 +1,5 @@
+---
+'@urql/preact': patch
+---
+
+Apply shallow difference patch from React bindings to `@urql/preact` (See: #3195)
diff --git a/packages/preact-urql/src/hooks/useSource.ts b/packages/preact-urql/src/hooks/useSource.ts
index bce19f18fb..c256b9cd70 100644
--- a/packages/preact-urql/src/hooks/useSource.ts
+++ b/packages/preact-urql/src/hooks/useSource.ts
@@ -8,10 +8,26 @@ type Updater<T> = (input: T) => void;
 
 let currentInit = false;
 
+// Two operations are considered equal if they have the same key
+const areOperationsEqual = (
+  a: { key: number } | undefined,
+  b: { key: number } | undefined
+) => {
+  return a === b || !!(a && b && a.key === b.key);
+};
+
 const isShallowDifferent = (a: any, b: any) => {
   if (typeof a != 'object' || typeof b != 'object') return a !== b;
   for (const x in a) if (!(x in b)) return true;
-  for (const x in b) if (a[x] !== b[x]) return true;
+  for (const key in b) {
+    if (
+      key === 'operation'
+        ? !areOperationsEqual(a[key], b[key])
+        : a[key] !== b[key]
+    ) {
+      return true;
+    }
+  }
   return false;
 };