import * as React from 'react';
import styled from 'styled-components';

import Colors from '../Colors';
import Sizes from '../Sizes';

export interface IProps {
  width?: number;
  height?: number;
}

const DashboardIcon = styled.svg`
  .a {
    fill: ${Colors.lochmara}
  }

  .c {
    fill: ${Colors.white}
  }
`;

export default React.memo(({ width, height }: IProps) => (
  <DashboardIcon viewBox='0 0 42.035 42.035' width={width || Sizes.s5} height={height || Sizes.s5}>
    <path className='a' d='M1.184 1.184h39.667v5.471H1.184zm0 0M17.598 27.857h6.839v5.471h-6.839zm0 0M17.598 14.178h6.839v5.471h-6.839zm0 0M28.54 27.857h6.839v5.471H28.54zm0 0M28.54 14.178h6.839v5.471H28.54zm0 0M6.655 27.857h6.839v5.471H6.655zm0 0M6.655 14.178h6.839v5.471H6.655zm0 0' />
    <path d='M40.851.5H1.184a.684.684 0 0 0-.684.684v39.667a.684.684 0 0 0 .684.684h39.667a.684.684 0 0 0 .684-.684V1.184A.684.684 0 0 0 40.851.5zM1.868 1.868h38.3v4.1h-38.3zm38.3 38.3h-38.3V7.339h38.3zm0 0' stroke={Colors.lochmara} fill={Colors.lochmara}/>
    <path className='c' d='M3.236 3.236h1.368v1.368H3.236zm0 0M5.971 3.236h1.368v1.368H5.971zm0 0M8.707 3.236h1.368v1.368H8.707zm0 0' />
    <path className='a' d='M24.437 34.012h-6.839a.684.684 0 0 1-.684-.684v-5.471a.684.684 0 0 1 .684-.684h6.839a.684.684 0 0 1 .684.684v5.471a.684.684 0 0 1-.684.684zm-6.155-1.368h5.471v-4.1h-5.471zm0 0M24.437 20.333h-6.839a.684.684 0 0 1-.684-.684v-5.471a.684.684 0 0 1 .684-.684h6.839a.684.684 0 0 1 .684.684v5.471a.684.684 0 0 1-.684.684zm-6.155-1.368h5.471v-4.1h-5.471zm0 0M35.38 34.012h-6.839a.684.684 0 0 1-.684-.684v-5.471a.684.684 0 0 1 .684-.684h6.839a.684.684 0 0 1 .684.684v5.471a.684.684 0 0 1-.684.684zm-6.155-1.368h5.471v-4.1h-5.471zm0 0M35.38 20.333h-6.839a.684.684 0 0 1-.684-.684v-5.471a.684.684 0 0 1 .684-.684h6.839a.684.684 0 0 1 .684.684v5.471a.684.684 0 0 1-.684.684zm-6.155-1.368h5.471v-4.1h-5.471zm0 0M13.494 34.012H6.655a.684.684 0 0 1-.684-.684v-5.471a.684.684 0 0 1 .684-.684h6.839a.684.684 0 0 1 .684.684v5.471a.684.684 0 0 1-.684.684zm-6.155-1.368h5.471v-4.1H7.339zm0 0M13.494 20.333H6.655a.684.684 0 0 1-.684-.684v-5.471a.684.684 0 0 1 .684-.684h6.839a.684.684 0 0 1 .684.684v5.471a.684.684 0 0 1-.684.684zm-6.155-1.368h5.471v-4.1H7.339zm0 0' />
  </DashboardIcon>
));