import { notifications } from '../services/notification.service';

// Example 1: Simple notification with avatar
export function showUserNotification() {
  notifications.show({
    title: 'New message from John',
    message: 'Hey, are you available for a quick call?',
    avatar: {
      src: 'https://example.com/john-avatar.jpg',
      alt: 'John Doe',
      name: 'JD',
    },
  });
}

// Example 2: Progress notification
export function showUploadProgress() {
  const id = notifications.show({
    title: 'Uploading document',
    message: 'Please wait while we upload your file',
    type: 'loading',
    progress: {
      value: 0,
      label: 'Starting upload...',
      animated: true,
    },
    duration: 'persistent',
  });

  // Simulate upload progress
  let progress = 0;
  const interval = setInterval(() => {
    progress += 10;
    notifications.update(id, {
      progress: {
        value: progress,
        label: `${progress}% complete`,
        animated: true,
      },
    });

    if (progress >= 100) {
      clearInterval(interval);
      notifications.update(id, {
        type: 'success',
        title: 'Upload complete',
        message: 'Your document has been uploaded successfully',
        progress: undefined,
      });
    }
  }, 500);

  return id;
}

// Example 3: Status notification
export function showOrderStatus() {
  notifications.show({
    title: 'Order #12345',
    message: 'Your order is being processed',
    status: {
      type: 'processing',
      label: 'Processing payment',
    },
    badge: {
      label: 'Express',
      color: 'blue',
    },
    link: {
      href: '/orders/12345',
      label: 'View order details',
    },
  });
}

// Example 4: Notification with actions
export function showApprovalRequest() {
  notifications.show({
    title: 'Document requires approval',
    message: 'Please review and approve the budget proposal',
    type: 'warning',
    avatar: {
      icon: '📄',
    },
    actions: [
      {
        label: 'Approve',
        action: () => {
          console.log('Document approved');
          notifications.show({
            title: 'Document approved',
            type: 'success',
          });
        },
        style: 'primary',
      },
      {
        label: 'Reject',
        action: () => {
          console.log('Document rejected');
        },
        style: 'danger',
      },
      {
        label: 'Review later',
        action: 'dismiss',
      },
    ],
    duration: 'persistent',
  });
}

// Example 5: Notification with multiple features
export function showComplexNotification() {
  notifications.show({
    title: 'Build deployment started',
    message: 'Deploying to production environment',
    type: 'info',
    avatar: {
      icon: '🚀',
      color: 'blue',
    },
    status: {
      type: 'processing',
      label: 'Building application',
    },
    progress: {
      value: 25,
      label: 'Step 1 of 4',
      color: 'blue',
      striped: true,
      animated: true,
    },
    badge: {
      label: 'v2.1.0',
      variant: 'outline',
    },
    link: {
      href: 'https://github.com/org/repo/actions',
      label: 'View workflow',
      external: true,
    },
    actions: [
      {
        label: 'Cancel deployment',
        action: () => {
          console.log('Deployment cancelled');
        },
        style: 'danger',
      },
    ],
    duration: 'persistent',
  });
}

// Example 6: Error notification with status
export function showErrorNotification() {
  notifications.show({
    title: 'Payment failed',
    message: 'Your payment could not be processed. Please check your card details.',
    type: 'error',
    status: {
      type: 'failed',
      label: 'Transaction declined',
    },
    link: {
      href: '/billing/payment-methods',
      label: 'Update payment method',
    },
    actions: [
      {
        label: 'Retry payment',
        action: () => {
          console.log('Retrying payment');
        },
        style: 'primary',
      },
      {
        label: 'Contact support',
        action: () => {
          window.open('/support', '_blank');
        },
      },
    ],
  });
}