Merge pull request #59 from ofuton/fix-fromNow-bug

Fix bug that argument passed to fromNow() is wrong

package.json

@@ -1,7 +1,7 @@
 {
   "name": "maimodorun",
   "private": true,
-  "version": "2.0.0",
+  "version": "2.0.1",
   "type": "module",
   "scripts": {
     "dev": "vite",

src/popup/component/Histories.tsx

@@ -90,7 +90,7 @@ const RecordCard: React.FC<RecordProps> = ({ record, clickTrashButtonHandler, re
                                     </div>
                                     <div className="l-histories-list-card-right-bottom-right">
                                         <div className="l-histories-list-card-right-bottom-right-time">
-                                            {fromNow(new Date())}
+                                            {fromNow(record.timestamp)}
                                         </div>
                                     </div>
                                 </div>
@@ -192,6 +192,6 @@ const RecordCardTag: React.FC<RecordCardTagProps> = ({ scope }) => {
   )
 }
 
-const fromNow = (date: Date): string => {
-  return dayjs(date).fromNow()
+const fromNow = (timestamp: number): string => {
+  return dayjs.unix(timestamp).fromNow()
 }

tests/popup/component/Histories.test.tsx

@@ -1,7 +1,8 @@
-import { afterEach, describe, expect, it, vi } from 'vitest'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 import { render, screen, waitFor } from '@testing-library/react'
 import { Histories } from '../../../src/popup/component/Histories.tsx'
 import userEvent from '@testing-library/user-event'
+import dayjs from 'dayjs'
 
 describe('src/popup/component/Histories.tsx', () => {
   afterEach(() => {
@@ -128,4 +129,75 @@ describe('src/popup/component/Histories.tsx', () => {
 
     expect(screen.getByText('tags will be removed')).toBeInTheDocument()
   })
+
+  describe('fromNow()', () => {
+    beforeEach(() => {
+      vi.useFakeTimers()
+    })
+
+    afterEach(() => {
+      // restoring date after each test run
+      vi.useRealTimers()
+    })
+
+    it('数秒前', () => {
+      const now = 1234567890
+      vi.setSystemTime(dayjs.unix(now).toDate())
+      const props = {
+        histories: [{
+          scope: 'thread.root',
+          url: 'https://example.com/1',
+          title: 'Example Title',
+          iconUrl: 'https://example.com/icon',
+          timestamp: now - 5,
+          content: '<span>tags will be removed</span>'
+        }],
+        clickTrashButtonHandler: async (_: string) => {},
+        recoveryRecordHandler: async (_: string) => {}
+      }
+      render(<Histories {...props} />)
+
+      expect(screen.getByText('数秒前')).toBeInTheDocument()
+    })
+
+    it('5分前', () => {
+      const now = 1234567890
+      vi.setSystemTime(dayjs.unix(now).toDate())
+      const props = {
+        histories: [{
+          scope: 'thread.root',
+          url: 'https://example.com/1',
+          title: 'Example Title',
+          iconUrl: 'https://example.com/icon',
+          timestamp: now - 5 * 60,
+          content: '<span>tags will be removed</span>'
+        }],
+        clickTrashButtonHandler: async (_: string) => {},
+        recoveryRecordHandler: async (_: string) => {}
+      }
+      render(<Histories {...props} />)
+
+      expect(screen.getByText('5分前')).toBeInTheDocument()
+    })
+
+    it('1日前', () => {
+      const now = 1234567890
+      vi.setSystemTime(dayjs.unix(now).toDate())
+      const props = {
+        histories: [{
+          scope: 'thread.root',
+          url: 'https://example.com/1',
+          title: 'Example Title',
+          iconUrl: 'https://example.com/icon',
+          timestamp: now - 60 * 60 * 24,
+          content: '<span>tags will be removed</span>'
+        }],
+        clickTrashButtonHandler: async (_: string) => {},
+        recoveryRecordHandler: async (_: string) => {}
+      }
+      render(<Histories {...props} />)
+
+      expect(screen.getByText('1日前')).toBeInTheDocument()
+    })
+  })
 })

vite.config.ts

@@ -8,7 +8,7 @@ import zipPack from 'vite-plugin-zip-pack'
 const manifest = defineManifest({
   manifest_version: 3,
   name: 'Maimodorun',
-  version: '2.0.0',
+  version: '2.0.1',
   description: 'maimodorun: Recovery Tool for Forms on kintone',
   icons: {
     16: 'assets/icon16.png',