@kiwicom/smart-faq/src/SmartFAQ/MobileBookingHeader/MobileUserDetail.js

// @flow

import * as React from 'react';
import { Stack, Text } from '@kiwicom/orbit-components';

import { UserContext } from '../context/User';
import type { UserContextType } from '../context/User';
import type { User } from '../../types';
import SignOutButton from '../common/layout/SignOutButton';
import { isWebView } from '../helpers/UrlHelpers';

const getUsername = (user: ?User): string | null => {
  if (user && user.firstname) {
    return user.firstname;
  }

  if (user && user.email) {
    return user.email;
  }

  return null;
};

const MobileUserDetail = () => (
  <UserContext.Consumer>
    {({ user }: UserContextType) => (
      <div style={{ marginTop: '8px' }}>
        <Stack flex justify="between" spaceAfter="small">
          <Text type="secondary">{getUsername(user)}</Text>
          {!isWebView && <SignOutButton />}
        </Stack>
      </div>
    )}
  </UserContext.Consumer>
);

export default MobileUserDetail;