From 8085ac00327a5300ade69a0887ce0710c9faf224 Mon Sep 17 00:00:00 2001
From: Ry Racherbaumer <ry@xmtp.com>
Date: Tue, 24 Oct 2023 11:54:44 -0500
Subject: [PATCH 1/2] Add filter for unsupported content types w/o a fallback

---
 packages/react-sdk/src/hooks/useMessages.ts | 29 ++++++++++++++++++---
 1 file changed, 26 insertions(+), 3 deletions(-)

diff --git a/packages/react-sdk/src/hooks/useMessages.ts b/packages/react-sdk/src/hooks/useMessages.ts
index f2f3707b..6c9478e6 100644
--- a/packages/react-sdk/src/hooks/useMessages.ts
+++ b/packages/react-sdk/src/hooks/useMessages.ts
@@ -1,5 +1,5 @@
 import { SortDirection, type DecodedMessage } from "@xmtp/xmtp-js";
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { min, subSeconds } from "date-fns";
 import type { OnError } from "../sharedTypes";
 import { useCachedMessages } from "./useCachedMessages";
@@ -21,6 +21,11 @@ export type UseMessagesOptions = OnError & {
    * browser tab becomes visible
    */
   disableAutoSync?: boolean;
+  /**
+   * Whether or not to disable filtering of messages with an unsupported
+   * content type and no content fallback
+   */
+  disableUnsupportedNoFallbackFiltering?: boolean;
 };
 
 /**
@@ -45,7 +50,12 @@ export const useMessages = (
   const loadingRef = useRef(false);
 
   // destructure options for more granular dependency arrays
-  const { disableAutoSync, onError, onMessages } = options ?? {};
+  const {
+    disableAutoSync,
+    disableUnsupportedNoFallbackFiltering,
+    onError,
+    onMessages,
+  } = options ?? {};
 
   const getMessages = useCallback(async () => {
     // already in progress
@@ -163,10 +173,23 @@ export const useMessages = (
     };
   }, [getMessages, disableAutoSync]);
 
+  const filteredMessages = useMemo(() => {
+    if (!disableUnsupportedNoFallbackFiltering) {
+      return messages;
+    }
+    return messages.filter(
+      (message) =>
+        // content type is supported, or
+        message.content ||
+        // content type is not supported but there is a fallback
+        (message.content === undefined && message.contentFallback),
+    );
+  }, [disableUnsupportedNoFallbackFiltering, messages]);
+
   return {
     error,
     isLoaded,
     isLoading,
-    messages,
+    messages: filteredMessages,
   };
 };

From 9336d243aafd167d7ee30cf857f6ef0b1f3cefd5 Mon Sep 17 00:00:00 2001
From: Ry Racherbaumer <rygine@users.noreply.github.com>
Date: Tue, 24 Oct 2023 12:12:22 -0500
Subject: [PATCH 2/2] Create big-crabs-care.md

---
 .changeset/big-crabs-care.md | 6 ++++++
 1 file changed, 6 insertions(+)
 create mode 100644 .changeset/big-crabs-care.md

diff --git a/.changeset/big-crabs-care.md b/.changeset/big-crabs-care.md
new file mode 100644
index 00000000..57def58c
--- /dev/null
+++ b/.changeset/big-crabs-care.md
@@ -0,0 +1,6 @@
+---
+"@xmtp/react-sdk": minor
+---
+
+- Added filter to `useMessages` hook that removes messages with unsupported content types without fallback content
+- Added `disableUnsupportedNoFallbackFiltering` option to `useMessages` hook to allow for disabling of the filter