@kiwicom/smart-faq/src/SmartFAQ/common/layout/SignOutButton.js

// @flow

import * as React from 'react';
import Text from '@kiwicom/nitro/lib/components/Text';
import { withRouter } from 'react-router-dom';
import type { ContextRouter } from 'react-router-dom';
import LogContext from '@kiwicom/nitro/lib/services/log/context';
import ButtonLink from '@kiwicom/orbit-components/lib/ButtonLink';

import { BookingState } from '../../context/BookingState';
import type { onLogout } from '../../../types';
import { events } from '../../../const/events';
import type { log } from '../../../const/events';

type OwnProps = {|
  ...ContextRouter,
|};

type Props = {|
  ...OwnProps,
  onLogout: onLogout,
  log: log,
|};

class SignOutButton extends React.Component<Props> {
  onSignOut = async () => {
    const { onLogout, history, log } = this.props;

    await onLogout();
    history.push('/');
    log(events.SIGN_OUT, {});
  };

  render() {
    return (
      <ButtonLink
        transparent={true}
        onClick={this.onSignOut}
        role="button"
        tabIndex="0"
        dataTest="signOutButton"
      >
        <Text type="attention" t="smartfaq.header.sign_out" />
      </ButtonLink>
    );
  }
}

const WrappedSignOutButton = (props: OwnProps) => {
  const { onLogout } = React.useContext(BookingState);
  const { log } = React.useContext(LogContext);
  return <SignOutButton {...props} onLogout={onLogout} log={log} />;
};

export default withRouter(WrappedSignOutButton);