feat(renderer): Insecure connection warning

Show a more prominent warning for insecure connections with a button
to try connecting over HTTPS if possible.

Signed-off-by: Kristóf Marussy <kristof@marussy.com>

1 files changed, 3 insertions, 1 deletions

diff --git a/packages/renderer/src/components/App.tsx b/packages/renderer/src/components/App.tsx
index 4a3a5cf..d381abf 100644
--- a/packages/renderer/src/components/App.tsx
+++ b/packages/renderer/src/components/App.tsx
@@ -24,8 +24,9 @@ import React, { useCallback, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import BrowserViewPlaceholder from './BrowserViewPlaceholder';
-import NewWindowBanner from './NewWindowBanner';
 import { useStore } from './StoreProvider';
+import InsecureConnectionBanner from './banner/InsecureConnectionBanner';
+import NewWindowBanner from './banner/NewWindowBanner';
 import ErrorPage from './errorPage/ErrorPage';
 import LocationBar from './locationBar/LocationBar';
 import Sidebar from './sidebar/Sidebar';
@@ -103,6 +104,7 @@ function App({ devMode }: { devMode: boolean }): JSX.Element {
         }}
       >
         <LocationBar />
+        <InsecureConnectionBanner service={selectedService} />
         <NewWindowBanner service={selectedService} />
         <BrowserViewPlaceholder>
           <ErrorPage service={selectedService} />