feat: Show date along with time in messages (#1748)

app/javascript/dashboard/components/widgets/conversation/Message.vue

@@ -131,7 +131,7 @@ export default {
       return !this.data.message_type ? 'left' : 'right';
     },
     readableTime() {
-      return this.messageStamp(this.data.created_at);
+      return this.messageStamp(this.data.created_at, 'LLL d, h:mm a');
     },
     isBubble() {
       return [0, 1, 3].includes(this.data.message_type);

app/javascript/dashboard/mixins/specs/time.spec.js

@@ -0,0 +1,10 @@
+import TimeMixin from '../time';
+
+describe('#messageStamp', () => {
+  it('returns correct value', () => {
+    expect(TimeMixin.methods.messageStamp(1612971343)).toEqual('3:35 PM');
+    expect(TimeMixin.methods.messageStamp(1612971343, 'LLL d, h:mm a')).toEqual(
+      'Feb 10, 3:35 PM'
+    );
+  });
+});

app/javascript/dashboard/mixins/time.js

@@ -1,13 +1,12 @@
-/* eslint no-console: 0 */
 import fromUnixTime from 'date-fns/fromUnixTime';
 import format from 'date-fns/format';
 import formatDistanceToNow from 'date-fns/formatDistanceToNow';
 
 export default {
   methods: {
-    messageStamp(time) {
+    messageStamp(time, dateFormat = 'h:mm a') {
       const unixTime = fromUnixTime(time);
-      return format(unixTime, 'h:mm a');
+      return format(unixTime, dateFormat);
     },
     dynamicTime(time) {
       const unixTime = fromUnixTime(time);

jest.config.js

@@ -30,4 +30,5 @@ module.exports = {
     '**/app/javascript/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)',
   ],
   testURL: 'http://localhost/',
+  globalSetup: './jest.setup.js',
 };

jest.setup.js

@@ -0,0 +1,3 @@
+module.exports = async () => {
+  process.env.TZ = 'UTC';
+};