All files / public/store-details buildTopicCard.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
 
 
 
 
 
 
 
5x
 
 
5x
 
4x
 
 
4x
 
4x
4x
 
4x
 
 
4x
 
4x
 
 
4x
 
4x
 
 
 
 
import { truncateString } from "../../libs/truncate-string";
 
function buildTopicCard(entity: {
  slug: string;
  name: string;
  description: string;
}) {
  const template = document.getElementById(
    "topic-card-template"
  ) as HTMLTemplateElement;
  const clone = template.content.cloneNode(true) as HTMLElement;
 
  const entityCardContainer = clone.querySelector(
    "[data-js='topic-card']"
  ) as HTMLElement;
  entityCardContainer.id = entity.slug;
 
  const entityCard = clone.querySelector("a.p-card--href") as HTMLAnchorElement;
  entityCard.href = `/topics/${entity.slug}`;
 
  const entityCardTitle = clone.querySelector(
    "h3.p-muted-heading"
  ) as HTMLElement;
  entityCardTitle.innerText = entity.name;
 
  const entityCardDescription = clone.querySelector(
    ".p-card__content"
  ) as HTMLElement;
  entityCardDescription.innerText = truncateString(entity.description, 200);
 
  return clone;
}
 
export default buildTopicCard;