Fix workspaces story

presleyp · presleyp · commit ba3783b18571 · 2022-10-25T17:58:17.000Z
diff --git a/site/src/components/PaginationWidget/utils.ts b/site/src/components/PaginationWidget/utils.ts
@@ -1,7 +1,9 @@
 import {
   PaginationContext,
+  paginationMachine,
   PaginationMachineRef,
 } from "xServices/pagination/paginationXService"
+import { spawn } from "xstate"
 
 /**
  * Generates a ranged array with an option to step over values.
@@ -61,9 +63,10 @@ export const buildPagedList = (
   return range(1, numPages)
 }
 
-export const getInitialPage = (page: string | null): number =>
+const getInitialPage = (page: string | null): number =>
   page ? Number(page) : 1
 
+// pages count from 1
 export const getOffset = (page: number, limit: number): number =>
   (page - 1) * limit
 
@@ -92,3 +95,8 @@ export const getPaginationContext = (
   page: getInitialPage(searchParams.get("page")),
   limit,
 })
+
+// for storybook
+export const createPaginationRef = (context: PaginationContext): PaginationMachineRef => {
+  return spawn(paginationMachine.withContext(context))
+}
diff --git a/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx b/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx
@@ -1,4 +1,5 @@
 import { ComponentMeta, Story } from "@storybook/react"
+import { createPaginationRef } from "components/PaginationWidget/utils"
 import dayjs from "dayjs"
 import { spawn } from "xstate"
 import {
@@ -87,6 +88,9 @@ export default {
   title: "pages/WorkspacesPageView",
   component: WorkspacesPageView,
   argTypes: {
+    paginationRef: {
+      defaultValue: createPaginationRef({ page: 1, limit: 25 })
+    },
     workspaceRefs: {
       options: [
         ...Object.keys(workspaces),
