mirror of
https://github.com/tabler/tabler.git
synced 2026-08-29 13:21:29 +04:00
codecalm
f27c70ad38
`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.
58 lines
1.5 KiB
Plaintext
58 lines
1.5 KiB
Plaintext
---
|
|
// `photo` and `index` are passed explicitly from the parent loop.
|
|
import Avatar from '@ui/Avatar.astro'
|
|
import Icon from '@ui/Icon.astro'
|
|
import { randomNumber, timeagoLabel } from '@shared/lib/pseudo-random'
|
|
|
|
interface Photo {
|
|
file: string
|
|
[key: string]: unknown
|
|
}
|
|
|
|
interface Person {
|
|
full_name?: string
|
|
photo?: string
|
|
[key: string]: unknown
|
|
}
|
|
|
|
interface Props {
|
|
photo: Photo
|
|
person: Person
|
|
/** 1-based loop index — seeds the deterministic pseudo-random values */
|
|
index: number
|
|
hideLikes?: boolean
|
|
}
|
|
|
|
const { photo, person, index, hideLikes } = Astro.props
|
|
|
|
// Heart filled when (index > 2 && index < 9) || index === 10.
|
|
const heartClass = (index > 2 && index < 9) || index === 10 ? 'icon-filled text-red' : undefined
|
|
---
|
|
|
|
<div class="card card-sm">
|
|
<a href="#" class="d-block"><img src={`./static/photos/${photo.file}`} class="card-img-top" /></a>
|
|
<div class="card-body">
|
|
<div class="d-flex align-items-center">
|
|
<Avatar person={person} class="me-3 rounded" />
|
|
<div>
|
|
<div>{person.full_name}</div>
|
|
<div class="text-secondary">{timeagoLabel(index, 10)}</div>
|
|
</div>
|
|
{
|
|
!hideLikes && (
|
|
<div class="ms-auto">
|
|
<a href="#" class="text-secondary">
|
|
<Icon name="eye" />
|
|
{randomNumber(index, 300, 600)}
|
|
</a>
|
|
<a href="#" class="ms-3 text-secondary">
|
|
<Icon name="heart" class={heartClass} />
|
|
{randomNumber(index, 20, 100)}
|
|
</a>
|
|
</div>
|
|
)
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|