create-appraisejs 0.1.6 → 0.1.8-alpha

package/templates/default/src/app/(base)/locators/locator-table-columns.tsx

@@ -1,90 +1,73 @@
-'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 { Locator, LocatorGroup, ConflictResolution } from '@prisma/client'
-import { deleteLocatorAction } from '@/actions/locator/locator-actions'
-import { formatDateTime } from '@/lib/utils'
-import { Badge } from '@/components/ui/badge'
-import { resolveConflictsAction } from '@/actions/conflict/conflict.action'
-
-export const locatorTableCols: ColumnDef<Locator & { locatorGroup: LocatorGroup; conflicts: ConflictResolution[] }>[] =
-  [
-    {
-      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" />,
-      cell: ({ row }) => {
-        const locator = row.original
-        const hasConflicts = locator.conflicts && locator.conflicts.length > 0
-        return (
-          <div className="flex items-center gap-2">
-            <span>{locator.name}</span>
-            {hasConflicts && (
-              <Badge variant="destructive" className="text-xs">
-                Conflict
-              </Badge>
-            )}
-          </div>
-        )
-      },
-    },
-    {
-      accessorKey: 'value',
-      header: ({ column }) => <DataTableColumnHeader column={column} title="Value" />,
-    },
-    {
-      accessorKey: 'locatorGroup.name',
-      header: ({ column }) => <DataTableColumnHeader column={column} title="Locator Group" />,
-    },
-    {
-      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 locator = row.original
-        return (
-          <TableActions
-            modifyLink={`/locators/modify/${locator.id}`}
-            deleteHandler={() => deleteLocatorAction([locator.id])}
-            resolveConflictsHandler={() => resolveConflictsAction([locator.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 { Locator, LocatorGroup, ConflictResolution } from '@prisma/client'
+import { deleteLocatorAction } from '@/actions/locator/locator-actions'
+import { formatDateTime } from '@/lib/utils'
+
+export const locatorTableCols: ColumnDef<Locator & { locatorGroup: LocatorGroup; conflicts: ConflictResolution[] }>[] =
+  [
+    {
+      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: 'value',
+      header: ({ column }) => <DataTableColumnHeader column={column} title="Value" />,
+    },
+    {
+      accessorKey: 'locatorGroup.name',
+      header: ({ column }) => <DataTableColumnHeader column={column} title="Locator Group" />,
+    },
+    {
+      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 locator = row.original
+        return (
+          <TableActions
+            modifyLink={`/locators/modify/${locator.id}`}
+            deleteHandler={() => deleteLocatorAction([locator.id])}
+          />
+        )
+      },
+    },
+  ]

package/templates/default/src/app/(base)/locators/locator-table.tsx

@@ -1,28 +1,28 @@
-import { deleteLocatorAction, getAllLocatorsAction } from '@/actions/locator/locator-actions'
-import { DataTable } from '@/components/ui/data-table'
-import { locatorTableCols } from './locator-table-columns'
-import { Locator, LocatorGroup, ConflictResolution } from '@prisma/client'
-
-const LocatorTable = async () => {
-  const { data: locators, error: locatorsError } = await getAllLocatorsAction()
-
-  if (locatorsError) {
-    return <div>Error: {locatorsError}</div>
-  }
-
-  return (
-    <>
-      <DataTable
-        columns={locatorTableCols}
-        data={locators as (Locator & { locatorGroup: LocatorGroup; conflicts: ConflictResolution[] })[]}
-        filterColumn="name"
-        filterPlaceholder="Filter by name..."
-        createLink="/locators/create"
-        modifyLink="/locators/modify"
-        deleteAction={deleteLocatorAction}
-      />
-    </>
-  )
-}
-
-export default LocatorTable
+import { deleteLocatorAction, getAllLocatorsAction } from '@/actions/locator/locator-actions'
+import { DataTable } from '@/components/ui/data-table'
+import { locatorTableCols } from './locator-table-columns'
+import { Locator, LocatorGroup, ConflictResolution } from '@prisma/client'
+
+const LocatorTable = async () => {
+  const { data: locators, error: locatorsError } = await getAllLocatorsAction()
+
+  if (locatorsError) {
+    return <div>Error: {locatorsError}</div>
+  }
+
+  return (
+    <>
+      <DataTable
+        columns={locatorTableCols}
+        data={locators as (Locator & { locatorGroup: LocatorGroup; conflicts: ConflictResolution[] })[]}
+        filterColumn="name"
+        filterPlaceholder="Filter by name..."
+        createLink="/locators/create"
+        modifyLink="/locators/modify"
+        deleteAction={deleteLocatorAction}
+      />
+    </>
+  )
+}
+
+export default LocatorTable

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

@@ -1,45 +1,45 @@
-import { getLocatorByIdAction, updateLocatorAction } from '@/actions/locator/locator-actions'
-import { Locator, LocatorGroup } from '@prisma/client'
-import React from 'react'
-import LocatorForm from '../../locator-form'
-import { getAllLocatorGroupsAction } from '@/actions/locator-groups/locator-group-actions'
-import { Metadata } from 'next'
-
-export const metadata: Metadata = {
-  title: 'Appraise | Modify Locator',
-  description: 'Update locator configuration',
-}
-
-const ModifyLocator = async ({ params }: { params: Promise<{ id: string }> }) => {
-  const { id } = await params
-  const { data, error } = await getLocatorByIdAction(id)
-
-  if (error) {
-    return <div>Error: {error}</div>
-  }
-
-  const locator = data as Locator & { locatorGroup: LocatorGroup }
-
-  const { data: locatorGroupList, error: locatorGroupListError } = await getAllLocatorGroupsAction()
-
-  if (locatorGroupListError) {
-    return <div>Error: {locatorGroupListError}</div>
-  }
-
-  return (
-    <LocatorForm
-      defaultValues={{
-        name: locator.name ?? '',
-        value: locator.value ?? '',
-        locatorGroupId: locator.locatorGroupId ?? '',
-      }}
-      successTitle="Locator updated"
-      successMessage="Locator updated successfully"
-      onSubmitAction={updateLocatorAction}
-      id={id}
-      locatorGroupList={locatorGroupList as LocatorGroup[]}
-    />
-  )
-}
-
-export default ModifyLocator
+import { getLocatorByIdAction, updateLocatorAction } from '@/actions/locator/locator-actions'
+import { Locator, LocatorGroup } from '@prisma/client'
+import React from 'react'
+import LocatorForm from '../../locator-form'
+import { getAllLocatorGroupsAction } from '@/actions/locator-groups/locator-group-actions'
+import { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  title: 'Appraise | Modify Locator',
+  description: 'Update locator configuration',
+}
+
+const ModifyLocator = async ({ params }: { params: Promise<{ id: string }> }) => {
+  const { id } = await params
+  const { data, error } = await getLocatorByIdAction(id)
+
+  if (error) {
+    return <div>Error: {error}</div>
+  }
+
+  const locator = data as Locator & { locatorGroup: LocatorGroup }
+
+  const { data: locatorGroupList, error: locatorGroupListError } = await getAllLocatorGroupsAction()
+
+  if (locatorGroupListError) {
+    return <div>Error: {locatorGroupListError}</div>
+  }
+
+  return (
+    <LocatorForm
+      defaultValues={{
+        name: locator.name ?? '',
+        value: locator.value ?? '',
+        locatorGroupId: locator.locatorGroupId ?? '',
+      }}
+      successTitle="Locator updated"
+      successMessage="Locator updated successfully"
+      onSubmitAction={updateLocatorAction}
+      id={id}
+      locatorGroupList={locatorGroupList as LocatorGroup[]}
+    />
+  )
+}
+
+export default ModifyLocator

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

@@ -1,65 +1,65 @@
-import PageHeader from '@/components/typography/page-header'
-import HeaderSubtitle from '@/components/typography/page-header-subtitle'
-import React from 'react'
-import { Code } from 'lucide-react'
-import LocatorTable from './locator-table'
-import { Suspense } from 'react'
-import DataTableSkeleton from '@/components/loading-skeleton/data-table/data-table-skeleton'
-import { getAllLocatorsAction } from '@/actions/locator/locator-actions'
-import EmptyState from '@/components/data-state/empty-state'
-import { Locator, LocatorGroup } from '@prisma/client'
-import { Metadata } from 'next'
-
-export const metadata: Metadata = {
-  title: 'Appraise | Locators',
-  description: 'Manage locators for identifying elements on pages',
-}
-
-const Locators = async () => {
-  const { data: locators, error: locatorsError } = await getAllLocatorsAction()
-
-  if (locatorsError) {
-    return <div>Error: {locatorsError}</div>
-  }
-
-  const locatorsData = locators as (Locator & { locatorGroup: LocatorGroup })[]
-
-  if (!locatorsData || locatorsData.length === 0) {
-    return (
-      <div className="flex min-h-[calc(100vh-20rem)] items-center justify-center">
-        <EmptyState
-          icon={<Code className="h-8 w-8" />}
-          title="No locators found"
-          description="Get started by creating a locator to identify elements on your pages"
-          createRoute="/locators/create"
-          createText="Create Locator"
-        />
-      </div>
-    )
-  }
-
-  return (
-    <>
-      <div className="mb-8">
-        <div className="flex items-center justify-between">
-          <div>
-            <PageHeader>
-              <span className="flex items-center">
-                <Code className="mr-2 h-8 w-8" />
-                Locators
-              </span>
-            </PageHeader>
-            <HeaderSubtitle>
-              Locators are the elements that are used to identify the elements on the page
-            </HeaderSubtitle>
-          </div>
-        </div>
-      </div>
-      <Suspense fallback={<DataTableSkeleton />}>
-        <LocatorTable />
-      </Suspense>
-    </>
-  )
-}
-
-export default Locators
+import PageHeader from '@/components/typography/page-header'
+import HeaderSubtitle from '@/components/typography/page-header-subtitle'
+import React from 'react'
+import { Code } from 'lucide-react'
+import LocatorTable from './locator-table'
+import { Suspense } from 'react'
+import DataTableSkeleton from '@/components/loading-skeleton/data-table/data-table-skeleton'
+import { getAllLocatorsAction } from '@/actions/locator/locator-actions'
+import EmptyState from '@/components/data-state/empty-state'
+import { Locator, LocatorGroup } from '@prisma/client'
+import { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  title: 'Appraise | Locators',
+  description: 'Manage locators for identifying elements on pages',
+}
+
+const Locators = async () => {
+  const { data: locators, error: locatorsError } = await getAllLocatorsAction()
+
+  if (locatorsError) {
+    return <div>Error: {locatorsError}</div>
+  }
+
+  const locatorsData = locators as (Locator & { locatorGroup: LocatorGroup })[]
+
+  if (!locatorsData || locatorsData.length === 0) {
+    return (
+      <div className="flex min-h-[calc(100vh-20rem)] items-center justify-center">
+        <EmptyState
+          icon={<Code className="h-8 w-8" />}
+          title="No locators found"
+          description="Get started by creating a locator to identify elements on your pages"
+          createRoute="/locators/create"
+          createText="Create Locator"
+        />
+      </div>
+    )
+  }
+
+  return (
+    <>
+      <div className="mb-8">
+        <div className="flex items-center justify-between">
+          <div>
+            <PageHeader>
+              <span className="flex items-center">
+                <Code className="mr-2 h-8 w-8" />
+                Locators
+              </span>
+            </PageHeader>
+            <HeaderSubtitle>
+              Locators are the elements that are used to identify the elements on the page
+            </HeaderSubtitle>
+          </div>
+        </div>
+      </div>
+      <Suspense fallback={<DataTableSkeleton />}>
+        <LocatorTable />
+      </Suspense>
+    </>
+  )
+}
+
+export default Locators

package/templates/default/src/app/(base)/locators/sync-locators-button.tsx

@@ -1,66 +1,66 @@
-'use client'
-
-import { Button } from '@/components/ui/button'
-import { RefreshCw } from 'lucide-react'
-import { useState } from 'react'
-import { syncLocatorsFromFilesAction } from '@/actions/locator/locator-actions'
-import { toast } from '@/hooks/use-toast'
-import { useRouter } from 'next/navigation'
-
-export function SyncLocatorsButton() {
-  const [isLoading, setIsLoading] = useState(false)
-  const router = useRouter()
-
-  const handleSync = async () => {
-    setIsLoading(true)
-    try {
-      const result = await syncLocatorsFromFilesAction()
-
-      if (result.status === 200 && result.data) {
-        const { synced, conflicts, errors } = result.data as {
-          synced: number
-          conflicts: number
-          errors: string[]
-        }
-
-        if (errors.length > 0) {
-          toast({
-            variant: 'destructive',
-            title: 'Sync completed with errors',
-            description: `Synced ${synced} locators, ${conflicts} conflicts detected. ${errors.length} error(s) occurred.`,
-          })
-        } else {
-          toast({
-            title: 'Sync completed successfully',
-            description: `Synced ${synced} locators, ${conflicts} conflicts detected.`,
-          })
-        }
-
-        // Refresh the page to show updated data
-        router.refresh()
-      } else {
-        toast({
-          variant: 'destructive',
-          title: 'Sync failed',
-          description: result.error || 'An error occurred during sync',
-        })
-      }
-    } catch (error) {
-      toast({
-        variant: 'destructive',
-        title: 'Sync failed',
-        description: `An error occurred: ${error}`,
-      })
-    } finally {
-      setIsLoading(false)
-    }
-  }
-
-  return (
-    <Button onClick={handleSync} disabled={isLoading} variant="outline">
-      <RefreshCw className={`h-4 w-4 ${isLoading ? 'animate-spin' : ''}`} />
-      {isLoading ? 'Syncing...' : 'Sync Locators'}
-    </Button>
-  )
-}
-
+'use client'
+
+import { Button } from '@/components/ui/button'
+import { RefreshCw } from 'lucide-react'
+import { useState } from 'react'
+import { syncLocatorsFromFilesAction } from '@/actions/locator/locator-actions'
+import { toast } from '@/hooks/use-toast'
+import { useRouter } from 'next/navigation'
+
+export function SyncLocatorsButton() {
+  const [isLoading, setIsLoading] = useState(false)
+  const router = useRouter()
+
+  const handleSync = async () => {
+    setIsLoading(true)
+    try {
+      const result = await syncLocatorsFromFilesAction()
+
+      if (result.status === 200 && result.data) {
+        const { synced, conflicts, errors } = result.data as {
+          synced: number
+          conflicts: number
+          errors: string[]
+        }
+
+        if (errors.length > 0) {
+          toast({
+            variant: 'destructive',
+            title: 'Sync completed with errors',
+            description: `Synced ${synced} locators, ${conflicts} conflicts detected. ${errors.length} error(s) occurred.`,
+          })
+        } else {
+          toast({
+            title: 'Sync completed successfully',
+            description: `Synced ${synced} locators, ${conflicts} conflicts detected.`,
+          })
+        }
+
+        // Refresh the page to show updated data
+        router.refresh()
+      } else {
+        toast({
+          variant: 'destructive',
+          title: 'Sync failed',
+          description: result.error || 'An error occurred during sync',
+        })
+      }
+    } catch (error) {
+      toast({
+        variant: 'destructive',
+        title: 'Sync failed',
+        description: `An error occurred: ${error}`,
+      })
+    } finally {
+      setIsLoading(false)
+    }
+  }
+
+  return (
+    <Button onClick={handleSync} disabled={isLoading} variant="outline">
+      <RefreshCw className={`h-4 w-4 ${isLoading ? 'animate-spin' : ''}`} />
+      {isLoading ? 'Syncing...' : 'Sync Locators'}
+    </Button>
+  )
+}
+

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

@@ -1,34 +1,34 @@
-import { createModuleAction, getAllModulesAction } from '@/actions/modules/module-actions'
-import ModuleForm from '../module-form'
-import { Module } from '@prisma/client'
-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 | Create Module',
-  description: 'Create a new module to be used in your test cases',
-}
-
-const CreateModule = async () => {
-  const { data: modules } = await getAllModulesAction()
-
-  const parentOptions = (Array.isArray(modules) ? modules : []) as (Module & { parent: { name: string } })[]
-
-  return (
-    <>
-      <div className="mb-8">
-        <PageHeader>Create Module</PageHeader>
-        <HeaderSubtitle>Create a new module to be used in your test cases.</HeaderSubtitle>
-      </div>
-      <ModuleForm
-        parentOptions={parentOptions}
-        successTitle="Module created"
-        successMessage="Module created successfully"
-        onSubmitAction={createModuleAction}
-      />
-    </>
-  )
-}
-
-export default CreateModule
+import { createModuleAction, getAllModulesAction } from '@/actions/modules/module-actions'
+import ModuleForm from '../module-form'
+import { Module } from '@prisma/client'
+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 | Create Module',
+  description: 'Create a new module to be used in your test cases',
+}
+
+const CreateModule = async () => {
+  const { data: modules } = await getAllModulesAction()
+
+  const parentOptions = (Array.isArray(modules) ? modules : []) as (Module & { parent: { name: string } })[]
+
+  return (
+    <>
+      <div className="mb-8">
+        <PageHeader>Create Module</PageHeader>
+        <HeaderSubtitle>Create a new module to be used in your test cases.</HeaderSubtitle>
+      </div>
+      <ModuleForm
+        parentOptions={parentOptions}
+        successTitle="Module created"
+        successMessage="Module created successfully"
+        onSubmitAction={createModuleAction}
+      />
+    </>
+  )
+}
+
+export default CreateModule