@enhearten/knowledge-base-module 1.0.2 → 1.0.3

package/dist/components/SettingsModal.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface SettingsModalProps {
+    open: boolean;
+    onClose: () => void;
+}
+export declare const SettingsModal: React.FC<SettingsModalProps>;
+export {};
+//# sourceMappingURL=SettingsModal.d.ts.map

package/dist/components/SettingsModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SettingsModal.d.ts","sourceRoot":"","sources":["../../src/components/SettingsModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAMnD,UAAU,kBAAkB;IACxB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA+ItD,CAAC"}

package/dist/components/SettingsModal.js

@@ -0,0 +1,84 @@
+import React, { useState, useEffect } from 'react';
+import { Button, Input, Label, Sheet, Text, XStack, YStack, Theme, Spinner } from 'tamagui';
+import { MaterialCommunityIcons } from '@expo/vector-icons';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import { configure } from '../services/api';
+export const SettingsModal = ({ open, onClose }) => {
+    const [backendUrl, setBackendUrl] = useState('');
+    const [composioKey, setComposioKey] = useState('');
+    const [googleKey, setGoogleKey] = useState('');
+    const [loading, setLoading] = useState(false);
+    const [saving, setSaving] = useState(false);
+    useEffect(() => {
+        if (open) {
+            loadSettings();
+        }
+    }, [open]);
+    const loadSettings = async () => {
+        setLoading(true);
+        try {
+            const storedUrl = await AsyncStorage.getItem('kb_backend_url');
+            const storedComposioKey = await AsyncStorage.getItem('kb_composio_key');
+            const storedGoogleKey = await AsyncStorage.getItem('kb_google_key');
+            if (storedUrl)
+                setBackendUrl(storedUrl);
+            if (storedComposioKey)
+                setComposioKey(storedComposioKey);
+            if (storedGoogleKey)
+                setGoogleKey(storedGoogleKey);
+        }
+        catch (error) {
+            console.error('Failed to load settings', error);
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const handleSave = async () => {
+        setSaving(true);
+        try {
+            // Remove trailing slash from URL if present
+            const cleanUrl = backendUrl.replace(/\/$/, '');
+            await AsyncStorage.setItem('kb_backend_url', cleanUrl);
+            await AsyncStorage.setItem('kb_composio_key', composioKey);
+            await AsyncStorage.setItem('kb_google_key', googleKey);
+            configure({
+                backendUrl: cleanUrl,
+                headers: {
+                    'x-composio-key': composioKey,
+                    'x-google-key': googleKey
+                }
+            });
+            onClose();
+        }
+        catch (error) {
+            console.error('Failed to save settings', error);
+        }
+        finally {
+            setSaving(false);
+        }
+    };
+    return (React.createElement(Theme, { name: "light" },
+        React.createElement(Sheet, { modal: true, open: open, onOpenChange: (isOpen) => !isOpen && onClose(), snapPoints: [85], dismissOnSnapToBottom: true },
+            React.createElement(Sheet.Overlay, null),
+            React.createElement(Sheet.Frame, { padding: "$4", backgroundColor: "white" },
+                React.createElement(Sheet.Handle, null),
+                React.createElement(YStack, { space: "$4", paddingTop: "$4" },
+                    React.createElement(XStack, { alignItems: "center", space: "$2" },
+                        React.createElement(MaterialCommunityIcons, { name: "cog", size: 28, color: "#333" }),
+                        React.createElement(Text, { fontSize: "$6", fontWeight: "bold" }, "Settings")),
+                    React.createElement(Text, { color: "$gray11" }, "Configure your Cloudflare Worker URL and API keys."),
+                    loading ? (React.createElement(Spinner, { size: "large", color: "$blue10" })) : (React.createElement(YStack, { space: "$4" },
+                        React.createElement(YStack, { space: "$2" },
+                            React.createElement(Label, { htmlFor: "backendUrl", fontWeight: "600" }, "Backend URL (Cloudflare Worker)"),
+                            React.createElement(Input, { id: "backendUrl", placeholder: "https://knowledge-base-worker.your-subdomain.workers.dev", value: backendUrl, onChangeText: setBackendUrl, autoCapitalize: "none", autoCorrect: false })),
+                        React.createElement(YStack, { space: "$2" },
+                            React.createElement(Label, { htmlFor: "composioKey", fontWeight: "600" }, "Composio API Key"),
+                            React.createElement(Input, { id: "composioKey", placeholder: "Enter your Composio API Key", value: composioKey, onChangeText: setComposioKey, secureTextEntry: true })),
+                        React.createElement(YStack, { space: "$2" },
+                            React.createElement(Label, { htmlFor: "googleKey", fontWeight: "600" }, "Google Gemini API Key"),
+                            React.createElement(Input, { id: "googleKey", placeholder: "Enter your Google Gemini API Key", value: googleKey, onChangeText: setGoogleKey, secureTextEntry: true })),
+                        React.createElement(XStack, { gap: "$3", justifyContent: "flex-end", marginTop: "$4" },
+                            React.createElement(Button, { size: "$4", variant: "outlined", onPress: onClose, disabled: saving }, "Cancel"),
+                            React.createElement(Button, { size: "$4", themeInverse: true, onPress: handleSave, disabled: saving, icon: saving ? React.createElement(Spinner, { size: "small", color: "white" }) : undefined }, saving ? 'Saving...' : 'Save Settings')))))))));
+};

package/dist/hooks/useServiceConnection.d.ts

@@ -2,6 +2,7 @@ export declare const useServiceConnection: (appName: string, entityId: string, s
     connected: boolean;
     loading: boolean;
     disconnecting: boolean;
+    error: string | null;
     handleConnect: () => Promise<void>;
     handleCancel: () => void;
     handleDisconnect: () => Promise<void>;

package/dist/hooks/useServiceConnection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useServiceConnection.d.ts","sourceRoot":"","sources":["../../src/hooks/useServiceConnection.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,oBAAoB,GAAI,SAAS,MAAM,EAAE,UAAU,MAAM,EAAE,cAAa,MAAM,EAAc;;;;;;;CAgFxG,CAAC"}
+{"version":3,"file":"useServiceConnection.d.ts","sourceRoot":"","sources":["../../src/hooks/useServiceConnection.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,oBAAoB,GAAI,SAAS,MAAM,EAAE,UAAU,MAAM,EAAE,cAAa,MAAM,EAAc;;;;;;;;CA4FxG,CAAC"}

package/dist/hooks/useServiceConnection.js

@@ -1,12 +1,15 @@
 import { useState, useEffect, useRef } from 'react';
-import { Linking } from 'react-native';
-import { startConnection, getConnectionStatus, disconnectApp } from '../services/api';
+import { Linking, Alert } from 'react-native';
+import { startConnection, getConnectionStatus, disconnectApp, isConfigured } from '../services/api';
 export const useServiceConnection = (appName, entityId, searchTerms = [appName]) => {
     const [loading, setLoading] = useState(false);
     const [disconnecting, setDisconnecting] = useState(false);
     const [connected, setConnected] = useState(false);
+    const [error, setError] = useState(null);
     const pollingInterval = useRef(null);
     const checkStatus = async () => {
+        if (!isConfigured())
+            return false;
         try {
             const data = await getConnectionStatus(entityId);
             const isConnected = data.connectedApps && data.connectedApps.some((a) => searchTerms.some(term => a.toLowerCase().includes(term.toLowerCase())));
@@ -28,8 +31,14 @@ export const useServiceConnection = (appName, entityId, searchTerms = [appName])
         };
     }, [entityId]);
     const handleConnect = async () => {
+        if (!isConfigured()) {
+            setError('Configuration missing. Please set up the API URL and keys.');
+            Alert.alert('Configuration Missing', 'Please configure the backend URL and API keys in settings.');
+            return;
+        }
         try {
             setLoading(true);
+            setError(null);
             const data = await startConnection(appName, entityId);
             if (data.url)
                 await Linking.openURL(data.url);
@@ -54,6 +63,7 @@ export const useServiceConnection = (appName, entityId, searchTerms = [appName])
         catch (error) {
             console.error(error);
             console.error(`Failed to connect ${appName}`);
+            setError(`Failed to connect ${appName}`);
             setLoading(false);
         }
     };
@@ -65,6 +75,8 @@ export const useServiceConnection = (appName, entityId, searchTerms = [appName])
         setLoading(false);
     };
     const handleDisconnect = async () => {
+        if (!isConfigured())
+            return;
         try {
             setDisconnecting(true);
             await disconnectApp(appName, entityId);
@@ -72,10 +84,11 @@ export const useServiceConnection = (appName, entityId, searchTerms = [appName])
         }
         catch (error) {
             console.error(`Failed to disconnect ${appName}:`, error);
+            setError(`Failed to disconnect ${appName}`);
         }
         finally {
             setDisconnecting(false);
         }
     };
-    return { connected, loading, disconnecting, handleConnect, handleCancel, handleDisconnect };
+    return { connected, loading, disconnecting, error, handleConnect, handleCancel, handleDisconnect };
 };

package/dist/index.d.mts

@@ -9,6 +9,7 @@ export { ConnectInstagram } from './components/ConnectInstagram';
 export { ConnectLinkedIn } from './components/ConnectLinkedIn';
 export { ConnectWhatsApp } from './components/ConnectWhatsApp';
 export { DataUploadModal } from './components/DataUploadModal';
+export { SettingsModal } from './components/SettingsModal';
 export { useServiceConnection } from './hooks/useServiceConnection';
 export { configure, startConnection, executeAction, getConnectionStatus, disconnectApp, uploadUserData, getUserDataStatus, deleteUserData } from './services/api';
 export { searchPerson, getGiftIdeas, draftEmail, summarizeRecent } from './services/api';

package/dist/index.d.ts

@@ -9,6 +9,7 @@ export { ConnectInstagram } from './components/ConnectInstagram';
 export { ConnectLinkedIn } from './components/ConnectLinkedIn';
 export { ConnectWhatsApp } from './components/ConnectWhatsApp';
 export { DataUploadModal } from './components/DataUploadModal';
+export { SettingsModal } from './components/SettingsModal';
 export { useServiceConnection } from './hooks/useServiceConnection';
 export { configure, startConnection, executeAction, getConnectionStatus, disconnectApp, uploadUserData, getUserDataStatus, deleteUserData } from './services/api';
 export { searchPerson, getGiftIdeas, draftEmail, summarizeRecent } from './services/api';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAG/D,OAAO,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AAGpE,OAAO,EACH,SAAS,EACT,eAAe,EACf,aAAa,EACb,mBAAmB,EACnB,aAAa,EACb,cAAc,EACd,iBAAiB,EACjB,cAAc,EACjB,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EACH,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,eAAe,EAClB,MAAM,gBAAgB,CAAC;AAGxB,YAAY,EACR,mBAAmB,EACnB,gBAAgB,EAChB,iBAAiB,EACjB,sBAAsB,EACtB,cAAc,EACjB,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAG3D,OAAO,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AAGpE,OAAO,EACH,SAAS,EACT,eAAe,EACf,aAAa,EACb,mBAAmB,EACnB,aAAa,EACb,cAAc,EACd,iBAAiB,EACjB,cAAc,EACjB,MAAM,gBAAgB,CAAC;AAGxB,OAAO,EACH,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,eAAe,EAClB,MAAM,gBAAgB,CAAC;AAGxB,YAAY,EACR,mBAAmB,EACnB,gBAAgB,EAChB,iBAAiB,EACjB,sBAAsB,EACtB,cAAc,EACjB,MAAM,gBAAgB,CAAC"}

package/dist/index.js

@@ -10,6 +10,7 @@ export { ConnectInstagram } from './components/ConnectInstagram';
 export { ConnectLinkedIn } from './components/ConnectLinkedIn';
 export { ConnectWhatsApp } from './components/ConnectWhatsApp';
 export { DataUploadModal } from './components/DataUploadModal';
+export { SettingsModal } from './components/SettingsModal';
 // Hooks
 export { useServiceConnection } from './hooks/useServiceConnection';
 // Core API functions

package/dist/index.mjs

@@ -10,6 +10,7 @@ export { ConnectInstagram } from './components/ConnectInstagram';
 export { ConnectLinkedIn } from './components/ConnectLinkedIn';
 export { ConnectWhatsApp } from './components/ConnectWhatsApp';
 export { DataUploadModal } from './components/DataUploadModal';
+export { SettingsModal } from './components/SettingsModal';
 // Hooks
 export { useServiceConnection } from './hooks/useServiceConnection';
 // Core API functions

package/dist/services/api.d.ts

@@ -1,11 +1,17 @@
 /**
- * Configure the backend URL for the knowledge base API.
- * Call this before using any other functions if your backend is not at localhost:3000.
- * @param url - The base URL of the backend (e.g., 'https://api.example.com')
+ * Configure the backend URL and optional headers for the knowledge base API.
+ * Call this before using any other functions if your backend is not at localhost:3000
+ * or if you need to pass specific API keys.
+ * @param options - The configuration options
  */
 export declare const configure: (options: {
     backendUrl: string;
+    headers?: Record<string, string>;
 }) => void;
+/**
+ * Check if the API is configured (has a backend URL set).
+ */
+export declare const isConfigured: () => boolean;
 export declare const startConnection: (appName: string, entityId: string) => Promise<any>;
 export declare const executeAction: (prompt: string, entityId: string) => Promise<any>;
 export declare const getConnectionStatus: (entityId: string) => Promise<any>;

package/dist/services/api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"api.d.ts","sourceRoot":"","sources":["../../src/services/api.ts"],"names":[],"mappings":"AAYA;;;;GAIG;AACH,eAAO,MAAM,SAAS,GAAI,SAAS;IAAE,UAAU,EAAE,MAAM,CAAA;CAAE,SAExD,CAAC;AAEF,eAAO,MAAM,eAAe,GAAU,SAAS,MAAM,EAAE,UAAU,MAAM,iBAetE,CAAC;AAEF,eAAO,MAAM,aAAa,GAAU,QAAQ,MAAM,EAAE,UAAU,MAAM,iBAenE,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAU,UAAU,MAAM,iBAUzD,CAAC;AAEF,eAAO,MAAM,aAAa,GAAU,SAAS,MAAM,EAAE,UAAU,MAAM,iBAepE,CAAC;AAEF,MAAM,WAAW,cAAc;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,cAAc,GACvB,aAAa,WAAW,GAAG,UAAU,EACrC,UAAU,MAAM,EAChB,MAAM,cAAc,iBAgCvB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAU,UAAU,MAAM,EAAE,aAAa,MAAM,iBAY5E,CAAC;AAEF,eAAO,MAAM,cAAc,GAAU,aAAa,MAAM,EAAE,UAAU,MAAM,iBAezE,CAAC;AAMF,MAAM,WAAW,mBAAmB;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,GAAU,SAAS,mBAAmB,iBAM9D,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;GAIG;AACH,eAAO,MAAM,YAAY,GAAU,SAAS,gBAAgB,iBAO3D,CAAC;AAEF,MAAM,WAAW,iBAAiB;IAC9B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED;;;;GAIG;AACH,eAAO,MAAM,UAAU,GAAU,SAAS,iBAAiB,iBAM1D,CAAC;AAEF,MAAM,WAAW,sBAAsB;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,KAAK,CAAC;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAU,SAAS,sBAAsB,iBAOpE,CAAC"}
+{"version":3,"file":"api.d.ts","sourceRoot":"","sources":["../../src/services/api.ts"],"names":[],"mappings":"AAaA;;;;;GAKG;AACH,eAAO,MAAM,SAAS,GAAI,SAAS;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAAE,SAK1F,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,YAAY,eAExB,CAAC;AASF,eAAO,MAAM,eAAe,GAAU,SAAS,MAAM,EAAE,UAAU,MAAM,iBAatE,CAAC;AAEF,eAAO,MAAM,aAAa,GAAU,QAAQ,MAAM,EAAE,UAAU,MAAM,iBAanE,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAU,UAAU,MAAM,iBAYzD,CAAC;AAEF,eAAO,MAAM,aAAa,GAAU,SAAS,MAAM,EAAE,UAAU,MAAM,iBAapE,CAAC;AAEF,MAAM,WAAW,cAAc;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,cAAc,GACvB,aAAa,WAAW,GAAG,UAAU,EACrC,UAAU,MAAM,EAChB,MAAM,cAAc,iBAgCvB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAU,UAAU,MAAM,EAAE,aAAa,MAAM,iBAY5E,CAAC;AAEF,eAAO,MAAM,cAAc,GAAU,aAAa,MAAM,EAAE,UAAU,MAAM,iBAezE,CAAC;AAMF,MAAM,WAAW,mBAAmB;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,GAAU,SAAS,mBAAmB,iBAM9D,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;;GAIG;AACH,eAAO,MAAM,YAAY,GAAU,SAAS,gBAAgB,iBAO3D,CAAC;AAEF,MAAM,WAAW,iBAAiB;IAC9B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED;;;;GAIG;AACH,eAAO,MAAM,UAAU,GAAU,SAAS,iBAAiB,iBAM1D,CAAC;AAEF,MAAM,WAAW,sBAAsB;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,KAAK,CAAC;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAU,SAAS,sBAAsB,iBAOpE,CAAC"}

package/dist/services/api.js

@@ -1,5 +1,6 @@
 import { Platform } from 'react-native';
 let _backendUrl = null;
+let _headers = {};
 const getBackendUrl = () => {
     if (_backendUrl)
         return _backendUrl;
@@ -9,20 +10,34 @@ const getBackendUrl = () => {
     });
 };
 /**
- * Configure the backend URL for the knowledge base API.
- * Call this before using any other functions if your backend is not at localhost:3000.
- * @param url - The base URL of the backend (e.g., 'https://api.example.com')
+ * Configure the backend URL and optional headers for the knowledge base API.
+ * Call this before using any other functions if your backend is not at localhost:3000
+ * or if you need to pass specific API keys.
+ * @param options - The configuration options
  */
 export const configure = (options) => {
     _backendUrl = options.backendUrl;
+    if (options.headers) {
+        _headers = { ..._headers, ...options.headers };
+    }
+};
+/**
+ * Check if the API is configured (has a backend URL set).
+ */
+export const isConfigured = () => {
+    return _backendUrl !== null;
+};
+const getHeaders = () => {
+    return {
+        'Content-Type': 'application/json',
+        ..._headers
+    };
 };
 export const startConnection = async (appName, entityId) => {
     try {
         const response = await fetch(`${getBackendUrl()}/start-connection`, {
             method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
+            headers: getHeaders(),
             body: JSON.stringify({ appName, entityId }),
         });
         const data = await response.json();
@@ -37,9 +52,7 @@ export const executeAction = async (prompt, entityId) => {
     try {
         const response = await fetch(`${getBackendUrl()}/execute`, {
             method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
+            headers: getHeaders(),
             body: JSON.stringify({ prompt, entityId }),
         });
         const data = await response.json();
@@ -52,7 +65,9 @@ export const executeAction = async (prompt, entityId) => {
 };
 export const getConnectionStatus = async (entityId) => {
     try {
-        const response = await fetch(`${getBackendUrl()}/connection-status?entityId=${entityId}`);
+        const response = await fetch(`${getBackendUrl()}/connection-status?entityId=${entityId}`, {
+            headers: getHeaders()
+        });
         if (!response.ok)
             throw new Error('Failed to fetch status');
         const data = await response.json();
@@ -67,9 +82,7 @@ export const disconnectApp = async (appName, entityId) => {
     try {
         const response = await fetch(`${getBackendUrl()}/disconnect`, {
             method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
+            headers: getHeaders(),
             body: JSON.stringify({ appName, entityId }),
         });
         const data = await response.json();

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@enhearten/knowledge-base-module",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "Connect accounts (Gmail, GitHub, Discord, etc.) and search across them with AI to execute actions",
   "main": "index.ts",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
   "exports": {
     ".": {
+      "types": "./dist/index.d.ts",
       "import": "./dist/index.mjs",
-      "require": "./dist/index.js",
-      "types": "./dist/index.d.ts"
+      "require": "./dist/index.js"
     },
     "./backend": {
       "require": "./backend/app.js"

package/src/components/SettingsModal.tsx

@@ -0,0 +1,155 @@
+import React, { useState, useEffect } from 'react';
+import { Button, Card, Input, Label, Sheet, Text, XStack, YStack, Theme, Spinner } from 'tamagui';
+import { MaterialCommunityIcons } from '@expo/vector-icons';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import { configure } from '../services/api';
+
+interface SettingsModalProps {
+    open: boolean;
+    onClose: () => void;
+}
+
+export const SettingsModal: React.FC<SettingsModalProps> = ({ open, onClose }) => {
+    const [backendUrl, setBackendUrl] = useState('');
+    const [composioKey, setComposioKey] = useState('');
+    const [googleKey, setGoogleKey] = useState('');
+    const [loading, setLoading] = useState(false);
+    const [saving, setSaving] = useState(false);
+
+    useEffect(() => {
+        if (open) {
+            loadSettings();
+        }
+    }, [open]);
+
+    const loadSettings = async () => {
+        setLoading(true);
+        try {
+            const storedUrl = await AsyncStorage.getItem('kb_backend_url');
+            const storedComposioKey = await AsyncStorage.getItem('kb_composio_key');
+            const storedGoogleKey = await AsyncStorage.getItem('kb_google_key');
+
+            if (storedUrl) setBackendUrl(storedUrl);
+            if (storedComposioKey) setComposioKey(storedComposioKey);
+            if (storedGoogleKey) setGoogleKey(storedGoogleKey);
+        } catch (error) {
+            console.error('Failed to load settings', error);
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    const handleSave = async () => {
+        setSaving(true);
+        try {
+            // Remove trailing slash from URL if present
+            const cleanUrl = backendUrl.replace(/\/$/, '');
+
+            await AsyncStorage.setItem('kb_backend_url', cleanUrl);
+            await AsyncStorage.setItem('kb_composio_key', composioKey);
+            await AsyncStorage.setItem('kb_google_key', googleKey);
+
+            configure({
+                backendUrl: cleanUrl,
+                headers: {
+                    'x-composio-key': composioKey,
+                    'x-google-key': googleKey
+                }
+            });
+
+            onClose();
+        } catch (error) {
+            console.error('Failed to save settings', error);
+        } finally {
+            setSaving(false);
+        }
+    };
+
+    return (
+        <Theme name="light">
+            <Sheet
+                modal
+                open={open}
+                onOpenChange={(isOpen: boolean) => !isOpen && onClose()}
+                snapPoints={[85]}
+                dismissOnSnapToBottom
+            >
+                <Sheet.Overlay />
+                <Sheet.Frame padding="$4" backgroundColor="white">
+                    <Sheet.Handle />
+                    
+                    <YStack space="$4" paddingTop="$4">
+                        <XStack alignItems="center" space="$2">
+                            <MaterialCommunityIcons name="cog" size={28} color="#333" />
+                            <Text fontSize="$6" fontWeight="bold">Settings</Text>
+                        </XStack>
+
+                        <Text color="$gray11">
+                            Configure your Cloudflare Worker URL and API keys.
+                        </Text>
+
+                        {loading ? (
+                            <Spinner size="large" color="$blue10" />
+                        ) : (
+                            <YStack space="$4">
+                                <YStack space="$2">
+                                    <Label htmlFor="backendUrl" fontWeight="600">Backend URL (Cloudflare Worker)</Label>
+                                    <Input
+                                        id="backendUrl"
+                                        placeholder="https://knowledge-base-worker.your-subdomain.workers.dev"
+                                        value={backendUrl}
+                                        onChangeText={setBackendUrl}
+                                        autoCapitalize="none"
+                                        autoCorrect={false}
+                                    />
+                                </YStack>
+
+                                <YStack space="$2">
+                                    <Label htmlFor="composioKey" fontWeight="600">Composio API Key</Label>
+                                    <Input
+                                        id="composioKey"
+                                        placeholder="Enter your Composio API Key"
+                                        value={composioKey}
+                                        onChangeText={setComposioKey}
+                                        secureTextEntry
+                                    />
+                                </YStack>
+
+                                <YStack space="$2">
+                                    <Label htmlFor="googleKey" fontWeight="600">Google Gemini API Key</Label>
+                                    <Input
+                                        id="googleKey"
+                                        placeholder="Enter your Google Gemini API Key"
+                                        value={googleKey}
+                                        onChangeText={setGoogleKey}
+                                        secureTextEntry
+                                    />
+                                </YStack>
+
+                                <XStack gap="$3" justifyContent="flex-end" marginTop="$4">
+                                    <Button
+                                        size="$4"
+                                        variant="outlined"
+                                        onPress={onClose}
+                                        disabled={saving}
+                                    >
+                                        Cancel
+                                    </Button>
+                                    <Button
+                                        size="$4"
+                                        themeInverse
+                                        onPress={handleSave}
+                                        disabled={saving}
+                                        icon={saving ? <Spinner size="small" color="white" /> : undefined}
+                                    >
+                                        {saving ? 'Saving...' : 'Save Settings'}
+                                    </Button>
+                                </XStack>
+                            </YStack>
+                        )}
+                    </YStack>
+                </Sheet.Frame>
+            </Sheet>
+        </Theme>
+    );
+};

package/src/hooks/useServiceConnection.ts

@@ -1,14 +1,16 @@
 import { useState, useEffect, useRef } from 'react';
-import { Linking } from 'react-native';
-import { startConnection, getConnectionStatus, disconnectApp } from '../services/api';
+import { Linking, Alert } from 'react-native';
+import { startConnection, getConnectionStatus, disconnectApp, isConfigured } from '../services/api';
 
 export const useServiceConnection = (appName: string, entityId: string, searchTerms: string[] = [appName]) => {
     const [loading, setLoading] = useState(false);
     const [disconnecting, setDisconnecting] = useState(false);
     const [connected, setConnected] = useState(false);
+    const [error, setError] = useState<string | null>(null);
     const pollingInterval = useRef<NodeJS.Timeout | null>(null);
 
     const checkStatus = async () => {
+        if (!isConfigured()) return false;
         try {
             const data = await getConnectionStatus(entityId);
             const isConnected = data.connectedApps && data.connectedApps.some((a: string) =>
@@ -32,8 +34,15 @@ export const useServiceConnection = (appName: string, entityId: string, searchTe
     }, [entityId]);
 
     const handleConnect = async () => {
+        if (!isConfigured()) {
+            setError('Configuration missing. Please set up the API URL and keys.');
+            Alert.alert('Configuration Missing', 'Please configure the backend URL and API keys in settings.');
+            return;
+        }
+
         try {
             setLoading(true);
+            setError(null);
             const data = await startConnection(appName, entityId);
             if (data.url) await Linking.openURL(data.url);
 
@@ -57,6 +66,7 @@ export const useServiceConnection = (appName: string, entityId: string, searchTe
         } catch (error) {
             console.error(error);
             console.error(`Failed to connect ${appName}`);
+            setError(`Failed to connect ${appName}`);
             setLoading(false);
         }
     };
@@ -70,16 +80,18 @@ export const useServiceConnection = (appName: string, entityId: string, searchTe
     };
 
     const handleDisconnect = async () => {
+        if (!isConfigured()) return;
         try {
             setDisconnecting(true);
             await disconnectApp(appName, entityId);
             setConnected(false);
         } catch (error) {
             console.error(`Failed to disconnect ${appName}:`, error);
+            setError(`Failed to disconnect ${appName}`);
         } finally {
             setDisconnecting(false);
         }
     };
 
-    return { connected, loading, disconnecting, handleConnect, handleCancel, handleDisconnect };
+    return { connected, loading, disconnecting, error, handleConnect, handleCancel, handleDisconnect };
 };

package/src/index.ts

@@ -10,6 +10,7 @@ export { ConnectInstagram } from './components/ConnectInstagram';
 export { ConnectLinkedIn } from './components/ConnectLinkedIn';
 export { ConnectWhatsApp } from './components/ConnectWhatsApp';
 export { DataUploadModal } from './components/DataUploadModal';
+export { SettingsModal } from './components/SettingsModal';
 
 // Hooks
 export { useServiceConnection } from './hooks/useServiceConnection';

package/src/services/api.ts

@@ -1,6 +1,7 @@
 import { Platform } from 'react-native';
 
 let _backendUrl: string | null = null;
+let _headers: Record<string, string> = {};
 
 const getBackendUrl = () => {
     if (_backendUrl) return _backendUrl;
@@ -11,21 +12,37 @@ const getBackendUrl = () => {
 };
 
 /**
- * Configure the backend URL for the knowledge base API.
- * Call this before using any other functions if your backend is not at localhost:3000.
- * @param url - The base URL of the backend (e.g., 'https://api.example.com')
+ * Configure the backend URL and optional headers for the knowledge base API.
+ * Call this before using any other functions if your backend is not at localhost:3000
+ * or if you need to pass specific API keys.
+ * @param options - The configuration options
  */
-export const configure = (options: { backendUrl: string }) => {
+export const configure = (options: { backendUrl: string; headers?: Record<string, string> }) => {
     _backendUrl = options.backendUrl;
+    if (options.headers) {
+        _headers = { ..._headers, ...options.headers };
+    }
+};
+
+/**
+ * Check if the API is configured (has a backend URL set).
+ */
+export const isConfigured = () => {
+    return _backendUrl !== null;
+};
+
+const getHeaders = () => {
+    return {
+        'Content-Type': 'application/json',
+        ..._headers
+    };
 };
 
 export const startConnection = async (appName: string, entityId: string) => {
     try {
         const response = await fetch(`${getBackendUrl()}/start-connection`, {
             method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
+            headers: getHeaders(),
             body: JSON.stringify({ appName, entityId }),
         });
         const data = await response.json();
@@ -40,9 +57,7 @@ export const executeAction = async (prompt: string, entityId: string) => {
     try {
         const response = await fetch(`${getBackendUrl()}/execute`, {
             method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
+            headers: getHeaders(),
             body: JSON.stringify({ prompt, entityId }),
         });
         const data = await response.json();
@@ -55,7 +70,9 @@ export const executeAction = async (prompt: string, entityId: string) => {
 
 export const getConnectionStatus = async (entityId: string) => {
     try {
-        const response = await fetch(`${getBackendUrl()}/connection-status?entityId=${entityId}`);
+        const response = await fetch(`${getBackendUrl()}/connection-status?entityId=${entityId}`, {
+            headers: getHeaders()
+        });
         if (!response.ok) throw new Error('Failed to fetch status');
         const data = await response.json();
         return data;
@@ -69,9 +86,7 @@ export const disconnectApp = async (appName: string, entityId: string) => {
     try {
         const response = await fetch(`${getBackendUrl()}/disconnect`, {
             method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            },
+            headers: getHeaders(),
             body: JSON.stringify({ appName, entityId }),
         });
         const data = await response.json();