add sort and tailwind prettier configs; run them

.prettierrc

@@ -1 +1,3 @@
-{}
+{
+  "plugins": ["prettier-plugin-organize-imports", "prettier-plugin-tailwindcss"]
+}

package.json

@@ -66,6 +66,8 @@
     "mobx-react-lite": "^2.0.7",
     "mocha": "^10.2.0",
     "prettier": "3.2.4",
+    "prettier-plugin-organize-imports": "^4.0.0",
+    "prettier-plugin-tailwindcss": "^0.6.6",
     "react": "^18.2.0",
     "react-day-picker": "^8.10.0",
     "react-dom": "^18.2.0",

scripts/migrate-uuidv7.ts

@@ -6,8 +6,8 @@
 // NOTE: This script won't actually run here, because the databse is compiled
 // against a target electron version, rather than the local node version. So
 // I run it in the preload/client/index.ts file; keeping here for reference.
-import { V7Generator } from "uuidv7";
 import Knex from "knex";
+import { V7Generator } from "uuidv7";
 
 const knex = Knex({
   client: "better-sqlite3",

src/components/Select.tsx

@@ -1,5 +1,5 @@
-import React from "react";
 import { SelectField } from "evergreen-ui";
+import React from "react";
 
 interface SelectProps<T extends string> {
   options: T[];

src/components/Sidesheet.tsx

@@ -1,8 +1,8 @@
-import * as React from "react";
 import * as SheetPrimitive from "@radix-ui/react-dialog";
 import { Cross2Icon } from "@radix-ui/react-icons";
-import { cva, type VariantProps } from "class-variance-authority";
 import { cn } from "@udecode/cn";
+import { cva, type VariantProps } from "class-variance-authority";
+import * as React from "react";
 
 const Sheet = SheetPrimitive.Root;
 
@@ -129,13 +129,13 @@ SheetDescription.displayName = SheetPrimitive.Description.displayName;
 
 export {
   Sheet,
-  SheetPortal,
-  SheetOverlay,
-  SheetTrigger,
   SheetClose,
   SheetContent,
-  SheetHeader,
+  SheetDescription,
   SheetFooter,
+  SheetHeader,
+  SheetOverlay,
+  SheetPortal,
   SheetTitle,
-  SheetDescription,
+  SheetTrigger,
 };

src/components/icons.tsx

@@ -3,7 +3,6 @@
 // icons in all their components. Will either prefer these throughou,
 // or migrate the plate icons to use evergreens
 // https://platejs.org/docs/components/installation/manual
-import React from "react";
 import { cva } from "class-variance-authority";
 import {
   AlignCenter,
@@ -12,16 +11,15 @@ import {
   AlignRight,
   Archive,
   Baseline,
-  Bug,
   Bold,
+  Bug,
   Check,
-  ChevronUp,
   ChevronDown,
   ChevronRight,
+  ChevronUp,
   ChevronsUpDown,
   Code2,
   Combine,
-  Edit2,
   ExternalLink,
   Eye,
   FileCode,
@@ -75,6 +73,7 @@ import {
   WrapText,
   X,
 } from "lucide-react";
+import React from "react";
 
 import type { LucideIcon } from "lucide-react";
 

src/container.tsx

@@ -1,18 +1,18 @@
-import React, { useState, useEffect, useContext, Fragment } from "react";
+import { Alert } from "evergreen-ui";
 import { observer } from "mobx-react-lite";
-import Layout, { LayoutDummy } from "./layout";
-import Preferences from "./views/preferences";
-import Documents from "./views/documents";
-import Editor from "./views/edit";
-import DocumentCreator from "./views/create";
-import { SearchProvider } from "./views/documents/SearchProvider";
+import React from "react";
+import "react-day-picker/dist/style.css";
+import { Navigate, Route, Routes } from "react-router-dom";
 import {
-  useJournalsLoader,
   JournalsStoreContext,
+  useJournalsLoader,
 } from "./hooks/useJournalsLoader";
-import { Alert } from "evergreen-ui";
-import { Routes, Route, Navigate } from "react-router-dom";
-import "react-day-picker/dist/style.css";
+import Layout, { LayoutDummy } from "./layout";
+import DocumentCreator from "./views/create";
+import Documents from "./views/documents";
+import { SearchProvider } from "./views/documents/SearchProvider";
+import Editor from "./views/edit";
+import Preferences from "./views/preferences";
 
 export default observer(function Container() {
   const { journalsStore, loading, loadingErr } = useJournalsLoader();

src/error.tsx

@@ -1,5 +1,5 @@
+import { Alert, Pane } from "evergreen-ui";
 import React from "react";
-import { Pane, Alert } from "evergreen-ui";
 
 interface State {
   hasError: boolean;

src/hooks/stores/journals.ts

@@ -1,5 +1,5 @@
-import { observable, computed, toJS } from "mobx";
-import { JournalResponse, IClient } from "../useClient";
+import { computed, observable, toJS } from "mobx";
+import { IClient, JournalResponse } from "../useClient";
 
 export class JournalsStore {
   @observable loading: boolean = true;

src/hooks/useClient.ts

@@ -2,8 +2,8 @@ import React, { useContext } from "react";
 import { IClient } from "../preload/client/types";
 export { IClient } from "../preload/client/types";
 
-export { JournalResponse } from "../preload/client/journals";
 export { SearchResponse } from "../preload/client/documents";
+export { JournalResponse } from "../preload/client/journals";
 
 export const ClientContext = React.createContext<any>(
   (window as any).chronicles.createClient(),

src/hooks/useEventListener.ts

@@ -1,4 +1,4 @@
-import { useRef, useEffect } from "react";
+import { useEffect, useRef } from "react";
 
 // NOTE: Copy pasta from
 // https://usehooks.com/useEventListener/

src/hooks/useJournalsLoader.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import { JournalsStore } from "./stores/journals";
 import { JournalResponse } from "../preload/client/journals";
+import { JournalsStore } from "./stores/journals";
 import useClient from "./useClient";
 
 export const JournalsStoreContext = React.createContext<JournalsStore | null>(

src/index.tsx

@@ -1,11 +1,11 @@
+import "mobx-react-lite/batchingForReactDom";
 import React from "react";
 import { createRoot } from "react-dom/client";
+import { HashRouter } from "react-router-dom";
 import Container from "./container";
 import "./index-compiled.css"; // generated by tailwindcss; see package.jsons scripts
-import "./typography.css";
 import "./prism-code-theme.css";
-import { HashRouter } from "react-router-dom";
-import "mobx-react-lite/batchingForReactDom";
+import "./typography.css";
 
 const root = createRoot(document.getElementById("app")!);
 

src/layout.tsx

@@ -1,5 +1,5 @@
-import React, { PropsWithChildren } from "react";
-import { Pane, Tablist, Tab } from "evergreen-ui";
+import { Pane } from "evergreen-ui";
+import React from "react";
 import ErrorBoundary from "./error";
 
 interface Props2 {

src/markdown/index.test.ts

@@ -1,5 +1,5 @@
-import { describe, it } from "mocha";
 import { expect } from "chai";
+import { describe, it } from "mocha";
 import { stringToSlate } from "./";
 
 describe("Markdown to Slate conversion", function () {

src/markdown/index.ts

@@ -1,10 +1,10 @@
-import { unified } from "unified";
-import remarkParse from "remark-parse";
 import remarkGfm from "remark-gfm";
+import remarkParse from "remark-parse";
 import remarkStringify from "remark-stringify";
 import remarkUnwrapImages from "remark-unwrap-images";
-import { remarkToSlate, slateToRemark } from "./remark-slate-transformer";
 import { Node as SNode } from "slate";
+import { unified } from "unified";
+import { remarkToSlate, slateToRemark } from "./remark-slate-transformer";
 
 export * from "ts-mdast";
 

src/markdown/remark-slate-transformer/transformers/mdast-to-slate.ts

@@ -1,19 +1,19 @@
-import * as slate from "../models/slate";
 import * as mdast from "../models/mdast";
+import * as slate from "../models/slate";
 
 // One of the main reasons this fork exists:
 // NOTE: https://github.com/inokawa/remark-slate-transformer/issues/31
 import { prefixUrl, videoExtensions } from "../../../hooks/images";
 
 // NOTE: added, and a good example of what changes I would want to make to this library!
 import {
+  ELEMENT_CODE_BLOCK,
+  ELEMENT_CODE_LINE,
   ELEMENT_LI,
   ELEMENT_LIC,
+  ELEMENT_LINK,
   ELEMENT_OL,
   ELEMENT_UL,
-  ELEMENT_CODE_BLOCK,
-  ELEMENT_CODE_LINE,
-  ELEMENT_LINK,
 } from "@udecode/plate"; // todo: sub-package which has only elements?
 
 import { toSlateLink } from "../../../views/edit/editor/features/note-linking/toMdast";

src/markdown/remark-slate-transformer/transformers/slate-to-mdast.ts

@@ -1,6 +1,6 @@
 import * as unistLib from "unist";
-import * as slate from "../models/slate";
 import * as mdast from "../models/mdast";
+import * as slate from "../models/slate";
 import * as SlateNodes from "./mdast-to-slate";
 
 import { Node as SNode } from "slate";
@@ -10,12 +10,11 @@ import { Node as SNode } from "slate";
 import { unPrefixUrl } from "../../../hooks/images";
 
 import {
+  ELEMENT_CODE_BLOCK,
   ELEMENT_LI,
   ELEMENT_LIC,
   ELEMENT_OL,
-  ELEMENT_TODO_LI,
   ELEMENT_UL,
-  ELEMENT_CODE_BLOCK,
 } from "@udecode/plate";
 
 import {

src/preload/client/index.ts

@@ -1,11 +1,11 @@
-import { JournalsClient } from "./journals";
+import DB from "better-sqlite3";
+import Knex from "knex";
 import { DocumentsClient } from "./documents";
-import { TagsClient } from "./tags";
-import { PreferencesClient } from "./preferences";
 import { FilesClient } from "./files";
+import { JournalsClient } from "./journals";
+import { PreferencesClient } from "./preferences";
+import { TagsClient } from "./tags";
 import { IClient } from "./types";
-import DB from "better-sqlite3";
-import Knex from "knex";
 
 import Store from "electron-store";
 const settings = new Store({

src/preload/client/journals.ts

@@ -1,5 +1,5 @@
-import { uuidv7 } from "uuidv7";
 import { Database } from "better-sqlite3";
+import { uuidv7 } from "uuidv7";
 
 export interface JournalResponse {
   id: string;

src/preload/client/preferences.ts

@@ -1,5 +1,5 @@
-import Store from "electron-store";
 import { ipcRenderer } from "electron";
+import Store from "electron-store";
 
 export interface Preferences {
   DATABASE_URL: string;

src/preload/client/types.ts

@@ -1,7 +1,7 @@
-import { IJournalsClient } from "./journals";
 import { IDocumentsClient } from "./documents";
-import { IPreferencesClient } from "./preferences";
 import { IFilesClient } from "./files";
+import { IJournalsClient } from "./journals";
+import { IPreferencesClient } from "./preferences";
 import { ITagsClient } from "./tags";
 
 // This interface was created with these "I" types like this

src/preload/files.ts

@@ -1,10 +1,9 @@
+import fs, { Stats } from "fs";
 import mkdirp from "mkdirp";
-import walk = require("klaw");
 import path from "path";
-import fs from "fs";
-const { readFile, writeFile, access, stat } = fs.promises;
-import { Stats } from "fs";
 import { NotFoundError, ValidationError } from "./errors";
+import walk = require("klaw");
+const { readFile, writeFile, access, stat } = fs.promises;
 const readFileStr = (path: string) => readFile(path, "utf8");
 
 import { IncomingMessage } from "http";

src/preload/importer/importChronicles.ts

@@ -1,9 +1,9 @@
-import { Files } from "../files";
-import { stringToMdast } from "../../markdown";
-import { shouldIndexDay } from "./indexer";
 import fs from "fs";
-import path from "path";
 import { DateTime } from "luxon";
+import path from "path";
+import { stringToMdast } from "../../markdown";
+import { Files } from "../files";
+import { shouldIndexDay } from "./indexer";
 
 import { create } from "../client";
 const client = create();

src/preload/importer/indexer.ts

@@ -1,8 +1,8 @@
-import path from "path";
-import { stringToMdast, mdastToString, Root } from "../../markdown";
 import { Database } from "better-sqlite3";
-import { Files, PathStatsFile } from "../files";
 import { DateTime } from "luxon";
+import path from "path";
+import { Root, mdastToString, stringToMdast } from "../../markdown";
+import { Files, PathStatsFile } from "../files";
 
 export interface IJournal {
   // path to root folder

src/titlebar/macos.tsx

@@ -1,5 +1,5 @@
-import React, { PropsWithChildren } from "react";
 import { cn } from "@udecode/cn";
+import React, { PropsWithChildren } from "react";
 
 interface Props extends PropsWithChildren {
   className?: string;
@@ -10,7 +10,7 @@ export default function Titlebar({ children, className }: Props) {
     <div
       style={{ WebkitAppRegion: "drag" } as React.CSSProperties}
       className={cn(
-        "bg-secondary border-b border-accent text-accent-foreground border-accent flex justify-between items-center py-3 px-2.5 pl-20 fixed w-full h-12 z-10 shadow",
+        "fixed z-10 flex h-12 w-full items-center justify-between border-b border-accent bg-secondary px-2.5 py-3 pl-20 text-accent-foreground shadow",
         className,
       )}
     >

src/views/create/index.tsx

@@ -1,11 +1,11 @@
-import React, { useContext, useEffect, useState } from "react";
 import { observer } from "mobx-react-lite";
-import { EditLoadingComponent } from "../edit/loading";
+import React, { useContext, useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
+import useClient from "../../hooks/useClient";
 import { useIsMounted } from "../../hooks/useIsMounted";
 import { JournalsStoreContext } from "../../hooks/useJournalsLoader";
-import { useNavigate } from "react-router-dom";
 import { SearchStoreContext } from "../documents/SearchStore";
-import useClient from "../../hooks/useClient";
+import { EditLoadingComponent } from "../edit/loading";
 
 // Creates a new document and immediately navigates to it
 function useCreateDocument() {

src/views/documents/DocumentItem.tsx

@@ -1,5 +1,5 @@
+import { Badge } from "evergreen-ui";
 import React from "react";
-import { Pane, Badge } from "evergreen-ui";
 import { SearchItem } from "./SearchStore";
 
 export function DocumentItem(props: {
@@ -13,10 +13,10 @@ export function DocumentItem(props: {
     <div
       key={doc.id}
       onClick={() => edit(doc.id)}
-      className="cursor-pointer flex hover:underline hover:underline-offset"
+      className="hover:underline-offset flex cursor-pointer hover:underline"
     >
       {/* Without mono font, dates won't be a uniform width */}
-      <div className="font-mono text-sm tracking-tight mr-6 shrink-0">
+      <div className="mr-6 shrink-0 font-mono text-sm tracking-tight">
         {doc.createdAt.slice(0, 10)}
       </div>
       <div className="font-sans">