fix: refresh sw when browser refreshed (#6824)

* fix: refresh sw when browser refreshed

* dummy test

* enable immediate reload

* test

* fix

* autoupdate

* don't immediate

* test

* testing testing

* test

* test

* its same

* revert logs

* fix types

---------

src/index.tsx

@@ -1,11 +1,14 @@
 import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 import ExcalidrawApp from "./excalidraw-app";
+import { registerSW } from "virtual:pwa-register";
 
 import "./excalidraw-app/sentry";
 window.__EXCALIDRAW_SHA__ = import.meta.env.VITE_APP_GIT_SHA;
 const rootElement = document.getElementById("root")!;
 const root = createRoot(rootElement);
+registerSW();
+
 root.render(
   <StrictMode>
     <ExcalidrawApp />

src/vite-env.d.ts

@@ -1,8 +1,7 @@
 /// <reference types="vite/client" />
-/// <reference types="vite-plugin-pwa/react" />
+/// <reference types="vite-plugin-pwa/vanillajs" />
 /// <reference types="vite-plugin-pwa/info" />
 /// <reference types="vite-plugin-svgr/client" />
-
 interface ImportMetaEnv {
   // The port to run the dev server
   VITE_APP_PORT: string;

vite.config.ts

@@ -53,6 +53,7 @@ export default defineConfig({
     svgrPlugin(),
     ViteEjsPlugin(),
     VitePWA({
+      registerType: "autoUpdate",
       devOptions: {
         /* set this flag to true to enable in Development mode */
         enabled: false,