diff --git a/src/components/post/post.tsx b/src/components/post/post.tsx
index ae0a09ea..ba216165 100644
--- a/src/components/post/post.tsx
+++ b/src/components/post/post.tsx
@@ -6,7 +6,7 @@ import { useTranslation } from 'react-i18next';
import { isAllView, isPostView, isProfileHiddenView, isSubplebbitView } from '../../lib/utils/view-utils';
import { getCommentMediaInfo, getHasThumbnail } from '../../lib/utils/media-utils';
import { getHostname } from '../../lib/utils/url-utils';
-import { getFormattedTimeAgo } from '../../lib/utils/time-utils';
+import { getFormattedTimeAgo, formatLocalizedUTCTimestamp } from '../../lib/utils/time-utils';
import CommentEditForm from '../comment-edit-form';
import ExpandButton from './expand-button';
import Expando from './expando';
@@ -105,7 +105,9 @@ const Post = ({ index, post = {} }: PostProps) => {
const { displayName, shortAddress } = author || {};
const { shortAuthorAddress, authorAddressChanged } = useAuthorAddress({ comment: post });
- const { t } = useTranslation();
+ const { t, i18n } = useTranslation();
+ const { language } = i18n;
+ const postDate = formatLocalizedUTCTimestamp(timestamp, language);
const params = useParams();
const location = useLocation();
const subplebbit = useSubplebbit({ subplebbitAddress });
@@ -225,7 +227,7 @@ const Post = ({ index, post = {} }: PostProps) => {
/>
)}
- {t('submitted')} {getFormattedTimeAgo(timestamp)}{' '}
+ {t('submitted')}
{getFormattedTimeAgo(timestamp)}{' '}
{edit && isInPostView &&
{t('last_edited', { timestamp: getFormattedTimeAgo(edit.timestamp) })}} {t('post_by')}
{scoreString}{' '}
- {getFormattedTimeAgo(timestamp)}
+ {getFormattedTimeAgo(timestamp)}
{edit && {t('edited_timestamp', { timestamp: getFormattedTimeAgo(edit.timestamp) })}}
{' '}
{pinned &&
- {t('stickied_comment')}}
diff --git a/src/lib/utils/time-utils.ts b/src/lib/utils/time-utils.ts
index 7adc85cc..00e1433f 100644
--- a/src/lib/utils/time-utils.ts
+++ b/src/lib/utils/time-utils.ts
@@ -1,6 +1,10 @@
import i18next from 'i18next';
-export const getFormattedTimeAgo = (unixTimestamp: number): string => {
+export const getFormattedTimeAgo = (unixTimestamp: number | undefined): string => {
+ if (!unixTimestamp || isNaN(unixTimestamp)) {
+ return '-';
+ }
+
const currentTime = Date.now() / 1000;
const timeDifference = currentTime - unixTimestamp;
const t = i18next.t;
@@ -35,7 +39,10 @@ export const getFormattedTimeAgo = (unixTimestamp: number): string => {
return t('time_x_years_ago', { count: Math.floor(timeDifference / 31104000) });
};
-export const getFormattedTimeDuration = (unixTimestamp: number): string => {
+export const getFormattedTimeDuration = (unixTimestamp: number | undefined): string => {
+ if (!unixTimestamp || isNaN(unixTimestamp)) {
+ return '-';
+ }
const currentTime = Date.now() / 1000;
const timeDifference = currentTime - unixTimestamp;
const t = i18next.t;
@@ -70,7 +77,32 @@ export const getFormattedTimeDuration = (unixTimestamp: number): string => {
return t('time_x_years', { count: Math.floor(timeDifference / 31104000) });
};
-export const getFormattedDate = (unixTimestamp: number, locale: string): string => {
+export const getFormattedDate = (unixTimestamp: number | undefined, locale: string): string => {
+ if (!unixTimestamp || isNaN(unixTimestamp)) {
+ return '-';
+ }
const date = new Date(unixTimestamp * 1000);
return new Intl.DateTimeFormat(locale, { day: 'numeric', month: 'short', year: 'numeric' }).format(date);
};
+
+export const formatLocalizedUTCTimestamp = (unixTimestamp: number | undefined, locale: string): string => {
+ if (!unixTimestamp || isNaN(unixTimestamp)) {
+ return '-';
+ }
+ const date = new Date(unixTimestamp * 1000);
+ return (
+ new Intl.DateTimeFormat(locale, {
+ weekday: 'short',
+ year: 'numeric',
+ month: 'short',
+ day: '2-digit',
+ hour: '2-digit',
+ minute: '2-digit',
+ second: '2-digit',
+ timeZone: 'UTC',
+ hour12: false,
+ })
+ .format(date)
+ .replace(/,/g, '') + ' UTC'
+ );
+};
diff --git a/src/views/home/home.tsx b/src/views/home/home.tsx
index 67a9302c..c40df127 100644
--- a/src/views/home/home.tsx
+++ b/src/views/home/home.tsx
@@ -41,6 +41,15 @@ const Home = () => {
const currentTimeFilterName = params.timeFilterName || timeFilterName;
+ const [showMorePostsSuggestion, setShowMorePostsSuggestion] = useState(false);
+ useEffect(() => {
+ const timer = setTimeout(() => {
+ setShowMorePostsSuggestion(true);
+ }, 5000);
+
+ return () => clearTimeout(timer);
+ }, []);
+
const Footer = () => {
let footerContent;
if (feed.length === 0) {
@@ -93,7 +102,6 @@ const Home = () => {
};
const virtuosoRef = useRef
(null);
- const [showMorePostsSuggestion, setShowMorePostsSuggestion] = useState(false);
useEffect(() => {
const setLastVirtuosoState = () => {
@@ -109,14 +117,6 @@ const Home = () => {
const lastVirtuosoState = lastVirtuosoStates?.[sortType + timeFilterName];
- useEffect(() => {
- const timer = setTimeout(() => {
- setShowMorePostsSuggestion(true);
- }, 5000);
-
- return () => clearTimeout(timer);
- }, []);
-
useEffect(() => {
document.title = `Seedit`;
}, [t]);