Error Handling

// Inside your component that calls elements.submit()
const handleSubmit = async (event) => {
event.preventDefault();
if (!elements || processing) return;

setProcessing(true);
setError(null); // Clear previous errors

try {
  const result = await elements.submit();
  console.log('Submission Result:', result);
  setSucceeded(true);
  // Handle successful submission (e.g., show a success message, redirect)
} catch (err) {
  console.error('Submission Error:', err);
  setError(err.message || 'An unexpected error occurred during submission.');
  setSucceeded(false);
}
setProcessing(false);
};

import { useNekudaWallet } from '@nekuda/react-nekuda-js';

function MyWalletComponent() {
const { elements, isReady, error } = useNekudaWallet();

if (error) {
  // Display an error message to the user or log it
  return <div style={{ color: 'red' }}>Error initializing payment services: {error.message}</div>;
}

if (!isReady) {
  // Show a loading state while the SDK is initializing
  return <div>Loading payment form...</div>;
}

// ... rest of your component logic using elements
return (
  <form>
    {/* Your form elements */}
    <button type="submit" disabled={!elements}>Submit</button>
  </form>
);
}

import { NekudaCardManagement, createWalletApiService } from '@nekuda/react-nekuda-js';

function PaymentMethods() {
const [errorMessage, setErrorMessage] = useState(null);

const apiService = createWalletApiService({
  customerId: 'your-customer-id',
  publicKey: 'YOUR_PUBLIC_KEY'
});

const handleCardOperationError = (error) => {
  // Handle specific error codes
  if (error.status === 401) {
    setErrorMessage('Authentication failed. Please log in again.');
  } else if (error.status === 429) {
    setErrorMessage('Too many requests. Please wait a moment and try again.');
  } else if (error.status >= 500) {
    setErrorMessage('Service temporarily unavailable. Please try again later.');
  } else {
    setErrorMessage(error.message || 'An error occurred while managing cards.');
  }
};

return (
  <NekudaWalletProvider
    publicKey="YOUR_PUBLIC_KEY"
    userId="user_123"
    onError={(errorInfo) => {
      // Handle API errors from the provider
      if (errorInfo.apiError) {
        handleCardOperationError(errorInfo.apiError);
      }
    }}
  >
    {errorMessage && (
      <div style={{ color: 'red', marginBottom: '10px' }}>
        {errorMessage}
      </div>
    )}
    
    <NekudaCardManagement
      apiService={apiService}
      userId="user_123"
      onCardSave={(card) => {
        setErrorMessage(null); // Clear errors on success
        console.log('Card saved successfully:', card);
      }}
      onCardDelete={(cardId) => {
        setErrorMessage(null);
        console.log('Card deleted:', cardId);
      }}
    />
  </NekudaWalletProvider>
);
}