@bytexbyte/nxtlinq-ai-agent-sdk 1.2.1 → 1.2.2

package/README.md

@@ -17,6 +17,7 @@ A powerful SDK for building intelligent conversation applications with Nxtlinq A
 - 🔑 Permission-based access control
 - 🔍 Enhanced error handling and debugging
 - ⚡ Improved async operation handling
+- 🔔 Unified notification system with Modal prompts
 
 ## Installation
 
@@ -70,6 +71,8 @@ function App() {
 }
 ```
 
+> **Note**: The SDK now includes a unified notification system. All success, error, warning, and info messages are displayed as Modal prompts in the top-right corner, providing a consistent and non-intrusive user experience.
+
 ## Berify.me Integration
 
 The SDK supports Berify.me wallet verification for enhanced security:
@@ -130,6 +133,17 @@ function App() {
 | retryDelay | number | No | Delay between retries in milliseconds (default: 1000) |
 | permissionGroup | string | No | Permission group name for filtering permissions |
 
+### Notification System
+
+The SDK includes a unified notification system that displays Modal prompts for various operations:
+
+- **Success Notifications**: Green modal for successful operations (auto-hide after 3 seconds)
+- **Error Notifications**: Red modal for error messages (auto-hide after 5 seconds)
+- **Warning Notifications**: Orange modal for warnings (auto-hide after 4 seconds)
+- **Info Notifications**: Blue modal for informational messages (auto-hide after 3 seconds)
+
+All notifications appear in the top-right corner and can be manually dismissed by clicking the × button.
+
 ## Types
 
 ### Message

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

@@ -1 +1 @@
-{"version":3,"file":"ChatBot.d.ts","sourceRoot":"","sources":["../../src/components/ChatBot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,OAAO,EAAkC,MAAM,kBAAkB,CAAC;AAE3E,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,OAAO;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC5B;AAED,MAAM,WAAW,QAAQ;IACvB,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC/B,QAAQ,CAAC,EAAE,QAAQ,CAAC;CACrB;AAED,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,YAAY;IAC3B,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC;IAC1D,cAAc,CAAC,EAAE,aAAa,EAAE,CAAC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,OAAO,CAAC;QAC7B,KAAK,EAAE,MAAM,CAAC;KACf,GAAG,SAAS,CAAC,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AA2cD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAogC1C,CAAC"}
+{"version":3,"file":"ChatBot.d.ts","sourceRoot":"","sources":["../../src/components/ChatBot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,EAAE,OAAO,EAAkC,MAAM,kBAAkB,CAAC;AAE3E,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,OAAO;IACtB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC5B;AAED,MAAM,WAAW,QAAQ;IACvB,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC/B,QAAQ,CAAC,EAAE,QAAQ,CAAC;CACrB;AAED,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,YAAY;IAC3B,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC,CAAC;IAC1D,cAAc,CAAC,EAAE,aAAa,EAAE,CAAC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,OAAO,CAAC;QAC7B,KAAK,EAAE,MAAM,CAAC;KACf,GAAG,SAAS,CAAC,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AA8hBD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAmjC1C,CAAC"}

package/dist/components/ChatBot.js

@@ -5,6 +5,61 @@ import { createNxtlinqApi } from '../api/nxtlinq-api';
 import stringify from 'fast-json-stable-stringify';
 import metakeepClient from '../core/metakeepClient';
 import useLocalStorage from '../core/lib/useLocalStorage';
+const NotificationModal = ({ notification, onClose }) => {
+    const getStyles = () => {
+        const baseStyles = {
+            position: 'fixed',
+            bottom: 20,
+            right: 20,
+            padding: '12px 24px',
+            borderRadius: 8,
+            zIndex: 2000,
+            fontWeight: 600,
+            boxShadow: '0 4px 12px rgba(0, 0, 0, 0.15)',
+            transition: 'all 0.3s ease',
+            display: 'flex',
+            alignItems: 'center',
+            gap: '12px',
+            minWidth: '300px',
+            maxWidth: '500px'
+        };
+        switch (notification.type) {
+            case 'success':
+                return { ...baseStyles, background: '#4caf50', color: 'white' };
+            case 'error':
+                return { ...baseStyles, background: '#f44336', color: 'white' };
+            case 'warning':
+                return { ...baseStyles, background: '#ff9800', color: 'white' };
+            default:
+                return { ...baseStyles, background: '#2196f3', color: 'white' };
+        }
+    };
+    const getIcon = () => {
+        switch (notification.type) {
+            case 'success':
+                return '✅';
+            case 'error':
+                return '❌';
+            case 'warning':
+                return '⚠️';
+            default:
+                return 'ℹ️';
+        }
+    };
+    return (notification.show && (_jsxs("div", { style: getStyles(), children: [_jsx("span", { style: { fontSize: '18px' }, children: getIcon() }), _jsx("span", { style: { flex: 1 }, children: notification.message }), _jsx("button", { onClick: onClose, style: {
+                    background: 'none',
+                    border: 'none',
+                    color: 'white',
+                    fontSize: '18px',
+                    cursor: 'pointer',
+                    padding: '4px',
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    borderRadius: '4px',
+                    transition: 'background-color 0.2s'
+                }, onMouseOver: (e) => e.currentTarget.style.backgroundColor = 'rgba(255, 255, 255, 0.2)', onMouseOut: (e) => e.currentTarget.style.backgroundColor = 'transparent', children: "\u00D7" })] })));
+};
 const PermissionForm = ({ hitAddress, permissions, setPermissions, setIsDisabled, onClose, onSave, onConnectWallet, onSignIn, isNeedSignInWithWallet, walletInfo, onVerifyWallet, serviceId, nxtlinqApi, permissionGroup, isAITLoading, isWalletLoading = false }) => {
     const [availablePermissions, setAvailablePermissions] = React.useState([]);
     const [isSaving, setIsSaving] = React.useState(false);
@@ -310,7 +365,6 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
     const [permissions, setPermissions] = React.useState([]);
     const [availablePermissions, setAvailablePermissions] = React.useState([]);
     const [showPermissionForm, setShowPermissionForm] = React.useState(false);
-    const [success, setSuccess] = React.useState(false);
     const [isPermissionFormOpen, setIsPermissionFormOpen] = React.useState(false);
     const [isAITLoading, setIsAITLoading] = React.useState(false);
     const messagesEndRef = React.useRef(null);
@@ -320,7 +374,34 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
     const verifyWalletBtnRef = React.useRef(null);
     const [nxtlinqAITServiceAccessToken, setNxtlinqAITServiceAccessToken] = useLocalStorage('nxtlinqAITServiceAccessToken', '');
     const [isWalletLoading, setIsWalletLoading] = React.useState(false);
+    const [notification, setNotification] = React.useState({
+        show: false,
+        type: 'info',
+        message: '',
+        autoHide: true,
+        duration: 5000
+    });
     const nxtlinqApi = React.useMemo(() => createNxtlinqApi(apiKey, apiSecret), [apiKey, apiSecret]);
+    // Unified notification functions
+    const showNotification = (type, message, duration = 5000) => {
+        setNotification({
+            show: true,
+            type,
+            message,
+            autoHide: true,
+            duration
+        });
+        // Auto-hide
+        if (duration > 0) {
+            setTimeout(() => {
+                setNotification(prev => ({ ...prev, show: false }));
+            }, duration);
+        }
+    };
+    const showSuccess = (message) => showNotification('success', message, 3000);
+    const showError = (message) => showNotification('error', message, 5000);
+    const showWarning = (message) => showNotification('warning', message, 4000);
+    const showInfo = (message) => showNotification('info', message, 3000);
     const fetchAvailablePermissions = async () => {
         if (!serviceId)
             return;
@@ -484,7 +565,7 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
             signer: !!signer
         });
         if (!hitAddress) {
-            alert('Please connect your wallet first.');
+            showError('Please connect your wallet first.');
             return;
         }
         try {
@@ -540,11 +621,13 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
                                     }
                                 }
                                 setIsLoading(false);
+                                // Use Modal notification instead of ChatBot message
+                                showSuccess('Wallet verification completed successfully! Your wallet is now verified and ready to use.');
                                 // Refresh AIT after wallet verification
                                 refreshAIT();
                                 return { token, hitAddress: address };
                             }
-                            alert(verifyWalletResponse.error);
+                            showError(verifyWalletResponse.error);
                             setIsLoading(false);
                             return;
                         }
@@ -579,6 +662,8 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
                             }
                         }
                         setIsLoading(false);
+                        // Use Modal notification instead of ChatBot message
+                        showSuccess('Wallet verification completed successfully! Your wallet is now verified and ready to use.');
                         // Refresh AIT after wallet verification
                         refreshAIT();
                         return { token, hitAddress: address };
@@ -593,7 +678,7 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
                             msg = error.message;
                         }
                         console.error('Wallet verification failed:', error);
-                        alert(msg);
+                        showError(msg);
                         setIsLoading(false);
                         throw error;
                     }
@@ -605,7 +690,7 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
         catch (error) {
             console.error('Failed to verify wallet:', error);
             setIsLoading(false);
-            alert('Failed to verify wallet. Please try again.');
+            showError('Failed to verify wallet. Please try again.');
             throw error;
         }
     };
@@ -686,12 +771,7 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
                 }
                 else {
                     // User is already signed in
-                    setMessages(prev => [...prev, {
-                            id: Date.now().toString(),
-                            content: 'Successfully connected your HIT wallet. You are already signed in and can use the AI agent.',
-                            role: 'assistant',
-                            timestamp: new Date().toISOString()
-                        }]);
+                    showSuccess('Successfully connected your HIT wallet. You are already signed in and can use the AI agent.');
                 }
             }
             return userAddress;
@@ -706,17 +786,17 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
     }, [nxtlinqAITServiceAccessToken, refreshAIT, isNeedSignInWithWallet]);
     const signInWallet = async (autoShowSuccessMessage = true) => {
         if (!hitAddress) {
-            alert('Please connect your wallet first.');
+            showError('Please connect your wallet first.');
             return;
         }
         if (!signer) {
-            alert('Please connect your wallet first.');
+            showError('Please connect your wallet first.');
             return;
         }
         try {
             const nonceResponse = await nxtlinqApi.auth.getNonce({ address: hitAddress });
             if ('error' in nonceResponse) {
-                alert(nonceResponse.error);
+                showError(nonceResponse.error);
                 return;
             }
             const payload = {
@@ -731,26 +811,21 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
                 signature
             });
             if ('error' in response) {
-                alert(response.error);
+                showError(response.error);
                 return;
             }
             const { accessToken } = response;
             setNxtlinqAITServiceAccessToken(accessToken);
             // Auto-show connected message after signing in
             if (autoShowSuccessMessage) {
-                setMessages(prev => [...prev, {
-                        id: Date.now().toString(),
-                        content: 'Successfully signed in with your HIT wallet. You can now use the AI agent.',
-                        role: 'assistant',
-                        timestamp: new Date().toISOString()
-                    }]);
+                showSuccess('Successfully signed in with your HIT wallet. You can now use the AI agent.');
             }
             // Refresh AIT after signing in
             refreshAIT();
         }
         catch (error) {
             console.error('Failed to sign in:', error);
-            alert('Failed to sign in. Please try again.');
+            showError('Failed to sign in. Please try again.');
         }
     };
     const hasPermission = async (toolName) => {
@@ -764,7 +839,7 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
                 }]);
             return false;
         }
-        // Check if user has signed in with wallet
+        // Check if user has signed in with wallet and token is valid
         if (!nxtlinqAITServiceAccessToken) {
             setMessages(prev => [...prev, {
                     id: Date.now().toString(),
@@ -775,6 +850,51 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
                 }]);
             return false;
         }
+        // Validate token - check if it's expired or for different address
+        try {
+            const payload = JSON.parse(atob(nxtlinqAITServiceAccessToken.split('.')[1]));
+            const exp = payload.exp * 1000; // Convert to milliseconds
+            const now = Date.now();
+            if (exp < now) {
+                // Clear invalid token
+                setNxtlinqAITServiceAccessToken('');
+                setMessages(prev => [...prev, {
+                        id: Date.now().toString(),
+                        content: 'Your wallet session has expired. Please sign in again.',
+                        role: 'assistant',
+                        timestamp: new Date().toISOString(),
+                        button: 'signIn'
+                    }]);
+                return false;
+            }
+            // Check if the token's payload has the same address as the wallet address
+            const address = payload.address;
+            if (address !== hitAddress) {
+                // Clear mismatched token
+                setNxtlinqAITServiceAccessToken('');
+                setMessages(prev => [...prev, {
+                        id: Date.now().toString(),
+                        content: 'Wallet address mismatch. Please sign in with the correct wallet.',
+                        role: 'assistant',
+                        timestamp: new Date().toISOString(),
+                        button: 'signIn'
+                    }]);
+                return false;
+            }
+        }
+        catch (error) {
+            console.error('Error parsing token:', error);
+            // Clear invalid token
+            setNxtlinqAITServiceAccessToken('');
+            setMessages(prev => [...prev, {
+                    id: Date.now().toString(),
+                    content: 'Invalid wallet session. Please sign in again.',
+                    role: 'assistant',
+                    timestamp: new Date().toISOString(),
+                    button: 'signIn'
+                }]);
+            return false;
+        }
         if (!ait) {
             setMessages(prev => [...prev, {
                     id: Date.now().toString(),
@@ -943,7 +1063,8 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
         setIsDisabled(true);
         try {
             await generateAndRegisterAIT();
-            setSuccess(true);
+            // Use Modal notification instead of ChatBot message
+            showSuccess('AIT permissions saved successfully! You can now use the AI agent with your configured permissions.');
             setShowPermissionForm(false);
             setIsPermissionFormOpen(false);
         }
@@ -951,7 +1072,10 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
             console.error('Failed to generate AIT:', error);
             setIsDisabled(false);
             if (error instanceof Error) {
-                alert(error.message);
+                showError(error.message);
+            }
+            else {
+                showError('Failed to save permissions. Please try again.');
             }
         }
     };
@@ -971,15 +1095,6 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
             onMessage?.(lastMessage);
         }
     }, [messages, onMessage]);
-    // Auto hide success message after 3 seconds
-    React.useEffect(() => {
-        if (success) {
-            const timer = setTimeout(() => {
-                setSuccess(false);
-            }, 3000);
-            return () => clearTimeout(timer);
-        }
-    }, [success]);
     return (_jsxs("div", { style: {
             position: 'fixed',
             bottom: '20px',
@@ -1123,22 +1238,5 @@ export const ChatBot = ({ onMessage, onError, onToolUse, presetMessages = [], pl
                 }, children: _jsx(PermissionForm, { hitAddress: hitAddress, permissions: permissions, setPermissions: setPermissions, setIsDisabled: setIsDisabled, onClose: () => {
                         setShowPermissionForm(false);
                         setIsPermissionFormOpen(false);
-                    }, onConnectWallet: () => connectWallet(false), onSignIn: () => signInWallet(false), onSave: savePermissions, isNeedSignInWithWallet: isNeedSignInWithWallet, walletInfo: walletInfo, onVerifyWallet: handleVerifyWalletClick, serviceId: serviceId, nxtlinqApi: nxtlinqApi, permissionGroup: permissionGroup, isAITLoading: isAITLoading, isWalletLoading: isWalletLoading }) })), success && (_jsxs("div", { style: {
-                    position: 'fixed',
-                    bottom: 100,
-                    right: 40,
-                    background: '#4caf50',
-                    color: 'white',
-                    padding: '12px 24px',
-                    borderRadius: 8,
-                    zIndex: 2000,
-                    fontWeight: 600,
-                }, children: ["Saved successfully!", _jsx("button", { style: {
-                            background: 'none',
-                            border: 'none',
-                            color: 'white',
-                            marginLeft: 16,
-                            fontSize: 18,
-                            cursor: 'pointer'
-                        }, onClick: () => setSuccess(false), children: "\u00D7" })] }))] }));
+                    }, onConnectWallet: () => connectWallet(false), onSignIn: () => signInWallet(false), onSave: savePermissions, isNeedSignInWithWallet: isNeedSignInWithWallet, walletInfo: walletInfo, onVerifyWallet: handleVerifyWalletClick, serviceId: serviceId, nxtlinqApi: nxtlinqApi, permissionGroup: permissionGroup, isAITLoading: isAITLoading, isWalletLoading: isWalletLoading }) })), notification.show && (_jsx(NotificationModal, { notification: notification, onClose: () => setNotification({ ...notification, show: false }) }))] }));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytexbyte/nxtlinq-ai-agent-sdk",
-  "version": "1.2.1",
+  "version": "1.2.2",
   "description": "Nxtlinq AI Agent SDK - Proprietary Software with enhanced async operation handling",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",