fix(pleno-vue): keep Fakturer nu visible on red-flagged customers (#279)

## Why

PR #271 made the `Fakturer nu` button visible again on multi-flag
customers in
the Kunder til gennemgang panel, but the button's v-if still gates on
`customer.requires_action`. On customers with manual (red) flags where
`requires_action` is false — e.g. flagged but the period's unbooked
transactions
are zero — the button stayed hidden in the right rail even though there
is
clearly something that needs the superuser's attention.

## What changed


`src/views/dashboards/superUserDashboard/InvoicingBillingPeriod/views/InvoicingBillingPeriodViewAll.vue`:

- New helper `hasRedFlags(customer)` next to `hasMultipleRedFlags`.
- Fakturer nu button v-if → `tmpFilters.displayRequiresAction &&
(customer.requires_action || hasRedFlags(customer))`.
- The `Gennemgå flag` tag remains gated on `hasMultipleRedFlags` (>= 2)
so the multi-flag warning is still loud.

`tests/unit/invoicing-period-queue-state.behavior.spec.js`:

- New test: `keeps the Fakturer nu button visible for customers with red
flags even when requires_action is false`.
- Sanity-checked: with the fix reverted, the test fails on the
visibility assertion; with the fix in place, it passes alongside the
existing 23 cases.

## Verification

| Check | Result |
|---|---|
| `npm run lint` | ✓ clean |
| `npm run format:tests:check` | ✓ clean |
| `npm run i18n:v2:check` | ✓ pass |
| `npm run test:unit:fast` | ✓ 1348/1348 (incl. new regression test) |
| `npm run build` | ✓ pass |

## Risk

- Surface-only v-if change. No API, data shape, or permission changes.
- Customers with red flags that previously showed neither the button nor
the
  `Gennemgå flag` tag now get the Fakturer nu button back. The button is
still scoped by the existing `v-if/v-else-if` chain (`all booked`, queue
blocked, draft blocked, action), so it does not appear where it
shouldn't.

🤖 Generated with [OpenClaw](https://openclaw.ai)

Co-authored-by: Cleanup Agent <agent@truckwash.io>
This commit is contained in:
Jeppe B
2026-08-10 05:56:42 +00:00
committed by GitHub
co-authored by Cleanup Agent
parent c353bfac3a
commit ba92bc4cb6
2 changed files with 55 additions and 1 deletions
@@ -300,6 +300,11 @@ const getCustomerFlagTabType = (customer: any): CustomerFlagTab => {
return "none";
};
const hasRedFlags = (customer: any): boolean => {
const flagCounts = getCustomerActiveFlagCounts(customer);
return Number(flagCounts?.manual ?? 0) > 0;
};
const hasMultipleRedFlags = (customer: any): boolean => {
const flagCounts = getCustomerActiveFlagCounts(customer);
return Number(flagCounts?.manual ?? 0) >= 2;
@@ -1526,7 +1531,7 @@ const getTransactionQueryParameters = () => {
</div>
<div class="column is-narrow period-customer-card__state" v-else>
<button
v-if="tmpFilters.displayRequiresAction && customer.requires_action"
v-if="tmpFilters.displayRequiresAction && (customer.requires_action || hasRedFlags(customer))"
type="button"
class="button is-small is-dark is-inverted"
:class="{ 'is-loading': isCustomerPeriodActionLoading(customer) }"
@@ -729,6 +729,55 @@ describe("Invoicing period queue state", () => {
expect(customer.get("[data-testid='invoice-period-flags-stub']").text()).toBe("2");
});
it("keeps the Fakturer nu button visible for customers with red flags even when requires_action is false", async () => {
sharedVariablesRef.value = {
types: {
all: [
{
id: 11,
customer_number: 1011,
customer_name: "Red Flag Only Customer",
requires_action: false,
status_indicator: "flag_red",
flag_counts: {
manual: 1,
automatic: 0,
total: 1,
},
flags: [
{
id: 1011,
source: "manual",
status: "active",
target_type: "customer",
target_id: 1011,
customer_number: 1011,
reason: "Manual flag — review required",
},
],
transactions: [
{
id: 8101,
amount: 60,
booked: false,
excluded: false,
invoice_collection_id: 6101,
date: "2026-04-15T10:00:00.000Z",
},
],
},
],
},
};
const wrapper = mountView();
await nextTick();
const customer = wrapper.get("[data-testid='invoicing-period-customer-1011']");
expect(customer.get("[data-testid='invoicing-period-customer-invoice-1011']").text()).toContain("Invoice now");
expect(customer.find("[data-testid='invoicing-period-customer-multiple-red-flag-1011']").exists()).toBe(false);
});
it("keeps collected invoice flags visible even when linked transactions are excluded", async () => {
sharedVariablesRef.value = {
types: {