import type { TourStepProps } from 'antd';
import type { TourStepContext } from '../types';
import { domTarget } from '../types';

export function dashboardSteps(_ctx: TourStepContext): TourStepProps[] {
  return [
    {
      title: 'Your Command Center',
      description:
        'This is your operational hub. Real-time metrics, service health, and recent activity — everything you need at a glance.',
      target: null,
    },
    {
      title: 'Key Metrics',
      description:
        'These cards show your most important numbers: active campaigns, map locations, registered users. Click any card to jump to that section.',
      target: domTarget('[data-tour-dashboard-stats]'),
      placement: 'bottom',
    },
    {
      title: 'Service Health',
      description:
        'This grid shows whether each service is running. Green means healthy. If something goes red, check the logs for details.',
      target: domTarget('[data-tour-dashboard-services]'),
      placement: 'bottom',
    },
    {
      title: 'Activity Feed',
      description:
        'The activity feed shows recent actions across the platform — new users, campaign submissions, shift signups. Stay aware of what is happening.',
      target: domTarget('[data-tour-dashboard-activity]'),
      placement: 'left',
    },
    {
      title: 'Quick Actions',
      description:
        'Use these shortcuts to jump to common tasks like creating campaigns, uploading media, or managing users.',
      target: domTarget('[data-tour-dashboard-actions]'),
      placement: 'bottom',
    },
    {
      title: 'Explore More',
      description:
        'That covers the dashboard basics. Open the Learning Tours menu anytime to explore tutorials for specific features like Campaigns, Map, or Media.',
      target: null,
    },
  ];
}
