Renaming to common

components/common/Avatar/Avatar.tsx

@@ -0,0 +1,25 @@
+import cn from 'classnames'
+import { FC, useState } from 'react'
+import { getRandomPairOfColors } from '@lib/colors'
+
+interface Props {
+  className?: string
+  children?: any
+}
+
+const Avatar: FC<Props> = ({}) => {
+  const [bg] = useState(getRandomPairOfColors)
+
+  return (
+    <div
+      className="inline-block h-8 w-8 rounded-full border-2 border-primary hover:border-secondary focus:border-secondary transition linear-out duration-150"
+      style={{
+        backgroundImage: `linear-gradient(140deg, ${bg[0]}, ${bg[1]} 100%)`,
+      }}
+    >
+      {/* Add an image - We're generating a gradient as placeholder  <img></img> */}
+    </div>
+  )
+}
+
+export default Avatar