Saved Opportunities Widget

Web Component for displaying user's saved opportunities. See the Widgets Docs Index for theming and embed attributes.

Note: This widget requires user authentication to display saved opportunities. Replace the placeholder token with a real JWT authentication token for your user.
Live Widget Demo

🔐 Authentication

  • Requires JWT token for user authentication
  • Supports token via URL parameter or postMessage
  • Graceful handling of unauthenticated states
  • Automatic token refresh support

📱 Responsive Design

  • Adapts to container width
  • Mobile-friendly interface
  • Consistent with other widgets
  • Mantine UI components

🎯 Smart States

  • Loading state with spinner
  • Empty state with helpful message
  • Error handling with retry option
  • Authentication required prompt

🔄 Real-time Data

  • Fetches user's saved opportunities
  • Displays opportunities in carousel format
  • Includes save/unsave functionality
  • Links to full opportunity details

HTML Usage

<saved-opportunities-widget
  api-url="https://your-domain.com"
  auth-token="your-jwt-token-here"
  width="100%"
  height="400"
>
</saved-opportunities-widget>

JavaScript Integration

// Load the widget script
<script src="/js/saved-opportunities-widget.js"></script>

// Listen for widget events
document.addEventListener('DOMContentLoaded', function() {
  const widget = document.querySelector('saved-opportunities-widget');
  
  if (widget) {
    // Widget loaded successfully
    widget.addEventListener('load', function() {
      console.log('Saved opportunities widget loaded');
    });
    
    // Handle authentication requests
    widget.addEventListener('auth-required', function() {
      // Redirect to login or show login modal
      showLoginModal();
    });
    
    // Handle errors
    widget.addEventListener('error', function(event) {
      console.error('Widget error:', event.detail);
    });
  }
});
Integration Notes: