fix: make dialog autofocus configurable

apps/web/src/common/dialogcontroller.js

@@ -607,7 +607,7 @@ export function showImportDialog() {
   ));
 }
 
-export function showMultifactorDialog(primaryMethod = undefined) {
+export function showMultifactorDialog(primaryMethod = "") {
   return showDialog((Dialogs, perform) => (
     <Dialogs.MultifactorDialog
       onClose={(res) => perform(res)}

apps/web/src/components/dialogs/dialog.js

@@ -133,7 +133,7 @@ function Dialog(props) {
                 {...props.positiveButton.props}
                 variant="dialog"
                 data-test-id="dialog-yes"
-                autoFocus
+                autoFocus={props.positiveButton.autoFocus}
                 disabled={props.positiveButton.disabled || false}
                 onClick={
                   !props.positiveButton.disabled

apps/web/src/index.js

@@ -1,3 +1,4 @@
+import "notes-core/types";
 import { EVENTS } from "@notesnook/desktop/events";
 import { render } from "react-dom";
 import { AppEventManager } from "./common/app-events";

apps/web/src/theme/variants/button.js

@@ -36,11 +36,10 @@ class Default {
         filter: "brightness(98%)",
       },
       outline: "none",
-      ":focus:not(:active), :focus-within:not(:active), :focus-visible:not(:active)":
-        {
-          filter: "brightness(90%)",
-          bg: "bgSecondary",
-        },
+      ":focus-visible:not(:active)": {
+        filter: "brightness(90%)",
+        bg: "bgSecondary",
+      },
       ":disabled": {
         opacity: 0.5,
         cursor: "not-allowed",

apps/web/src/views/auth.tsx

@@ -169,7 +169,7 @@ function Auth(props: AuthProps) {
                 alignSelf: "end",
                 alignItems: "center",
               }}
-              onClick={() => db.user.logout()}
+              onClick={() => db.user?.logout()}
               color="error"
             >
               <Logout size={16} sx={{ mr: 1 }} color="error" /> Logout