mirror of
https://github.com/sergeyyarkov/yarkov.tech.git
synced 2026-10-11 10:29:21 +03:00
35 lines
1.0 KiB
TypeScript
35 lines
1.0 KiB
TypeScript
/* eslint-disable solid/reactivity */
|
|
import type { Component } from "solid-js";
|
|
import { createDateFormatter } from "@utils/date";
|
|
import "./ArticleItem.scss";
|
|
import { DEFAULT_LANGUAGE } from "@root/config";
|
|
|
|
export type ArticleItemProps = {
|
|
data: ArticleType;
|
|
lang: string;
|
|
};
|
|
|
|
export const ArticleItem: Component<ArticleItemProps> = (props) => {
|
|
const isNonDefaultLanguage = props.data.lang && props.data.lang !== props.lang;
|
|
const hrefLangPrefix = props.data.lang && props.data.lang !== DEFAULT_LANGUAGE ? `/${props.data.lang}` : "";
|
|
return (
|
|
<article class="article-item">
|
|
<a
|
|
href={`${hrefLangPrefix}/blog/${new Date(props.data.published_at).toLocaleDateString("en-CA")}/${
|
|
props.data.slug
|
|
}/`}
|
|
>
|
|
<div class="flex">
|
|
<h3>{props.data.title}</h3>
|
|
{isNonDefaultLanguage && <sup>{props.data.lang.toLocaleUpperCase()}</sup>}
|
|
</div>
|
|
<p>
|
|
<time datetime={props.data.published_at.toString()}>
|
|
{createDateFormatter(props.lang).format(new Date(props.data.published_at))}
|
|
</time>
|
|
</p>
|
|
</a>
|
|
</article>
|
|
);
|
|
};
|