Adds a month navigator and category filter chips to the Тооцоо list, plus a categorize-review flow at /accounting/review for bulk-assigning categories to uncategorized merchants (grouped by matchKey, biggest spend first).
42 lines
1.4 KiB
TypeScript
42 lines
1.4 KiB
TypeScript
"use client";
|
||
|
||
import type { CSSProperties } from "react";
|
||
import { Icon } from "@/ds/icons";
|
||
|
||
const navButtonStyle: CSSProperties = {
|
||
all: "unset",
|
||
cursor: "pointer",
|
||
width: 32,
|
||
height: 32,
|
||
flexShrink: 0,
|
||
borderRadius: 10,
|
||
display: "grid",
|
||
placeItems: "center",
|
||
color: "var(--seed-color-fg-neutral)",
|
||
};
|
||
|
||
export interface MonthNavProps {
|
||
/** e.g. "2026 оны 8-р сар" (see `monthLabel`). */
|
||
label: string;
|
||
onPrev: () => void;
|
||
onNext: () => void;
|
||
prevLabel?: string;
|
||
nextLabel?: string;
|
||
}
|
||
|
||
/** ‹ [month] › — the month navigator above the Тооцоо list. Ports the
|
||
* `monthRow` control from `TransactionsView.swift` (narrowed to just the
|
||
* month stepper, no week/month panel toggle). */
|
||
export function MonthNav({ label, onPrev, onNext, prevLabel = "Өмнөх сар", nextLabel = "Дараагийн сар" }: MonthNavProps) {
|
||
return (
|
||
<div style={{ display: "flex", alignItems: "center", justifyContent: "center", gap: 4 }}>
|
||
<button type="button" onClick={onPrev} aria-label={prevLabel} style={navButtonStyle}>
|
||
<Icon name="chevron-left" size={16} />
|
||
</button>
|
||
<span style={{ fontSize: 17, fontWeight: 700, minWidth: 150, textAlign: "center" }}>{label}</span>
|
||
<button type="button" onClick={onNext} aria-label={nextLabel} style={navButtonStyle}>
|
||
<Icon name="chevron-right" size={16} />
|
||
</button>
|
||
</div>
|
||
);
|
||
}
|