create-appraisejs 0.3.1-alpha.0 → 0.4.0-alpha.0

package/templates/blank/src/app/(base)/test-cases/test-case-form.tsx

@@ -52,11 +52,7 @@ import { testCaseSchema } from '@/constants/form-opts/test-case-form-opts'
 import { toast } from '@/hooks/use-toast'
 import { cn } from '@/lib/utils'
 import type { ActionResponse } from '@/types/form/actionHandler'
-import {
-  createTestCaseFormState,
-  testCaseFormReducer,
-  type TestCaseFormErrors,
-} from './test-case-form-reducer'
+import { createTestCaseFormState, testCaseFormReducer, type TestCaseFormErrors } from './test-case-form-reducer'
 
 type TestCaseFormProps = {
   defaultNodesOrder: NodeOrderMap
@@ -296,53 +292,53 @@ function FlowPanel({
 }: FlowPanelProps) {
   return (
     <LazyMotion features={domAnimation} strict>
-    <motion.div
-      layout
-      layoutId="test-case-flow-panel"
-      className={cn(
-        'flex min-h-0 w-full flex-col overflow-hidden rounded-xl border border-zinc-700 text-card-foreground shadow-sm will-change-transform',
-        className,
-      )}
-      transition={{ layout: { duration: 0.3, ease: 'easeInOut' } }}
-    >
-      <CardHeader className="shrink-0">
-        <div className="flex items-start justify-between gap-3">
-          <div className="space-y-1">
-            <CardTitle className="text-xl font-bold text-primary">Test Case Flow</CardTitle>
-            <CardDescription>Build your test scenario step by step visually</CardDescription>
+      <motion.div
+        layout
+        layoutId="test-case-flow-panel"
+        className={cn(
+          'flex min-h-0 w-full flex-col overflow-hidden rounded-xl border border-zinc-700 text-card-foreground shadow-sm will-change-transform',
+          className,
+        )}
+        transition={{ layout: { duration: 0.3, ease: 'easeInOut' } }}
+      >
+        <CardHeader className="shrink-0">
+          <div className="flex items-start justify-between gap-3">
+            <div className="space-y-1">
+              <CardTitle className="text-xl font-bold text-primary">Test Case Flow</CardTitle>
+              <CardDescription>Build your test scenario step by step visually</CardDescription>
+            </div>
+            <Button
+              type="button"
+              variant="outline"
+              size="icon"
+              className="size-9 shrink-0"
+              onClick={onToggleImmersive}
+              aria-label={isFlowImmersive ? 'Exit immersive flow editing' : 'Enter immersive flow editing'}
+            >
+              {isFlowImmersive ? <Minimize2 className="size-4" /> : <Maximize2 className="size-4" />}
+            </Button>
           </div>
-          <Button
-            type="button"
-            variant="outline"
-            size="icon"
-            className="size-9 shrink-0"
-            onClick={onToggleImmersive}
-            aria-label={isFlowImmersive ? 'Exit immersive flow editing' : 'Enter immersive flow editing'}
-          >
-            {isFlowImmersive ? <Minimize2 className="size-4" /> : <Maximize2 className="size-4" />}
-          </Button>
-        </div>
-      </CardHeader>
-      <CardContent className="flex min-h-0 flex-1 flex-col">
-        <div className="flex min-h-0 flex-1 flex-col gap-2">
-          <div className="min-h-0 flex-1">
-            <TestCaseFlow
-              initialNodesOrder={nodesOrder}
-              templateStepParams={templateStepParams}
-              templateSteps={templateSteps}
-              onNodeOrderChange={onNodeOrderChange}
-              locators={locators}
-              locatorGroups={locatorGroups}
-              environments={environments}
-              modules={moduleList}
-              flowBlocks={flowBlocks}
-              layoutRefreshKey={isFlowImmersive}
-              onFlowBlocksChange={onFlowBlocksChange}
-            />
+        </CardHeader>
+        <CardContent className="flex min-h-0 flex-1 flex-col">
+          <div className="flex min-h-0 flex-1 flex-col gap-2">
+            <div className="min-h-0 flex-1">
+              <TestCaseFlow
+                initialNodesOrder={nodesOrder}
+                templateStepParams={templateStepParams}
+                templateSteps={templateSteps}
+                onNodeOrderChange={onNodeOrderChange}
+                locators={locators}
+                locatorGroups={locatorGroups}
+                environments={environments}
+                modules={moduleList}
+                flowBlocks={flowBlocks}
+                layoutRefreshKey={isFlowImmersive}
+                onFlowBlocksChange={onFlowBlocksChange}
+              />
+            </div>
           </div>
-        </div>
-      </CardContent>
-    </motion.div>
+        </CardContent>
+      </motion.div>
     </LazyMotion>
   )
 }
@@ -774,16 +770,16 @@ function FlowStep({
   return (
     <div className="flex flex-col gap-4">
       <LazyMotion features={domAnimation} strict>
-      <LayoutGroup id="test-case-flow-panel-layout">
-        <div className="w-full min-w-0 overflow-x-hidden">
-          {isFlowImmersive ? (
-            <div className="fixed inset-0 z-40 bg-background p-3 sm:p-4">{immersiveFlowPanel}</div>
-          ) : (
-            flowPanel
-          )}
-          <TestCaseFormFieldError message={errors.steps} />
-        </div>
-      </LayoutGroup>
+        <LayoutGroup id="test-case-flow-panel-layout">
+          <div className="w-full min-w-0 overflow-x-hidden">
+            {isFlowImmersive ? (
+              <div className="fixed inset-0 z-40 bg-background p-3 sm:p-4">{immersiveFlowPanel}</div>
+            ) : (
+              flowPanel
+            )}
+            <TestCaseFormFieldError message={errors.steps} />
+          </div>
+        </LayoutGroup>
       </LazyMotion>
       {!isFlowImmersive && (
         <div className="flex flex-col gap-4">
@@ -857,14 +853,7 @@ type WizardStepContentProps = {
   errors: TestCaseFormErrors
 }
 
-function WizardStepContent({
-  actions,
-  details,
-  errors,
-  flow,
-  navigation,
-  template,
-}: WizardStepContentProps) {
+function WizardStepContent({ actions, details, errors, flow, navigation, template }: WizardStepContentProps) {
   const { currentStep, detailsStepIndex, hasTemplateSelectionStep } = navigation
 
   if (hasTemplateSelectionStep && currentStep === 0) {
@@ -1142,7 +1131,10 @@ function useBodyScrollLock(isLocked: boolean) {
   }, [isLocked])
 }
 
-function useWizardStepClick(currentStep: number, dispatch: React.Dispatch<import('./test-case-form-reducer').TestCaseFormAction>) {
+function useWizardStepClick(
+  currentStep: number,
+  dispatch: React.Dispatch<import('./test-case-form-reducer').TestCaseFormAction>,
+) {
   return useCallback(
     (stepIndex: number) => {
       if (stepIndex <= currentStep) {
@@ -1194,11 +1186,7 @@ const TestCaseForm = ({
       defaultTestSuiteIds,
       defaultTagIds,
       defaultTemplateTestCaseId,
-      initialWizardStep: getInitialWizardStep(
-        hasTemplateSelectionStep,
-        defaultTemplateTestCaseId,
-        detailsStepIndex,
-      ),
+      initialWizardStep: getInitialWizardStep(hasTemplateSelectionStep, defaultTemplateTestCaseId, detailsStepIndex),
     },
     createTestCaseFormState,
   )
@@ -1357,10 +1345,7 @@ const TestCaseForm = ({
     flow: {
       isFlowImmersive,
       flowPanel: (
-        <FlowPanel
-          {...flowPanelProps}
-          className="relative h-[max(22rem,calc(100dvh-12rem))] bg-zinc-500/10"
-        />
+        <FlowPanel {...flowPanelProps} className="relative h-[max(22rem,calc(100dvh-12rem))] bg-zinc-500/10" />
       ),
       immersiveFlowPanel: <FlowPanel {...flowPanelProps} className="h-full bg-background" />,
       scenarioPreview,

package/templates/blank/src/app/(base)/test-cases/test-case-route-helpers.test.ts

@@ -1,13 +1,8 @@
 import { StepParameterType, TemplateStepIcon } from '@prisma/client'
 import { describe, expect, it } from 'vitest'
 
-import {
-  buildNodeOrderFromTestCaseSteps,
-  getEditableTestCase,
-} from './editable-test-case-helpers'
-import {
-  getTestCaseRows,
-} from './test-case-row-helpers'
+import { buildNodeOrderFromTestCaseSteps, getEditableTestCase } from './editable-test-case-helpers'
+import { getTestCaseRows } from './test-case-row-helpers'
 
 describe('test-case route helpers', () => {
   it('narrows test case list rows from action data', () => {

package/templates/blank/src/app/(base)/test-suites/editable-test-suite-helpers.ts

@@ -4,12 +4,7 @@ import { isTagRow, isTestSuiteTableRow } from './test-suite-row-guards'
 import type { EditableTestSuite } from './test-suite-types'
 
 function isEditableTestSuite(value: unknown): value is EditableTestSuite {
-  return (
-    isTestSuiteTableRow(value) &&
-    'tags' in value &&
-    Array.isArray(value.tags) &&
-    value.tags.every(isTagRow)
-  )
+  return isTestSuiteTableRow(value) && 'tags' in value && Array.isArray(value.tags) && value.tags.every(isTagRow)
 }
 
 export function getEditableTestSuite(data: ActionResponseData | undefined) {

package/templates/blank/src/app/(base)/test-suites/test-suite-form.test.tsx

@@ -23,11 +23,7 @@ vi.mock('@/hooks/use-toast', () => ({
 
 vi.mock('@/components/test-case/test-case-picker', () => ({
   __esModule: true,
-  default: ({
-    onSave,
-  }: {
-    onSave: (value: string[]) => void
-  }) => (
+  default: ({ onSave }: { onSave: (value: string[]) => void }) => (
     <button type="button" onClick={() => onSave(['case-1'])}>
       Select Cases
     </button>
@@ -36,11 +32,7 @@ vi.mock('@/components/test-case/test-case-picker', () => ({
 
 vi.mock('@/components/ui/multi-select-with-preview', () => ({
   __esModule: true,
-  default: ({
-    onSelectChange,
-  }: {
-    onSelectChange: (value: string[]) => void
-  }) => (
+  default: ({ onSelectChange }: { onSelectChange: (value: string[]) => void }) => (
     <button type="button" onClick={() => onSelectChange(['tag-1'])}>
       Select Tags
     </button>

package/templates/blank/src/app/(dashboard-components)/data-card-grid.tsx

@@ -1,13 +1,13 @@
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
 
 export const DataCardGrid = ({ children }: { children: React.ReactNode }) => {
-    return <Card className="border-zinc-600/10 bg-zinc-600/10 w-fit">
-        <CardHeader>
-            <CardTitle className="text-primary">States</CardTitle>
-            <CardDescription>Overview of entity states</CardDescription>
-        </CardHeader>
-        <CardContent className="grid grid-cols-2 gap-4">
-            {children}
-        </CardContent>
+  return (
+    <Card className="w-fit border-zinc-600/10 bg-zinc-600/10">
+      <CardHeader>
+        <CardTitle className="text-primary">States</CardTitle>
+        <CardDescription>Overview of entity states</CardDescription>
+      </CardHeader>
+      <CardContent className="grid grid-cols-2 gap-4">{children}</CardContent>
     </Card>
-}
+  )
+}

package/templates/blank/src/app/api/test-runs/[runId]/download/route.ts

@@ -12,10 +12,7 @@ type Archive = ReturnType<typeof archiver>
 type ArtifactFile = { absolutePath: string; archivePath: string }
 type DownloadTestRun = NonNullable<Awaited<ReturnType<typeof getDownloadTestRun>>>
 
-async function collectRunArtifactFiles(
-  dir: string,
-  baseDir = dir,
-): Promise<ArtifactFile[]> {
+async function collectRunArtifactFiles(dir: string, baseDir = dir): Promise<ArtifactFile[]> {
   try {
     const entries = await fs.readdir(dir, { withFileTypes: true })
     const files: ArtifactFile[] = []

package/templates/blank/src/app/api/test-runs/[runId]/trace/[testCaseId]/route.test.ts

@@ -86,9 +86,12 @@ describe('trace route', () => {
       testCases: [{ id: 'trtc-1', tracePath: null }],
     })
 
-    const response = await POST(new NextRequest('http://localhost/api/test-runs/run-1/trace/trtc-1', { method: 'POST' }), {
-      params: Promise.resolve({ runId: 'run-1', testCaseId: 'trtc-1' }),
-    })
+    const response = await POST(
+      new NextRequest('http://localhost/api/test-runs/run-1/trace/trtc-1', { method: 'POST' }),
+      {
+        params: Promise.resolve({ runId: 'run-1', testCaseId: 'trtc-1' }),
+      },
+    )
 
     expect(response.status).toBe(400)
     await expect(response.json()).resolves.toEqual({ error: 'No trace path available for this test case' })
@@ -100,9 +103,12 @@ describe('trace route', () => {
     })
     mockAccess.mockRejectedValue(new Error('missing'))
 
-    const response = await POST(new NextRequest('http://localhost/api/test-runs/run-1/trace/trtc-1', { method: 'POST' }), {
-      params: Promise.resolve({ runId: 'run-1', testCaseId: 'trtc-1' }),
-    })
+    const response = await POST(
+      new NextRequest('http://localhost/api/test-runs/run-1/trace/trtc-1', { method: 'POST' }),
+      {
+        params: Promise.resolve({ runId: 'run-1', testCaseId: 'trtc-1' }),
+      },
+    )
 
     expect(response.status).toBe(404)
     await expect(response.json()).resolves.toEqual({ error: 'Trace file not found at path: trace.zip' })
@@ -115,9 +121,12 @@ describe('trace route', () => {
     mockAccess.mockResolvedValue(undefined)
     mockSpawn.mockResolvedValue({ name: 'trace-viewer-trtc-1' })
 
-    const response = await POST(new NextRequest('http://localhost/api/test-runs/run-1/trace/trtc-1', { method: 'POST' }), {
-      params: Promise.resolve({ runId: 'run-1', testCaseId: 'trtc-1' }),
-    })
+    const response = await POST(
+      new NextRequest('http://localhost/api/test-runs/run-1/trace/trtc-1', { method: 'POST' }),
+      {
+        params: Promise.resolve({ runId: 'run-1', testCaseId: 'trtc-1' }),
+      },
+    )
 
     expect(mockSpawn).toHaveBeenCalledWith('npx', ['playwright', 'show-trace', '/resolved/trace.zip'], {
       streamLogs: true,

package/templates/blank/src/assets/icons/empty-tube.tsx

@@ -1,23 +1,23 @@
-import { cn } from '@/lib/utils'
-
-const EmptyTube = ({ className }: { className?: string }) => {
-  return (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      stroke="currentColor"
-      strokeWidth="2"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-      className={cn('lucide lucide-test-tube-icon lucide-test-tube', className)}
-    >
-      <path d="M14.5 2v17.5c0 1.4-1.1 2.5-2.5 2.5c-1.4 0-2.5-1.1-2.5-2.5V2" />
-      <path d="M8.5 2h7" />
-    </svg>
-  )
-}
-
-export default EmptyTube
+import { cn } from '@/lib/utils'
+
+const EmptyTube = ({ className }: { className?: string }) => {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="24"
+      height="24"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      className={cn('lucide lucide-test-tube-icon lucide-test-tube', className)}
+    >
+      <path d="M14.5 2v17.5c0 1.4-1.1 2.5-2.5 2.5c-1.4 0-2.5-1.1-2.5-2.5V2" />
+      <path d="M8.5 2h7" />
+    </svg>
+  )
+}
+
+export default EmptyTube

package/templates/blank/src/assets/icons/tube-plus.tsx

@@ -1,29 +1,29 @@
-import { cn } from '@/lib/utils'
-
-export const TubePlus = ({ className }: { className?: string }) => {
-  return (
-    <>
-      <svg
-        xmlns="http://www.w3.org/2000/svg"
-        width="24"
-        height="24"
-        viewBox="0 0 24 24"
-        fill="none"
-        stroke="currentColor"
-        strokeWidth="2"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-        className={cn('lucide', className)}
-      >
-        {/* Empty tube icon */}
-        <path d="M14.5 2v17.5c0 1.4-1.1 2.5-2.5 2.5c-1.4 0-2.5-1.1-2.5-2.5V2" />
-        <path d="M8.5 2h7" />
-        {/* Half-filled level indicator */}
-        <line x1="10.5" y1="15.5" x2="13.5" y2="15.5" />
-        {/* Plus icon - positioned at bottom right */}
-        <line x1="17.5" y1="19.5" x2="21.5" y2="19.5" strokeWidth="1.5" />
-        <line x1="19.5" y1="17.5" x2="19.5" y2="21.5" strokeWidth="1.5" />
-      </svg>
-    </>
-  )
-}
+import { cn } from '@/lib/utils'
+
+export const TubePlus = ({ className }: { className?: string }) => {
+  return (
+    <>
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="24"
+        height="24"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        strokeWidth="2"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        className={cn('lucide', className)}
+      >
+        {/* Empty tube icon */}
+        <path d="M14.5 2v17.5c0 1.4-1.1 2.5-2.5 2.5c-1.4 0-2.5-1.1-2.5-2.5V2" />
+        <path d="M8.5 2h7" />
+        {/* Half-filled level indicator */}
+        <line x1="10.5" y1="15.5" x2="13.5" y2="15.5" />
+        {/* Plus icon - positioned at bottom right */}
+        <line x1="17.5" y1="19.5" x2="21.5" y2="19.5" strokeWidth="1.5" />
+        <line x1="19.5" y1="17.5" x2="19.5" y2="21.5" strokeWidth="1.5" />
+      </svg>
+    </>
+  )
+}

package/templates/blank/src/components/data-visualization/info-card.tsx

@@ -1,70 +1,56 @@
-import React from 'react'
-import { Card, CardContent } from '../ui/card'
-import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../ui/tooltip'
-
-const InfoCard = ({
-  showHighlightGroup,
-  highlight,
-  legend,
-  defaultText,
-  icon,
-}: {
-  showHighlightGroup: boolean
-  highlight: string
-  legend: string
-  defaultText: string
-  icon: React.ReactNode
-}) => {
-  // Dynamic text size based on highlight text length
-  const getHighlightTextSize = (text: string) => {
-    const length = text.length
-    if (length <= 3) return 'text-2xl'
-    if (length <= 6) return 'text-xl'
-    if (length <= 10) return 'text-lg'
-    if (length <= 15) return 'text-base'
-    return 'text-sm'
-  }
-
-  return (
-    <>
-      <Card className="flex w-[10vw] max-w-[20rem] items-center bg-inherit">
-        <CardContent className="p-2">
-          <div className="flex items-center gap-4 text-primary">
-            {showHighlightGroup ? (
-              <>
-                {icon}
-                <div className="flex h-full flex-col">
-                  <div className="flex h-full items-center text-xs text-muted-foreground">{legend}</div>
-                  <div
-                    className={`mr-2 h-full items-center font-mono text-primary ${getHighlightTextSize(highlight)} ${
-                      highlight.length > 15 ? 'w-[6rem] overflow-hidden text-ellipsis whitespace-nowrap' : ''
-                    }`}
-                  >
-                    {highlight.length > 15 ? (
-                      <>
-                        <TooltipProvider>
-                          <Tooltip delayDuration={200}>
-                            <TooltipTrigger asChild>
-                              <span>{highlight}</span>
-                            </TooltipTrigger>
-                            <TooltipContent>{highlight}</TooltipContent>
-                          </Tooltip>
-                        </TooltipProvider>
-                      </>
-                    ) : (
-                      highlight
-                    )}
-                  </div>
-                </div>
-              </>
-            ) : (
-              <div className="flex items-center text-xs text-muted-foreground">{defaultText}</div>
-            )}
-          </div>
-        </CardContent>
-      </Card>
-    </>
-  )
-}
-
-export default InfoCard
+import React from 'react'
+import { Card, CardContent } from '../ui/card'
+
+const InfoCard = ({
+  showHighlightGroup,
+  highlight,
+  legend,
+  defaultText,
+  icon,
+}: {
+  showHighlightGroup: boolean
+  highlight: string
+  legend: string
+  defaultText: string
+  icon: React.ReactNode
+}) => {
+  // Dynamic text size based on highlight text length
+  const getHighlightTextSize = (text: string) => {
+    const length = text.length
+    if (length <= 3) return 'text-2xl'
+    if (length <= 6) return 'text-xl'
+    if (length <= 10) return 'text-lg'
+    if (length <= 15) return 'text-base'
+    return 'text-sm'
+  }
+
+  return (
+    <>
+      <Card className="flex min-w-40 max-w-80 items-center bg-inherit">
+        <CardContent className="min-w-0 p-2">
+          <div className="flex min-w-0 items-center gap-4 text-primary">
+            {showHighlightGroup ? (
+              <>
+                <div className="shrink-0">{icon}</div>
+                <div className="flex h-full min-w-0 flex-col">
+                  <div className="flex h-full items-center text-xs text-muted-foreground">{legend}</div>
+                  <div
+                    className={`h-full min-w-0 items-center break-words font-mono text-primary ${getHighlightTextSize(
+                      highlight,
+                    )}`}
+                  >
+                    {highlight}
+                  </div>
+                </div>
+              </>
+            ) : (
+              <div className="flex items-center text-xs text-muted-foreground">{defaultText}</div>
+            )}
+          </div>
+        </CardContent>
+      </Card>
+    </>
+  )
+}
+
+export default InfoCard

package/templates/blank/src/components/data-visualization/info-grid.tsx

@@ -1,22 +1,22 @@
-import React from 'react'
-import InfoCard from './info-card'
-
-interface InfoCards {
-  showHighlightGroup: boolean
-  highlight: string
-  legend: string
-  defaultText: string
-  icon: React.ReactNode
-}
-
-const InfoGrid = ({ infoCards }: { infoCards: InfoCards[] }) => {
-  return (
-    <div className="my-4 flex flex-wrap gap-4">
-      {infoCards.map(card => (
-        <InfoCard key={card.legend} {...card} />
-      ))}
-    </div>
-  )
-}
-
-export default InfoGrid
+import React from 'react'
+import InfoCard from './info-card'
+
+interface InfoCards {
+  showHighlightGroup: boolean
+  highlight: string
+  legend: string
+  defaultText: string
+  icon: React.ReactNode
+}
+
+const InfoGrid = ({ infoCards }: { infoCards: InfoCards[] }) => {
+  return (
+    <div className="my-4 flex flex-wrap gap-4">
+      {infoCards.map(card => (
+        <InfoCard key={card.legend} {...card} />
+      ))}
+    </div>
+  )
+}
+
+export default InfoGrid

package/templates/blank/src/components/diagram/add-node-prompt-node.tsx

@@ -18,7 +18,7 @@ export const AddNodePromptNode = memo(function AddNodePromptNode({
   onOpenAddNode,
 }: AddNodePromptNodeComponentProps) {
   return (
-    <BaseNode selected={selected} className="max-w-80 border-dashed border-muted-foreground/50 bg-muted/30 px-4 py-3">
+    <BaseNode selected={selected} className="border-muted-foreground/50 bg-muted/30 max-w-80 border-dashed px-4 py-3">
       <p className="mb-3 text-sm text-muted-foreground">No steps yet. Add your first node to build the flow.</p>
       <Button type="button" className={cn('nodrag w-full')} variant="outline" onClick={onOpenAddNode}>
         Add node

package/templates/blank/src/components/diagram/dynamic-parameters-helpers.ts

@@ -68,7 +68,9 @@ export function getInitialSelectedLocatorGroups(
   initialParameterValues: DynamicParameterInput[] | undefined,
   locators: Array<Pick<Locator, 'id' | 'name' | 'locatorGroupId'>>,
 ) {
-  const initialValueMap = Object.fromEntries((initialParameterValues ?? []).map(parameter => [parameter.name, parameter]))
+  const initialValueMap = Object.fromEntries(
+    (initialParameterValues ?? []).map(parameter => [parameter.name, parameter]),
+  )
 
   return Object.fromEntries(
     templateStepParams.flatMap(parameter => {
@@ -141,8 +143,7 @@ export function formatDynamicParameterValues(
         formattedValue = value !== undefined && value !== null ? String(value) : ''
         break
       case StepParameterType.DATE:
-        formattedValue =
-          value instanceof Date && !Number.isNaN(value.getTime()) ? format(value, 'PPP') : ''
+        formattedValue = value instanceof Date && !Number.isNaN(value.getTime()) ? format(value, 'PPP') : ''
         break
       case StepParameterType.BOOLEAN:
         formattedValue = value !== undefined && value !== null ? String(value) : ''