Cutlery/Kyoo
1
0
Fork 0
mirror of https://github.com/zoriya/Kyoo.git synced 2025-06-02 21:24:20 -04:00
Code Issues Packages Projects Releases Wiki Activity

Front: EpisodeLine: format releaseDate using current locale

Browse Source
This commit is contained in:
Arthur Jamet 2023-12-20 16:18:53 +01:00 committed by Zoe Roux
parent 9a55262856
commit 5664465df5
1 changed files with 27 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
front/packages/ui/src/details/episode.tsx
View File

@ -62,10 +62,6 @@ export const displayRuntime = (runtime: number) => {
return `${Math.floor(runtime / 60)}h${runtime % 60}`; return `${Math.floor(runtime / 60)}h${runtime % 60}`;
}; };
export const displayAirDate = (airDate: Date) => {
return airDate.toLocaleDateString("en-US");
};
export const EpisodeBox = ({ export const EpisodeBox = ({
slug, slug,
showSlug, showSlug,
@ -109,6 +105,9 @@ export const EpisodeBox = ({
more: { more: {
opacity: 0, opacity: 0,
}, },
less: {
display: "flex",
},
}, },
fover: { fover: {
self: focusReset, self: focusReset,
@ -121,6 +120,9 @@ export const EpisodeBox = ({
more: { more: {
opacity: 1, opacity: 1,
}, },
less: {
display: "none",
},
}, },
}, },
props, props,
@ -306,16 +308,34 @@ export const EpisodeLine = ({
<View {...css({ flexDirection: "row", alignItems: "center" })}> <View {...css({ flexDirection: "row", alignItems: "center" })}>
{isLoading || {isLoading ||
(runtime && ( (runtime && (
<Skeleton> <Skeleton {...css(["less"])}>
{isLoading || ( {isLoading || (
<SubP {...css({ flexShrink: 0 })}> <SubP>
{[releaseDate ? displayAirDate(releaseDate) : null, displayRuntime(runtime)] {/* Source https://www.i18next.com/translation-function/formatting#datetime */}
{[
releaseDate ? t("{{val, datetime}}", { val: releaseDate }) : null,
displayRuntime(runtime),
]
.filter((item) => item != null) .filter((item) => item != null)
.join(" · ")} .join(" · ")}
</SubP> </SubP>
)} )}
</Skeleton> </Skeleton>
))} ))}
{slug && watchedStatus !== undefined && (
<EpisodesContext
slug={slug}
showSlug={showSlug}
status={watchedStatus}
isOpen={moreOpened}
setOpen={(v) => setMoreOpened(v)}
{...css([
"more",
{ display: "flex", marginLeft: ts(3) },
Platform.OS === "web" && moreOpened && { display: important("flex") },
])}
/>
)}
</View> </View>
</View> </View>
<View {...css({ flexDirection: "row" })}> <View {...css({ flexDirection: "row" })}>
@ -331,20 +351,6 @@ export const EpisodeLine = ({
setDescriptionExpanded((isExpanded) => !isExpanded); setDescriptionExpanded((isExpanded) => !isExpanded);
}} }}
/> />
{slug && watchedStatus !== undefined && (
<EpisodesContext
slug={slug}
showSlug={showSlug}
status={watchedStatus}
isOpen={moreOpened}
setOpen={(v) => setMoreOpened(v)}
{...css([
"more",
{ display: "flex", marginLeft: ts(3) },
Platform.OS === "web" && moreOpened && { display: important("flex") },
])}
/>
)}
</View> </View>
</View> </View>
</Link> </Link>