-
Edit Reading Log Entry
+
{editMode ? "Edit" : "Create"} Reading Log Entry
@@ -95,7 +123,13 @@
.fields {
display: grid;
grid-template-columns: max-content 1fr;
- gap: var(--size-4-2);
+ gap: var(--size-4-4);
+ align-items: center;
+
+ input:disabled {
+ color: var(--text-muted);
+ cursor: not-allowed;
+ }
}
}
}
diff --git a/src/components/ReadingLogViewer.svelte b/src/components/ReadingLogViewer.svelte
index 289efb0..e6a1ec1 100644
--- a/src/components/ReadingLogViewer.svelte
+++ b/src/components/ReadingLogViewer.svelte
@@ -2,8 +2,9 @@
import type { ReadingLog } from "@utils/storage";
import type { ReadingLogEntry } from "@src/types";
import type { App } from "obsidian";
- import { Edit, Trash } from "lucide-svelte";
+ import { Edit, Trash, Plus } from "lucide-svelte";
import { ReadingLogEntryEditModal } from "@views/reading-log-entry-edit-modal";
+ import { ReadingLogNewEntryModal } from "@views/reading-log-new-entry-modal";
const ALL_TIME = "ALL_TIME";
@@ -68,6 +69,16 @@
),
);
+ function createEntry() {
+ const modal = new ReadingLogNewEntryModal(app);
+ modal.once("submit", async (event) => {
+ modal.close();
+ await readingLog.addRawEntry(event.entry);
+ reload();
+ });
+ modal.open();
+ }
+
function editEntry(i: number, entry: ReadingLogEntry) {
const modal = new ReadingLogEntryEditModal(app, entry);
modal.once("submit", async (event) => {
@@ -86,28 +97,36 @@
-
-
-
+
+
+
+
+
+
@@ -155,6 +174,27 @@
@use "../styles/utils";
.obt-reading-log-viewer {
+ .controls {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ align-items: center;
+
+ .right {
+ text-align: right;
+
+ button.create-entry {
+ display: inline-flex;
+ gap: var(--size-2-2);
+ align-items: center;
+
+ :global(svg) {
+ width: var(--icon-s);
+ height: var(--icon-s);
+ }
+ }
+ }
+ }
+
.year-filter:has(> option.all-time:checked) + .month-filter {
display: none;
}
diff --git a/src/settings/suggesters/book.ts b/src/settings/suggesters/book.ts
new file mode 100644
index 0000000..6e2d8c3
--- /dev/null
+++ b/src/settings/suggesters/book.ts
@@ -0,0 +1,34 @@
+// Credits go to Liam's Periodic Notes Plugin: https://github.com/liamcain/obsidian-periodic-notes
+
+import { TAbstractFile, TFile } from "obsidian";
+import { TextInputSuggest } from "./core";
+
+export class BookSuggest extends TextInputSuggest {
+ getSuggestions(inputStr: string): TFile[] {
+ const abstractFiles = this.app.vault.getAllLoadedFiles();
+ const files: TFile[] = [];
+ const lowerCaseInputStr = inputStr.toLowerCase();
+
+ abstractFiles.forEach((file: TAbstractFile) => {
+ if (
+ file instanceof TFile &&
+ file.extension === "md" &&
+ file.basename.toLowerCase().contains(lowerCaseInputStr)
+ ) {
+ files.push(file);
+ }
+ });
+
+ return files;
+ }
+
+ renderSuggestion(file: TFile, el: HTMLElement): void {
+ el.setText(file.basename);
+ }
+
+ selectSuggestion(file: TFile): void {
+ this.inputEl.value = file.basename;
+ this.inputEl.trigger("input");
+ this.close();
+ }
+}
diff --git a/src/utils/storage.ts b/src/utils/storage.ts
index 1a813e7..0908e50 100644
--- a/src/utils/storage.ts
+++ b/src/utils/storage.ts
@@ -93,7 +93,11 @@ export class ReadingLog {
createdAt: new Date(),
};
- this.entries.push(newEntry);
+ await this.addRawEntry(newEntry);
+ }
+
+ public async addRawEntry(entry: ReadingLogEntry) {
+ this.entries.push(entry);
await this.storeEntries();
}
diff --git a/src/views/reading-log-entry-edit-modal.ts b/src/views/reading-log-entry-edit-modal.ts
index 932b846..beb9533 100644
--- a/src/views/reading-log-entry-edit-modal.ts
+++ b/src/views/reading-log-entry-edit-modal.ts
@@ -21,6 +21,7 @@ export class ReadingLogEntryEditModal extends EventEmitter<
constructor(app: App, entry: ReadingLogEntry) {
super(app, ReadingLogEntryEditor, {
props: {
+ app,
entry,
onSubmit: (entry: ReadingLogEntry) =>
this.emit("submit", new SubmitEvent(entry)),
diff --git a/src/views/reading-log-new-entry-modal.ts b/src/views/reading-log-new-entry-modal.ts
new file mode 100644
index 0000000..2971fbd
--- /dev/null
+++ b/src/views/reading-log-new-entry-modal.ts
@@ -0,0 +1,30 @@
+import ReadingLogEntryEditor from "@components/ReadingLogEntryEditor.svelte";
+import type { ReadingLogEntry } from "@src/types";
+import { Event, EventEmitter } from "@utils/event";
+import { App } from "obsidian";
+import { SvelteModal } from "./svelte-modal";
+
+export class SubmitEvent extends Event {
+ constructor(public readonly entry: ReadingLogEntry) {
+ super();
+ }
+}
+
+interface ReadingLogNewEntryModalEventMap {
+ submit: SubmitEvent;
+}
+
+export class ReadingLogNewEntryModal extends EventEmitter<
+ ReadingLogNewEntryModalEventMap,
+ typeof SvelteModal
+>(SvelteModal) {
+ constructor(app: App) {
+ super(app, ReadingLogEntryEditor, {
+ props: {
+ app,
+ onSubmit: (entry: ReadingLogEntry) =>
+ this.emit("submit", new SubmitEvent(entry)),
+ },
+ });
+ }
+}