mulmoclaude 0.5.2 → 0.6.0

package/src/plugins/accounting/components/BookSettings.vue

@@ -0,0 +1,284 @@
+<template>
+  <div class="flex flex-col gap-4" data-testid="accounting-settings">
+    <section class="border border-gray-200 rounded p-3 flex flex-col gap-2">
+      <h4 class="text-sm font-semibold">{{ t("pluginAccounting.settings.bookInfo") }}</h4>
+      <p class="text-xs text-gray-500">{{ t("pluginAccounting.settings.bookInfoExplain") }}</p>
+      <label class="text-sm flex flex-col gap-1">
+        {{ t("pluginAccounting.bookSwitcher.nameLabel") }}
+        <input
+          v-model="selectedName"
+          type="text"
+          class="h-8 px-2 rounded border border-gray-300 text-sm bg-white"
+          data-testid="accounting-settings-name"
+          :disabled="updating"
+          maxlength="200"
+        />
+      </label>
+      <dl class="text-xs text-gray-700 grid grid-cols-[max-content_1fr] gap-x-3 gap-y-1">
+        <dt class="text-gray-500">{{ t("pluginAccounting.bookSwitcher.currencyLabel") }}</dt>
+        <dd>{{ currency }}</dd>
+      </dl>
+      <label class="text-sm flex flex-col gap-1 mt-1">
+        {{ t("pluginAccounting.bookSwitcher.countryLabel") }}
+        <select
+          v-model="selectedCountry"
+          class="h-8 px-2 rounded border border-gray-300 text-sm bg-white"
+          data-testid="accounting-settings-country"
+          :disabled="updating"
+        >
+          <option value="">{{ t("pluginAccounting.settings.countryUnset") }}</option>
+          <option v-for="opt in countryOptions" :key="opt.code" :value="opt.code">{{ opt.label }}</option>
+        </select>
+      </label>
+      <label class="text-sm flex flex-col gap-1 mt-1">
+        {{ t("pluginAccounting.bookSwitcher.fiscalYearEndLabel") }}
+        <select
+          v-model="selectedFiscalYearEnd"
+          class="h-8 px-2 rounded border border-gray-300 text-sm bg-white"
+          data-testid="accounting-settings-fiscal-year-end"
+          :disabled="updating"
+        >
+          <option v-for="opt in fiscalYearEndOptions" :key="opt.value" :value="opt.value">{{ opt.label }}</option>
+        </select>
+      </label>
+      <p class="text-xs text-gray-500">{{ t("pluginAccounting.settings.fiscalYearEndExplain") }}</p>
+      <p v-if="updateOk" class="text-xs text-green-600" data-testid="accounting-settings-update-ok">{{ updateOk }}</p>
+      <p v-if="updateError" class="text-xs text-red-500" data-testid="accounting-settings-update-error">{{ updateError }}</p>
+      <div>
+        <button
+          class="h-8 px-3 rounded bg-blue-600 hover:bg-blue-700 text-white text-sm disabled:opacity-50"
+          :disabled="updating || !hasPendingChanges"
+          data-testid="accounting-settings-save"
+          @click="onSaveBookInfo"
+        >
+          {{ updating ? t("pluginAccounting.common.loading") : t("pluginAccounting.settings.saveChanges") }}
+        </button>
+      </div>
+    </section>
+    <section class="border border-gray-200 rounded p-3 flex flex-col gap-2">
+      <h4 class="text-sm font-semibold">{{ t("pluginAccounting.settings.rebuild") }}</h4>
+      <p class="text-xs text-gray-500">{{ t("pluginAccounting.settings.rebuildExplain") }}</p>
+      <p v-if="rebuildOk" class="text-xs text-green-600" data-testid="accounting-settings-rebuild-ok">{{ rebuildOk }}</p>
+      <p v-if="rebuildError" class="text-xs text-red-500" data-testid="accounting-settings-rebuild-error">{{ rebuildError }}</p>
+      <div>
+        <button
+          class="h-8 px-3 rounded bg-blue-600 hover:bg-blue-700 text-white text-sm disabled:opacity-50"
+          :disabled="rebuilding"
+          data-testid="accounting-settings-rebuild"
+          @click="onRebuild"
+        >
+          {{ rebuilding ? t("pluginAccounting.common.loading") : t("pluginAccounting.settings.rebuild") }}
+        </button>
+      </div>
+    </section>
+    <div v-if="!showAdvanced">
+      <button
+        type="button"
+        class="h-8 px-2.5 flex items-center gap-1 rounded border border-gray-300 text-sm text-gray-600 hover:bg-gray-50"
+        data-testid="accounting-settings-advanced"
+        @click="showAdvanced = true"
+      >
+        <span class="material-icons text-base">expand_more</span>
+        <span>{{ t("pluginAccounting.settings.advanced") }}</span>
+      </button>
+    </div>
+    <section v-if="showAdvanced" class="border border-red-300 rounded p-3 flex flex-col gap-2">
+      <h4 class="text-sm font-semibold text-red-700">{{ t("pluginAccounting.settings.deleteBook") }}</h4>
+      <p class="text-xs text-gray-500">{{ t("pluginAccounting.settings.deleteBookExplain") }}</p>
+      <p v-if="deleteError" class="text-xs text-red-500" data-testid="accounting-settings-delete-error">{{ deleteError }}</p>
+      <label class="text-xs text-gray-500 flex flex-col gap-1">
+        {{ t("pluginAccounting.settings.deleteBookConfirm", { bookName: bookName }) }}
+        <input v-model="confirmName" class="h-8 px-2 rounded border border-gray-300 text-sm" data-testid="accounting-settings-delete-confirm" />
+      </label>
+      <div>
+        <button
+          class="h-8 px-3 rounded bg-red-600 hover:bg-red-700 text-white text-sm disabled:opacity-50"
+          :disabled="confirmName !== bookName || deleting"
+          data-testid="accounting-settings-delete"
+          @click="onDelete"
+        >
+          {{ deleting ? t("pluginAccounting.common.loading") : t("pluginAccounting.settings.deleteBookButton") }}
+        </button>
+      </div>
+    </section>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed, ref, watch } from "vue";
+import { useI18n } from "vue-i18n";
+import { deleteBook, rebuildSnapshots, updateBook } from "../api";
+import { SUPPORTED_COUNTRY_CODES, isSupportedCountryCode, localizedCountryName, type SupportedCountryCode } from "../countries";
+import { DEFAULT_FISCAL_YEAR_END, FISCAL_YEAR_ENDS, resolveFiscalYearEnd, type FiscalYearEnd } from "../fiscalYear";
+
+const { t, locale } = useI18n();
+
+const props = defineProps<{
+  bookId: string;
+  bookName: string;
+  currency: string;
+  country?: SupportedCountryCode;
+  fiscalYearEnd?: FiscalYearEnd;
+}>();
+const emit = defineEmits<{ deleted: [bookName: string]; "books-changed": [] }>();
+
+const rebuilding = ref(false);
+const rebuildOk = ref<string | null>(null);
+const rebuildError = ref<string | null>(null);
+const deleting = ref(false);
+const deleteError = ref<string | null>(null);
+const confirmName = ref("");
+const updating = ref(false);
+const updateOk = ref<string | null>(null);
+const updateError = ref<string | null>(null);
+const showAdvanced = ref(false);
+const selectedName = ref<string>(props.bookName);
+const selectedCountry = ref<string>(props.country ?? "");
+// Resolved at the boundary so the dropdown always shows a concrete
+// value — books without a `fiscalYearEnd` field on disk land here as
+// the default Q4 (matches the back-compat read policy).
+const selectedFiscalYearEnd = ref<FiscalYearEnd>(props.fiscalYearEnd ?? DEFAULT_FISCAL_YEAR_END);
+
+interface CountryOption {
+  code: string;
+  label: string;
+}
+
+const countryOptions = computed<CountryOption[]>(() =>
+  SUPPORTED_COUNTRY_CODES.map((code) => ({
+    code,
+    label: `${code} — ${localizedCountryName(code, locale.value)}`,
+  })),
+);
+
+interface FiscalYearEndOption {
+  value: FiscalYearEnd;
+  label: string;
+}
+
+const fiscalYearEndOptions = computed<FiscalYearEndOption[]>(() =>
+  FISCAL_YEAR_ENDS.map((value) => ({
+    value,
+    label: t(`pluginAccounting.bookSwitcher.fiscalYearEnd${value}`),
+  })),
+);
+
+const hasPendingChanges = computed<boolean>(() => {
+  // Compare against the trimmed value so a no-op edit (typing then
+  // backspacing back to the original) doesn't keep the Save button
+  // hot. Server-side validateUpdateBookInput rejects empty / whitespace
+  // names with a 400 — the disabled binding below mirrors that contract
+  // so the button can't fire a doomed request.
+  const nameChanged = selectedName.value.trim() !== props.bookName;
+  const nameValid = selectedName.value.trim().length > 0;
+  const countryChanged = selectedCountry.value !== (props.country ?? "");
+  const fiscalChanged = selectedFiscalYearEnd.value !== resolveFiscalYearEnd(props.fiscalYearEnd);
+  return nameValid && (nameChanged || countryChanged || fiscalChanged);
+});
+
+async function onRebuild(): Promise<void> {
+  rebuilding.value = true;
+  rebuildOk.value = null;
+  rebuildError.value = null;
+  try {
+    const result = await rebuildSnapshots(props.bookId);
+    if (!result.ok) {
+      rebuildError.value = result.error;
+      return;
+    }
+    rebuildOk.value = t("pluginAccounting.settings.rebuildOk", { count: result.data.rebuilt.length });
+  } finally {
+    rebuilding.value = false;
+  }
+}
+
+async function onSaveBookInfo(): Promise<void> {
+  if (updating.value) return;
+  updating.value = true;
+  updateOk.value = null;
+  updateError.value = null;
+  try {
+    // The select v-model is a plain `string` (HTML form value); narrow
+    // it back to the union before handing it to the API helper. The
+    // empty string is the sentinel that clears the country server-side.
+    const rawCountry = selectedCountry.value;
+    const country: SupportedCountryCode | "" = rawCountry === "" || isSupportedCountryCode(rawCountry) ? rawCountry : "";
+    const result = await updateBook({
+      bookId: props.bookId,
+      name: selectedName.value.trim(),
+      country,
+      fiscalYearEnd: selectedFiscalYearEnd.value,
+    });
+    if (!result.ok) {
+      updateError.value = result.error;
+      return;
+    }
+    updateOk.value = t("pluginAccounting.settings.updateOk");
+    emit("books-changed");
+  } finally {
+    updating.value = false;
+  }
+}
+
+async function onDelete(): Promise<void> {
+  if (deleting.value) return;
+  deleting.value = true;
+  deleteError.value = null;
+  try {
+    const result = await deleteBook(props.bookId);
+    if (!result.ok) {
+      deleteError.value = result.error;
+      return;
+    }
+    emit("deleted", props.bookName);
+    emit("books-changed");
+  } finally {
+    deleting.value = false;
+  }
+}
+
+// Reset feedback / confirmation AND the dropdown selection when the
+// user navigates between books while this tab is open. Without the
+// `selectedCountry` reset, switching from book A (country=JP) to
+// book B (also country=JP) leaves a previously-typed unsaved value
+// staged on B — a save would then misattribute the edit.
+watch(
+  () => props.bookId,
+  () => {
+    rebuildOk.value = null;
+    rebuildError.value = null;
+    deleteError.value = null;
+    confirmName.value = "";
+    updateOk.value = null;
+    updateError.value = null;
+    selectedName.value = props.bookName;
+    selectedCountry.value = props.country ?? "";
+    selectedFiscalYearEnd.value = props.fiscalYearEnd ?? DEFAULT_FISCAL_YEAR_END;
+    showAdvanced.value = false;
+  },
+);
+
+// Follow external bookName updates — e.g. an LLM-driven updateBook in
+// another tab, or pubsub-driven refetch. Without this, an out-of-band
+// rename leaves a stale draft staged in the input.
+watch(
+  () => props.bookName,
+  (next) => {
+    selectedName.value = next;
+  },
+);
+
+watch(
+  () => props.country,
+  (next) => {
+    selectedCountry.value = next ?? "";
+  },
+);
+
+watch(
+  () => props.fiscalYearEnd,
+  (next) => {
+    selectedFiscalYearEnd.value = next ?? DEFAULT_FISCAL_YEAR_END;
+  },
+);
+</script>

package/src/plugins/accounting/components/BookSwitcher.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="flex items-center gap-2">
+    <label class="text-xs text-gray-500" for="accounting-book-select">{{ t("pluginAccounting.bookSwitcher.label") }}</label>
+    <select
+      id="accounting-book-select"
+      :value="modelValue"
+      class="h-8 px-2 rounded border border-gray-300 text-sm bg-white"
+      data-testid="accounting-book-select"
+      @change="onSelect"
+    >
+      <option v-if="modelValue === ''" value="" disabled>{{ t("pluginAccounting.bookSwitcher.placeholder") }}</option>
+      <option v-for="book in books" :key="book.id" :value="book.id">{{ formatBookOption(book) }}</option>
+      <!-- eslint-disable-next-line @intlify/vue-i18n/no-raw-text -- decorative separator inside the books <select>, not user copy -->
+      <option disabled>──────────</option>
+      <option :value="NEW_BOOK_SENTINEL" data-testid="accounting-new-book-option">+ {{ t("pluginAccounting.bookSwitcher.newBook") }}</option>
+    </select>
+    <NewBookForm v-if="showNewBook" @cancel="showNewBook = false" @created="onCreated" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from "vue";
+import { useI18n } from "vue-i18n";
+import NewBookForm from "./NewBookForm.vue";
+import type { BookSummary } from "../api";
+
+const { t } = useI18n();
+
+const props = defineProps<{ modelValue: string; books: BookSummary[] }>();
+const emit = defineEmits<{
+  "update:modelValue": [bookId: string];
+  "books-changed": [];
+  "book-created": [book: BookSummary];
+}>();
+
+// Sentinel value for the "+ New book" option living inside the
+// books <select>. Picking it opens the modal and reverts the
+// select's displayed value to the current selection — the option
+// must not collide with any real book id, which are nanoid-shaped.
+const NEW_BOOK_SENTINEL = "__new__";
+
+const showNewBook = ref(false);
+
+function formatBookOption(book: BookSummary): string {
+  // `Name (CCY · Country)` when a country is set; otherwise fall back
+  // to `Name (CCY)`. Keeps the option label compact while surfacing
+  // the country so a multi-jurisdiction user can pick the right book
+  // by tax regime, not just currency.
+  const suffix = book.country ? `${book.currency} · ${book.country}` : book.currency;
+  return `${book.name} (${suffix})`;
+}
+
+function onSelect(event: Event): void {
+  const target = event.target as HTMLSelectElement;
+  const bookId = target.value;
+  if (bookId === NEW_BOOK_SENTINEL) {
+    target.value = props.modelValue;
+    showNewBook.value = true;
+    return;
+  }
+  if (bookId === props.modelValue) return;
+  // The View persists the new selection to localStorage; no server
+  // round-trip needed since there's no shared "active book" state.
+  emit("update:modelValue", bookId);
+}
+
+function onCreated(book: BookSummary): void {
+  // Hand the new book to the parent in one event so it can await
+  // its own refetch before setting the active selection. Splitting
+  // this into separate `books-changed` + `update:modelValue` emits
+  // races: the parent's async refetch runs concurrently with the
+  // selection update, and the stillExists guard inside refetch can
+  // snap the selection back to books[0] if the fetch happens to
+  // resolve before the new book is in the list.
+  showNewBook.value = false;
+  emit("book-created", book);
+}
+</script>

package/src/plugins/accounting/components/DateRangePicker.vue

@@ -0,0 +1,140 @@
+<template>
+  <!-- Reusable from/to + shortcut date range picker. Owns no state
+       beyond the v-model; the parent supplies an initial range and
+       the active book's fiscalYearEnd so quarter/year shortcuts
+       resolve under the right calendar. -->
+  <div class="flex flex-wrap items-end gap-2" data-testid="accounting-daterange">
+    <label class="text-xs text-gray-500 flex flex-col gap-1">
+      {{ t("pluginAccounting.dateRange.shortcutLabel") }}
+      <select
+        :value="selectedShortcut"
+        class="h-8 px-2 rounded border border-gray-300 text-sm bg-white"
+        data-testid="accounting-daterange-shortcut"
+        @change="onShortcutChange(($event.target as HTMLSelectElement).value)"
+      >
+        <!-- Sentinel for the "custom" state. Hidden from the menu
+             but bound when the current range doesn't match any
+             preset, which leaves the trigger displaying blank
+             instead of forcing a wrong-looking match. -->
+        <option value="" hidden></option>
+        <option value="currentQuarter">{{ t("pluginAccounting.dateRange.currentQuarter") }}</option>
+        <option value="previousQuarter">{{ t("pluginAccounting.dateRange.previousQuarter") }}</option>
+        <option value="currentYear">{{ t("pluginAccounting.dateRange.currentYear") }}</option>
+        <option value="previousYear">{{ t("pluginAccounting.dateRange.previousYear") }}</option>
+        <option v-if="hasOpeningDate" value="lifetime">{{ t("pluginAccounting.dateRange.lifetime") }}</option>
+        <option value="all">{{ t("pluginAccounting.dateRange.all") }}</option>
+      </select>
+    </label>
+    <label class="text-xs text-gray-500 flex flex-col gap-1">
+      {{ t("pluginAccounting.dateRange.fromLabel") }}
+      <input
+        :value="modelValue.from"
+        type="date"
+        class="h-8 px-2 rounded border border-gray-300 text-sm"
+        data-testid="accounting-daterange-from"
+        @input="onFromChange(($event.target as HTMLInputElement).value)"
+      />
+    </label>
+    <label class="text-xs text-gray-500 flex flex-col gap-1">
+      {{ t("pluginAccounting.dateRange.toLabel") }}
+      <input
+        :value="modelValue.to"
+        type="date"
+        class="h-8 px-2 rounded border border-gray-300 text-sm"
+        data-testid="accounting-daterange-to"
+        @input="onToChange(($event.target as HTMLInputElement).value)"
+      />
+    </label>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from "vue";
+import { useI18n } from "vue-i18n";
+import { currentFiscalYearRange, currentQuarterRange, previousFiscalYearRange, previousQuarterRange, type DateRange, type FiscalYearEnd } from "../fiscalYear";
+import { localDateString } from "../dates";
+
+const { t } = useI18n();
+
+const props = defineProps<{
+  modelValue: DateRange;
+  fiscalYearEnd: FiscalYearEnd;
+  /** The active book's opening-balance date. Drives the "Lifetime"
+   *  shortcut (from = openingDate, to = today). Optional — when
+   *  absent the Lifetime option is hidden from the menu. The opening
+   *  gate prevents the tabs that mount this picker from rendering
+   *  before an opening exists, so in normal use this stays defined. */
+  openingDate?: string;
+}>();
+
+const emit = defineEmits<{
+  "update:modelValue": [DateRange];
+}>();
+
+const hasOpeningDate = computed<boolean>(() => Boolean(props.openingDate));
+
+const UNBOUNDED_RANGE: DateRange = { from: "", to: "" };
+
+/** From the book's opening date through today. Hidden from the menu
+ *  when the parent hasn't supplied an opening. */
+function lifetimeRange(): DateRange | null {
+  if (!props.openingDate) return null;
+  return { from: props.openingDate, to: localDateString() };
+}
+
+type Shortcut = "currentQuarter" | "previousQuarter" | "currentYear" | "previousYear" | "lifetime" | "all";
+/** Empty string is the sentinel "no preset matches" value bound to
+ *  the hidden option in the template — the trigger shows blank. */
+type SelectedShortcut = Shortcut | "";
+
+function rangesEqual(left: DateRange, right: DateRange): boolean {
+  return left.from === right.from && left.to === right.to;
+}
+
+// Resolve the dropdown's displayed value from the current
+// modelValue. Re-evaluates today on every read — the picker is a
+// short-lived UI surface so cache invalidation isn't a concern, and
+// the user has no expectation that "current quarter" picked in the
+// morning still labels correctly at midnight. Returns "" when no
+// preset matches (custom range from manual from/to edits).
+//
+// Order matters when ranges collide: when no opening is on file the
+// Lifetime option is hidden from the menu, but if it ever produced
+// the same span as another preset (it can't — Lifetime spans years,
+// presets span quarter/year), the earlier branch would win. We
+// check the explicit ranges first and fall through to the unbounded
+// "all" last so a manually-cleared input lands on "all" rather than
+// blank when both sides happen to be empty.
+const selectedShortcut = computed<SelectedShortcut>(() => {
+  const value = props.modelValue;
+  const today = new Date();
+  if (rangesEqual(value, currentQuarterRange(props.fiscalYearEnd, today))) return "currentQuarter";
+  if (rangesEqual(value, previousQuarterRange(props.fiscalYearEnd, today))) return "previousQuarter";
+  if (rangesEqual(value, currentFiscalYearRange(props.fiscalYearEnd, today))) return "currentYear";
+  if (rangesEqual(value, previousFiscalYearRange(props.fiscalYearEnd, today))) return "previousYear";
+  const lifetime = lifetimeRange();
+  if (lifetime && rangesEqual(value, lifetime)) return "lifetime";
+  if (rangesEqual(value, UNBOUNDED_RANGE)) return "all";
+  return "";
+});
+
+function onShortcutChange(raw: string): void {
+  const today = new Date();
+  if (raw === "currentQuarter") emit("update:modelValue", currentQuarterRange(props.fiscalYearEnd, today));
+  else if (raw === "previousQuarter") emit("update:modelValue", previousQuarterRange(props.fiscalYearEnd, today));
+  else if (raw === "currentYear") emit("update:modelValue", currentFiscalYearRange(props.fiscalYearEnd, today));
+  else if (raw === "previousYear") emit("update:modelValue", previousFiscalYearRange(props.fiscalYearEnd, today));
+  else if (raw === "lifetime") {
+    const lifetime = lifetimeRange();
+    if (lifetime) emit("update:modelValue", lifetime);
+  } else if (raw === "all") emit("update:modelValue", UNBOUNDED_RANGE);
+}
+
+function onFromChange(value: string): void {
+  emit("update:modelValue", { from: value, to: props.modelValue.to });
+}
+
+function onToChange(value: string): void {
+  emit("update:modelValue", { from: props.modelValue.from, to: value });
+}
+</script>