From a35bb3ff26bf10b0e54383222df283800d6ee2c8 Mon Sep 17 00:00:00 2001
From: Anastasiia Derymarko <anastasiia@redocly.com>
Date: Tue, 2 Aug 2022 14:13:41 +0300
Subject: [PATCH] fix: Redocly logo (#2109)

---
 src/components/SideMenu/Logo.tsx     | 18 ++++++++++++++++++
 src/components/SideMenu/SideMenu.tsx |  5 +++--
 2 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 src/components/SideMenu/Logo.tsx

diff --git a/src/components/SideMenu/Logo.tsx b/src/components/SideMenu/Logo.tsx
new file mode 100644
index 0000000000..c3e0bfe3df
--- /dev/null
+++ b/src/components/SideMenu/Logo.tsx
@@ -0,0 +1,18 @@
+import { useEffect, useState } from 'react';
+import * as React from 'react';
+
+export default function RedoclyLogo(): JSX.Element | null {
+  const [isDisplay, setDisplay] = useState(false);
+
+  useEffect(() => {
+    setDisplay(true);
+  }, []);
+
+  return isDisplay ? (
+    <img
+      alt={'redocly logo'}
+      onError={() => setDisplay(false)}
+      src={'https://cdn.redoc.ly/redoc/logo-mini.svg'}
+    />
+  ) : null;
+}
diff --git a/src/components/SideMenu/SideMenu.tsx b/src/components/SideMenu/SideMenu.tsx
index 7b86f7d7ea..58dd34c54d 100644
--- a/src/components/SideMenu/SideMenu.tsx
+++ b/src/components/SideMenu/SideMenu.tsx
@@ -8,6 +8,7 @@ import { MenuItems } from './MenuItems';
 
 import { PerfectScrollbarWrap } from '../../common-elements/perfect-scrollbar';
 import { RedocAttribution } from './styled.elements';
+import RedoclyLogo from './Logo';
 
 @observer
 export class SideMenu extends React.Component<{ menu: MenuStore; className?: string }> {
@@ -27,8 +28,8 @@ export class SideMenu extends React.Component<{ menu: MenuStore; className?: str
         <MenuItems items={store.items} onActivate={this.activate} root={true} />
         <RedocAttribution>
           <a target="_blank" rel="noopener noreferrer" href="https://redocly.com/redoc/">
-            <img src={'https://cdn.redoc.ly/redoc/logo-mini.svg'} alt={'redocly logo'} /> API docs
-            by Redocly
+            <RedoclyLogo />
+            API docs by Redocly
           </a>
         </RedocAttribution>
       </PerfectScrollbarWrap>