Fix iOS Devices

ios/Podfile.lock

@@ -110,7 +110,7 @@ PODS:
     - hermes-engine/Pre-built (= 0.73.2)
   - hermes-engine/Pre-built (0.73.2)
   - libevent (2.1.12)
-  - LibXMTP (0.4.1-beta3)
+  - LibXMTP (0.4.2-beta1)
   - Logging (1.0.0)
   - MessagePacker (0.4.7)
   - MMKV (1.3.3):
@@ -1217,16 +1217,16 @@ PODS:
     - GenericJSON (~> 2.0)
     - Logging (~> 1.0.0)
     - secp256k1.swift (~> 0.1)
-  - XMTP (0.8.5):
+  - XMTP (0.8.7):
     - Connect-Swift (= 0.3.0)
     - GzipSwift
-    - LibXMTP (= 0.4.1-beta3)
+    - LibXMTP (= 0.4.2-beta1)
     - web3.swift
-  - XMTPReactNative (1.27.0-beta.14):
+  - XMTPReactNative (1.27.0-beta.16):
     - ExpoModulesCore
     - MessagePacker
     - secp256k1.swift
-    - XMTP (= 0.8.5)
+    - XMTP (= 0.8.7)
   - Yoga (1.14.0)
 
 DEPENDENCIES:
@@ -1565,7 +1565,7 @@ SPEC CHECKSUMS:
   GzipSwift: 893f3e48e597a1a4f62fafcb6514220fcf8287fa
   hermes-engine: b361c9ef5ef3cda53f66e195599b47e1f84ffa35
   libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913
-  LibXMTP: 678390cd0049d090af4aa6a7d5c9133ded3473b3
+  LibXMTP: 026f2fec3c88b24e92f21895b29a12817fa54779
   Logging: 9ef4ecb546ad3169398d5a723bc9bea1c46bef26
   MessagePacker: ab2fe250e86ea7aedd1a9ee47a37083edd41fd02
   MMKV: f902fb6719da13c2ab0965233d8963a59416f911
@@ -1635,8 +1635,8 @@ SPEC CHECKSUMS:
   SwiftProtobuf: b02b5075dcf60c9f5f403000b3b0c202a11b6ae1
   WatermelonDB: 842d22ba555425aa9f3ce551239a001200c539bc
   web3.swift: 2263d1e12e121b2c42ffb63a5a7beb1acaf33959
-  XMTP: 1957e318059e8723bc1e76b1723c1eeb98e7760b
-  XMTPReactNative: 18de4b2e87433918e825ab4a7cac1bd122da659b
+  XMTP: 35a0ca7e90bbabf4c49a862ae7750626324f55bf
+  XMTPReactNative: 4fb753f8ce7f7c151072d2723605a318b243f24e
   Yoga: e64aa65de36c0832d04e8c7bd614396c77a80047
 
 PODFILE CHECKSUM: c765268d8eab018a5f4619e1d00ca4dab437bc4f

package.json

@@ -27,7 +27,8 @@
     "@tanstack/react-query": "^5.17.19",
     "@thirdweb-dev/react-native": "^0.5.4",
     "@thirdweb-dev/react-native-compat": "^0.5.4",
-    "@xmtp/react-native-sdk": "1.27.0-beta.14",
+    "@xmtp/frames-client": "^0.3.2",
+    "@xmtp/react-native-sdk": "1.27.0-beta.16",
     "aws-sdk": "^2.1540.0",
     "ethers": "^5",
     "expo": ">=50.0.0-0 <51.0.0",

src/hooks/useGroup.ts

@@ -1,27 +1,18 @@
-import {Group} from '@xmtp/react-native-sdk/build/lib/Group';
-import {useEffect, useState} from 'react';
-import {SupportedContentTypes} from '../consts/ContentTypes';
+import {useQuery} from '@tanstack/react-query';
+import {QueryKeys} from '../queries/QueryKeys';
 import {useClient} from './useClient';
 
 export const useGroup = (id: string) => {
-  if (!id) {
-    throw new Error('useGroup requires an id');
-  }
   const {client} = useClient();
-  const [group, setGroup] = useState<Group<SupportedContentTypes> | null>(null);
 
-  useEffect(() => {
-    const getGroup = async () => {
+  return useQuery({
+    queryKey: [client?.address, QueryKeys.Group, id],
+    queryFn: async () => {
       const groups = await client?.conversations.listGroups();
-      const foundGroup = groups?.find(c => c.id === id);
-      if (foundGroup) {
-        setGroup(foundGroup);
-      }
-    };
-    getGroup();
-  }, [client, id]);
-
-  return {
-    group,
-  };
+      return groups || [];
+    },
+    select: data => {
+      return data.find(c => c.id === id);
+    },
+  });
 };

src/hooks/useGroupMessages.ts

@@ -7,7 +7,7 @@ import {useGroupMessagesQuery} from '../queries/useGroupMessagesQuery';
 import {useGroup} from './useGroup';
 
 export const useGroupMessages = (id: string) => {
-  const {group} = useGroup(id);
+  const {data: group} = useGroup(id);
   const queryClient = useQueryClient();
 
   useEffect(() => {

src/i18n/locales/en.json

@@ -73,5 +73,9 @@
   "valid_address": "Valid Ethereum Address",
   "message_requests_from_new_addresses": "Message requests from addresses you’ve never interacted with show up here",
 
-  "wallet_error": "Wallet Error"
+  "wallet_error": "Wallet Error",
+  "group_add_single": "%{initiatedByAddress} added %{address}",
+  "group_add_plural": "%{initiatedByAddress} added %{addressCount} members",
+  "group_remove_single": "%{initiatedByAddress} removed %{address}",
+  "group_remove_plural": "%{initiatedByAddress} removed %{addressCount} members"
 }

src/queries/QueryKeys.ts

@@ -1,6 +1,9 @@
 export enum QueryKeys {
   ConversationMessages = 'conversation_messages',
   List = 'list',
+  Group = 'group',
   GroupParticipants = 'group_participants',
   GroupMessages = 'group_messages',
+  FramesClient = 'frames_client',
+  Frame = 'frame',
 }

src/queries/useGroupMessagesQuery.ts

@@ -6,13 +6,13 @@ import {withRequestLogger} from '../utils/logger';
 import {QueryKeys} from './QueryKeys';
 
 export const useGroupMessagesQuery = (id: string) => {
-  const {group} = useGroup(id);
+  const {data: group} = useGroup(id);
 
   return useQuery<DecodedMessage<SupportedContentTypes>[]>({
     queryKey: [QueryKeys.GroupMessages, id],
     queryFn: async () => {
       if (!group) {
-        throw new Error('Group not found');
+        return [];
       }
       await withRequestLogger(group.sync(), {
         name: 'group_sync',

src/queries/useGroupParticipantsQuery.ts

@@ -7,7 +7,7 @@ import {withRequestLogger} from '../utils/logger';
 import {QueryKeys} from './QueryKeys';
 
 export const useGroupParticipantsQuery = (id: string) => {
-  const {group} = useGroup(id);
+  const {data: group} = useGroup(id);
   const queryClient = useQueryClient();
 
   useEffect(() => {

src/screens/GroupScreen.tsx

@@ -1,7 +1,7 @@
 import {useFocusEffect, useRoute} from '@react-navigation/native';
 import {DecodedMessage, RemoteAttachmentContent} from '@xmtp/react-native-sdk';
 import {Box, FlatList, HStack, Pressable, VStack} from 'native-base';
-import {useCallback, useEffect, useState} from 'react';
+import React, {useCallback, useEffect, useState} from 'react';
 import {KeyboardAvoidingView, ListRenderItem, Platform} from 'react-native';
 import {Asset} from 'react-native-image-picker';
 import {ConversationInput} from '../components/ConversationInput';
@@ -44,7 +44,7 @@ const useData = (id: string) => {
   const {data: messages, refetch, isRefetching} = useGroupMessages(id);
   const {data: addresses} = useGroupParticipantsQuery(id);
   const {client} = useClient();
-  const {group} = useGroup(id);
+  const {data: group} = useGroup(id);
 
   return {
     name: group?.id,

yarn.lock

@@ -9515,6 +9515,25 @@
   resolved "https://registry.yarnpkg.com/@xmldom/xmldom/-/xmldom-0.7.13.tgz#ff34942667a4e19a9f4a0996a76814daac364cf3"
   integrity sha512-lm2GW5PkosIzccsaZIz7tp8cPADSIlIHWDFTR1N0SzfinhhYgeIQjFMz4rYzanCScr3DqQLeomUDArp6MWKm+g==
 
+"@xmtp/frames-client@^0.3.2":
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/@xmtp/frames-client/-/frames-client-0.3.2.tgz#6c860e11cbf7a63aa956543b4941ee72738ed211"
+  integrity sha512-61rxA7YcNUUKndQ9e5X44LNVwWJCrrZR6sBGOWLckfMK00LqRasoiLgom1PlR34c17a59PPZmagxoNQ2QCto7A==
+  dependencies:
+    "@noble/hashes" "^1.3.3"
+    "@xmtp/proto" "3.41.0-beta.5"
+    long "^5.2.3"
+
+"@xmtp/[email protected]":
+  version "3.41.0-beta.5"
+  resolved "https://registry.yarnpkg.com/@xmtp/proto/-/proto-3.41.0-beta.5.tgz#fe6d2f4f0a37e69c18c516ed0796a48fb16574db"
+  integrity sha512-vx5zqLpAVPjTEdyqY/woXrgvWMKjbTwwco+x9WE+T1iVlv+472yp2DwFJRLpfeQByC1cHl7XQyuO2Q+8t8HL4Q==
+  dependencies:
+    long "^5.2.0"
+    protobufjs "^7.0.0"
+    rxjs "^7.8.0"
+    undici "^5.8.1"
+
 "@xmtp/proto@^3.25.0":
   version "3.41.0"
   resolved "https://registry.yarnpkg.com/@xmtp/proto/-/proto-3.41.0.tgz#e21d28278f4ead3db2d719732bdd89875356ad72"
@@ -9525,10 +9544,10 @@
     rxjs "^7.8.0"
     undici "^5.8.1"
 
-"@xmtp/[email protected].14":
-  version "1.27.0-beta.14"
-  resolved "https://registry.yarnpkg.com/@xmtp/react-native-sdk/-/react-native-sdk-1.27.0-beta.14.tgz#b70a5e379f38e315caebc0440c4dc3a1fef35498"
-  integrity sha512-L6ljcYa+2vqjDavdZmi/scioup3KAsgHI8t7WdTcTxLq8fRxTjzw8cJPC/2mHD7bCnjOKa+3IdNtSQbHZh4NGQ==
+"@xmtp/[email protected].16":
+  version "1.27.0-beta.16"
+  resolved "https://registry.yarnpkg.com/@xmtp/react-native-sdk/-/react-native-sdk-1.27.0-beta.16.tgz#2d3114471b5b4219041924b7024c8357d00fdf4c"
+  integrity sha512-GJ1Q5DiuEwRcfMOatcuJvACd/sRRnwDuSojkOSnkiyIGEh17rc6yMDRD999QyngHNM0tXB0jr84aHANBbOXmEg==
   dependencies:
     "@ethersproject/bytes" "^5.7.0"
     "@msgpack/msgpack" "^3.0.0-beta2"
@@ -15178,7 +15197,7 @@ logkitty@^0.7.1:
   resolved "https://registry.yarnpkg.com/@nozbe/lokijs/-/lokijs-1.5.12-wmelon6.tgz#e457d934d614d5df80105c86314252a6e614df9b"
   integrity sha512-GXsaqY8qTJ6xdCrGyno2t+ON2aj6PrUDdvhbrkxK/0Fp12C4FGvDg1wS+voLU9BANYHEnr7KRWfItDZnQkjoAg==
 
-long@^5.0.0, long@^5.2.0:
+long@^5.0.0, long@^5.2.0, long@^5.2.3:
   version "5.2.3"
   resolved "https://registry.yarnpkg.com/long/-/long-5.2.3.tgz#a3ba97f3877cf1d778eccbcb048525ebb77499e1"
   integrity sha512-lcHwpNoggQTObv5apGNCTdJrO69eHOZMi4BNC+rTLER8iHAqGrUVeLh/irVIM7zTw2bOXA8T6uNPeujwOLg/2Q==