Moved everything

site/lib/hooks/useAcceptCookies.ts

@@ -0,0 +1,24 @@
+import Cookies from 'js-cookie'
+import { useEffect, useState } from 'react'
+
+const COOKIE_NAME = 'accept_cookies'
+
+export const useAcceptCookies = () => {
+  const [acceptedCookies, setAcceptedCookies] = useState(true)
+
+  useEffect(() => {
+    if (!Cookies.get(COOKIE_NAME)) {
+      setAcceptedCookies(false)
+    }
+  }, [])
+
+  const acceptCookies = () => {
+    setAcceptedCookies(true)
+    Cookies.set(COOKIE_NAME, 'accepted', { expires: 365 })
+  }
+
+  return {
+    acceptedCookies,
+    onAcceptCookies: acceptCookies,
+  }
+}

site/lib/hooks/useUserAvatar.ts

@@ -0,0 +1,26 @@
+import { useEffect } from 'react'
+import { useUI } from '@components/ui/context'
+import { getRandomPairOfColors } from '@lib/colors'
+
+export const useUserAvatar = (name = 'userAvatar') => {
+  const { userAvatar, setUserAvatar } = useUI()
+
+  useEffect(() => {
+    if (!userAvatar && localStorage.getItem(name)) {
+      // Get bg from localStorage and push it to the context.
+      setUserAvatar(localStorage.getItem(name))
+    }
+    if (!localStorage.getItem(name)) {
+      // bg not set locally, generating one, setting localStorage and context to persist.
+      const bg = getRandomPairOfColors()
+      const value = `linear-gradient(140deg, ${bg[0]}, ${bg[1]} 100%)`
+      localStorage.setItem(name, value)
+      setUserAvatar(value)
+    }
+  }, [])
+
+  return {
+    userAvatar,
+    setUserAvatar,
+  }
+}