import React, { FC } from 'react';

import ProperLogo from '../../../icons/ProperLogo';
import { TopNavBody, TopNavLeftContent, TopNavRightContent } from '../styles';
import { ITopNavDesktopProps } from './types';

export const TopNavDesktop: FC<ITopNavDesktopProps> = ({
  leftItems,
  rightItems,
}) => {
  return (
    <TopNavBody>
      <TopNavLeftContent>
        <ProperLogo width={80} color={'#3A5DAE'} />

        {leftItems}
      </TopNavLeftContent>

      <TopNavRightContent>{rightItems}</TopNavRightContent>
    </TopNavBody>
  );
};