@kiwicom/smart-faq/src/shared/relay/GuaranteeNeededResolver.js

// @flow

import * as React from 'react';
import { graphql, createFragmentContainer } from 'react-relay';

import { GuaranteeChatContext } from '../context/GuaranteeChatInfo';
import type { GuaranteeChatBookingInfo } from '../context/GuaranteeChatInfo';
import type { GuaranteeNeededResolver_booking as GuaranteeNeededResolverType } from './__generated__/GuaranteeNeededResolver_booking.graphql';
import { track } from '../cuckoo/tracker';

type ComponentProps = {|
  booking: ?GuaranteeNeededResolverType,
  eventSource: 'smartFAQ' | 'contactForm',
|};

type Props = {|
  ...ComponentProps,
  showGuaranteeChat: boolean,
  guaranteeChatBookingInfo: ?GuaranteeChatBookingInfo,
  toggleGuaranteeChat: boolean => void,
  onSetBookingInfo: GuaranteeChatBookingInfo => void,
|};

class GuaranteeNeededResolver extends React.Component<Props> {
  componentDidMount() {
    this.shouldShowGuaranteeChat();
    this.updateBookingInfo();
  }

  componentDidUpdate() {
    this.shouldShowGuaranteeChat();
    this.updateBookingInfo();
  }

  componentWillUnmount() {
    const { showGuaranteeChat, toggleGuaranteeChat } = this.props;

    if (showGuaranteeChat) {
      toggleGuaranteeChat(false);
    }
  }

  updateBookingInfo = () => {
    const { booking, guaranteeChatBookingInfo, onSetBookingInfo } = this.props;
    const bid = booking && parseInt(booking.databaseId, 10);

    if (bid === guaranteeChatBookingInfo?.bid) return;

    const status = booking && booking.status;
    const departureCity = booking?.upcomingLeg?.departure?.airport?.city?.name;
    const arrivalCity = booking?.upcomingLeg?.arrival?.airport?.city?.name;
    const departureAirport = booking?.upcomingLeg?.departure?.airport?.code;
    const arrivalAirport = booking?.upcomingLeg?.arrival?.airport?.code;
    const phone = booking?.contactDetails?.phone;
    const email = booking?.contactDetails?.email;
    const firstName = booking?.contactDetails?.passenger?.firstname;
    const lastName = booking?.contactDetails?.passenger?.lastname;

    onSetBookingInfo({
      bid,
      status,
      departureCity,
      departureAirport,
      arrivalCity,
      arrivalAirport,
      phone,
      email,
      firstName,
      lastName,
    });
  };

  shouldShowGuaranteeChat = () => {
    const { booking, eventSource } = this.props;
    const forceGuaranteeChat =
      typeof window !== 'undefined' && window.GuaranteeChatForce;
    const showGuaranteeChat =
      booking?.customerSupport?.hasGuaranteeChat || forceGuaranteeChat || false;

    if (showGuaranteeChat !== this.props.showGuaranteeChat) {
      if (showGuaranteeChat) {
        track('GuaranteeChat', 'chatEnabled', { where: eventSource });
      }

      this.props.toggleGuaranteeChat(Boolean(showGuaranteeChat));
    }
  };

  render() {
    return null;
  }
}

const WrappedGuaranteeNeededResolver = ({
  booking,
  eventSource,
}: ComponentProps) => (
  <GuaranteeChatContext.Consumer>
    {({
      showGuaranteeChat,
      enableChat,
      toggleGuaranteeChat,
      onSetBookingInfo,
      guaranteeChatBookingInfo,
    }) => {
      if (!enableChat) {
        // do not process upcomingLeg info at all if chat is disabled
        return null;
      }

      return (
        <GuaranteeNeededResolver
          booking={booking}
          eventSource={eventSource}
          showGuaranteeChat={showGuaranteeChat}
          toggleGuaranteeChat={toggleGuaranteeChat}
          onSetBookingInfo={onSetBookingInfo}
          guaranteeChatBookingInfo={guaranteeChatBookingInfo}
        />
      );
    }}
  </GuaranteeChatContext.Consumer>
);

export const UnwrappedGuaranteeNeededResolver = GuaranteeNeededResolver;

export default createFragmentContainer(
  WrappedGuaranteeNeededResolver,
  graphql`
    fragment GuaranteeNeededResolver_booking on BookingInterface {
      databaseId: id(opaque: false)
      status
      contactDetails {
        phone
        email
        passenger {
          firstname
          lastname
        }
      }
      customerSupport {
        hasGuaranteeChat
      }
      upcomingLeg(guarantee: KIWICOM) {
        arrival {
          airport {
            city {
              name
            }
            code
          }
        }
        departure {
          airport {
            city {
              name
            }
            code
          }
        }
      }
    }
  `,
);