From 2a24af7c47a03cbf2e8b9f9b7d6be0ad49e99ad5 Mon Sep 17 00:00:00 2001
From: divlo <contact@divlo.fr>
Date: Tue, 27 Apr 2021 17:49:34 +0200
Subject: [PATCH] fix: rendering issues with next-themes

---
 components/Header/Language/Arrow.tsx | 10 ++++++++++
 components/Header/SwitchTheme.tsx    | 10 ++++++++++
 2 files changed, 20 insertions(+)

diff --git a/components/Header/Language/Arrow.tsx b/components/Header/Language/Arrow.tsx
index adbdae1..1eb3a52 100644
--- a/components/Header/Language/Arrow.tsx
+++ b/components/Header/Language/Arrow.tsx
@@ -1,8 +1,18 @@
+import { useEffect, useState } from 'react'
 import { useTheme } from 'next-themes'
 
 export const Arrow: React.FC = () => {
+  const [mounted, setMounted] = useState(false)
   const { theme } = useTheme()
 
+  useEffect(() => {
+    setMounted(true)
+  }, [])
+
+  if (!mounted) {
+    return null
+  }
+
   return (
     <svg
       width='12'
diff --git a/components/Header/SwitchTheme.tsx b/components/Header/SwitchTheme.tsx
index 450ebf2..012366f 100644
--- a/components/Header/SwitchTheme.tsx
+++ b/components/Header/SwitchTheme.tsx
@@ -1,8 +1,18 @@
+import { useEffect, useState } from 'react'
 import { useTheme } from 'next-themes'
 
 export const SwitchTheme: React.FC = () => {
+  const [mounted, setMounted] = useState(false)
   const { theme, setTheme } = useTheme()
 
+  useEffect(() => {
+    setMounted(true)
+  }, [])
+
+  if (!mounted) {
+    return null
+  }
+
   return (
     <>
       <div