// @flow
import React, { useContext } from 'react';
import { ThemeContext } from 'styled-components';
import { getPaletteColor } from '../../../../mixins/branding';

export const SortArrowUp = () => {
  const theme = useContext(ThemeContext);
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="8"
      height="6"
      viewBox="0 0 8 6"
    >
      <path
        fill={getPaletteColor('greyscale-black')({ theme })}
        fillRule="evenodd"
        d="M4 0l4 6H0z"
      />
    </svg>
  );
};

SortArrowUp.displayName = 'SortArrowUp';
