enhancement: update time format

sendbird · Dec 20, 2022 · 708be93 · 708be93
1 parent 2bafc8f
commit 708be93
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 16 deletions.
diff --git a/packages/uikit-react-native/src/localization/StringSet.type.ts b/packages/uikit-react-native/src/localization/StringSet.type.ts
@@ -9,11 +9,11 @@ import type {
  SendbirdUser,
 } from '@sendbird/uikit-utils';
 import {
- dateSeparator,
+ getDateSeparatorFormat,
  getGroupChannelLastMessage,
  getGroupChannelPreviewTime,
  getGroupChannelTitle,
- messageTime,
+ getMessageTimeFormat,
 } from '@sendbird/uikit-utils';
 
 /**
@@ -250,10 +250,10 @@ export const createBaseStringSet = ({ dateLocale, overrides }: StringSetCreateOp
  HEADER_TITLE: (currentUserId, channel) =>
  getGroupChannelTitle(currentUserId, channel, USER_NO_NAME, CHANNEL_NO_MEMBERS),
  LIST_BANNER_FROZEN: 'Channel is frozen',
- LIST_DATE_SEPARATOR: (date, locale) => dateSeparator(date, locale ?? dateLocale),
+ LIST_DATE_SEPARATOR: (date, locale) => getDateSeparatorFormat(date, locale ?? dateLocale),
  LIST_BUTTON_NEW_MSG: (newMessages) => `${newMessages.length} new messages`,
 
- MESSAGE_BUBBLE_TIME: (message, locale) => messageTime(new Date(message.createdAt), locale ?? dateLocale),
+ MESSAGE_BUBBLE_TIME: (message, locale) => getMessageTimeFormat(new Date(message.createdAt), locale ?? dateLocale),
  MESSAGE_BUBBLE_FILE_TITLE: (message) => message.name,
  MESSAGE_BUBBLE_EDITED_POSTFIX: ' (edited)',
  MESSAGE_BUBBLE_UNKNOWN_TITLE: () => '(Unknown message type)',
@@ -406,7 +406,7 @@ export const createBaseStringSet = ({ dateLocale, overrides }: StringSetCreateOp
  },
  FILE_VIEWER: {
  TITLE: (message) => message.sender?.nickname || USER_NO_NAME,
- SUBTITLE: (message) => messageTime(new Date(message.createdAt), dateLocale),
+ SUBTITLE: (message) => getMessageTimeFormat(new Date(message.createdAt), dateLocale),
  },
  PLACEHOLDER: {
  NO_BANNED_USERS: 'No banned users',

diff --git a/packages/uikit-utils/src/sendbird/message.ts b/packages/uikit-utils/src/sendbird/message.ts
@@ -7,7 +7,7 @@ import type {
  SendbirdReaction,
  SendbirdSendableMessage,
 } from '../types';
-import { messageTime } from '../ui-format/common';
+import { getMessageTimeFormat } from '../ui-format/common';
 
 export function isNewMessage(msg: SendbirdMessage, currentUserId?: string) {
  const myMessage = isMyMessage(msg, currentUserId);
@@ -69,7 +69,7 @@ export function calcMessageGrouping(
  if (!prev) return false;
  if (curr.isAdminMessage()) return false;
  if (!hasSameSender(curr, prev)) return false;
- if (messageTime(new Date(curr.createdAt)) !== messageTime(new Date(prev.createdAt))) return false;
+ if (getMessageTimeFormat(new Date(curr.createdAt)) !== getMessageTimeFormat(new Date(prev.createdAt))) return false;
  return true;
  };
 
@@ -78,7 +78,7 @@ export function calcMessageGrouping(
  if (!next) return false;
  if (curr.isAdminMessage()) return false;
  if (!hasSameSender(curr, next)) return false;
- if (messageTime(new Date(curr.createdAt)) !== messageTime(new Date(next.createdAt))) return false;
+ if (getMessageTimeFormat(new Date(curr.createdAt)) !== getMessageTimeFormat(new Date(next.createdAt))) return false;
  return true;
  };
 

diff --git a/packages/uikit-utils/src/ui-format/common.ts b/packages/uikit-utils/src/ui-format/common.ts
@@ -1,5 +1,5 @@
 import type { Locale } from 'date-fns';
-import format from 'date-fns/format';
+import { format, isThisYear } from 'date-fns';
 
 type TruncateMode = 'head' | 'mid' | 'tail';
 type TruncateOption = { mode: TruncateMode; maxLen: number; separator: string };
@@ -58,8 +58,9 @@ export const truncatedCount = (count: number, MAX = 99, MAX_SUFFIX = '+') => {
  * @param {Locale} [locale]
  * @returns {string}
  * */
-export const dateSeparator = (date: Date, locale?: Locale): string => {
- return format(date, 'E, LLL dd', { locale });
+export const getDateSeparatorFormat = (date: Date, locale?: Locale): string => {
+ if (isThisYear(date)) return format(date, 'MMM dd, yyyy', { locale });
+ return format(date, 'E, MMM dd', { locale });
 };
 
 /**
@@ -69,6 +70,6 @@ export const dateSeparator = (date: Date, locale?: Locale): string => {
  * @param {Locale} [locale]
  * @returns {string}
  * */
-export const messageTime = (date: Date, locale?: Locale): string => {
+export const getMessageTimeFormat = (date: Date, locale?: Locale): string => {
  return format(date, 'p', { locale });
 };
diff --git a/packages/uikit-utils/src/ui-format/groupChannel.ts b/packages/uikit-utils/src/ui-format/groupChannel.ts
@@ -1,7 +1,5 @@
 import type { Locale } from 'date-fns';
-import format from 'date-fns/format';
-import isToday from 'date-fns/isToday';
-import isYesterday from 'date-fns/isYesterday';
+import { format, isThisYear, isToday, isYesterday } from 'date-fns';
 
 import type { SendbirdGroupChannel } from '../types';
 import { truncate } from './common';
@@ -23,9 +21,12 @@ export const getGroupChannelTitle = (
 
 export const getGroupChannelPreviewTime = (channel: SendbirdGroupChannel, locale?: Locale) => {
  const timestamp = channel.lastMessage?.createdAt || channel.joinedAt * 1000 || channel.createdAt;
+
  if (isToday(timestamp)) return format(timestamp, 'p', { locale });
  if (isYesterday(timestamp)) return 'Yesterday';
- return format(timestamp, 'MMM dd', { locale });
+ if (isThisYear(timestamp)) return format(timestamp, 'MMM dd', { locale });
+
+ return format(timestamp, 'yyyy/MM/dd', { locale });
 };
 
 export const getGroupChannelLastMessage = (channel: SendbirdGroupChannel, EMPTY_MESSAGE = '', MAX_LEN = 15) => {