import * as React from 'react'
import InlineSVG from 'svg-inline-react'

import { APP_URL } from '../../utils/ResourceConstants'

import TrackingStatus from './TrackingStatus'
import CalendarInject from './CalendarInject'
import { IStatusBarComponentProps } from './interfaces'

const driftLogo = require('!svg-inline-loader?removeTags=true&removeSVGTagAttrs=false!../../../img/svg/Drift_logo.svg')

require('./styles.styl')


const StatusBar = ({ composeViewUUID, calendarOnClick }: IStatusBarComponentProps) =>
  <div className="drift-email-extension-status-bar">
    <a href={APP_URL}><InlineSVG className="drift-email-extension-status-bar-logo" src={driftLogo} /></a>
    <TrackingStatus composeViewUUID={composeViewUUID} />
    <CalendarInject composeViewUUID={composeViewUUID} calendarOnClick={calendarOnClick} />
  </div>

export default StatusBar