fix: allow payouts that go over the tax limit by prefilling form (#4478)

* feat: start on fix

* fix: withdraw btn

* fix: lint issues

* fix: use button rather than span

* fix: lint issues

---------

Co-authored-by: --global <--global>
This commit is contained in:
Calum H.
2025-10-07 17:33:50 +01:00
committed by GitHub
parent cb5600ad45
commit 3c578108de
3 changed files with 90 additions and 31 deletions

View File

@@ -68,25 +68,15 @@
</div>
</div>
<div class="input-group mt-4">
<span
:class="{
'disabled-cursor-wrapper': userBalance.available < minWithdraw || blockedByTax,
}"
>
<ButtonStyled color="brand">
<nuxt-link
:aria-disabled="
userBalance.available < minWithdraw || blockedByTax ? 'true' : 'false'
"
:class="{ 'disabled-link': userBalance.available < minWithdraw || blockedByTax }"
:disabled="!!(userBalance.available < minWithdraw || blockedByTax) || null"
:tabindex="userBalance.available < minWithdraw || blockedByTax ? -1 : undefined"
to="/dashboard/revenue/withdraw"
>
<TransferIcon /> Withdraw
</nuxt-link>
</ButtonStyled>
</span>
<ButtonStyled color="brand">
<nuxt-link
v-if="!(userBalance.available < minWithdraw || blockedByTax)"
to="/dashboard/revenue/withdraw"
>
<TransferIcon /> Withdraw
</nuxt-link>
<button v-else class="disabled"><TransferIcon /> Withdraw</button>
</ButtonStyled>
<ButtonStyled>
<NuxtLink to="/dashboard/revenue/transfers">
<HistoryIcon />
@@ -176,9 +166,19 @@ const { addNotification, handleError } = injectNotificationManager()
const auth = await useAuth()
const minWithdraw = ref(0.01)
const { data: userBalance } = await useAsyncData(`payout/balance`, () =>
useBaseFetch(`payout/balance`, { apiVersion: 3 }),
)
const { data: userBalance } = await useAsyncData(`payout/balance`, async () => {
const response = await useBaseFetch(`payout/balance`, { apiVersion: 3 })
return {
...response,
available: parseFloat(response.available),
withdrawn_lifetime: parseFloat(response.withdrawn_lifetime),
withdrawn_ytd: parseFloat(response.withdrawn_ytd),
pending: parseFloat(response.pending),
dates: Object.fromEntries(
Object.entries(response.dates).map(([date, value]) => [date, parseFloat(value)]),
),
}
})
const blockedByTax = computed(() => {
const status = userBalance.value?.form_completion_status ?? 'unknown'
@@ -250,14 +250,6 @@ strong {
font-weight: 500;
}
.disabled-cursor-wrapper {
cursor: not-allowed;
}
.disabled-link {
pointer-events: none;
}
.grid-display {
grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}