commit 4133128c4fd795bb3fb34e2f49e43c2f53af72ef
parent 3bb3d4c82535e4c3bc946355967d40683a15fd1c
Author: Sebastian <sebasjm@gmail.com>
Date: Sun, 30 Jun 2024 16:37:01 -0300
time to web-util
Diffstat:
8 files changed, 89 insertions(+), 91 deletions(-)
diff --git a/packages/bank-ui/src/components/Cashouts/views.tsx b/packages/bank-ui/src/components/Cashouts/views.tsx
@@ -24,6 +24,7 @@ import {
import {
Attention,
Loading,
+ Time,
useTranslationContext,
} from "@gnu-taler/web-util/browser";
import { format } from "date-fns";
@@ -31,7 +32,6 @@ import { Fragment, VNode, h } from "preact";
import { useConversionInfo } from "../../hooks/regional.js";
import { RenderAmount } from "../../pages/PaytoWireTransferForm.js";
import { ErrorLoadingWithDebug } from "../ErrorLoadingWithDebug.js";
-import { Time } from "../Time.js";
import { State } from "./index.js";
export function FailedView({ error }: State.Failed) {
@@ -160,7 +160,6 @@ export function ReadyView({
timestamp={AbsoluteTime.fromProtocolTimestamp(
item.creation_time,
)}
- // relative={Duration.fromSpec({ days: 1 })}
/>
</div>
{
diff --git a/packages/bank-ui/src/components/Time.tsx b/packages/bank-ui/src/components/Time.tsx
@@ -1,80 +0,0 @@
-/*
- This file is part of GNU Taler
- (C) 2022-2024 Taler Systems S.A.
-
- GNU Taler is free software; you can redistribute it and/or modify it under the
- terms of the GNU General Public License as published by the Free Software
- Foundation; either version 3, or (at your option) any later version.
-
- GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
- WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
- A PARTICULAR PURPOSE. See the GNU General Public License for more details.
-
- You should have received a copy of the GNU General Public License along with
- GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
- */
-
-import { AbsoluteTime, Duration } from "@gnu-taler/taler-util";
-import { useTranslationContext } from "@gnu-taler/web-util/browser";
-import {
- formatISO,
- format,
- formatDuration,
- intervalToDuration,
-} from "date-fns";
-import { Fragment, h, VNode } from "preact";
-
-/**
- *
- * @param timestamp time to be formatted
- * @param relative duration threshold, if the difference is lower
- * the timestamp will be formatted as relative time from "now"
- *
- * @returns
- */
-export function Time({
- timestamp,
- relative,
- format: formatString,
-}: {
- timestamp: AbsoluteTime | undefined;
- relative?: Duration;
- format: string;
-}): VNode {
- const { i18n, dateLocale } = useTranslationContext();
- if (!timestamp) return <Fragment />;
-
- if (timestamp.t_ms === "never") {
- return <time>{i18n.str`never`}</time>;
- }
-
- const now = AbsoluteTime.now();
- const diff = AbsoluteTime.difference(now, timestamp);
- if (relative && now.t_ms !== "never" && Duration.cmp(diff, relative) === -1) {
- const d = intervalToDuration({
- start: now.t_ms,
- end: timestamp.t_ms,
- });
- d.seconds = 0;
- const duration = formatDuration(d, { locale: dateLocale });
- const isFuture = AbsoluteTime.cmp(now, timestamp) < 0;
- if (isFuture) {
- return (
- <time dateTime={formatISO(timestamp.t_ms)}>
- <i18n.Translate>in {duration}</i18n.Translate>
- </time>
- );
- } else {
- return (
- <time dateTime={formatISO(timestamp.t_ms)}>
- <i18n.Translate>{duration} ago</i18n.Translate>
- </time>
- );
- }
- }
- return (
- <time dateTime={formatISO(timestamp.t_ms)}>
- {format(timestamp.t_ms, formatString, { locale: dateLocale })}
- </time>
- );
-}
diff --git a/packages/bank-ui/src/components/Transactions/views.tsx b/packages/bank-ui/src/components/Transactions/views.tsx
@@ -16,13 +16,13 @@
import {
Attention,
+ Time,
useBankCoreApiContext,
useTranslationContext,
} from "@gnu-taler/web-util/browser";
import { format } from "date-fns";
import { Fragment, VNode, h } from "preact";
import { RenderAmount } from "../../pages/PaytoWireTransferForm.js";
-import { Time } from "../Time.js";
import { State } from "./index.js";
export function ReadyView({
diff --git a/packages/bank-ui/src/pages/ShowNotifications.tsx b/packages/bank-ui/src/pages/ShowNotifications.tsx
@@ -14,9 +14,8 @@
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
*/
-import { useNotifications } from "@gnu-taler/web-util/browser";
+import { Time, useNotifications } from "@gnu-taler/web-util/browser";
import { VNode, h } from "preact";
-import { Time } from "../components/Time.js";
export function ShowNotifications(): VNode {
const ns = useNotifications();
diff --git a/packages/bank-ui/src/pages/SolveChallengePage.tsx b/packages/bank-ui/src/pages/SolveChallengePage.tsx
@@ -30,7 +30,10 @@ import {
Attention,
Loading,
LocalNotificationBanner,
+ RouteDefinition,
ShowInputErrorLabel,
+ Time,
+ useBankCoreApiContext,
useLocalNotification,
useNavigationContext,
useTranslationContext,
@@ -38,17 +41,13 @@ import {
import { Fragment, VNode, h } from "preact";
import { useEffect, useState } from "preact/hooks";
import { ErrorLoadingWithDebug } from "../components/ErrorLoadingWithDebug.js";
-import { Time } from "../components/Time.js";
-import { useBankCoreApiContext } from "@gnu-taler/web-util/browser";
import { useWithdrawalDetails } from "../hooks/account.js";
import { ChallengeInProgess, useBankState } from "../hooks/bank-state.js";
import { useConversionInfo } from "../hooks/regional.js";
import { useSessionState } from "../hooks/session.js";
-import { RouteDefinition } from "@gnu-taler/web-util/browser";
import { undefinedIfEmpty } from "../utils.js";
import { RenderAmount } from "./PaytoWireTransferForm.js";
import { OperationNotFound } from "./WithdrawalQRCode.js";
-import { IdempotencyRetry } from "../../../taler-util/lib/http-client/utils.js";
const TAN_PREFIX = "T-";
const TAN_REGEX = /^([Tt](-)?)?[0-9]*$/;
diff --git a/packages/bank-ui/src/pages/regional/ShowCashoutDetails.tsx b/packages/bank-ui/src/pages/regional/ShowCashoutDetails.tsx
@@ -23,13 +23,13 @@ import {
import {
Attention,
Loading,
+ RouteDefinition,
+ Time,
useTranslationContext,
} from "@gnu-taler/web-util/browser";
import { VNode, h } from "preact";
import { ErrorLoadingWithDebug } from "../../components/ErrorLoadingWithDebug.js";
-import { Time } from "../../components/Time.js";
import { useCashoutDetails, useConversionInfo } from "../../hooks/regional.js";
-import { RouteDefinition } from "@gnu-taler/web-util/browser";
import { RenderAmount } from "../PaytoWireTransferForm.js";
interface Props {
diff --git a/packages/web-util/src/components/Time.tsx b/packages/web-util/src/components/Time.tsx
@@ -0,0 +1,80 @@
+/*
+ This file is part of GNU Taler
+ (C) 2022-2024 Taler Systems S.A.
+
+ GNU Taler is free software; you can redistribute it and/or modify it under the
+ terms of the GNU General Public License as published by the Free Software
+ Foundation; either version 3, or (at your option) any later version.
+
+ GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
+ WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
+ A PARTICULAR PURPOSE. See the GNU General Public License for more details.
+
+ You should have received a copy of the GNU General Public License along with
+ GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
+ */
+
+import { AbsoluteTime, Duration } from "@gnu-taler/taler-util";
+import {
+ formatISO,
+ format,
+ formatDuration,
+ intervalToDuration,
+} from "date-fns";
+import { Fragment, h, VNode } from "preact";
+import { useTranslationContext } from "../index.browser.js";
+
+/**
+ *
+ * @param timestamp time to be formatted
+ * @param relative duration threshold, if the difference is lower
+ * the timestamp will be formatted as relative time from "now"
+ *
+ * @returns
+ */
+export function Time({
+ timestamp,
+ relative,
+ format: formatString,
+}: {
+ timestamp: AbsoluteTime | undefined;
+ relative?: Duration;
+ format: string;
+}): VNode {
+ const { i18n, dateLocale } = useTranslationContext();
+ if (!timestamp) return <Fragment />;
+
+ if (timestamp.t_ms === "never") {
+ return <time>{i18n.str`never`}</time>;
+ }
+
+ const now = AbsoluteTime.now();
+ const diff = AbsoluteTime.difference(now, timestamp);
+ if (relative && now.t_ms !== "never" && Duration.cmp(diff, relative) === -1) {
+ const d = intervalToDuration({
+ start: now.t_ms,
+ end: timestamp.t_ms,
+ });
+ d.seconds = 0;
+ const duration = formatDuration(d, { locale: dateLocale });
+ const isFuture = AbsoluteTime.cmp(now, timestamp) < 0;
+ if (isFuture) {
+ return (
+ <time dateTime={formatISO(timestamp.t_ms)}>
+ <i18n.Translate>in {duration}</i18n.Translate>
+ </time>
+ );
+ } else {
+ return (
+ <time dateTime={formatISO(timestamp.t_ms)}>
+ <i18n.Translate>{duration} ago</i18n.Translate>
+ </time>
+ );
+ }
+ }
+ return (
+ <time dateTime={formatISO(timestamp.t_ms)}>
+ {format(timestamp.t_ms, formatString, { locale: dateLocale })}
+ </time>
+ );
+}
diff --git a/packages/web-util/src/components/index.ts b/packages/web-util/src/components/index.ts
@@ -10,3 +10,4 @@ export * from "./Button.js";
export * from "./ShowInputErrorLabel.js";
export * from "./NotificationBanner.js";
export * from "./ToastBanner.js";
+export * from "./Time.js";
