mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-23 15:36:33 +00:00
Maurice
41 lines
1.7 KiB
TypeScript
41 lines
1.7 KiB
TypeScript
import type { AssistantMessage, AssistantPlaces } from '@trek/shared';
|
|
|
|
import { useTranslation } from '../../i18n';
|
|
import AssistantPlaceCard from './AssistantPlaceCard';
|
|
import { suggestedFromStrip } from './assistantParts';
|
|
import CardStrip from './cards/parts/CardStrip';
|
|
import { useAssistantPlaceStrip } from './useAssistantPlaceStrip';
|
|
|
|
/** Cards the strip shows, every one the server sends; what it left out is counted on the tile at its end. */
|
|
const SHOWN = 60;
|
|
|
|
/**
|
|
* The places a search found, as one row of cards to swipe or scroll through
|
|
* (the cards' strip: the next card peeks in, the edges fade where there is
|
|
* more, and the desktop head names the row and pages it by whole cards).
|
|
* Every card the step found, then a tile counting what the server left out.
|
|
*/
|
|
export default function AssistantPlaceStrip({ found, message }: { found: AssistantPlaces; message: AssistantMessage }) {
|
|
const { t } = useTranslation();
|
|
const strip = useAssistantPlaceStrip();
|
|
const rest = Math.max(0, found.places.length - SHOWN) + found.more;
|
|
const total = found.places.length + found.more;
|
|
return (
|
|
<CardStrip label={t('assistant.place.strip')} count={total} watch={found}>
|
|
{found.places.slice(0, SHOWN).map((place) => (
|
|
<AssistantPlaceCard
|
|
key={place.ref}
|
|
place={place}
|
|
strip={strip}
|
|
suggested={suggestedFromStrip(message, place)}
|
|
/>
|
|
))}
|
|
{rest > 0 && (
|
|
<li className="flex w-24 flex-shrink-0 snap-start items-center justify-center rounded-2xl border border-dashed border-edge-faint px-2 text-center text-caption text-content-muted">
|
|
{t('assistant.place.more', { count: rest })}
|
|
</li>
|
|
)}
|
|
</CardStrip>
|
|
);
|
|
}
|