eewing
110 lines
5.0 KiB
JavaScript
110 lines
5.0 KiB
JavaScript
import { h as head, e as escape_html, a as ensure_array_like, b as attr, c as stringify } from "../../../chunks/index2.js";
|
||
import { B as Button } from "../../../chunks/button.js";
|
||
import { C as Card, a as Card_content } from "../../../chunks/card-content.js";
|
||
import "clsx";
|
||
import { I as Input } from "../../../chunks/input.js";
|
||
function _page($$renderer, $$props) {
|
||
$$renderer.component(($$renderer2) => {
|
||
let { data } = $$props;
|
||
let searchQuery = "";
|
||
const transactions = data?.transactions ?? [];
|
||
const filteredTransactions = (() => {
|
||
const q = searchQuery.trim().toLowerCase();
|
||
if (!q) return transactions;
|
||
return transactions.filter((t) => t.id.toLowerCase().includes(q));
|
||
})();
|
||
let $$settled = true;
|
||
let $$inner_renderer;
|
||
function $$render_inner($$renderer3) {
|
||
head("1q0dtg6", $$renderer3, ($$renderer4) => {
|
||
$$renderer4.title(($$renderer5) => {
|
||
$$renderer5.push(`<title>Transactions – Stackq</title>`);
|
||
});
|
||
});
|
||
$$renderer3.push(`<main class="container mx-auto flex flex-col gap-6 px-4 py-6 sm:px-6 sm:py-8"><div class="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between"><div class="flex items-center gap-3 min-w-0"><a href="/" class="text-muted-foreground hover:text-foreground shrink-0 text-sm" title="Back to main">Back</a> <h1 class="text-xl font-semibold truncate sm:text-2xl">Transactions</h1></div> <div class="flex flex-col gap-3 sm:flex-row sm:flex-wrap sm:items-center sm:gap-2"><div class="w-full sm:w-64 sm:min-w-0">`);
|
||
Input($$renderer3, {
|
||
type: "search",
|
||
placeholder: "Search transactions…",
|
||
class: "h-11 w-full sm:h-9",
|
||
get value() {
|
||
return searchQuery;
|
||
},
|
||
set value($$value) {
|
||
searchQuery = $$value;
|
||
$$settled = false;
|
||
}
|
||
});
|
||
$$renderer3.push(`<!----></div> <span class="text-muted-foreground text-sm shrink-0">${escape_html(filteredTransactions.length)}${escape_html(filteredTransactions.length !== transactions.length ? ` of ${transactions.length}` : "")} transactions</span> <a href="/transactions/new" class="block shrink-0">`);
|
||
Button($$renderer3, {
|
||
class: "w-full sm:w-auto min-h-11",
|
||
children: ($$renderer4) => {
|
||
$$renderer4.push(`<!---->New transaction`);
|
||
},
|
||
$$slots: { default: true }
|
||
});
|
||
$$renderer3.push(`<!----></a></div></div> `);
|
||
if (filteredTransactions.length === 0) {
|
||
$$renderer3.push("<!--[-->");
|
||
Card($$renderer3, {
|
||
children: ($$renderer4) => {
|
||
Card_content($$renderer4, {
|
||
class: "flex flex-col items-center justify-center gap-4 py-12",
|
||
children: ($$renderer5) => {
|
||
$$renderer5.push(`<p class="text-muted-foreground text-center text-sm">${escape_html(transactions.length === 0 ? "No transactions yet." : "No transactions match your search.")}</p> <p class="text-muted-foreground text-center text-xs">${escape_html(transactions.length === 0 ? "Create a transaction to get started." : "Try a different search.")}</p> <a href="/transactions/new">`);
|
||
Button($$renderer5, {
|
||
variant: "outline",
|
||
children: ($$renderer6) => {
|
||
$$renderer6.push(`<!---->New transaction`);
|
||
},
|
||
$$slots: { default: true }
|
||
});
|
||
$$renderer5.push(`<!----></a> <a href="/">`);
|
||
Button($$renderer5, {
|
||
variant: "ghost",
|
||
children: ($$renderer6) => {
|
||
$$renderer6.push(`<!---->Back to home`);
|
||
},
|
||
$$slots: { default: true }
|
||
});
|
||
$$renderer5.push(`<!----></a>`);
|
||
},
|
||
$$slots: { default: true }
|
||
});
|
||
},
|
||
$$slots: { default: true }
|
||
});
|
||
} else {
|
||
$$renderer3.push("<!--[!-->");
|
||
$$renderer3.push(`<div class="flex flex-col gap-2"><!--[-->`);
|
||
const each_array = ensure_array_like(filteredTransactions);
|
||
for (let $$index = 0, $$length = each_array.length; $$index < $$length; $$index++) {
|
||
let tx = each_array[$$index];
|
||
Card($$renderer3, {
|
||
children: ($$renderer4) => {
|
||
Card_content($$renderer4, {
|
||
class: "p-4",
|
||
children: ($$renderer5) => {
|
||
$$renderer5.push(`<a${attr("href", `/transactions/${stringify(tx.id)}`)} class="font-medium hover:underline">Transaction ${escape_html(tx.id)}</a>`);
|
||
},
|
||
$$slots: { default: true }
|
||
});
|
||
},
|
||
$$slots: { default: true }
|
||
});
|
||
}
|
||
$$renderer3.push(`<!--]--></div>`);
|
||
}
|
||
$$renderer3.push(`<!--]--></main>`);
|
||
}
|
||
do {
|
||
$$settled = true;
|
||
$$inner_renderer = $$renderer2.copy();
|
||
$$render_inner($$inner_renderer);
|
||
} while (!$$settled);
|
||
$$renderer2.subsume($$inner_renderer);
|
||
});
|
||
}
|
||
export {
|
||
_page as default
|
||
};
|