global: support day format options & $day$ title format & /day command

apps/web/src/components/editor/tiptap.tsx

@@ -56,7 +56,7 @@ import { ScopedThemeProvider } from "../theme-provider";
 import { useStore as useThemeStore } from "../../stores/theme-store";
 import { writeToClipboard } from "../../utils/clipboard";
 import { useEditorStore } from "../../stores/editor-store";
-import { parseInternalLink } from "@notesnook/core";
+import { DayFormat, parseInternalLink } from "@notesnook/core";
 import Skeleton from "react-loading-skeleton";
 import useMobile from "../../hooks/use-mobile";
 import useTablet from "../../hooks/use-tablet";
@@ -103,6 +103,7 @@ type TipTapProps = {
   doubleSpacedLines: boolean;
   dateFormat: string;
   timeFormat: TimeFormat;
+  dayFormat: DayFormat;
   markdownShortcuts: boolean;
   fontLigatures: boolean;
 };
@@ -146,6 +147,7 @@ function TipTap(props: TipTapProps) {
     doubleSpacedLines,
     dateFormat,
     timeFormat,
+    dayFormat,
     markdownShortcuts,
     fontLigatures
   } = props;
@@ -200,6 +202,7 @@ function TipTap(props: TipTapProps) {
       doubleSpacedLines,
       dateFormat,
       timeFormat,
+      dayFormat,
       element: editorContainer(),
       editable: !readonly,
       content: content?.(),
@@ -316,6 +319,7 @@ function TipTap(props: TipTapProps) {
     doubleSpacedLines,
     dateFormat,
     timeFormat,
+    dayFormat,
     markdownShortcuts,
     fontLigatures
   ]);
@@ -421,6 +425,7 @@ function TiptapWrapper(
       | "doubleSpacedLines"
       | "dateFormat"
       | "timeFormat"
+      | "dayFormat"
       | "markdownShortcuts"
       | "fontLigatures"
     >
@@ -437,6 +442,7 @@ function TiptapWrapper(
   );
   const dateFormat = useSettingsStore((store) => store.dateFormat);
   const timeFormat = useSettingsStore((store) => store.timeFormat);
+  const dayFormat = useSettingsStore((store) => store.dayFormat);
   const markdownShortcuts = useSettingsStore(
     (store) => store.markdownShortcuts
   );
@@ -515,13 +521,14 @@ function TiptapWrapper(
       }}
     >
       <TipTap
-        key={`tiptap-${props.id}-${doubleSpacedLines}-${dateFormat}-${timeFormat}-${markdownShortcuts}-${fontLigatures}`}
+        key={`tiptap-${props.id}-${doubleSpacedLines}-${dateFormat}-${timeFormat}-${dayFormat}-${markdownShortcuts}-${fontLigatures}`}
         {...props}
         isMobile={isMobile}
         isTablet={isTablet}
         doubleSpacedLines={doubleSpacedLines}
         dateFormat={dateFormat}
         timeFormat={timeFormat}
+        dayFormat={dayFormat}
         markdownShortcuts={markdownShortcuts}
         fontLigatures={fontLigatures}
         onLoad={(editor) => {

apps/web/src/dialogs/settings/behaviour-settings.ts

@@ -25,7 +25,7 @@ import {
 } from "../../stores/setting-store";
 import dayjs from "dayjs";
 import { isUserPremium } from "../../hooks/use-is-user-premium";
-import { TimeFormat } from "@notesnook/core";
+import { TimeFormat, DayFormat } from "@notesnook/core";
 import { TrashCleanupInterval } from "@notesnook/core";
 import { strings } from "@notesnook/intl";
 import { BuyDialog } from "../buy-dialog";
@@ -141,6 +141,26 @@ export const BehaviourSettings: SettingsGroup[] = [
             ]
           }
         ]
+      },
+      {
+        key: "day-format",
+        title: strings.dayFormat(),
+        description: strings.dayFormatDesc(),
+        keywords: [],
+        onStateChange: (listener) =>
+          useSettingStore.subscribe((s) => s.dayFormat, listener),
+        components: [
+          {
+            type: "dropdown",
+            onSelectionChanged: (value) =>
+              useSettingStore.getState().setDayFormat(value as DayFormat),
+            selectedOption: () => useSettingStore.getState().dayFormat,
+            options: [
+              { value: "short", title: "Short (Mon, Tue)" },
+              { value: "long", title: "Long (Monday, Tuesday)" }
+            ]
+          }
+        ]
       }
     ]
   },

apps/web/src/stores/setting-store.ts

@@ -25,7 +25,7 @@ import Config from "../utils/config";
 import BaseStore from "./index";
 import { useEditorStore } from "./editor-store";
 import { setDocumentTitle } from "../utils/dom";
-import { TimeFormat } from "@notesnook/core";
+import { TimeFormat, DayFormat } from "@notesnook/core";
 import { Profile, TrashCleanupInterval } from "@notesnook/core";
 
 export const HostIds = [
@@ -68,6 +68,7 @@ class SettingStore extends BaseStore<SettingStore> {
   hideNoteTitle = Config.get("hideNoteTitle", false);
   dateFormat = "DD-MM-YYYY";
   timeFormat: TimeFormat = "12-hour";
+  dayFormat: DayFormat = "short";
   titleFormat = "Note $date$ $time$";
   profile?: Profile;
 
@@ -94,6 +95,7 @@ class SettingStore extends BaseStore<SettingStore> {
     this.set({
       dateFormat: db.settings.getDateFormat(),
       timeFormat: db.settings.getTimeFormat(),
+      dayFormat: db.settings.getDayFormat(),
       titleFormat: db.settings.getTitleFormat(),
       trashCleanupInterval: db.settings.getTrashCleanupInterval(),
       profile: db.settings.getProfile(),
@@ -119,6 +121,11 @@ class SettingStore extends BaseStore<SettingStore> {
     this.set({ timeFormat });
   };
 
+  setDayFormat = async (dayFormat: DayFormat) => {
+    await db.settings.setDayFormat(dayFormat);
+    this.set({ dayFormat });
+  };
+
   setTitleFormat = async (titleFormat: string) => {
     await db.settings.setTitleFormat(titleFormat);
     this.set({ titleFormat });

docs/help/contents/rich-text-editor/markdown-notes-editing.md

@@ -27,6 +27,7 @@ Notesnook supports the following (Markdown) shortcuts in the editor:
 | Codeblock           | \`\`\`javascript<br>function hello() { }<br>\`\`\`                    |
 | Math block          | $$$<br>2 + 2 = 4<br>$$$                                               |
 | Current Date        | `/date`                                                               |
+| Current Day         | `/day`                                                                |
 | Date Time           | `/time`                                                               |
 | Current Date & Time | `/now`                                                                |
 | Current Date & Time with timezone | `/nowz`                                                 |

docs/help/contents/rich-text-editor/personalizing-rich-text-editor.md

@@ -28,6 +28,8 @@ Go to `Settings` > `Editor` > `Title format` to customize the title formatting.
 
 **$date$**: Today's date
 
+**$day$**: Today's day name
+
 **$time$**: The current time
 
 **$count$**: Current note count + 1

packages/core/src/collections/notes.ts

@@ -136,6 +136,7 @@ export class Notes implements ICollection {
             this.db.settings.getTitleFormat(),
             this.db.settings.getDateFormat(),
             this.db.settings.getTimeFormat(),
+            this.db.settings.getDayFormat(),
             headlineTitle,
             this.totalNotes
           );

packages/core/src/collections/settings.ts

@@ -30,7 +30,8 @@ import {
   ToolbarConfig,
   ToolbarConfigPlatforms,
   TrashCleanupInterval,
-  TimeFormat
+  TimeFormat,
+  DayFormat
 } from "../types.js";
 import { ICollection } from "./collection.js";
 import { SQLCachedCollection } from "../database/sql-cached-collection.js";
@@ -53,6 +54,7 @@ const DEFAULT_GROUP_OPTIONS = (key: GroupingKey) =>
 
 const defaultSettings: SettingItemMap = {
   timeFormat: "12-hour",
+  dayFormat: "short",
   dateFormat: "DD-MM-YYYY",
   titleFormat: "Note $date$ $time$",
   defaultNotebook: undefined,
@@ -204,6 +206,14 @@ export class Settings implements ICollection {
     return this.set("timeFormat", format);
   }
 
+  getDayFormat() {
+    return this.get("dayFormat");
+  }
+
+  setDayFormat(format: DayFormat) {
+    return this.set("dayFormat", format);
+  }
+
   getSideBarOrder(section: SideBarSection) {
     return this.get(`sideBarOrder:${section}`);
   }

packages/core/src/types.ts

@@ -21,6 +21,7 @@ import { Cipher } from "@notesnook/crypto";
 import { isCipher } from "./utils/index.js";
 
 export type TimeFormat = "12-hour" | "24-hour";
+export type DayFormat = "short" | "long";
 
 export type SortOptions = {
   sortBy:
@@ -469,6 +470,7 @@ export type SettingItemMap = {
   trashCleanupInterval: TrashCleanupInterval;
   titleFormat: string;
   timeFormat: TimeFormat;
+  dayFormat: DayFormat;
   dateFormat: string;
   defaultNotebook: string | undefined;
   defaultTag: string | undefined;

packages/core/src/utils/__tests__/title-format.test.js

@@ -24,6 +24,7 @@ import { test, expect, describe, beforeAll, afterAll } from "vitest";
 const templates = {
   $time$: "11:25",
   $date$: "DD-MM-YYYY",
+  $day$: "Wed",
   $timestamp$: "DDMMYYYY1125",
   $count$: "1",
   $headline$: "HEADLINE"
@@ -45,8 +46,35 @@ afterAll(() => {
 
 describe("pairs should be equal", () => {
   test.each(cases)("%s", (one, two) => {
-    expect(formatTitle(one, "[DD-MM-YYYY]", "[hh:mm]", "HEADLINE", 0)).toBe(
-      two
-    );
+    expect(
+      formatTitle(one, "[DD-MM-YYYY]", "[hh:mm]", "short", "HEADLINE", 0)
+    ).toBe(two);
+  });
+});
+
+describe("day format", () => {
+  test("$day$ with long format", () => {
+    expect(
+      formatTitle(
+        "Note $day$",
+        "[DD-MM-YYYY]",
+        "[hh:mm]",
+        "long",
+        "HEADLINE",
+        0
+      )
+    ).toBe("Note Wednesday");
+  });
+  test("$day$ with short format", () => {
+    expect(
+      formatTitle(
+        "Note $day$",
+        "[DD-MM-YYYY]",
+        "[hh:mm]",
+        "short",
+        "HEADLINE",
+        0
+      )
+    ).toBe("Note Wed");
   });
 });

packages/core/src/utils/date.ts

@@ -20,7 +20,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 import dayjs from "dayjs";
 import advancedFormat from "dayjs/plugin/advancedFormat.js";
 import timezone from "dayjs/plugin/timezone.js";
-import { TimeFormat } from "../types.js";
+import { TimeFormat, DayFormat } from "../types.js";
 
 dayjs.extend(advancedFormat);
 dayjs.extend(timezone);
@@ -68,6 +68,10 @@ export function getTimeFormat(format: TimeFormat) {
   return format === "12-hour" ? "hh:mm A" : "HH:mm";
 }
 
+function getDayFormat(format: DayFormat) {
+  return format === "short" ? "ddd" : "dddd";
+}
+
 export type TimeZoneOptions = {
   type: "timezone";
 };
@@ -79,6 +83,10 @@ export type DateOptions = {
   type: "date";
   dateFormat: string;
 };
+export type DayOptions = {
+  type: "day";
+  dayFormat: DayFormat;
+};
 export type DateTimeOptions = {
   type: "date-time";
   dateFormat: string;
@@ -93,6 +101,7 @@ export type FormatDateOptions =
   | TimeZoneOptions
   | TimeOptions
   | DateOptions
+  | DayOptions
   | DateTimeOptions
   | DateTimeWithTimeZoneOptions;
 
@@ -117,6 +126,8 @@ export function formatDate(
       return dayjs(date).format(getTimeFormat(options.timeFormat));
     case "date":
       return dayjs(date).format(options.dateFormat);
+    case "day":
+      return dayjs(date).format(getDayFormat(options.dayFormat));
     case "timezone":
       return dayjs(date).format("ZZ");
   }

packages/core/src/utils/title-format.ts

@@ -17,7 +17,7 @@ You should have received a copy of the GNU General Public License
 along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-import { TimeFormat } from "../types.js";
+import { TimeFormat, DayFormat } from "../types.js";
 import { formatDate } from "./date.js";
 
 export const NEWLINE_STRIP_REGEX = /[\r\n\t\v]+/gm;
@@ -26,6 +26,7 @@ export const HEADLINE_REGEX = /\$headline\$/g;
 const DATE_REGEX = /\$date\$/g;
 const COUNT_REGEX = /\$count\$/g;
 const TIME_REGEX = /\$time\$/g;
+const DAY_REGEX = /\$day\$/g;
 const TIMESTAMP_REGEX = /\$timestamp\$/g;
 const TIMESTAMP_Z_REGEX = /\$timestampz\$/g;
 const DATE_TIME_STRIP_REGEX = /[\\\-:./, ]/g;
@@ -34,6 +35,7 @@ export function formatTitle(
   titleFormat: string,
   dateFormat: string,
   timeFormat: TimeFormat,
+  dayFormat: DayFormat,
   headline = "",
   totalNotes = 0
 ) {
@@ -49,13 +51,19 @@ export function formatTitle(
   const timezone = formatDate(Date.now(), {
     type: "timezone"
   });
+  const day = formatDate(Date.now(), {
+    dayFormat,
+    type: "day"
+  });
+
   const timestamp = `${date}${time}`.replace(DATE_TIME_STRIP_REGEX, "");
   const timestampWithTimeZone = `${timestamp}${timezone}`;
 
   return titleFormat
     .replace(NEWLINE_STRIP_REGEX, " ")
     .replace(DATE_REGEX, date)
     .replace(TIME_REGEX, time)
+    .replace(DAY_REGEX, day)
     .replace(HEADLINE_REGEX, headline || "")
     .replace(TIMESTAMP_REGEX, timestamp)
     .replace(TIMESTAMP_Z_REGEX, timestampWithTimeZone)