@kiwicom/smart-faq/src/shared/context/GuaranteeChatInfo.js

Smart FAQ

// @flow
/* eslint-disable react/no-unused-state */

import * as React from 'react';

export type GuaranteeChatBookingInfo = {|
  bid: ?number,
  status: ?string,
  departureCity: ?string,
  departureAirport: ?string,
  arrivalCity: ?string,
  arrivalAirport: ?string,
  phone: ?string,
  email: ?string,
  firstName: ?string,
  lastName: ?string,
|};

export type ChatConfig = {
  [key: string]: string,
} | null;

type Props = {|
  enableChat?: boolean,
  chatConfig: ChatConfig,
  onToggleIsClosable: boolean => void,
  children: React.Node,
  isChatActive: boolean,
|};

export type State = {|
  showGuaranteeChat: boolean,
  guaranteeChatBookingInfo: ?GuaranteeChatBookingInfo,
  onSetBookingInfo: GuaranteeChatBookingInfo => void,
  onToggleIsClosable: boolean => void,
  toggleGuaranteeChat: (showGuaranteeChat: boolean) => void,
  enableChat: boolean,
  chatConfig: ChatConfig,
  isChatActive: boolean,
|};

const initialState = {
  showGuaranteeChat: false,
  guaranteeChatBookingInfo: null,
  chatConfig: {},
  isChatActive: false,
};

export const GuaranteeChatInfoState = React.createContext({
  ...initialState,
  onSetBookingInfo: () => {},
  onToggleIsClosable: () => {},
  toggleGuaranteeChat: (showGuaranteeChat: boolean) => {}, // eslint-disable-line no-unused-vars
  enableChat: true,
});

class GuaranteeChatInfo extends React.Component<Props, State> {
  static getDerivedStateFromProps(nextProps: Props) {
    return {
      isChatActive: nextProps.isChatActive,
      enableChat: nextProps.enableChat,
      chatConfig: nextProps.chatConfig,
    };
  }

  constructor(props: Props) {
    super(props);

    this.state = {
      ...initialState,
      onSetBookingInfo: this.onSetBookingInfo,
      toggleGuaranteeChat: this.toggleGuaranteeChat,
      chatConfig: props.chatConfig,
      onToggleIsClosable: props.onToggleIsClosable,
      isChatActive: props.isChatActive,
      enableChat: props.enableChat,
    };
  }

  onSetBookingInfo = (guaranteeChatBookingInfo: GuaranteeChatBookingInfo) => {
    this.setState({ guaranteeChatBookingInfo });
  };

  toggleGuaranteeChat = (showGuaranteeChat: boolean) => {
    this.setState({ showGuaranteeChat });
  };

  render() {
    return (
      <GuaranteeChatInfoState.Provider value={this.state}>
        {this.props.children}
      </GuaranteeChatInfoState.Provider>
    );
  }
}

export default GuaranteeChatInfo;