Fix Prettier formatting regression and Astro type-check errors

`Render Modal as real markup` (#2742) reformatted ~140 files back to
tabs/semicolons, breaking the Prettier config added by the Astro
quality gates (#2749). Re-run prettier --write to restore it, and fix
the type errors it had been masking: HTMLElement casts and `this`
typing in ChangePasswordModalContent/ConfirmDeleteModalContent
scripts, plain-JS syntax in the inline-injected progress.astro script,
narrowed prop unions in Button/Check/Spinner, nullable icon svg casts
in Icons/Rating, and a duplicate firstLetters/invalid `placeholder`
attribute in Select.astro. Also fix shared/vitest.config.mts's stale
`astro/lib/**/*.test.ts` include glob left over from the shared source
restructure, which made `pnpm test` report zero test files.
This commit is contained in:
codecalm
2026-08-03 01:26:19 +02:00
parent 5246f0b6fd
commit f27c70ad38
166 changed files with 9678 additions and 10612 deletions
+44 -42
View File
@@ -1,57 +1,59 @@
---
import Avatar from '@ui/Avatar.astro';
import CardTitle from '@ui/CardTitle.astro';
import people from '@data/people.json';
import { randomNumber, timeagoLabel } from '@shared/lib/pseudo-random';
import Avatar from '@ui/Avatar.astro'
import CardTitle from '@ui/CardTitle.astro'
import people from '@data/people.json'
import { randomNumber, timeagoLabel } from '@shared/lib/pseudo-random'
interface Person {
full_name?: string;
photo?: string;
[key: string]: unknown;
full_name?: string
photo?: string
[key: string]: unknown
}
interface Props {
limit?: number;
offset?: number;
title?: string;
class?: string;
limit?: number
offset?: number
title?: string
class?: string
}
const { limit = 10, offset = 0, title = 'Top users', class: className } = Astro.props;
const { limit = 10, offset = 0, title = 'Top users', class: className } = Astro.props
const colors = 'green,red,yellow,x,x'.split(',');
const colors = 'green,red,yellow,x,x'.split(',')
const rows = (people as Person[]).slice(offset, offset + limit).map((person, idx) => {
const index = idx + 1; // forloop.index (1-based)
return {
person,
status: colors[randomNumber(index + 5, 0, colors.length - 1)],
timeago: timeagoLabel(index, 6),
};
});
const index = idx + 1 // forloop.index (1-based)
return {
person,
status: colors[randomNumber(index + 5, 0, colors.length - 1)],
timeago: timeagoLabel(index, 6),
}
})
---
<div class={`card${className ? ` ${className}` : ''}`}>
<div class="card-header">
<CardTitle>{title}</CardTitle>
</div>
<div class="card-body">
<div class="row g-3">
{
rows.map((row) => (
<div class="col-6">
<div class="row g-3 align-items-center">
<a href="#" class="col-auto">
<Avatar person={row.person} status={row.status} />
</a>
<div class="col text-truncate">
<a href="#" class="text-reset d-block text-truncate">{row.person.full_name}</a>
<div class="text-secondary text-truncate mt-n1">{row.timeago}</div>
</div>
</div>
</div>
))
}
</div>
</div>
<div class="card-header">
<CardTitle>{title}</CardTitle>
</div>
<div class="card-body">
<div class="row g-3">
{
rows.map((row) => (
<div class="col-6">
<div class="row g-3 align-items-center">
<a href="#" class="col-auto">
<Avatar person={row.person} status={row.status} />
</a>
<div class="col text-truncate">
<a href="#" class="text-reset d-block text-truncate">
{row.person.full_name}
</a>
<div class="text-secondary text-truncate mt-n1">{row.timeago}</div>
</div>
</div>
</div>
))
}
</div>
</div>
</div>