AT protocol bookmarking platforms in obsidian
1import { Modal, Notice } from "obsidian";
2import type ATmarkPlugin from "../main";
3import { createTag } from "../lib";
4
5export class CreateTagModal extends Modal {
6 plugin: ATmarkPlugin;
7 onSuccess?: () => void;
8
9 constructor(plugin: ATmarkPlugin, onSuccess?: () => void) {
10 super(plugin.app);
11 this.plugin = plugin;
12 this.onSuccess = onSuccess;
13 }
14
15 onOpen() {
16 const { contentEl } = this;
17 contentEl.empty();
18 contentEl.addClass("atmark-modal");
19
20 contentEl.createEl("h2", { text: "New tag" });
21
22 if (!this.plugin.client) {
23 contentEl.createEl("p", { text: "Not connected." });
24 return;
25 }
26
27 const form = contentEl.createEl("form", { cls: "atmark-form" });
28
29 // Tag value field
30 const tagGroup = form.createEl("div", { cls: "atmark-form-group" });
31 tagGroup.createEl("label", { text: "Tag", attr: { for: "tag-value" } });
32 const tagInput = tagGroup.createEl("input", {
33 type: "text",
34 cls: "atmark-input",
35 attr: { id: "tag-value", placeholder: "Tag name", required: "true" },
36 });
37
38 // Action buttons
39 const actions = form.createEl("div", { cls: "atmark-modal-actions" });
40
41 const cancelBtn = actions.createEl("button", {
42 text: "Cancel",
43 cls: "atmark-btn atmark-btn-secondary",
44 type: "button",
45 });
46 cancelBtn.addEventListener("click", () => this.close());
47
48 const createBtn = actions.createEl("button", {
49 text: "Create",
50 cls: "atmark-btn atmark-btn-primary",
51 type: "submit",
52 });
53
54 form.addEventListener("submit", (e) => {
55 e.preventDefault();
56 void this.handleSubmit(tagInput, createBtn);
57 });
58
59 // Focus tag input
60 tagInput.focus();
61 }
62
63 private async handleSubmit(
64 tagInput: HTMLInputElement,
65 createBtn: HTMLButtonElement
66 ) {
67 const value = tagInput.value.trim();
68 if (!value) {
69 new Notice("Please enter a tag name");
70 return;
71 }
72
73 createBtn.disabled = true;
74 createBtn.textContent = "Creating...";
75
76 try {
77 await createTag(
78 this.plugin.client!,
79 this.plugin.settings.identifier,
80 value
81 );
82
83 new Notice(`Created tag "${value}"`);
84 this.close();
85 this.onSuccess?.();
86 } catch (err) {
87 const message = err instanceof Error ? err.message : String(err);
88 new Notice(`Failed to create tag: ${message}`);
89 createBtn.disabled = false;
90 createBtn.textContent = "Create";
91 }
92 }
93
94 onClose() {
95 this.contentEl.empty();
96 }
97}