Iterable UI modules auto-included even when not used (2.0.2)

[flochtililoch]

I've just updated the RN SDK from version 1.3.21 to 2.0.2. It now breaks with the following error:

 Error: Unable to resolve module react-native-vector-icons/Ionicons from /app/node_modules/@iterable/react-native-sdk/lib/module/inbox/components/IterableInboxMessageDisplay.js: react-native-vector-icons/Ionicons could not be found within the project or in these directories:
  ../node_modules
  3 | import { useEffect, useState } from 'react';
  4 | import { Linking, ScrollView, StyleSheet, Text, TouchableWithoutFeedback, View } from 'react-native';
> 5 | import Icon from 'react-native-vector-icons/Ionicons';
    |                   ^
  6 | import { WebView } from 'react-native-webview';
  7 | import { IterableAction, IterableActionContext, IterableActionSource } from "../../core/index.js";
  8 | // expo throws an error if this is not imported directly due to circular
    at ModuleResolver.resolveDependency (/app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:150:15)
    at DependencyGraph.resolveDependency (/app/node_modules/metro/src/node-haste/DependencyGraph.js:248:43)
    at /app/node_modules/metro/src/lib/transformHelpers.js:165:21
    at resolveDependencies (/app/node_modules/metro/src/DeltaBundler/buildSubgraph.js:42:25)
    at visit (/app/node_modules/metro/src/DeltaBundler/buildSubgraph.js:83:30)
    at async Promise.all (index 3)
    at async visit (/app/node_modules/metro/src/DeltaBundler/buildSubgraph.js:92:5)
    at async Promise.all (index 1)
    at async visit (/app/node_modules/metro/src/DeltaBundler/buildSubgraph.js:92:5)
    at async Promise.all (index 3)

Since our app does not make use of any Iterable UIs, I don't really need any of the included modules from "inbox", so I managed to work around the problem with the following patch:

diff --git a/lib/module/index.js b/lib/module/index.js
index ddf834ae3ac5c3c2b56951587880cfd0994fdad2..34865e6ea5ad77d3f11464189f298f064a6d6e26 100644
--- a/lib/module/index.js
+++ b/lib/module/index.js
@@ -7,5 +7,4 @@ export { Iterable, IterableAction, IterableActionContext, IterableAttributionInf
 export { IterableActionSource, IterableDataRegion, IterableEventName, IterableLogLevel, IterablePushPlatform } from "./core/enums/index.js";
 export { useAppStateListener, useDeviceOrientation } from "./core/hooks/index.js";
 export { IterableHtmlInAppContent, IterableInAppCloseSource, IterableInAppContentType, IterableInAppDeleteSource, IterableInAppLocation, IterableInAppManager, IterableInAppMessage, IterableInAppShowResponse, IterableInAppTrigger, IterableInAppTriggerType, IterableInboxMetadata } from "./inApp/index.js";
-export { IterableInbox, IterableInboxDataModel, IterableInboxEmptyState, IterableInboxMessageCell } from "./inbox/index.js";
 //# sourceMappingURL=index.js.map
\ No newline at end of file

It would be great to make the UI modules optional / explicitly imported.

[sabtaintanvir2]

facing the same issue , react native version 0.77 and iterablesdk version 2.0.2

[lposen]

Hi @flochtililoch and @sabtaintanvir2,

Thanks so much for pointing this out — this is a great catch. You're absolutely right: consumers who don’t use the provided UI components shouldn’t be required to include additional dependencies like react-native-vector-icons.

Making the UI modules optional and explicitly imported is a solid idea, and we’ve added this to our roadmap for a future release.

Thanks again for the helpful feedback!

Best,
Loren

[lposen]

Hi @flochtililoch and @sabtaintanvir2,

This has been fixed in version 2.0.4 — react-native-vector-icons has been removed as a dependency.

Thanks for reporting this!