Custom updater modal (#1738)

* WIP: Custom updater modal Fixes #1663 * First working example with data * Clean up, moved code to index.tsx * Clean up * Nicer dialog * Add relaunch dialog (macOS) * max-height in case of a long text * Clean up * Add component tests and fix name consistency * Update styling, re-add md parser * Clean up * Quick typo * Clean up * Rebase on tauri v2 * Clean up * Add updater permissions * Remove dialog from config * Fix restart after install
2024-04-17 10:30:23 -04:00
parent 624b1fc07d
commit b13c1339aa
13 changed files with 297 additions and 10 deletions
--- a/src/components/UpdaterRestartModal.tsx
+++ b/src/components/UpdaterRestartModal.tsx
@ -0,0 +1,56 @@
+import { create, InstanceProps } from 'react-modal-promise'
+import { ActionButton } from './ActionButton'
+
+type ModalResolve = {
+  wantRestart: boolean
+}
+
+type ModalReject = boolean
+
+type UpdaterRestartModalProps = InstanceProps<ModalResolve, ModalReject> & {
+  version: string
+}
+
+export const createUpdaterRestartModal = create<
+  UpdaterRestartModalProps,
+  ModalResolve,
+  ModalReject
+>
+
+export const UpdaterRestartModal = ({
+  onResolve,
+  version,
+}: UpdaterRestartModalProps) => (
+  <div className="fixed inset-0 z-50 grid place-content-center bg-chalkboard-110/50">
+    <div className="max-w-3xl p-8 rounded bg-chalkboard-10 dark:bg-chalkboard-90">
+      <h1 className="text-3xl font-bold">Ready to restart?</h1>
+      <p className="my-4" data-testid="update-restart-version">
+        v{version} is now installed. Restart the app to use the new features.
+      </p>
+      <div className="flex justify-between">
+        <ActionButton
+          Element="button"
+          onClick={() => onResolve({ wantRestart: false })}
+          icon={{
+            icon: 'close',
+            bgClassName: 'bg-destroy-80',
+            iconClassName: 'text-destroy-20 group-hover:text-destroy-10',
+          }}
+          className="hover:border-destroy-40 hover:bg-destroy-10/50 dark:hover:bg-destroy-80/50"
+          data-testid="update-restrart-button-cancel"
+        >
+          Not now
+        </ActionButton>
+        <ActionButton
+          Element="button"
+          onClick={() => onResolve({ wantRestart: true })}
+          icon={{ icon: 'arrowRight', bgClassName: 'dark:bg-chalkboard-80' }}
+          className="dark:hover:bg-chalkboard-80/50"
+          data-testid="update-restrart-button-update"
+        >
+          Restart
+        </ActionButton>
+      </div>
+    </div>
+  </div>
+)