create-appraisejs 0.3.0 → 0.3.1-alpha.0

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

@@ -8,13 +8,17 @@ import { getAutomationReportRunDir, resolveStoredPath } from '@/lib/automation/a
 // Ensure this route runs in Node.js runtime (not Edge) for file system access
 export const runtime = 'nodejs'
 
+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<Array<{ absolutePath: string; archivePath: string }>> {
+): Promise<ArtifactFile[]> {
   try {
     const entries = await fs.readdir(dir, { withFileTypes: true })
-    const files: Array<{ absolutePath: string; archivePath: string }> = []
+    const files: ArtifactFile[] = []
 
     for (const entry of entries) {
       const absolutePath = path.join(dir, entry.name)
@@ -36,7 +40,7 @@ async function collectRunArtifactFiles(
 }
 
 async function addStoredArtifactFile(
-  archive: ReturnType<typeof archiver>,
+  archive: Archive,
   storedPath: string,
   archivePath: string,
   warningLabel: string,
@@ -57,6 +61,154 @@ function isPathWithinDirectory(targetPath: string, directoryPath: string): boole
   return relativePath !== '' && !relativePath.startsWith('..') && !path.isAbsolute(relativePath)
 }
 
+async function getDownloadTestRun(runId: string) {
+  return prisma.testRun.findUnique({
+    where: { runId },
+    select: {
+      logPath: true,
+      reportPath: true,
+      testCases: {
+        select: {
+          tracePath: true,
+        },
+      },
+    },
+  })
+}
+
+function createZipArchive() {
+  return archiver('zip', {
+    zlib: { level: 9 }, // Maximum compression
+  })
+}
+
+function addRunArtifactFiles(archive: Archive, runArtifactFiles: ArtifactFile[]) {
+  for (const artifactFile of runArtifactFiles) {
+    archive.file(artifactFile.absolutePath, { name: artifactFile.archivePath })
+  }
+
+  return new Set<string>(runArtifactFiles.map(artifactFile => artifactFile.archivePath))
+}
+
+async function addLegacyReportFile(
+  archive: Archive,
+  testRun: DownloadTestRun,
+  runArtifactDir: string,
+  archivedPaths: Set<string>,
+) {
+  if (!testRun.reportPath) {
+    return false
+  }
+
+  const resolvedReportPath = resolveStoredPath(testRun.reportPath)
+  if (isPathWithinDirectory(resolvedReportPath, runArtifactDir) || archivedPaths.has('cucumber.json')) {
+    return false
+  }
+
+  const didAddReportFile = await addStoredArtifactFile(archive, testRun.reportPath, 'cucumber.json', 'Report file')
+  if (didAddReportFile) {
+    archivedPaths.add('cucumber.json')
+  }
+
+  return didAddReportFile
+}
+
+async function addLegacyLogFile(
+  archive: Archive,
+  testRun: DownloadTestRun,
+  runArtifactDir: string,
+  archivedPaths: Set<string>,
+) {
+  if (!testRun.logPath) {
+    return false
+  }
+
+  const resolvedLogPath = resolveStoredPath(testRun.logPath)
+  const archivePath = `logs/${path.basename(testRun.logPath)}`
+  if (isPathWithinDirectory(resolvedLogPath, runArtifactDir) || archivedPaths.has(archivePath)) {
+    return false
+  }
+
+  const didAddLogFile = await addStoredArtifactFile(archive, testRun.logPath, archivePath, 'Log file')
+  if (didAddLogFile) {
+    archivedPaths.add(archivePath)
+  }
+
+  return didAddLogFile
+}
+
+async function addLegacyTraceFiles(
+  archive: Archive,
+  testRun: DownloadTestRun,
+  runArtifactDir: string,
+  archivedPaths: Set<string>,
+) {
+  let didAddAnyTraceFile = false
+  const traceFiles = testRun.testCases.flatMap(({ tracePath }) => (tracePath ? [tracePath] : []))
+
+  for (const tracePath of traceFiles) {
+    const resolvedTracePath = resolveStoredPath(tracePath)
+    const archivePath = `traces/${path.basename(tracePath)}`
+
+    if (isPathWithinDirectory(resolvedTracePath, runArtifactDir) || archivedPaths.has(archivePath)) {
+      continue
+    }
+
+    const didAddTraceFile = await addStoredArtifactFile(archive, tracePath, archivePath, 'Trace file')
+    didAddAnyTraceFile = didAddTraceFile || didAddAnyTraceFile
+    if (didAddTraceFile) {
+      archivedPaths.add(archivePath)
+    }
+  }
+
+  return didAddAnyTraceFile
+}
+
+async function addDownloadArtifacts(archive: Archive, testRun: DownloadTestRun, runArtifactDir: string) {
+  const runArtifactFiles = await collectRunArtifactFiles(runArtifactDir)
+  const archivedPaths = addRunArtifactFiles(archive, runArtifactFiles)
+  const didAddReportFile = await addLegacyReportFile(archive, testRun, runArtifactDir, archivedPaths)
+  const didAddLogFile = await addLegacyLogFile(archive, testRun, runArtifactDir, archivedPaths)
+  const didAddTraceFile = await addLegacyTraceFiles(archive, testRun, runArtifactDir, archivedPaths)
+
+  return runArtifactFiles.length > 0 || didAddReportFile || didAddLogFile || didAddTraceFile
+}
+
+function finalizeArchive(archive: Archive) {
+  const chunks: Buffer[] = []
+
+  const archivePromise = new Promise<Buffer>((resolve, reject) => {
+    archive.on('data', (chunk: Buffer) => {
+      chunks.push(chunk)
+    })
+
+    archive.on('end', () => {
+      resolve(Buffer.concat(chunks))
+    })
+
+    archive.on('error', err => {
+      reject(err)
+    })
+  })
+
+  archive.finalize()
+  return archivePromise
+}
+
+function createZipDownloadResponse(zipBuffer: Buffer, runId: string) {
+  const timestamp = new Date().toISOString().replace(/[:.]/g, '-').slice(0, -5)
+  const filename = `test-run-${runId}-${timestamp}.zip`
+
+  return new NextResponse(new Uint8Array(zipBuffer), {
+    status: 200,
+    headers: {
+      'Content-Type': 'application/zip',
+      'Content-Disposition': `attachment; filename="${filename}"`,
+      'Content-Length': zipBuffer.length.toString(),
+    },
+  })
+}
+
 /**
  * GET handler for downloading a test run's stored artifacts as a zip file
  *
@@ -72,117 +224,22 @@ export async function GET(_request: NextRequest, { params }: { params: Promise<{
   const runArtifactDir = getAutomationReportRunDir(runId)
 
   try {
-    // Verify test run exists
-    const testRun = await prisma.testRun.findUnique({
-      where: { runId },
-      select: {
-        logPath: true,
-        reportPath: true,
-        testCases: {
-          select: {
-            tracePath: true,
-          },
-        },
-      },
-    })
+    const testRun = await getDownloadTestRun(runId)
 
     if (!testRun) {
       return NextResponse.json({ error: 'Test run not found' }, { status: 404 })
     }
 
-    // Create a zip archive
-    const archive = archiver('zip', {
-      zlib: { level: 9 }, // Maximum compression
-    })
-
-    const runArtifactFiles = await collectRunArtifactFiles(runArtifactDir)
-    let hasFiles = runArtifactFiles.length > 0
-    const archivedPaths = new Set<string>(runArtifactFiles.map(artifactFile => artifactFile.archivePath))
-
-    for (const artifactFile of runArtifactFiles) {
-      archive.file(artifactFile.absolutePath, { name: artifactFile.archivePath })
-    }
-
-    if (testRun.reportPath) {
-      const resolvedReportPath = resolveStoredPath(testRun.reportPath)
-      if (!isPathWithinDirectory(resolvedReportPath, runArtifactDir) && !archivedPaths.has('cucumber.json')) {
-        const didAddReportFile = await addStoredArtifactFile(archive, testRun.reportPath, 'cucumber.json', 'Report file')
-        hasFiles = didAddReportFile || hasFiles
-        if (didAddReportFile) {
-          archivedPaths.add('cucumber.json')
-        }
-      }
-    }
-
-    if (testRun.logPath) {
-      const resolvedLogPath = resolveStoredPath(testRun.logPath)
-      const archivePath = `logs/${path.basename(testRun.logPath)}`
-      if (!isPathWithinDirectory(resolvedLogPath, runArtifactDir) && !archivedPaths.has(archivePath)) {
-        const didAddLogFile = await addStoredArtifactFile(archive, testRun.logPath, archivePath, 'Log file')
-        hasFiles = didAddLogFile || hasFiles
-        if (didAddLogFile) {
-          archivedPaths.add(archivePath)
-        }
-      }
-    }
-
-    const traceFiles = testRun.testCases.flatMap(({ tracePath }) => (tracePath ? [tracePath] : []))
-    for (const tracePath of traceFiles) {
-      const resolvedTracePath = resolveStoredPath(tracePath)
-      const archivePath = `traces/${path.basename(tracePath)}`
-
-      if (!isPathWithinDirectory(resolvedTracePath, runArtifactDir) && !archivedPaths.has(archivePath)) {
-        const didAddTraceFile = await addStoredArtifactFile(archive, tracePath, archivePath, 'Trace file')
-        hasFiles = didAddTraceFile || hasFiles
-        if (didAddTraceFile) {
-          archivedPaths.add(archivePath)
-        }
-      }
-    }
+    const archive = createZipArchive()
+    const hasFiles = await addDownloadArtifacts(archive, testRun, runArtifactDir)
 
     // If no files to add, return an error
     if (!hasFiles) {
       return NextResponse.json({ error: 'No run artifacts available for this test run' }, { status: 404 })
     }
 
-    // Create a readable stream to collect the archive data
-    const chunks: Buffer[] = []
-
-    // Set up event handlers before finalizing
-    const archivePromise = new Promise<Buffer>((resolve, reject) => {
-      archive.on('data', (chunk: Buffer) => {
-        chunks.push(chunk)
-      })
-
-      archive.on('end', () => {
-        const zipBuffer = Buffer.concat(chunks)
-        resolve(zipBuffer)
-      })
-
-      archive.on('error', err => {
-        reject(err)
-      })
-    })
-
-    // Finalize the archive
-    archive.finalize()
-
-    // Wait for the archive to complete
-    const zipBuffer = await archivePromise
-
-    // Generate filename with timestamp
-    const timestamp = new Date().toISOString().replace(/[:.]/g, '-').slice(0, -5)
-    const filename = `test-run-${runId}-${timestamp}.zip`
-
-    // Return the zip file as a downloadable response (Uint8Array for BodyInit)
-    return new NextResponse(new Uint8Array(zipBuffer), {
-      status: 200,
-      headers: {
-        'Content-Type': 'application/zip',
-        'Content-Disposition': `attachment; filename="${filename}"`,
-        'Content-Length': zipBuffer.length.toString(),
-      },
-    })
+    const zipBuffer = await finalizeArchive(archive)
+    return createZipDownloadResponse(zipBuffer, runId)
   } catch (error) {
     console.error(`[Download] Error creating zip file for testRunId: ${runId}:`, error)
     return NextResponse.json(

package/templates/starter/src/app/globals.css

@@ -88,3 +88,14 @@ body {
     @apply bg-background text-foreground;
   }
 }
+
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+  }
+}

package/templates/starter/src/app/layout.tsx

@@ -98,34 +98,34 @@ export default function RootLayout({
                     <Logo />
                   </Link>
                 </div>
-                <NavLink href="/" icon={<LayoutDashboard className="h-5 w-5 text-primary" />}>
+                <NavLink href="/" icon={<LayoutDashboard className="size-5 text-primary" />}>
                   Dashboard
                 </NavLink>
                 <NavMenuCardDeck
                   containerButtonText="Automate"
-                  containerButtonIcon={<Bot className="h-5 w-5 text-primary" />}
+                  containerButtonIcon={<Bot className="size-5 text-primary" />}
                   dropdownItems={[
                     {
                       text: 'Test Suites',
-                      icon: <TestTubes className="h-6 w-6 text-primary" />,
+                      icon: <TestTubes className="size-6 text-primary" />,
                       href: '/test-suites',
                       description: 'Group tests into logical units',
                     },
                     {
                       text: 'Test Cases',
-                      icon: <TestTubeDiagonal className="h-6 w-6 text-primary" />,
+                      icon: <TestTubeDiagonal className="size-6 text-primary" />,
                       href: '/test-cases',
                       description: 'Define test scenarios',
                     },
                     {
                       text: 'Test Runs',
-                      icon: <ListChecks className="h-6 w-6 text-primary" />,
+                      icon: <ListChecks className="size-6 text-primary" />,
                       href: '/test-runs',
                       description: 'Execute test scenarios',
                     },
                     {
                       text: 'Reports',
-                      icon: <FileCheck className="h-6 w-6 text-primary" />,
+                      icon: <FileCheck className="size-6 text-primary" />,
                       href: '/reports',
                       description: 'Analyze test results',
                     },
@@ -133,23 +133,23 @@ export default function RootLayout({
                 />
                 <NavMenuCardDeck
                   containerButtonText="Template"
-                  containerButtonIcon={<BrickWall className="h-5 w-5 text-primary" />}
+                  containerButtonIcon={<BrickWall className="size-5 text-primary" />}
                   dropdownItems={[
                     {
                       text: 'Template Steps',
-                      icon: <LayoutTemplate className="h-6 w-6 text-primary" />,
+                      icon: <LayoutTemplate className="size-6 text-primary" />,
                       href: '/template-steps',
                       description: 'Define reusable test steps',
                     },
                     {
                       text: 'Template Step Groups',
-                      icon: <Component className="h-6 w-6 text-primary" />,
+                      icon: <Component className="size-6 text-primary" />,
                       href: '/template-step-groups',
                       description: 'Organize template steps into logical groups',
                     },
                     {
                       text: 'Template Test Cases',
-                      icon: <Blocks className="h-6 w-6 text-primary" />,
+                      icon: <Blocks className="size-6 text-primary" />,
                       href: '/template-test-cases',
                       description: 'Define reusable test scenario templates',
                     },
@@ -157,41 +157,41 @@ export default function RootLayout({
                 />
                 <NavMenuCardDeck
                   containerButtonText="Configuration"
-                  containerButtonIcon={<FileSliders className="h-5 w-5 text-primary" />}
+                  containerButtonIcon={<FileSliders className="size-5 text-primary" />}
                   dropdownItems={[
                     {
                       text: 'Locators',
-                      icon: <Code className="h-6 w-6 text-primary" />,
+                      icon: <Code className="size-6 text-primary" />,
                       href: '/locators',
                       description: 'Define reusable locators',
                     },
                     {
                       text: 'Locator Groups',
-                      icon: <Group className="h-6 w-6 text-primary" />,
+                      icon: <Group className="size-6 text-primary" />,
                       href: '/locator-groups',
                       description: 'Organize locators into logical groups',
                     },
                     {
                       text: 'Modules',
-                      icon: <Puzzle className="h-6 w-6 text-primary" />,
+                      icon: <Puzzle className="size-6 text-primary" />,
                       href: '/modules',
                       description: 'Organize tests into logical units',
                     },
                     {
                       text: 'Environments',
-                      icon: <Server className="h-6 w-6 text-primary" />,
+                      icon: <Server className="size-6 text-primary" />,
                       href: '/environments',
                       description: 'Define test environment configurations',
                     },
                     {
                       text: 'Tags',
-                      icon: <Tag className="h-6 w-6 text-primary" />,
+                      icon: <Tag className="size-6 text-primary" />,
                       href: '/tags',
                       description: 'Define tags for test scenarios and suites',
                     },
                   ]}
                 />
-                <NavLink href="/settings" icon={<Settings2 className="h-5 w-5 text-primary" />}>
+                <NavLink href="/settings" icon={<Settings2 className="size-5 text-primary" />}>
                   Settings
                 </NavLink>
                 <NavCommand className="ml-auto" />

package/templates/starter/src/app/page.tsx

@@ -1,13 +1,13 @@
+import type { Metadata } from 'next'
 import PageHeader from '@/components/typography/page-header'
 import HeaderSubtitle from '@/components/typography/page-header-subtitle'
 import AppDrawer from './(dashboard-components)/app-drawer'
 import {
-  EntityMetrics,
   getDashboardMetricsAction,
   getEntityMetricsAction,
   getTestSuiteExecutionDataAction,
 } from '@/actions/dashboard/dashboard-actions'
-import type { TestSuiteExecutionData } from '@/services/dashboard/dashboard-service'
+import type { EntityMetrics, TestSuiteExecutionData } from '@/services/dashboard/dashboard-service'
 import { DashboardMetrics } from '@prisma/client'
 import QuickActionsDrawer from './(dashboard-components)/quick-actions-drawer'
 import DataCard from './(dashboard-components)/data-card'
@@ -15,12 +15,14 @@ import OngoingTestRunsCard from './(dashboard-components)/ongoing-test-runs-card
 import { DataCardGrid } from './(dashboard-components)/data-card-grid'
 import { ExecutionHealthPanel } from './(dashboard-components)/execution-health-panel'
 
+export const metadata: Metadata = {
+  title: 'Appraise | Dashboard',
+  description: 'Check metrics, entity states, execution health, and quick actions.',
+}
+
 export const dynamic = 'force-dynamic'
 
 const Dashboard = async () => {
-  const metricsResponse = await getDashboardMetricsAction()
-  const metrics = metricsResponse.status === 200 ? (metricsResponse.data as DashboardMetrics | null) : null
-
   const entityMetricsResponse = await getEntityMetricsAction()
   const entityMetrics =
     entityMetricsResponse.status === 200 ? (entityMetricsResponse.data as unknown as EntityMetrics) : null
@@ -28,6 +30,9 @@ const Dashboard = async () => {
     return <div>Error loading entity metrics</div>
   }
 
+  const metricsResponse = await getDashboardMetricsAction()
+  const metrics = metricsResponse.status === 200 ? (metricsResponse.data as DashboardMetrics | null) : null
+
   const { testCasesCount, testSuitesCount, templateStepsCount, runningTestRunsCount } = entityMetrics
 
   // Fetch test suite execution data

package/templates/starter/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/starter/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/starter/src/components/base-node.tsx

@@ -1,11 +1,10 @@
-import { forwardRef, HTMLAttributes } from 'react'
+import type { HTMLAttributes } from 'react'
 
 import { cn } from '@/lib/utils'
 
-export const BaseNode = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement> & { selected?: boolean }>(
-  ({ className, selected, ...props }, ref) => (
+export function BaseNode({ className, selected, ...props }: HTMLAttributes<HTMLDivElement> & { selected?: boolean }) {
+  return (
     <div
-      ref={ref}
       className={cn(
         'relative rounded-md border bg-card p-5 text-card-foreground',
         className,
@@ -15,7 +14,5 @@ export const BaseNode = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement
       tabIndex={0}
       {...props}
     />
-  ),
-)
-
-BaseNode.displayName = 'BaseNode'
+  )
+}

package/templates/starter/src/components/data-state/empty-state.tsx

@@ -27,7 +27,7 @@ const EmptyState = ({
       <EmptyContent>
         <Button asChild>
           <Link href={createRoute}>
-            <SquarePen className="h-4 w-4" />
+            <SquarePen className="size-4" />
             <span className="sr-only">{createText}</span>
             {createText}
           </Link>