diff --git a/apps/mobile/app/screens/settings/editor/state.ts b/apps/mobile/app/screens/settings/editor/state.ts
index b02bd4041..bf84fe521 100644
--- a/apps/mobile/app/screens/settings/editor/state.ts
+++ b/apps/mobile/app/screens/settings/editor/state.ts
@@ -20,10 +20,11 @@ along with this program. If not, see .
import type { ToolbarGroupDefinition } from "@notesnook/editor/dist/toolbar/types";
import create, { State } from "zustand";
import { persist, StateStorage } from "zustand/middleware";
-import { db } from "../../../common/database";
+import { DatabaseLogger, db } from "../../../common/database";
import { MMKV } from "../../../common/database/mmkv";
import { useSettingStore } from "../../../stores/use-setting-store";
import { presets } from "./toolbar-definition";
+import { ToolbarConfig } from "@notesnook/core";
export type ToolDefinition = string | string[];
export type DraggedItem = {
@@ -55,6 +56,25 @@ function clone(value: T[]) {
return JSON.parse(JSON.stringify(value));
}
+function migrateToolbar(tools: ToolbarConfig) {
+ const version = MMKV.getInt("editor:tools_version") || 0;
+
+ switch (version) {
+ case 0: {
+ tools.config?.push(["checkList"]);
+ DatabaseLogger.info(`Toolbar migrated to version ${version + 1}`);
+ MMKV.setInt("editor:tools_version", version + 1);
+ db.settings.setToolbarConfig("mobile", tools);
+ break;
+ }
+ default: {
+ break;
+ }
+ }
+ console.log(tools);
+ return tools;
+}
+
export const useDragState = create(
persist(
(set, get) => ({
@@ -97,13 +117,15 @@ export const useDragState = create(
init: async () => {
const user = await db.user?.getUser();
if (!user) return;
- const toolbarConfig = db.settings.getToolbarConfig(
+ let toolbarConfig = db.settings.getToolbarConfig(
useSettingStore.getState().deviceMode || ("mobile" as any)
);
if (!toolbarConfig) {
logger.info("DragState", "No user defined toolbar config was found");
return;
}
+
+ toolbarConfig = migrateToolbar(toolbarConfig);
const preset = toolbarConfig?.preset as DragState["preset"];
set({
preset: preset,
diff --git a/apps/mobile/app/services/settings.ts b/apps/mobile/app/services/settings.ts
index 6186138e6..491741046 100644
--- a/apps/mobile/app/services/settings.ts
+++ b/apps/mobile/app/services/settings.ts
@@ -159,6 +159,7 @@ function setProperty(
function onFirstLaunch() {
const introCompleted = get().introCompleted;
if (!introCompleted) {
+ MMKV.setInt("editor:tools_version", 1);
set({
rateApp: Date.now() + 86400000 * 2,
nextBackupRequestTime: Date.now() + 86400000 * 3
diff --git a/packages/editor/src/extensions/check-list-item/check-list-item.ts b/packages/editor/src/extensions/check-list-item/check-list-item.ts
index 8873a3143..afc407767 100644
--- a/packages/editor/src/extensions/check-list-item/check-list-item.ts
+++ b/packages/editor/src/extensions/check-list-item/check-list-item.ts
@@ -106,6 +106,13 @@ export const CheckListItem = Node.create({
checkbox.contentEditable = "false";
checkbox.type = "checkbox";
+
+ checkbox.addEventListener("mousedown", (event) => {
+ if (globalThis.keyboardShown) {
+ event.preventDefault();
+ }
+ });
+
checkbox.addEventListener("change", (event) => {
event.preventDefault();
// if the editor isn’t editable and we don't have a handler for
diff --git a/packages/editor/styles/styles.css b/packages/editor/styles/styles.css
index 6532d7c26..75fd13d1b 100644
--- a/packages/editor/styles/styles.css
+++ b/packages/editor/styles/styles.css
@@ -635,9 +635,21 @@ p > *::selection {
margin-right: 0.5rem;
user-select: none;
height: 18px;
+ width: 18px;
accent-color: var(--accent);
}
.ProseMirror ul.simple-checklist > li > div {
flex: 1 1 auto;
+}
+
+@media screen and (max-width: 480px) {
+ .ProseMirror ul.simple-checklist > li > input {
+ height: 21px;
+ width: 21px;
+ }
+
+ .ProseMirror ul.simple-checklist > li > div {
+ margin-top: 2px;
+ }
}
\ No newline at end of file