@kiwicom/smart-faq/src/SmartFAQ/common/booking/bookingStatuses.js

// @flow

import * as React from 'react';
import { Badge } from '@kiwicom/orbit-components';
import {
  CheckCircle,
  Clock,
  Refund,
} from '@kiwicom/orbit-components/lib/icons';
import { Consumer as IntlConsumer } from '@kiwicom/nitro/lib/services/intl/context';

type BookingStatuses = {
  [key: string]: {
    status: string,
    color: string,
    badgeType: 'dark' | 'success' | 'warning',
    icon: React.Node,
  },
};

type BookingBadgeStatusProps = {|
  status: string,
|};

export const bookingStatuses: BookingStatuses = {
  REFUNDED: {
    status: 'REFUNDED',
    color: '#171b1e',
    badgeType: 'dark',
    icon: <Refund />,
  },
  CONFIRMED: {
    status: 'CONFIRMED',
    color: '#127f22',
    badgeType: 'success',
    icon: <CheckCircle />,
  },
  CLOSED: {
    // FIXME: deprecated, remove when GraphQL is fixed
    status: 'CLOSED',
    color: '#ffc345',
    badgeType: 'warning',
    icon: <Clock />,
  },
  IN_PROCESS: {
    status: 'IN_PROCESS',
    color: '#ffc345',
    badgeType: 'warning',
    icon: <Clock />,
  },
};

export const BookingBadgeStatus = ({ status }: BookingBadgeStatusProps) => {
  const { badgeType, icon } = bookingStatuses[status] || {};
  return (
    <IntlConsumer>
      {intl => {
        const translatedStatuses = {
          REFUNDED: intl.translate(__('smartfaq.booking_status.refunded')),
          CONFIRMED: intl.translate(__('smartfaq.booking_status.confirmed')),
          CLOSED: intl.translate(__('smartfaq.booking_status.closed')),
          IN_PROCESS: intl.translate(__('smartfaq.booking_status.in_process')),
        };

        return (
          <Badge type={badgeType} icon={icon}>
            {translatedStatuses[status]}
          </Badge>
        );
      }}
    </IntlConsumer>
  );
};