add mockdate for consistent snapshots

.storybook/preview.tsx

@@ -1,7 +1,8 @@
 import '../app/style.css'
-import type { Preview } from '@storybook/react'
 import { resetMockDB } from '#lib/db.mock'
+import type { Preview } from '@storybook/react'
 import { onMockCall } from '@storybook/test'
+import MockDate from 'mockdate'
 
 onMockCall((spy, args) => {
  console.log(spy.name, args)
@@ -18,6 +19,7 @@ const preview: Preview = {
  nextjs: { appDirectory: true },
  },
  beforeEach() {
+ MockDate.set('2024-05-04T14:00:00.000Z')
  resetMockDB()
  },
 }

mocks/notes.ts

@@ -1,20 +1,23 @@
 import { type Note } from '@prisma/client'
 
-export const createNotes: () => Note[] = () => [
- {
- id: '1',
- title: 'Module mocking in Storybook?',
- body: "Yup, that's a thing now! 🎉",
- createdBy: 'storybookjs',
- createdAt: new Date(),
- updatedAt: new Date(),
- },
- {
- id: '2',
- title: 'Hello World',
- body: 'RSC is pretty cool, even cooler that Storybook supports it!',
- createdBy: 'storybookjs',
- createdAt: new Date(),
- updatedAt: new Date(),
- },
-]
+export const createNotes: () => Note[] = () => {
+ const mockedDate = new Date('2024-05-04T14:00:00.000Z')
+ return [
+ {
+ id: '1',
+ title: 'Module mocking in Storybook?',
+ body: "Yup, that's a thing now! 🎉",
+ createdBy: 'storybookjs',
+ createdAt: mockedDate,
+ updatedAt: mockedDate,
+ },
+ {
+ id: '2',
+ title: 'Hello World',
+ body: 'RSC is pretty cool, even cooler that Storybook supports it!',
+ createdBy: 'storybookjs',
+ createdAt: mockedDate,
+ updatedAt: mockedDate,
+ },
+ ]
+}

package.json

@@ -69,6 +69,7 @@
  "eslint-config-next": "14.2.0",
  "eslint-plugin-storybook": "^0.8.0",
  "http-server": "^14.1.1",
+ "mockdate": "^3.0.5",
  "playwright": "^1.43.0",
  "prettier": "^3.2.5",
  "prisma": "^5.11.0",