WIP

src/ui/App.tsx

@@ -2,14 +2,16 @@ import { Component, Show } from "solid-js";
 import type { DeepReadonly } from "solid-js/store";
 
 import { Handlers } from "../types";
-import { State, state } from "../state";
+import { setState, State, state } from "../state";
 
 import Header from "./components/Header";
 import GameTabs from "./components/GameTabs";
 import SetupTabs from "./components/SetupTabs";
 import Controls from "./components/Controls";
+import Popup from "./components/Popup";
 
 import "./App.css";
+import saveConfig from "../persistance/saveConfig";
 
 const App: Component<{ handlers: Handlers; state: DeepReadonly<State> }> = (
   props
@@ -42,6 +44,17 @@ const App: Component<{ handlers: Handlers; state: DeepReadonly<State> }> = (
           ></GameTabs>
         </div>
       </div>
+      <Show when={state.siteConfig.wrongBrowserPopup}>
+        <Popup
+          handlers={props.handlers}
+          onClose={() => {
+            setState("siteConfig", "wrongBrowserPopup", false);
+            saveConfig("site");
+          }}
+        >
+          {state.browser} | {state.os}
+        </Popup>
+      </Show>
     </div>
   );
 };