Compare commits
6
Commits
0dac38abcc
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
741e5a49ba | ||
|
|
94fe456a9d | ||
|
|
65d83ddec7 | ||
|
|
54a51752ac | ||
|
|
9c15b81409 | ||
|
|
4a03ab8e1a |
No files matched your search
@@ -4,13 +4,13 @@
|
||||
import ChevronRight from "@lucide/svelte/icons/chevron-right";
|
||||
import { Popover } from "bits-ui";
|
||||
import { period } from "#lib/period.svelte.js";
|
||||
import { ui } from "#lib/ui.svelte.js";
|
||||
|
||||
let open = $state(false);
|
||||
let start = $state(period.start);
|
||||
let end = $state(period.end);
|
||||
|
||||
$effect(() => {
|
||||
if (open) {
|
||||
if (ui.periodOpen) {
|
||||
({ start, end } = period);
|
||||
}
|
||||
});
|
||||
@@ -19,7 +19,7 @@
|
||||
event.preventDefault();
|
||||
if (start && end && start <= end) {
|
||||
period.set({ end, start });
|
||||
open = false;
|
||||
ui.periodOpen = false;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -34,7 +34,7 @@
|
||||
>
|
||||
<ChevronLeft class="size-4" />
|
||||
</button>
|
||||
<Popover.Root bind:open>
|
||||
<Popover.Root bind:open={ui.periodOpen}>
|
||||
<Popover.Trigger
|
||||
class="flex h-8 items-center gap-2 px-2 font-medium text-[13px] hover:bg-black/10"
|
||||
title="Choose period"
|
||||
@@ -59,11 +59,16 @@
|
||||
: ""}"
|
||||
onclick={() => {
|
||||
period.set(preset.range);
|
||||
open = false;
|
||||
ui.periodOpen = false;
|
||||
}}
|
||||
type="button"
|
||||
>
|
||||
{preset.label}
|
||||
{#if preset.key || preset.hint}
|
||||
<span class="kbd"
|
||||
>{preset.key ? `p ${preset.key}` : preset.hint}</span
|
||||
>
|
||||
{/if}
|
||||
</button>
|
||||
{/each}
|
||||
</div>
|
||||
@@ -76,6 +81,7 @@
|
||||
Start
|
||||
<input
|
||||
class="cladd-cut cladd-focusable-input h-8 rounded-cladd-sm px-2 text-[13px] text-cladd-fg"
|
||||
id="period-start"
|
||||
type="date"
|
||||
bind:value={start}
|
||||
>
|
||||
|
||||
@@ -36,6 +36,18 @@
|
||||
}
|
||||
});
|
||||
|
||||
function setPreset(key: string | undefined) {
|
||||
const preset = period.presets().find((item) => item.key === key);
|
||||
if (preset) {
|
||||
period.set(preset.range);
|
||||
}
|
||||
}
|
||||
|
||||
function openCustomPeriod() {
|
||||
ui.periodOpen = true;
|
||||
setTimeout(() => document.getElementById("period-start")?.focus(), 50);
|
||||
}
|
||||
|
||||
function openOld(sticky = false) {
|
||||
location.assign(oldUiUrl(page.url.href, sticky));
|
||||
}
|
||||
@@ -148,6 +160,27 @@
|
||||
label: "Current period",
|
||||
run: () => period.reset(),
|
||||
},
|
||||
{
|
||||
group: "Period",
|
||||
keys: "p p",
|
||||
label: "Choose a period",
|
||||
run: () => (ui.periodOpen = true),
|
||||
},
|
||||
{
|
||||
group: "Period",
|
||||
keys: "p c",
|
||||
label: "Custom period: type the dates",
|
||||
run: openCustomPeriod,
|
||||
},
|
||||
...period
|
||||
.presets()
|
||||
.filter((preset) => preset.key)
|
||||
.map((preset) => ({
|
||||
group: "Period",
|
||||
keys: `p ${preset.key}`,
|
||||
label: `Period: ${preset.label}`,
|
||||
run: () => setPreset(preset.key),
|
||||
})),
|
||||
{
|
||||
group: "Global",
|
||||
hidden: true,
|
||||
|
||||
@@ -122,7 +122,7 @@
|
||||
onclick={() => byCurrency || onmode()}
|
||||
type="button"
|
||||
>
|
||||
By currency<span class="kbd max-sm:hidden">p</span>
|
||||
By currency<span class="kbd max-sm:hidden">v</span>
|
||||
</button>
|
||||
</fieldset>
|
||||
</header>
|
||||
|
||||
+16
-5
@@ -118,12 +118,23 @@ export function periodOf(value: string, view: ViewRange): Range {
|
||||
}
|
||||
}
|
||||
|
||||
const UNITS: ViewRange[] = ["1M", "3M", "6M", "1Y"];
|
||||
|
||||
function unitOf(range: Range, view: ViewRange): ViewRange | null {
|
||||
const units = isDynamic(view) ? UNITS : [view, ...UNITS];
|
||||
return (
|
||||
units.find((unit) => {
|
||||
const aligned = periodOf(range.start, unit);
|
||||
return aligned.start === range.start && range.end <= aligned.end;
|
||||
}) ?? null
|
||||
);
|
||||
}
|
||||
|
||||
export function shiftPeriod(range: Range, view: ViewRange, dir: 1 | -1): Range {
|
||||
const fixed = isDynamic(view) ? "1M" : view;
|
||||
const aligned = periodOf(range.start, fixed);
|
||||
if (aligned.start === range.start && aligned.end === range.end) {
|
||||
const anchor = dir === 1 ? addDays(range.end, 1) : addDays(range.start, -1);
|
||||
return periodOf(anchor, fixed);
|
||||
const unit = unitOf(range, view);
|
||||
if (unit) {
|
||||
const anchor = dir === 1 ? periodOf(range.start, unit).end : range.start;
|
||||
return periodOf(addDays(anchor, dir), unit);
|
||||
}
|
||||
const days = daysBetween(range.start, range.end) + 1;
|
||||
return {
|
||||
|
||||
@@ -15,6 +15,8 @@ const STORAGE_KEY = "ffui.period";
|
||||
const ISO_DATE = /^\d{4}-\d{2}-\d{2}$/;
|
||||
|
||||
export interface Preset {
|
||||
hint?: string;
|
||||
key?: string;
|
||||
label: string;
|
||||
range: Range;
|
||||
}
|
||||
@@ -113,31 +115,44 @@ class Period {
|
||||
if (!isDynamic(view)) {
|
||||
const prev = shiftPeriod(this.range, view, -1);
|
||||
const next = shiftPeriod(this.range, view, 1);
|
||||
presets.push({ label: periodLabel(prev, view), range: prev });
|
||||
presets.push({ label: periodLabel(next, view), range: next });
|
||||
presets.push({ hint: "[", label: periodLabel(prev, view), range: prev });
|
||||
presets.push({ hint: "]", label: periodLabel(next, view), range: next });
|
||||
}
|
||||
const current = periodOf(now, view);
|
||||
presets.push({
|
||||
key: "t",
|
||||
label: `Today (${periodLabel(current, view)})`,
|
||||
range: current,
|
||||
});
|
||||
presets.push({
|
||||
key: "7",
|
||||
label: "Last seven days",
|
||||
range: { end: now, start: addDays(now, -7) },
|
||||
});
|
||||
presets.push({
|
||||
key: "3",
|
||||
label: "Last thirty days",
|
||||
range: { end: now, start: addDays(now, -30) },
|
||||
});
|
||||
presets.push({ label: "Month to date", range: periodOf(now, "MTD") });
|
||||
presets.push({ label: "Year to date", range: periodOf(now, "YTD") });
|
||||
presets.push({
|
||||
key: "m",
|
||||
label: "Month to date",
|
||||
range: periodOf(now, "MTD"),
|
||||
});
|
||||
presets.push({
|
||||
key: "y",
|
||||
label: "Year to date",
|
||||
range: periodOf(now, "YTD"),
|
||||
});
|
||||
const year = Number(now.slice(0, 4)) - 1;
|
||||
presets.push({
|
||||
key: "l",
|
||||
label: `Previous year (${year})`,
|
||||
range: { end: `${year}-12-31`, start: `${year}-01-01` },
|
||||
});
|
||||
if (this.first) {
|
||||
presets.push({
|
||||
key: "a",
|
||||
label: "Everything",
|
||||
range: { end: now, start: this.first },
|
||||
});
|
||||
|
||||
@@ -28,10 +28,12 @@ export const runwayQueries = {
|
||||
bills: (start: string, end: string) => ({
|
||||
queryFn: () => all<Bill>("/v1/bills", { end, start }),
|
||||
queryKey: ["subscriptions", "runway", start, end],
|
||||
refetchOnWindowFocus: true,
|
||||
}),
|
||||
paid: () => ({
|
||||
queryFn: async () => toPayments(await search("has_any_bill:true")),
|
||||
queryKey: ["subscriptions", "payments"],
|
||||
refetchOnWindowFocus: true,
|
||||
}),
|
||||
unlinked: (day: string) => {
|
||||
const after = addDays(day, -UNLINKED_DAYS);
|
||||
|
||||
@@ -208,11 +208,7 @@ function occurrences(bill: Bill, day: string) {
|
||||
return (bill.pay_dates ?? [])
|
||||
.map((raw) => raw.slice(0, 10))
|
||||
.filter((date) => !end || date <= end)
|
||||
.filter(
|
||||
(date) =>
|
||||
date < day ||
|
||||
!paid.some((p) => p <= date && daysBetween(p, date) < early)
|
||||
)
|
||||
.filter((date) => !paid.some((p) => Math.abs(daysBetween(p, date)) < early))
|
||||
.map((date) => ({ date: date < day ? day : date, overdue: date < day }));
|
||||
}
|
||||
|
||||
|
||||
@@ -11,6 +11,7 @@ class Ui {
|
||||
palette = $state(false);
|
||||
paletteQuery = $state("");
|
||||
quickEntry = $state(false);
|
||||
periodOpen = $state(false);
|
||||
mobileNav = $state(false);
|
||||
collapsed = $state(stored(SIDEBAR_KEY));
|
||||
notes = $state(stored(NOTES_KEY));
|
||||
|
||||
@@ -78,7 +78,7 @@
|
||||
},
|
||||
{
|
||||
group: "Currencies",
|
||||
keys: "p",
|
||||
keys: "P",
|
||||
label: "Make primary currency",
|
||||
run: () => nav.current && makePrimary(nav.current),
|
||||
},
|
||||
@@ -203,7 +203,7 @@
|
||||
</ContextMenuItem>
|
||||
<ContextMenuItem onSelect={() => makePrimary(item)}>
|
||||
Make primary
|
||||
<span class="ml-auto kbd">p</span>
|
||||
<span class="ml-auto kbd">P</span>
|
||||
</ContextMenuItem>
|
||||
<MenuDelete {arm} id={item.id} run={() => remove(item)} />
|
||||
{/if}
|
||||
|
||||
@@ -296,7 +296,7 @@
|
||||
})),
|
||||
{
|
||||
group: "Runway",
|
||||
keys: "p",
|
||||
keys: "v",
|
||||
label: perCurrency ? "Group by card" : "Group by currency",
|
||||
run: toggleMode,
|
||||
},
|
||||
@@ -491,7 +491,9 @@
|
||||
{@const ends = bill.end_date?.slice(0, 10)}
|
||||
{@const last = lastOf(item)}
|
||||
{@const who = payer(item)}
|
||||
{@const stale = staleSince(bill, last, day)}
|
||||
{@const stale = paid.isSuccess
|
||||
? staleSince(bill, last, day)
|
||||
: null}
|
||||
{@const extra = found.get(item.id) ?? []}
|
||||
{@const armedHere = arm.key?.endsWith(`:${item.id}`)}
|
||||
<tr
|
||||
@@ -567,7 +569,7 @@
|
||||
billIds={manualCards.picking.ids}
|
||||
cards={cardList}
|
||||
/>
|
||||
{:else if bill.active}
|
||||
{:else if bill.active && paid.isSuccess}
|
||||
{#if who.card}
|
||||
<span class="text-cladd-fg-soft"
|
||||
>{who.card.name}</span
|
||||
|
||||
@@ -13,7 +13,7 @@ x-firefly-env: &firefly-env
|
||||
|
||||
services:
|
||||
v1:
|
||||
image: fireflyiii/core:version-6.6.6
|
||||
image: fireflyiii/core:version-6.6.6@sha256:ae69fdd95cdef9038cd7a460a5aec731f14813973e4f096511d5a4ea9ff0e972
|
||||
environment:
|
||||
<<: *firefly-env
|
||||
APP_KEY: ffuistandv1ffuistandv1ffuistand1
|
||||
@@ -26,7 +26,7 @@ services:
|
||||
- "127.0.0.1:${FFUI_V1_PORT:-30072}:8080"
|
||||
|
||||
v3:
|
||||
image: fireflyiii/core:latest
|
||||
image: fireflyiii/core:latest@sha256:4409f9f0f87378ba95d40811352f4f49338d276bb638c1e6d18a5579f332fbe8
|
||||
environment:
|
||||
<<: *firefly-env
|
||||
APP_KEY: ffuistandv3ffuistandv3ffuistand3
|
||||
|
||||
Reference in new issue
Block a user