Add error, empty, success states to cart sidebar

components/product/Swatch/Swatch.tsx

@@ -2,6 +2,7 @@ import cn from 'classnames'
 import { FC } from 'react'
 import s from './Swatch.module.css'
 import { Colors } from '@components/ui/types'
+import { Check } from '@components/icon'
 import Button, { ButtonProps } from '@components/ui/Button'
 
 interface Props extends ButtonProps {
@@ -37,7 +38,7 @@ const Swatch: FC<Props> = ({ className, size, color, active, ...props }) => {
             'text-black': color === 'white',
           })}
         >
-          {Check}
+          <Check />
         </span>
       )}
       {size}
@@ -47,19 +48,3 @@ const Swatch: FC<Props> = ({ className, size, color, active, ...props }) => {
 
 export default Swatch
 
-const Check = (
-  <svg
-    width="24"
-    height="24"
-    viewBox="0 0 24 24"
-    fill="none"
-    stroke="currentColor"
-  >
-    <path
-      d="M20 6L9 17L4 12"
-      stroke-width="2"
-      stroke-linecap="round"
-      stroke-linejoin="round"
-    />
-  </svg>
-)