From bd27bbb073465be77e4e752e6bf9bc4cf5e84c60 Mon Sep 17 00:00:00 2001 From: João Augusto Costa Branco Marado Torres Date: Sun, 27 Jul 2025 12:34:14 -0300 Subject: feat: styling microblogs MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: João Augusto Costa Branco Marado Torres --- src/components/organisms/KeywordsList.astro | 11 ++++- src/components/organisms/RelativeTime.astro | 19 ++++++++ src/components/templates/MicroBlog.astro | 66 +++++++++++++++++++------ src/components/templates/PrevNextNav.astro | 13 +++-- src/layouts/PrevNext.astro | 2 + src/pages/blog/[...date].astro | 6 ++- src/pages/blog/micro/[page].astro | 42 ++++++++++++---- src/pages/index.astro | 2 +- src/utils/datetime.test.ts | 74 ++++++++++++++++++++++++++++- src/utils/datetime.ts | 25 ++++++++++ 10 files changed, 228 insertions(+), 32 deletions(-) create mode 100644 src/components/organisms/RelativeTime.astro (limited to 'src') diff --git a/src/components/organisms/KeywordsList.astro b/src/components/organisms/KeywordsList.astro index d3b9e7f..44c5641 100644 --- a/src/components/organisms/KeywordsList.astro +++ b/src/components/organisms/KeywordsList.astro @@ -7,7 +7,13 @@ const { keywords } = Astro.props; ---

- {keywords.map((x) => #{x})} + { + keywords.map((x) => ( + #{ + x + } + )) + }

diff --git a/src/pages/index.astro b/src/pages/index.astro index bb4108c..baadbc7 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -55,7 +55,7 @@ const micro = await fromPosts( itemtype="http://schema.org/Blog" >

Últimas publicações atualizadas

- {micro &&
} + {micro &&
}
diff --git a/src/utils/datetime.test.ts b/src/utils/datetime.test.ts index 5f0749d..03e2771 100644 --- a/src/utils/datetime.test.ts +++ b/src/utils/datetime.test.ts @@ -1,6 +1,10 @@ import { assertEquals, assertMatch } from "@std/assert"; import { describe, it } from "@std/testing/bdd"; -import { toIso8601Full, toIso8601FullUTC } from "./datetime.ts"; +import { + getRelativeTimeUnit, + toIso8601Full, + toIso8601FullUTC, +} from "./datetime.ts"; describe("toIso8601Full", () => { it("formats current local time with offset", () => { @@ -60,3 +64,71 @@ describe("toIso8601FullUTC", () => { assertMatch(result, /^-\d{6}-03-15T12:00:00\.000Z$/); }); }); + +describe("getRelativeTimeUnit", () => { + const now = new Date(); + + it("returns seconds for differences under a minute", () => { + const future = new Date(now.getTime() + 45 * 1000); + const [value, unit] = getRelativeTimeUnit(future); + + assertEquals(unit, "second"); + assertEquals(value, 1); + }); + + it("returns minutes for differences under an hour but over a minute", () => { + const future = new Date(now.getTime() + 15 * 60 * 1000); + const [value, unit] = getRelativeTimeUnit(future); + + assertEquals(unit, "minute"); + assertEquals(value, 15); + }); + + it("returns hours for differences under a day but over an hour", () => { + const past = new Date(now.getTime() - 3.2 * 60 * 60 * 1000); + const [value, unit] = getRelativeTimeUnit(past); + + assertEquals(unit, "hour"); + assertEquals(value, -3); + }); + + it("returns days for differences under a week but over a day", () => { + const past = new Date(now.getTime() - 2.5 * 24 * 60 * 60 * 1000); + const [value, unit] = getRelativeTimeUnit(past); + + assertEquals(unit, "day"); + assertEquals(value, -3); + }); + + it("returns weeks for differences under a month but over a week", () => { + const future = new Date(now.getTime() + 2.3 * 7 * 24 * 60 * 60 * 1000); + const [value, unit] = getRelativeTimeUnit(future); + + assertEquals(unit, "week"); + assertEquals(value, 2); + }); + + it("returns months for differences under a quarter but over a month", () => { + const past = new Date(now.getTime() - 1.5 * 30 * 24 * 60 * 60 * 1000); + const [value, unit] = getRelativeTimeUnit(past); + + assertEquals(unit, "month"); + assertEquals(value, -2); + }); + + it("returns quarters for differences under a year but over a quarter", () => { + const future = new Date(now.getTime() + 5 * 30 * 24 * 60 * 60 * 1000); + const [value, unit] = getRelativeTimeUnit(future); + + assertEquals(unit, "quarter"); + assertEquals(value, 2); + }); + + it("returns years for differences over a year", () => { + const past = new Date(now.getTime() - 3.4 * 365 * 24 * 60 * 60 * 1000); + const [value, unit] = getRelativeTimeUnit(past); + + assertEquals(unit, "year"); + assertEquals(value, -3); + }); +}); diff --git a/src/utils/datetime.ts b/src/utils/datetime.ts index 3a2cd25..c32fde0 100644 --- a/src/utils/datetime.ts +++ b/src/utils/datetime.ts @@ -41,3 +41,28 @@ export function toIso8601FullUTC(date: Date): string { } const pad = (num: number, len = 2) => String(Math.abs(num)).padStart(len, "0"); + +export function getRelativeTimeUnit( + date: Date, + now: Date = new Date(), +): Parameters { + const diffMs = date.getTime() - now.getTime(); + + const seconds = diffMs / 1000; + const minutes = seconds / 60; + const hours = minutes / 60; + const days = hours / 24; + const weeks = days / 7; + const months = days / 30; + const quarters = months / 3; + const years = days / 365; + + if (Math.abs(years) >= 1) return [Math.round(years), "year"]; + if (Math.abs(quarters) >= 1) return [Math.round(quarters), "quarter"]; + if (Math.abs(months) >= 1) return [Math.round(months), "month"]; + if (Math.abs(weeks) >= 1) return [Math.round(weeks), "week"]; + if (Math.abs(days) >= 1) return [Math.round(days), "day"]; + if (Math.abs(hours) >= 1) return [Math.round(hours), "hour"]; + if (Math.abs(minutes) >= 1) return [Math.round(minutes), "minute"]; + return [Math.round(seconds), "second"]; +} -- cgit v1.2.3