create-appraisejs 0.2.0-alpha.6 → 0.3.0-alpha.0

package/templates/default/src/app/(base)/environments/environment-table-columns.tsx

@@ -1,96 +1,96 @@
-'use client'
-
-import { DataTableColumnHeader } from '@/components/ui/data-table-column-header'
-import { ColumnDef } from '@tanstack/react-table'
-
-import { Checkbox } from '@/components/ui/checkbox'
-import TableActions from '@/components/table/table-actions'
-import { Environment } from '@prisma/client'
-import { deleteEnvironmentAction } from '@/actions/environments/environment-actions'
-import { formatDateTime } from '@/lib/utils'
-
-export const environmentTableCols: ColumnDef<Environment>[] = [
-  {
-    id: 'select',
-    header: ({ table }) => (
-      <Checkbox
-        checked={table.getIsAllPageRowsSelected() || (table.getIsSomePageRowsSelected() && 'indeterminate')}
-        onCheckedChange={value => table.toggleAllPageRowsSelected(!!value)}
-        aria-label="Select all"
-        className="mr-2"
-      />
-    ),
-    cell: ({ row }) => (
-      <Checkbox
-        checked={row.getIsSelected()}
-        onCheckedChange={value => row.toggleSelected(!!value)}
-        aria-label="Select row"
-        className="mr-2"
-      />
-    ),
-    enableSorting: false,
-    enableHiding: false,
-  },
-  {
-    accessorKey: 'name',
-    header: ({ column }) => <DataTableColumnHeader column={column} title="Name" />,
-  },
-  {
-    accessorKey: 'baseUrl',
-    header: ({ column }) => <DataTableColumnHeader column={column} title="Base URL" />,
-    cell: ({ row }) => {
-      const baseUrl = row.original.baseUrl
-      return (
-        <div className="max-w-[200px] truncate font-mono text-sm" title={baseUrl}>
-          {baseUrl}
-        </div>
-      )
-    },
-  },
-  {
-    accessorKey: 'apiBaseUrl',
-    header: ({ column }) => <DataTableColumnHeader column={column} title="API Base URL" />,
-    cell: ({ row }) => {
-      const apiBaseUrl = row.original.apiBaseUrl
-      return (
-        <div className="max-w-[200px] truncate font-mono text-sm" title={apiBaseUrl || ''}>
-          {apiBaseUrl || '-'}
-        </div>
-      )
-    },
-  },
-  {
-    accessorKey: 'username',
-    header: ({ column }) => <DataTableColumnHeader column={column} title="Username" />,
-    cell: ({ row }) => {
-      const username = row.original.username
-      return <div className="max-w-[150px] truncate">{username || '-'}</div>
-    },
-  },
-  {
-    accessorKey: 'createdAt',
-    header: ({ column }) => <DataTableColumnHeader column={column} title="Created At" />,
-    cell: ({ row }) => {
-      return formatDateTime(row.original.createdAt)
-    },
-  },
-  {
-    accessorKey: 'updatedAt',
-    header: ({ column }) => <DataTableColumnHeader column={column} title="Updated At" />,
-    cell: ({ row }) => {
-      return formatDateTime(row.original.updatedAt)
-    },
-  },
-  {
-    id: 'actions',
-    cell: ({ row }) => {
-      const environmentData = row.original
-      return (
-        <TableActions
-          modifyLink={`/environments/modify/${environmentData.id}`}
-          deleteHandler={() => deleteEnvironmentAction([environmentData.id])}
-        />
-      )
-    },
-  },
-]
+'use client'
+
+import { DataTableColumnHeader } from '@/components/ui/data-table-column-header'
+import { ColumnDef } from '@tanstack/react-table'
+
+import { Checkbox } from '@/components/ui/checkbox'
+import TableActions from '@/components/table/table-actions'
+import { deleteEnvironmentAction } from '@/actions/environments/environment-actions'
+import { formatDateTime } from '@/lib/utils'
+import { type EnvironmentTableRow } from './environment-helpers'
+
+export const environmentTableCols: ColumnDef<EnvironmentTableRow>[] = [
+  {
+    id: 'select',
+    header: ({ table }) => (
+      <Checkbox
+        checked={table.getIsAllPageRowsSelected() || (table.getIsSomePageRowsSelected() && 'indeterminate')}
+        onCheckedChange={value => table.toggleAllPageRowsSelected(!!value)}
+        aria-label="Select all"
+        className="mr-2"
+      />
+    ),
+    cell: ({ row }) => (
+      <Checkbox
+        checked={row.getIsSelected()}
+        onCheckedChange={value => row.toggleSelected(!!value)}
+        aria-label="Select row"
+        className="mr-2"
+      />
+    ),
+    enableSorting: false,
+    enableHiding: false,
+  },
+  {
+    accessorKey: 'name',
+    header: ({ column }) => <DataTableColumnHeader column={column} title="Name" />,
+  },
+  {
+    accessorKey: 'baseUrl',
+    header: ({ column }) => <DataTableColumnHeader column={column} title="Base URL" />,
+    cell: ({ row }) => {
+      const baseUrl = row.original.baseUrl
+      return (
+        <div className="max-w-[200px] truncate font-mono text-sm" title={baseUrl}>
+          {baseUrl}
+        </div>
+      )
+    },
+  },
+  {
+    accessorKey: 'apiBaseUrl',
+    header: ({ column }) => <DataTableColumnHeader column={column} title="API Base URL" />,
+    cell: ({ row }) => {
+      const apiBaseUrl = row.original.apiBaseUrl
+      return (
+        <div className="max-w-[200px] truncate font-mono text-sm" title={apiBaseUrl || ''}>
+          {apiBaseUrl || '-'}
+        </div>
+      )
+    },
+  },
+  {
+    accessorKey: 'username',
+    header: ({ column }) => <DataTableColumnHeader column={column} title="Username" />,
+    cell: ({ row }) => {
+      const username = row.original.username
+      return <div className="max-w-[150px] truncate">{username || '-'}</div>
+    },
+  },
+  {
+    accessorKey: 'createdAt',
+    header: ({ column }) => <DataTableColumnHeader column={column} title="Created At" />,
+    cell: ({ row }) => {
+      return formatDateTime(row.original.createdAt)
+    },
+  },
+  {
+    accessorKey: 'updatedAt',
+    header: ({ column }) => <DataTableColumnHeader column={column} title="Updated At" />,
+    cell: ({ row }) => {
+      return formatDateTime(row.original.updatedAt)
+    },
+  },
+  {
+    id: 'actions',
+    cell: ({ row }) => {
+      const environmentData = row.original
+      return (
+        <TableActions
+          modifyLink={`/environments/modify/${environmentData.id}`}
+          deleteHandler={() => deleteEnvironmentAction([environmentData.id])}
+        />
+      )
+    },
+  },
+]

package/templates/default/src/app/(base)/environments/environment-table.tsx

@@ -1,24 +1,25 @@
-import { DataTable } from '@/components/ui/data-table'
-import { Environment } from '@prisma/client'
-import { getAllEnvironmentsAction, deleteEnvironmentAction } from '@/actions/environments/environment-actions'
-import { environmentTableCols } from './environment-table-columns'
-
-const EnvironmentTable = async () => {
-  const { data: environments } = await getAllEnvironmentsAction()
-
-  return (
-    <>
-      <DataTable
-        columns={environmentTableCols}
-        data={environments as Environment[]}
-        filterColumn="name"
-        filterPlaceholder="Filter by name..."
-        createLink="/environments/create"
-        modifyLink="/environments/modify"
-        deleteAction={deleteEnvironmentAction}
-      />
-    </>
-  )
-}
-
-export default EnvironmentTable
+import { DataTable } from '@/components/ui/data-table'
+import { getAllEnvironmentsAction, deleteEnvironmentAction } from '@/actions/environments/environment-actions'
+import { environmentTableCols } from './environment-table-columns'
+import { getEnvironmentTableRows } from './environment-helpers'
+
+const EnvironmentTable = async () => {
+  const { data: environments } = await getAllEnvironmentsAction()
+  const environmentRows = getEnvironmentTableRows(environments)
+
+  return (
+    <>
+      <DataTable
+        columns={environmentTableCols}
+        data={environmentRows}
+        filterColumn="name"
+        filterPlaceholder="Filter by name..."
+        createLink="/environments/create"
+        modifyLink="/environments/modify"
+        deleteAction={deleteEnvironmentAction}
+      />
+    </>
+  )
+}
+
+export default EnvironmentTable

package/templates/default/src/app/(base)/environments/modify/[id]/page.tsx

@@ -1,46 +1,49 @@
-import { getEnvironmentByIdAction, updateEnvironmentAction } from '@/actions/environments/environment-actions'
-import { Environment } from '@prisma/client'
-import EnvironmentForm from '../../environment-form'
-import PageHeader from '@/components/typography/page-header'
-import HeaderSubtitle from '@/components/typography/page-header-subtitle'
-import { Metadata } from 'next'
-
-export const metadata: Metadata = {
-  title: 'Appraise | Modify Environment',
-  description: 'Update the environment configuration',
-}
-
-const ModifyEnvironment = async ({ params }: { params: Promise<{ id: string }> }) => {
-  const { id } = await params
-  const { data: environmentToBeEditedData, error: environmentToBeEditedError } = await getEnvironmentByIdAction(id)
-
-  if (environmentToBeEditedError) {
-    return <div>Error: {environmentToBeEditedError}</div>
-  }
-
-  const environmentData = environmentToBeEditedData as Environment
-
-  return (
-    <>
-      <div className="mb-8">
-        <PageHeader>Modify Environment</PageHeader>
-        <HeaderSubtitle>Update the environment configuration.</HeaderSubtitle>
-      </div>
-      <EnvironmentForm
-        id={id}
-        defaultValues={{
-          name: environmentData.name,
-          baseUrl: environmentData.baseUrl,
-          apiBaseUrl: environmentData.apiBaseUrl || '',
-          username: environmentData.username || '',
-          password: environmentData.password || '',
-        }}
-        successTitle="Environment updated"
-        successMessage="Environment updated successfully"
-        onSubmitAction={updateEnvironmentAction}
-      />
-    </>
-  )
-}
-
-export default ModifyEnvironment
+import { getEnvironmentByIdAction, updateEnvironmentAction } from '@/actions/environments/environment-actions'
+import EnvironmentForm from '../../environment-form'
+import PageHeader from '@/components/typography/page-header'
+import HeaderSubtitle from '@/components/typography/page-header-subtitle'
+import { Metadata } from 'next'
+import { getEnvironmentTableRows } from '../../environment-helpers'
+
+export const metadata: Metadata = {
+  title: 'Appraise | Modify Environment',
+  description: 'Update the environment configuration',
+}
+
+const ModifyEnvironment = async ({ params }: { params: Promise<{ id: string }> }) => {
+  const { id } = await params
+  const { data: environmentToBeEditedData, error: environmentToBeEditedError } = await getEnvironmentByIdAction(id)
+
+  if (environmentToBeEditedError) {
+    return <div>Error: {environmentToBeEditedError}</div>
+  }
+
+  const [environmentData] = getEnvironmentTableRows([environmentToBeEditedData])
+  if (!environmentData) {
+    return <div>Error: Environment data is unavailable.</div>
+  }
+
+  return (
+    <>
+      <div className="mb-8">
+        <PageHeader>Modify Environment</PageHeader>
+        <HeaderSubtitle>Update the environment configuration.</HeaderSubtitle>
+      </div>
+      <EnvironmentForm
+        id={id}
+        defaultValues={{
+          name: environmentData.name,
+          baseUrl: environmentData.baseUrl,
+          apiBaseUrl: environmentData.apiBaseUrl || '',
+          username: environmentData.username || '',
+          password: environmentData.password || '',
+        }}
+        successTitle="Environment updated"
+        successMessage="Environment updated successfully"
+        onSubmitAction={updateEnvironmentAction}
+      />
+    </>
+  )
+}
+
+export default ModifyEnvironment

package/templates/default/src/app/(base)/environments/page.tsx

@@ -1,59 +1,59 @@
-import PageHeader from '@/components/typography/page-header'
-import HeaderSubtitle from '@/components/typography/page-header-subtitle'
-import React from 'react'
-import { Server } from 'lucide-react'
-import EnvironmentTable from './environment-table'
-import { Suspense } from 'react'
-import DataTableSkeleton from '@/components/loading-skeleton/data-table/data-table-skeleton'
-import { getAllEnvironmentsAction } from '@/actions/environments/environment-actions'
-import EmptyState from '@/components/data-state/empty-state'
-import { Environment } from '@prisma/client'
-import { Metadata } from 'next'
-
-export const metadata: Metadata = {
-  title: 'Appraise | Environments',
-  description: 'Manage test environments and their configurations',
-}
-
-const Environments = async () => {
-  const { data: environments, error: environmentsError } = await getAllEnvironmentsAction()
-
-  if (environmentsError) {
-    return <div>Error: {environmentsError}</div>
-  }
-
-  const environmentsData = environments as Environment[]
-
-  if (!environmentsData || environmentsData.length === 0) {
-    return (
-      <div className="flex min-h-[calc(100vh-20rem)] items-center justify-center">
-        <EmptyState
-          icon={<Server className="h-8 w-8" />}
-          title="No environments found"
-          description="Get started by creating an environment to manage your test configurations"
-          createRoute="/environments/create"
-          createText="Create Environment"
-        />
-      </div>
-    )
-  }
-
-  return (
-    <>
-      <div className="mb-8">
-        <PageHeader>
-          <span className="flex items-center">
-            <Server className="mr-2 h-8 w-8" />
-            Environments
-          </span>
-        </PageHeader>
-        <HeaderSubtitle>Manage test environments and their configurations</HeaderSubtitle>
-      </div>
-      <Suspense fallback={<DataTableSkeleton />}>
-        <EnvironmentTable />
-      </Suspense>
-    </>
-  )
-}
-
-export default Environments
+import PageHeader from '@/components/typography/page-header'
+import HeaderSubtitle from '@/components/typography/page-header-subtitle'
+import React from 'react'
+import { Server } from 'lucide-react'
+import EnvironmentTable from './environment-table'
+import { Suspense } from 'react'
+import DataTableSkeleton from '@/components/loading-skeleton/data-table/data-table-skeleton'
+import { getAllEnvironmentsAction } from '@/actions/environments/environment-actions'
+import EmptyState from '@/components/data-state/empty-state'
+import { Metadata } from 'next'
+import { getEnvironmentTableRows } from './environment-helpers'
+
+export const metadata: Metadata = {
+  title: 'Appraise | Environments',
+  description: 'Manage test environments and their configurations',
+}
+
+const Environments = async () => {
+  const { data: environments, error: environmentsError } = await getAllEnvironmentsAction()
+
+  if (environmentsError) {
+    return <div>Error: {environmentsError}</div>
+  }
+
+  const environmentsData = getEnvironmentTableRows(environments)
+
+  if (!environmentsData || environmentsData.length === 0) {
+    return (
+      <div className="flex min-h-[calc(100vh-20rem)] items-center justify-center">
+        <EmptyState
+          icon={<Server className="h-8 w-8" />}
+          title="No environments found"
+          description="Get started by creating an environment to manage your test configurations"
+          createRoute="/environments/create"
+          createText="Create Environment"
+        />
+      </div>
+    )
+  }
+
+  return (
+    <>
+      <div className="mb-8">
+        <PageHeader>
+          <span className="flex items-center">
+            <Server className="mr-2 h-8 w-8" />
+            Environments
+          </span>
+        </PageHeader>
+        <HeaderSubtitle>Manage test environments and their configurations</HeaderSubtitle>
+      </div>
+      <Suspense fallback={<DataTableSkeleton />}>
+        <EnvironmentTable />
+      </Suspense>
+    </>
+  )
+}
+
+export default Environments

package/templates/default/src/app/(base)/layout.tsx

@@ -1,10 +1,10 @@
-/**
- * All (base) routes depend on server data (Prisma). Force dynamic rendering
- * so these pages are not statically generated at build time (e.g. in CI where
- * no database is available).
- */
-export const dynamic = 'force-dynamic'
-
-export default function BaseLayout({ children }: { children: React.ReactNode }) {
-  return <>{children}</>
-}
+/**
+ * All (base) routes depend on server data (Prisma). Force dynamic rendering
+ * so these pages are not statically generated at build time (e.g. in CI where
+ * no database is available).
+ */
+export const dynamic = 'force-dynamic'
+
+export default function BaseLayout({ children }: { children: React.ReactNode }) {
+  return <>{children}</>
+}

package/templates/default/src/app/(base)/locator-groups/create/page.tsx

@@ -1,44 +1,44 @@
-import { createLocatorGroupAction } from '@/actions/locator-groups/locator-group-actions'
-import PageHeader from '@/components/typography/page-header'
-import HeaderSubtitle from '@/components/typography/page-header-subtitle'
-import { Group } from 'lucide-react'
-import React from 'react'
-import LocatorGroupForm from '../locator-group-form'
-import { getAllModulesAction } from '@/actions/modules/module-actions'
-import { Module } from '@prisma/client'
-import { Metadata } from 'next'
-
-export const metadata: Metadata = {
-  title: 'Appraise | Create Locator Group',
-  description: 'Create a new locator group',
-}
-
-const CreateLocatorGroup = async () => {
-  const { data: moduleList, error: moduleListError } = await getAllModulesAction()
-
-  if (moduleListError) {
-    return <div>Error: {moduleListError}</div>
-  }
-
-  return (
-    <>
-      <div className="mb-8">
-        <PageHeader>
-          <span className="flex items-center">
-            <Group className="mr-2 h-8 w-8" />
-            Create Locator Group
-          </span>
-        </PageHeader>
-        <HeaderSubtitle>Create a new locator group.</HeaderSubtitle>
-      </div>
-      <LocatorGroupForm
-        moduleList={moduleList as Module[]}
-        onSubmitAction={createLocatorGroupAction}
-        successTitle="Locator Group Created"
-        successMessage="The locator group has been created successfully."
-      />
-    </>
-  )
-}
-
-export default CreateLocatorGroup
+import { createLocatorGroupAction } from '@/actions/locator-groups/locator-group-actions'
+import PageHeader from '@/components/typography/page-header'
+import HeaderSubtitle from '@/components/typography/page-header-subtitle'
+import { Group } from 'lucide-react'
+import React from 'react'
+import LocatorGroupForm from '../locator-group-form'
+import { getAllModulesAction } from '@/actions/modules/module-actions'
+import { Module } from '@prisma/client'
+import { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  title: 'Appraise | Create Locator Group',
+  description: 'Create a new locator group',
+}
+
+const CreateLocatorGroup = async () => {
+  const { data: moduleList, error: moduleListError } = await getAllModulesAction()
+
+  if (moduleListError) {
+    return <div>Error: {moduleListError}</div>
+  }
+
+  return (
+    <>
+      <div className="mb-8">
+        <PageHeader>
+          <span className="flex items-center">
+            <Group className="mr-2 h-8 w-8" />
+            Create Locator Group
+          </span>
+        </PageHeader>
+        <HeaderSubtitle>Create a new locator group.</HeaderSubtitle>
+      </div>
+      <LocatorGroupForm
+        moduleList={moduleList as Module[]}
+        onSubmitAction={createLocatorGroupAction}
+        successTitle="Locator Group Created"
+        successMessage="The locator group has been created successfully."
+      />
+    </>
+  )
+}
+
+export default CreateLocatorGroup