create-foldkit-app 0.32.1 → 0.33.0

package/dist/templates/examples/kanban/src/view/view.ts

@@ -0,0 +1,71 @@
+import { Array, Option, pipe } from 'effect'
+import { type Document, HtmlBuilder } from 'foldkit/html'
+
+import { DragAndDrop } from '@foldkit/ui'
+
+import { Message } from '../message'
+import type { Model } from '../model'
+import { ghostCardView } from './card'
+import { columnView } from './column'
+
+const findDraggedCard = (model: Model) =>
+  pipe(
+    model.dragAndDrop,
+    DragAndDrop.maybeDraggedItemId,
+    Option.flatMap(cardId =>
+      pipe(
+        model.columns,
+        Array.flatMap(({ cards }) => cards),
+        Array.findFirst(({ id }) => id === cardId),
+      ),
+    ),
+  )
+
+const ghostElement = (model: Model, h: HtmlBuilder<Message>) =>
+  pipe(
+    DragAndDrop.ghostStyle(model.dragAndDrop),
+    Option.flatMap(ghostStyle =>
+      Option.map(findDraggedCard(model), card => ({ ghostStyle, card })),
+    ),
+    Option.match({
+      onNone: () => h.empty,
+      onSome: ({ ghostStyle, card }) =>
+        h.div(
+          [h.Style(ghostStyle), h.Class('w-64'), h.AriaHidden(true)],
+          [ghostCardView(card, h)],
+        ),
+    }),
+  )
+
+export const view = (model: Model, h: HtmlBuilder<Message>): Document => ({
+  title: 'Kanban Board',
+  body: h.div(
+    [h.Class('flex flex-col min-h-screen bg-gray-100')],
+    [
+      h.div(
+        [h.Class('px-6 py-4 bg-white border-b border-gray-200')],
+        [
+          h.h1(
+            [h.Class('text-lg font-semibold text-gray-900')],
+            ['Kanban Board'],
+          ),
+        ],
+      ),
+      h.div(
+        [
+          h.Class(
+            'flex-1 p-6 grid grid-cols-[repeat(auto-fit,minmax(16rem,1fr))] gap-6 items-start',
+          ),
+        ],
+        Array.map(model.columns, column =>
+          columnView(model, column, message => message, h),
+        ),
+      ),
+      ghostElement(model, h),
+      h.div(
+        [h.Class('sr-only'), h.AriaLive('assertive')],
+        [model.announcement],
+      ),
+    ],
+  ),
+})

package/dist/templates/examples/managed-resource-layer/package.json

@@ -18,9 +18,7 @@
     "@foldkit/devtools": "workspace:*",
     "@foldkit/vite-plugin": "workspace:*",
     "@tailwindcss/vite": "^4.3.3",
-    "@trivago/prettier-plugin-sort-imports": "^6.0.2",
     "happy-dom": "^20.11.13",
-    "prettier": "^3.9.6",
     "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "vite": "^8.2.2",

package/dist/templates/examples/map/package.json

@@ -20,9 +20,7 @@
     "@foldkit/devtools": "workspace:*",
     "@foldkit/vite-plugin": "workspace:*",
     "@tailwindcss/vite": "^4.3.3",
-    "@trivago/prettier-plugin-sort-imports": "^6.0.2",
     "happy-dom": "^20.11.13",
-    "prettier": "^3.9.6",
     "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "vite": "^8.2.2",

package/dist/templates/examples/pixel-art/package.json

@@ -20,9 +20,7 @@
     "@foldkit/devtools": "workspace:*",
     "@foldkit/vite-plugin": "workspace:*",
     "@tailwindcss/vite": "^4.3.3",
-    "@trivago/prettier-plugin-sort-imports": "^6.0.2",
     "happy-dom": "^20.11.13",
-    "prettier": "^3.9.6",
     "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "vite": "^8.2.2",

package/dist/templates/examples/pixel-art/src/scene.test.ts

@@ -3,8 +3,6 @@ import { Command, click, expect, given, role, scene, text } from 'foldkit/scene'
 import { describe, test } from 'vitest'
 
 import { Dialog, Listbox, RadioGroup } from '@foldkit/ui'
-import { Message as DialogMessage } from '@foldkit/ui/dialog'
-import { Message as RadioGroupMessage } from '@foldkit/ui/radioGroup'
 
 import { ExportPng, SaveCanvas } from './command'
 import { createEmptyGrid } from './grid'
@@ -15,7 +13,7 @@ import { view } from './view'
 
 const resolveFocusOption = Command.resolve(
   RadioGroup.FocusOption,
-  RadioGroupMessage.CompletedFocusOption(),
+  RadioGroup.Message.CompletedFocusOption(),
 )
 
 const createTestModel = (): Model => ({
@@ -69,7 +67,7 @@ describe('export workflow', () => {
         ExportPng,
         Message.FailedExportPng({ error: 'Canvas 2D context not available' }),
       ),
-      Command.resolve(Dialog.ShowDialog, DialogMessage.SucceededShowDialog()),
+      Command.resolve(Dialog.ShowDialog, Dialog.Message.SucceededShowDialog()),
       expect(text('Export Failed')).toExist(),
       expect(text('Canvas 2D context not available')).toExist(),
       expect(role('button', { name: 'Dismiss' })).toExist(),
@@ -85,10 +83,13 @@ describe('export workflow', () => {
         ExportPng,
         Message.FailedExportPng({ error: 'Canvas 2D context not available' }),
       ),
-      Command.resolve(Dialog.ShowDialog, DialogMessage.SucceededShowDialog()),
+      Command.resolve(Dialog.ShowDialog, Dialog.Message.SucceededShowDialog()),
       expect(text('Export Failed')).toExist(),
       click(role('button', { name: 'Dismiss' })),
-      Command.resolve(Dialog.CloseDialog, DialogMessage.CompletedCloseDialog()),
+      Command.resolve(
+        Dialog.CloseDialog,
+        Dialog.Message.CompletedCloseDialog(),
+      ),
       expect(text('Export Failed')).toBeAbsent(),
     )
   })
@@ -196,7 +197,7 @@ describe('grid size change', () => {
       given(createPaintedModel()),
       click(role('radio', { name: '8' })),
       resolveFocusOption,
-      Command.resolve(Dialog.ShowDialog, DialogMessage.SucceededShowDialog()),
+      Command.resolve(Dialog.ShowDialog, Dialog.Message.SucceededShowDialog()),
       expect(text('Change to 8\u00d78?')).toExist(),
       expect(
         text('This will clear your canvas and reset undo history.'),
@@ -222,7 +223,10 @@ describe('grid size change', () => {
       given(modelWithPendingResize),
       expect(text('Change to 8\u00d78?')).toExist(),
       click(role('button', { name: 'Clear and Resize' })),
-      Command.resolve(Dialog.CloseDialog, DialogMessage.CompletedCloseDialog()),
+      Command.resolve(
+        Dialog.CloseDialog,
+        Dialog.Message.CompletedCloseDialog(),
+      ),
       Command.resolve(SaveCanvas, Message.CompletedSaveCanvas()),
       expect(text('Change to 8\u00d78?')).toBeAbsent(),
     )
@@ -243,7 +247,10 @@ describe('grid size change', () => {
       given(modelWithPendingResize),
       expect(text('Change to 8\u00d78?')).toExist(),
       click(role('button', { name: 'Cancel' })),
-      Command.resolve(Dialog.CloseDialog, DialogMessage.CompletedCloseDialog()),
+      Command.resolve(
+        Dialog.CloseDialog,
+        Dialog.Message.CompletedCloseDialog(),
+      ),
       expect(text('Change to 8\u00d78?')).toBeAbsent(),
     )
   })

package/dist/templates/examples/pixel-art/src/story.test.ts

@@ -3,7 +3,6 @@ import { Command, given, message, model, story } from 'foldkit/story'
 import { describe, expect, test } from 'vitest'
 
 import { Dialog, Listbox, RadioGroup } from '@foldkit/ui'
-import { Message as DialogMessage } from '@foldkit/ui/dialog'
 
 import { ExportPng, SaveCanvas } from './command'
 import { createEmptyGrid } from './grid'
@@ -304,7 +303,7 @@ describe('grid size', () => {
       update,
       given(paintedModel),
       message(Message.SelectedGridSize({ size: 8 })),
-      Command.resolve(Dialog.ShowDialog, DialogMessage.SucceededShowDialog()),
+      Command.resolve(Dialog.ShowDialog, Dialog.Message.SucceededShowDialog()),
       model(model => {
         expect(model.maybePendingGridSize).toEqual(Option.some(8))
         expect(model.gridSizeConfirmDialog.isOpen).toBe(true)
@@ -328,7 +327,10 @@ describe('grid size', () => {
       update,
       given(modelWithPending),
       message(Message.ConfirmedGridSizeChange()),
-      Command.resolve(Dialog.CloseDialog, DialogMessage.CompletedCloseDialog()),
+      Command.resolve(
+        Dialog.CloseDialog,
+        Dialog.Message.CompletedCloseDialog(),
+      ),
       Command.resolve(SaveCanvas, Message.CompletedSaveCanvas()),
       model(model => {
         expect(model.gridSize).toBe(8)
@@ -449,7 +451,7 @@ describe('export failure', () => {
       message(
         Message.FailedExportPng({ error: 'Canvas 2D context not available' }),
       ),
-      Command.resolve(Dialog.ShowDialog, DialogMessage.SucceededShowDialog()),
+      Command.resolve(Dialog.ShowDialog, Dialog.Message.SucceededShowDialog()),
       model(model => {
         expect(model.maybeExportError).toEqual(
           Option.some('Canvas 2D context not available'),
@@ -466,13 +468,16 @@ describe('export failure', () => {
       message(
         Message.FailedExportPng({ error: 'Canvas 2D context not available' }),
       ),
-      Command.resolve(Dialog.ShowDialog, DialogMessage.SucceededShowDialog()),
+      Command.resolve(Dialog.ShowDialog, Dialog.Message.SucceededShowDialog()),
       message(
         Message.GotErrorDialogMessage({
-          message: DialogMessage.RequestedClose(),
+          message: Dialog.Message.RequestedClose(),
         }),
       ),
-      Command.resolve(Dialog.CloseDialog, DialogMessage.CompletedCloseDialog()),
+      Command.resolve(
+        Dialog.CloseDialog,
+        Dialog.Message.CompletedCloseDialog(),
+      ),
       model(model => {
         expect(model.maybeExportError).toEqual(Option.none())
         expect(model.errorDialog.isOpen).toBe(false)

package/dist/templates/examples/query-sync/package.json

@@ -19,9 +19,7 @@
     "@foldkit/devtools": "workspace:*",
     "@foldkit/vite-plugin": "workspace:*",
     "@tailwindcss/vite": "^4.3.3",
-    "@trivago/prettier-plugin-sort-imports": "^6.0.2",
     "happy-dom": "^20.11.13",
-    "prettier": "^3.9.6",
     "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "vite": "^8.2.2",

package/dist/templates/examples/query-sync/src/story.test.ts

@@ -4,7 +4,6 @@ import { fromString } from 'foldkit/url'
 import { describe, expect, test } from 'vitest'
 
 import { Listbox } from '@foldkit/ui'
-import { Message as ListboxMessage } from '@foldkit/ui/listbox'
 
 import {
   AppRoute,
@@ -138,23 +137,23 @@ describe('update', () => {
         given(browseModel),
         message(
           Message.GotDietListboxMessage({
-            message: ListboxMessage.Opened({
+            message: Listbox.Message.Opened({
               maybeActiveItemIndex: Option.none(),
             }),
           }),
         ),
         Command.resolve(
           Listbox.FocusItems,
-          ListboxMessage.CompletedFocusItems(),
+          Listbox.Message.CompletedFocusItems(),
         ),
         message(
           Message.GotDietListboxMessage({
-            message: ListboxMessage.SelectedItem({ item: 'Carnivore' }),
+            message: Listbox.Message.SelectedItem({ item: 'Carnivore' }),
           }),
         ),
         Command.resolve(
           Listbox.FocusButton,
-          ListboxMessage.CompletedFocusButton(),
+          Listbox.Message.CompletedFocusButton(),
         ),
         Command.expectHas(ReplaceFilters),
         Command.resolve(ReplaceFilters, Message.CompletedReplaceFilters()),

package/dist/templates/examples/route-transitions/package.json

@@ -17,9 +17,7 @@
     "@foldkit/devtools": "workspace:*",
     "@foldkit/vite-plugin": "workspace:*",
     "@tailwindcss/vite": "^4.3.3",
-    "@trivago/prettier-plugin-sort-imports": "^6.0.2",
     "happy-dom": "^20.11.13",
-    "prettier": "^3.9.6",
     "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "vite": "^8.2.2",

package/dist/templates/examples/routing/package.json

@@ -18,9 +18,7 @@
     "@foldkit/devtools": "workspace:*",
     "@foldkit/vite-plugin": "workspace:*",
     "@tailwindcss/vite": "^4.3.3",
-    "@trivago/prettier-plugin-sort-imports": "^6.0.2",
     "happy-dom": "^20.11.13",
-    "prettier": "^3.9.6",
     "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "vite": "^8.2.2",

package/dist/templates/examples/routing/src/page/people.scene.test.ts

@@ -0,0 +1,41 @@
+import { Array, String } from 'effect'
+import { expect, given, role, scene, text } from 'foldkit/scene'
+import { describe, test } from 'vitest'
+
+import { Model, SearchResults, searchPeople, update, view } from './people'
+
+const loaded = (searchInput: string) =>
+  Model.make({
+    searchInput,
+    searchHistory: Array.liftPredicate(String.isNonEmpty)(searchInput),
+    results: SearchResults.Loaded({
+      query: searchInput,
+      people: searchPeople(searchInput),
+    }),
+  })
+
+describe('people', () => {
+  test('lists every person', () => {
+    scene(
+      { update, view },
+      given(loaded('')),
+      expect(role('heading', { name: 'People' })).toExist(),
+      expect(text('Alice Johnson')).toExist(),
+      expect(text('Bob Smith')).toExist(),
+      expect(text('Carol Davis')).toExist(),
+      expect(text('David Wilson')).toExist(),
+      expect(text('Eva Brown')).toExist(),
+    )
+  })
+
+  test('a search filters matches by name or role', () => {
+    scene(
+      { update, view },
+      given(loaded('designer')),
+      expect(text('Alice Johnson')).toExist(),
+      expect(text('Eva Brown')).toExist(),
+      expect(text('Bob Smith')).toBeAbsent(),
+      expect(text('2 results', { exact: false })).toExist(),
+    )
+  })
+})

package/dist/templates/examples/routing/src/page/people.story.test.ts

@@ -0,0 +1,73 @@
+import { Array, String } from 'effect'
+import { Command, given, message, model, story } from 'foldkit/story'
+import { describe, expect, test } from 'vitest'
+
+import {
+  Message,
+  Model,
+  PushSearchUrl,
+  SearchResults,
+  searchPeople,
+  update,
+} from './people'
+
+const givenLoaded = (searchInput: string) =>
+  given(
+    Model.make({
+      searchInput,
+      searchHistory: Array.liftPredicate(String.isNonEmpty)(searchInput),
+      results: SearchResults.Loaded({
+        query: searchInput,
+        people: searchPeople(searchInput),
+      }),
+    }),
+  )
+
+describe('people', () => {
+  test('ChangedSearchInput updates the input without recording history or fetching', () => {
+    story(
+      update,
+      givenLoaded(''),
+      message(Message.ChangedSearchInput({ value: 'd' })),
+      message(Message.ChangedSearchInput({ value: 'de' })),
+      message(Message.ChangedSearchInput({ value: 'designer' })),
+      Command.expectNone(),
+      model(model => {
+        expect(model.searchInput).toBe('designer')
+        expect(model.searchHistory).toStrictEqual([])
+      }),
+    )
+  })
+
+  test('SubmittedSearch pushes the current input to the URL', () => {
+    story(
+      update,
+      givenLoaded('designer'),
+      message(Message.SubmittedSearch()),
+      Command.expectHas(PushSearchUrl),
+      Command.resolve(PushSearchUrl, Message.CompletedPushSearchUrl()),
+    )
+  })
+
+  test('SucceededFetchPeople stores the loaded results', () => {
+    const people = searchPeople('designer')
+
+    story(
+      update,
+      givenLoaded(''),
+      message(
+        Message.SucceededFetchPeople({
+          query: 'designer',
+          people,
+        }),
+      ),
+      model(model => {
+        expect(model.results._tag).toBe('Loaded')
+        if (model.results._tag === 'Loaded') {
+          expect(model.results.query).toBe('designer')
+          expect(model.results.people).toStrictEqual(people)
+        }
+      }),
+    )
+  })
+})

package/dist/templates/examples/routing/src/scene.test.ts

@@ -80,26 +80,11 @@ describe('view', () => {
     )
   })
 
-  test('the People route lists every person', () => {
+  test('the People route renders the People heading', () => {
     scene(
       { update, view },
       given(people('')),
-      expect(text('Alice Johnson')).toExist(),
-      expect(text('Bob Smith')).toExist(),
-      expect(text('Carol Davis')).toExist(),
-      expect(text('David Wilson')).toExist(),
-      expect(text('Eva Brown')).toExist(),
-    )
-  })
-
-  test('a search filters People to matches by name or role', () => {
-    scene(
-      { update, view },
-      given(people('designer')),
-      expect(text('Alice Johnson')).toExist(),
-      expect(text('Eva Brown')).toExist(),
-      expect(text('Bob Smith')).toBeAbsent(),
-      expect(text('2 results', { exact: false })).toExist(),
+      expect(role('heading', { name: 'People' })).toExist(),
     )
   })
 

package/dist/templates/examples/routing/src/story.test.ts

@@ -5,7 +5,6 @@ import { describe, expect, test } from 'vitest'
 
 import { AppRoute, Message, Model, update } from './main'
 import { People } from './page'
-import { Message as PeopleMessage } from './page/people'
 
 const peoplePageWith = (searchInput: string) =>
   People.Model.make({
@@ -41,7 +40,7 @@ const urlOrThrow = (raw: string) =>
 const resolveFetch = (searchText: string) =>
   Command.resolve(
     People.FetchPeople,
-    PeopleMessage.SucceededFetchPeople({
+    People.Message.SucceededFetchPeople({
       query: searchText,
       people: People.searchPeople(searchText),
     }),
@@ -198,48 +197,19 @@ describe('update', () => {
   })
 
   describe('GotPeopleMessage', () => {
-    test('typing updates the input without recording history or firing a command', () => {
+    test('GotPeopleMessage writes through to peoplePage', () => {
       story(
         update,
         given(onPeople('')),
         message(
           Message.GotPeopleMessage({
-            message: PeopleMessage.ChangedSearchInput({ value: 'd' }),
+            message: People.Message.ChangedSearchInput({ value: 'd' }),
           }),
         ),
-        message(
-          Message.GotPeopleMessage({
-            message: PeopleMessage.ChangedSearchInput({ value: 'de' }),
-          }),
-        ),
-        message(
-          Message.GotPeopleMessage({
-            message: PeopleMessage.ChangedSearchInput({ value: 'designer' }),
-          }),
-        ),
-        Command.expectNone(),
         model(model => {
-          expect(model.peoplePage.searchInput).toBe('designer')
-          expect(model.peoplePage.searchHistory).toStrictEqual([])
+          expect(model.peoplePage.searchInput).toBe('d')
         }),
       )
     })
-
-    test('submitting the search pushes the current input to the URL', () => {
-      story(
-        update,
-        given(onPeople('designer')),
-        message(
-          Message.GotPeopleMessage({
-            message: PeopleMessage.SubmittedSearch(),
-          }),
-        ),
-        Command.expectHas(People.PushSearchUrl),
-        Command.resolve(
-          People.PushSearchUrl,
-          PeopleMessage.CompletedPushSearchUrl(),
-        ),
-      )
-    })
   })
 })

package/dist/templates/examples/shopping-cart/package.json

@@ -18,9 +18,7 @@
     "@foldkit/devtools": "workspace:*",
     "@foldkit/vite-plugin": "workspace:*",
     "@tailwindcss/vite": "^4.3.3",
-    "@trivago/prettier-plugin-sort-imports": "^6.0.2",
     "happy-dom": "^20.11.13",
-    "prettier": "^3.9.6",
     "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "vite": "^8.2.2",

package/dist/templates/examples/shopping-cart/src/page/products.scene.test.ts

@@ -0,0 +1,20 @@
+import { expect, given, role, scene, text, withViewInputs } from 'foldkit/scene'
+import { describe, test } from 'vitest'
+
+import { products } from '../data/products'
+import { init, update, view } from './products'
+
+const productsView = withViewInputs(view, { cart: [] })
+
+describe('products', () => {
+  test('lists every product with an Add to Cart button', () => {
+    scene(
+      { update, view: productsView() },
+      given(init(products)),
+      expect(role('heading', { name: 'Products' })).toExist(),
+      expect(text('Apple')).toExist(),
+      expect(text('Banana')).toExist(),
+      expect(role('button', { name: 'Add to Cart' })).toExist(),
+    )
+  })
+})

package/dist/templates/examples/shopping-cart/src/page/products.story.test.ts

@@ -0,0 +1,56 @@
+import {
+  Command,
+  expectOutMessage,
+  given,
+  message,
+  model,
+  story,
+} from 'foldkit/story'
+import { describe, expect, test } from 'vitest'
+
+import { products } from '../data/products'
+import { Message, OutMessage, ReplaceSearchUrl, init, update } from './products'
+
+const apple = { id: '1', name: 'Apple', price: 1.5 }
+
+describe('products', () => {
+  test('ChangedSearchInput stores the query and replaces the search URL', () => {
+    story(
+      update,
+      given(init(products)),
+      message(Message.ChangedSearchInput({ value: 'app' })),
+      model(model => {
+        expect(model.searchText).toBe('app')
+      }),
+      Command.expectHas(ReplaceSearchUrl),
+      Command.resolve(ReplaceSearchUrl, Message.CompletedReplaceSearchUrl()),
+    )
+  })
+
+  test('ClickedAddToCart emits AddedToCart', () => {
+    story(
+      update,
+      given(init(products)),
+      message(Message.ClickedAddToCart({ item: apple })),
+      expectOutMessage(OutMessage.AddedToCart({ item: apple })),
+    )
+  })
+
+  test('ClickedIncrementQuantity emits IncrementedQuantity', () => {
+    story(
+      update,
+      given(init(products)),
+      message(Message.ClickedIncrementQuantity({ itemId: '1' })),
+      expectOutMessage(OutMessage.IncrementedQuantity({ itemId: '1' })),
+    )
+  })
+
+  test('ClickedDecrementQuantity emits DecrementedQuantity', () => {
+    story(
+      update,
+      given(init(products)),
+      message(Message.ClickedDecrementQuantity({ itemId: '1' })),
+      expectOutMessage(OutMessage.DecrementedQuantity({ itemId: '1' })),
+    )
+  })
+})

package/dist/templates/examples/shopping-cart/src/page/products.ts

@@ -52,7 +52,7 @@ export const init = (products: ReadonlyArray<Item.Item>): Model => ({
 
 // COMMAND
 
-const ReplaceSearchUrl = Command.define('ReplaceSearchUrl', {
+export const ReplaceSearchUrl = Command.define('ReplaceSearchUrl', {
   args: { url: Schema.String },
   messages: [Message.CompletedReplaceSearchUrl],
   execute: ({ url }) =>

package/dist/templates/examples/shopping-cart/src/scene.test.ts

@@ -49,14 +49,11 @@ describe('view', () => {
     )
   })
 
-  test('the Products route lists every product with an Add to Cart button', () => {
+  test('the Products route renders the Products heading', () => {
     scene(
       { update, view },
       given(baseModel),
       expect(role('heading', { name: 'Products' })).toExist(),
-      expect(text('Apple')).toExist(),
-      expect(text('Banana')).toExist(),
-      expect(role('button', { name: 'Add to Cart' })).toExist(),
     )
   })
 

package/dist/templates/examples/shopping-cart/src/story.test.ts

@@ -6,7 +6,6 @@ import { describe, expect, test } from 'vitest'
 import { products } from './data/products'
 import { Message, type Model, update } from './main'
 import { Products } from './page'
-import { Message as ProductsMessage } from './page/products'
 import { AppRoute } from './route'
 
 const apple = { id: '1', name: 'Apple', price: 1.5 }
@@ -90,7 +89,7 @@ describe('update', () => {
         given(baseModel),
         message(
           Message.GotProductsMessage({
-            message: ProductsMessage.ClickedAddToCart({ item: apple }),
+            message: Products.Message.ClickedAddToCart({ item: apple }),
           }),
         ),
         model(model => {
@@ -107,12 +106,12 @@ describe('update', () => {
         given(baseModel),
         message(
           Message.GotProductsMessage({
-            message: ProductsMessage.ClickedAddToCart({ item: apple }),
+            message: Products.Message.ClickedAddToCart({ item: apple }),
           }),
         ),
         message(
           Message.GotProductsMessage({
-            message: ProductsMessage.ClickedAddToCart({ item: apple }),
+            message: Products.Message.ClickedAddToCart({ item: apple }),
           }),
         ),
         model(model => {