betterstart-cli 0.0.102 → 0.0.104

package/dist/assets/adapters/next/templates/renderers/generators/sortable-header/build-sortable-header-def.ts

@@ -0,0 +1,14 @@
+export function renderBuildSortableHeaderDefTemplate({
+  sortLabelExpr,
+  sortableHeaderButtonJsx
+}: {
+  sortLabelExpr: string
+  sortableHeaderButtonJsx: string
+}): string {
+  return `header: ({ column }) => {
+      ${sortLabelExpr}
+      return (
+        ${sortableHeaderButtonJsx}
+      )
+    }`
+}

package/dist/assets/adapters/next/templates/renderers/generators/table.ts

@@ -0,0 +1,284 @@
+export function renderTableClientModuleTemplate({
+  hasEditRouterImport,
+  plural,
+  schemaName,
+  singular,
+  actionImportPath,
+  filterProps,
+  filterParams,
+  hasEditRouterSetup,
+  camelPlural,
+  schemaLabel,
+  hasEditEnabled,
+  hasEditRowClickHandler
+}: {
+  hasEditRouterImport: string
+  plural: string
+  schemaName: string
+  singular: string
+  actionImportPath: string
+  filterProps: string
+  filterParams: string
+  hasEditRouterSetup: string
+  camelPlural: string
+  schemaLabel: string
+  hasEditEnabled: string
+  hasEditRowClickHandler: string
+}): string {
+  return `'use client'
+
+import {
+  DataTablePagination,
+} from '@admin/components/shared/data-table/data-table-pagination'
+import {
+  DataGrid,
+  DataGridBody,
+  DataGridCell,
+  DataGridHead,
+  DataGridHeader,
+  DataGridRow
+} from '@admin/components/shared/data-table/data-grid'
+import {
+  type ColumnDef,
+  flexRender,
+  getCoreRowModel,
+  useReactTable
+} from '@tanstack/react-table'
+import { GripVertical } from 'lucide-react'
+import { parseAsInteger, parseAsString, useQueryStates } from 'nuqs'
+${hasEditRouterImport}import { use${plural} } from '@admin/hooks/use-${schemaName}'
+import type { ${singular} } from '@admin/actions/${actionImportPath}'
+import { useTableUtils } from '@admin/hooks/use-table-utils'
+import { cn } from '@admin/utils/shared/cn'
+
+interface ${plural}TableProps<TValue> extends React.HTMLAttributes<HTMLDivElement> {
+  columns: ColumnDef<${singular}, TValue>[]
+  selectedIds: string[]
+  setSelectedIds: (ids: string[]) => void
+  search?: string
+  ${filterProps}
+}
+
+export function ${plural}Table<TValue>({ columns, selectedIds, setSelectedIds, search, ${filterParams}, className }: ${plural}TableProps<TValue>) {
+  const defaultPageSize = 20
+${hasEditRouterSetup}  const [{
+    page: pageIndex,
+    size: pageSize,
+    sort: sortField,
+    dir: sortDir
+  }, setTableQuery] = useQueryStates({
+    page: parseAsInteger.withDefault(0),
+    size: parseAsInteger.withDefault(defaultPageSize),
+    sort: parseAsString.withDefault(''),
+    dir: parseAsString.withDefault('')
+  })
+
+  const safePageIndex = Number.isFinite(pageIndex) && pageIndex > 0 ? pageIndex : 0
+  const safePageSize = pageSize === -1 || (Number.isFinite(pageSize) && pageSize > 0) ? pageSize : defaultPageSize
+  const { data, error, isPending } = use${plural}(search, ${filterParams}, safePageIndex, safePageSize, sortField || undefined, (sortDir as 'asc' | 'desc') || undefined)
+
+  const tableData = data?.${camelPlural} ?? []
+  const totalRows = data?.total ?? 0
+  const effectivePageSize = safePageSize === -1 ? totalRows : safePageSize
+  const pageCount = effectivePageSize > 0 ? Math.ceil(totalRows / effectivePageSize) : 1
+  const shouldShowPagination = totalRows > defaultPageSize
+
+  const {
+    columnSizing,
+    handleColumnSizingChange,
+    handlePaginationChange,
+    handleRowSelectionChange,
+    handleSortingChange,
+    hoveredColumnId,
+    registerTable,
+    resetColumnSizingToContainer,
+    rowSelection,
+    setHoveredColumnId,
+    sorting,
+    tableContainerRef
+  } = useTableUtils<${singular}>({
+    data: tableData,
+    selectedIds,
+    onSelectedIdsChange: setSelectedIds,
+    pageIndex: safePageIndex,
+    pageSize: effectivePageSize,
+    setPageIndex: (nextPageIndex) => setTableQuery({ page: nextPageIndex }),
+    setSortingParams: ({
+      pageIndex: nextPageIndex,
+      sortDir: nextSortDir,
+      sortField: nextSortField
+    }) => setTableQuery({
+      page: nextPageIndex,
+      sort: nextSortField,
+      dir: nextSortDir
+    }),
+    sortField,
+    sortDir
+  })
+
+  const table = useReactTable({
+    data: tableData,
+    columns,
+    columnResizeMode: 'onChange',
+    defaultColumn: {
+      minSize: 48,
+      size: 220
+    },
+    getCoreRowModel: getCoreRowModel(),
+    manualPagination: true,
+    manualSorting: true,
+    pageCount,
+    rowCount: totalRows,
+    onSortingChange: handleSortingChange,
+    onColumnSizingChange: handleColumnSizingChange,
+    onRowSelectionChange: handleRowSelectionChange,
+    onPaginationChange: handlePaginationChange,
+    state: {
+      sorting,
+      columnSizing,
+      rowSelection,
+      pagination: {
+        pageIndex: safePageIndex,
+        pageSize: effectivePageSize
+      }
+    }
+  })
+  registerTable(table)
+  const gridTemplateColumns = table
+    .getVisibleLeafColumns()
+    .map((column) => \`\${column.getSize()}px\`)
+    .join(' ')
+
+  return (
+    <div
+      className={cn("flex flex-col gap-6 pt-px pb-2 h-full", className)}
+    >
+      <DataGrid containerClassName="min-h-0 flex-1" containerRef={tableContainerRef} gridTemplateColumns={gridTemplateColumns} style={{ width: table.getTotalSize() }}>
+        <DataGridHeader>
+          {table.getHeaderGroups().map((headerGroup) => (
+            <DataGridRow key={headerGroup.id}>
+              {headerGroup.headers.map((header, headerIndex) => {
+                const meta = header.column.columnDef.meta as Record<string, unknown> | undefined
+                const resizeLabel = typeof header.column.columnDef.header === 'string' ? header.column.columnDef.header : header.column.id
+                const nextHeader = headerGroup.headers[headerIndex + 1]
+                const canResizeColumn = header.column.getCanResize() && nextHeader?.column.getCanResize() === true
+                return (
+                  <DataGridHead
+                    key={header.id}
+                    className={cn('group/resize-header relative overflow-hidden', {
+                      'text-center': meta?.align === 'center',
+                      'text-right': meta?.align === 'right'
+                    })}
+                    data-column-id={header.column.id}
+                    onMouseEnter={() => setHoveredColumnId(header.column.id)}
+                    onMouseLeave={() => setHoveredColumnId((current) => (current === header.column.id ? null : current))}
+                  >
+                    {header.isPlaceholder
+                      ? null
+                      : flexRender(header.column.columnDef.header, header.getContext())}
+                    {canResizeColumn ? (
+                      <button
+                        type="button"
+                        aria-label={\`Resize \${resizeLabel} column\`}
+                        className="group/resize-handle absolute right-0 top-0 z-10 flex h-full w-5 cursor-col-resize touch-none select-none items-center justify-center text-muted-foreground opacity-0 transition-opacity hover:text-foreground focus-visible:text-foreground focus-visible:opacity-100 focus-visible:outline-none group-focus-within/resize-header:opacity-100 data-[column-hovered=true]:opacity-100 data-[resizing=true]:opacity-100"
+                        data-resize-handle
+                        data-column-hovered={hoveredColumnId === header.column.id ? 'true' : 'false'}
+                        data-resizing={header.column.getIsResizing() ? 'true' : 'false'}
+                        onDoubleClick={resetColumnSizingToContainer}
+                        onMouseDown={header.getResizeHandler()}
+                        onTouchStart={header.getResizeHandler()}
+                      >
+                        <GripVertical aria-hidden="true" className={cn('size-3.5', { 'text-ring': header.column.getIsResizing() })} />
+                      </button>
+                    ) : null}
+                  </DataGridHead>
+                )
+              })}
+            </DataGridRow>
+          ))}
+        </DataGridHeader>
+        <DataGridBody>
+          {isPending ? (
+            <DataGridRow>
+              <DataGridCell className="flex h-24 items-center justify-center text-center" style={{ gridColumn: '1 / -1' }}>
+                <div className="text-muted-foreground">Loading ${schemaLabel}…</div>
+              </DataGridCell>
+            </DataGridRow>
+          ) : error ? (
+            <DataGridRow>
+              <DataGridCell className="flex h-24 items-center justify-center text-center" style={{ gridColumn: '1 / -1' }}>
+                <div className="text-destructive">Error loading ${schemaLabel}: {error.message}</div>
+              </DataGridCell>
+            </DataGridRow>
+          ) : table.getRowModel().rows?.length ? (
+            table.getRowModel().rows.map((row) => (
+              <DataGridRow
+                key={row.id}
+                className={cn('hover:bg-muted/50', {
+                  'cursor-pointer': ${hasEditEnabled}
+                })}
+                data-state={row.getIsSelected() ? 'selected' : undefined}${hasEditRowClickHandler}
+              >
+                {row.getVisibleCells().map((cell) => {
+                const meta = cell.column.columnDef.meta as Record<string, unknown> | undefined
+                return (
+                    <DataGridCell
+                      key={cell.id}
+                      className={cn({
+                        'text-center': meta?.align === 'center',
+                        'text-right': meta?.align === 'right'
+                      })}
+                      data-column-id={cell.column.id}
+                      onMouseEnter={() => setHoveredColumnId(cell.column.id)}
+                      onMouseLeave={() => setHoveredColumnId((current) => (current === cell.column.id ? null : current))}
+                    >
+                      {flexRender(cell.column.columnDef.cell, cell.getContext())}
+                    </DataGridCell>
+                  )
+                })}
+              </DataGridRow>
+            ))
+          ) : (
+            <DataGridRow>
+              <DataGridCell className="flex h-24 items-center justify-center text-center" style={{ gridColumn: '1 / -1' }}>
+                No ${schemaLabel} found.
+              </DataGridCell>
+            </DataGridRow>
+          )}
+        </DataGridBody>
+      </DataGrid>
+
+      {shouldShowPagination ? (
+        <DataTablePagination
+          table={table}
+          paginationMode="controlled"
+          pageSize={safePageSize}
+          pageIndex={safePageIndex}
+          pageCount={pageCount}
+          setPageIndex={(nextPageIndex) => setTableQuery({ page: nextPageIndex })}
+          setPageSize={(nextPageSize) =>
+            setTableQuery({ page: 0, size: nextPageSize })
+          }
+        />
+      ) : null}
+    </div>
+  )
+}
+`
+}
+
+export function renderTableEditRowClickHandlerTemplate({
+  adminRoutePath,
+  schemaName
+}: {
+  adminRoutePath: string
+  schemaName: string
+}): string {
+  return `
+                onClick={(e) => {
+                  const target = e.target as HTMLElement
+                  if (!e.currentTarget.contains(target)) return
+                  if (target.closest('button, a, input, [role="checkbox"]')) return
+                  router.push(\`${adminRoutePath}/${schemaName}/\${row.original.id}/edit\`)
+                }}`
+}

package/dist/assets/adapters/next/templates/renderers/generators/thankyou-email-template.ts

@@ -0,0 +1,110 @@
+export function renderThankYouEmailTemplateGeneratedFunctionTemplate({
+  pascal,
+  toLowerCase
+}: {
+  pascal: string
+  toLowerCase: string
+}): string {
+  return `import { Body, Container, Head, Heading, Html, Preview, Section, Text } from '@react-email/components'
+
+export function ${pascal}ThankYouEmail() {
+  return (
+    <Html>
+      <Head />
+      <Preview>Thank you for your ${toLowerCase} submission</Preview>
+      <Body style={main}>
+        <Container style={container}>
+          <Section style={header}>
+            <Text style={logoText}>BetterStart</Text>
+          </Section>
+
+          <Section style={body}>
+            <Heading style={h1}>Thank you!</Heading>
+            <Text style={paragraph}>
+              We received your ${toLowerCase} submission and will get back to you shortly.
+            </Text>
+            <Text style={paragraph}>
+              If you have any questions in the meantime, feel free to reply to this email.
+            </Text>
+          </Section>
+
+          <Section style={footer}>
+            <Text style={footerBrand}>BetterStart</Text>
+          </Section>
+        </Container>
+      </Body>
+    </Html>
+  )
+}
+
+const colors = {
+  primary: '#7c3aed',
+  background: '#f8fafc',
+  cardBg: '#ffffff',
+  text: '#1e293b',
+  textMuted: '#64748b',
+  border: '#e2e8f0',
+}
+
+const main = {
+  backgroundColor: colors.background,
+  fontFamily: 'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+  padding: '40px 20px',
+}
+
+const container = {
+  margin: '0 auto',
+  maxWidth: '600px',
+}
+
+const header = {
+  backgroundColor: colors.primary,
+  borderRadius: '12px 12px 0 0',
+  padding: '24px 32px',
+  textAlign: 'center' as const,
+}
+
+const logoText = {
+  color: '#ffffff',
+  fontSize: '24px',
+  fontWeight: '700' as const,
+  letterSpacing: '-0.02em',
+  margin: '0',
+}
+
+const body = {
+  backgroundColor: colors.cardBg,
+  padding: '40px 32px',
+}
+
+const h1 = {
+  color: colors.text,
+  fontSize: '24px',
+  fontWeight: '700' as const,
+  lineHeight: '32px',
+  margin: '0 0 16px',
+}
+
+const paragraph = {
+  color: colors.text,
+  fontSize: '16px',
+  lineHeight: '26px',
+  margin: '0 0 16px',
+}
+
+const footer = {
+  backgroundColor: colors.cardBg,
+  borderRadius: '0 0 12px 12px',
+  borderTop: \`1px solid \${colors.border}\`,
+  padding: '24px 32px',
+  textAlign: 'center' as const,
+}
+
+const footerBrand = {
+  color: colors.textMuted,
+  fontSize: '14px',
+  fontWeight: '600' as const,
+  margin: '0',
+}
+`
+}

package/dist/assets/adapters/next/templates/renderers/generators/webhook-events/render-extract.ts

@@ -0,0 +1,14 @@
+export function renderExtractImportsTemplate({
+  toCamelCase,
+  join
+}: {
+  toCamelCase: string
+  join: string
+}): string {
+  return `import type { WebhookEventSource } from '@admin/types/webhooks'
+
+export const ${toCamelCase}WebhookEvents: WebhookEventSource = {
+${join}
+}
+`
+}

package/dist/assets/adapters/next/templates/renderers/init/scaffolders/next-config/create-next-config-template.ts

@@ -0,0 +1,48 @@
+export function renderCreateNextConfigTemplateImportsTemplate({
+  betterstartAssetHost
+}: {
+  betterstartAssetHost: string
+}): string {
+  return `import type { NextConfig } from 'next'
+
+const nextConfig: NextConfig = {
+  cacheComponents: true,
+  devIndicators: false,
+  images: {
+    remotePatterns: [
+      {
+        protocol: 'https',
+        hostname: '${betterstartAssetHost}',
+      },
+    ],
+  },
+}
+
+export default nextConfig
+`
+}
+
+export function renderCreateNextConfigTemplateImportsDetailsTemplate({
+  betterstartAssetHost
+}: {
+  betterstartAssetHost: string
+}): string {
+  return `import type { NextConfig } from 'next'
+
+const nextConfig: NextConfig = {
+  experimental: {
+    useCache: true,
+  },
+  images: {
+    remotePatterns: [
+      {
+        protocol: 'https',
+        hostname: '${betterstartAssetHost}',
+      },
+    ],
+  },
+}
+
+export default nextConfig
+`
+}

package/dist/assets/adapters/next/templates/renderers/init/scaffolders/tailwind/admin-shadow-input-utility.ts

@@ -0,0 +1,9 @@
+export function renderAdminShadowInputUtility(): string {
+  return `
+@utility shadow-input {
+  --admin-shadow-input: rgba(0, 0, 0, 0.02) 0px 4px 8px -2px;
+  --tw-shadow: var(--admin-shadow-input);
+  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
+    var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+}`
+}

package/dist/assets/adapters/next/templates/renderers/init/scaffolders/tailwind/admin-theme-block.ts

@@ -0,0 +1,42 @@
+export function renderAdminThemeBlock(): string {
+  return `
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-input-border: var(--input-border);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+}`
+}

package/dist/assets/adapters/next/templates/renderers/init/templates/app/admin.ts

@@ -0,0 +1,12 @@
+export function renderAdminDataTemplateGeneratedValueTemplate({
+  namespaceCamel,
+  projectName
+}: {
+  namespaceCamel: string
+  projectName: string
+}): string {
+  return `export const ${namespaceCamel} = {
+  name: '${projectName}',
+}
+`
+}

package/dist/assets/adapters/next/templates/renderers/integration-runtime/render-core-email-provider.ts

@@ -0,0 +1,27 @@
+export function renderCoreEmailProviderContentTemplate({
+  activeProviderExportName
+}: {
+  activeProviderExportName: string
+}): string {
+  return `  if (${activeProviderExportName}.isConfigured()) {
+    return ${activeProviderExportName}
+  }
+
+`
+}
+
+export function renderCoreEmailProviderGeneratedFunctionTemplate({
+  providerImport,
+  providerBranch
+}: {
+  providerImport: string
+  providerBranch: string
+}): string {
+  return `import { noneEmailProvider } from '@admin/actions/email/none'
+${providerImport}import type { AdminEmailProvider } from '@admin/actions/email/types'
+
+export function getEmailProvider(): AdminEmailProvider {
+${providerBranch}  return noneEmailProvider
+}
+`
+}

package/dist/assets/adapters/next/templates/renderers/integration-runtime/render-core-storage-provider.ts

@@ -0,0 +1,27 @@
+export function renderCoreStorageProviderContentTemplate({
+  activeProviderExportName
+}: {
+  activeProviderExportName: string
+}): string {
+  return `  if (${activeProviderExportName}.isConfigured()) {
+    return ${activeProviderExportName}
+  }
+
+`
+}
+
+export function renderCoreStorageProviderGeneratedFunctionTemplate({
+  providerImport,
+  providerBranch
+}: {
+  providerImport: string
+  providerBranch: string
+}): string {
+  return `import { localStorageProvider } from '@admin/actions/storage/local'
+${providerImport}import type { AdminStorageProvider } from '@admin/actions/storage/types'
+
+export function getStorageProvider(): AdminStorageProvider {
+${providerBranch}  return localStorageProvider
+}
+`
+}

package/dist/assets/adapters/next/templates/renderers/snapshots/barrels/render-db-barrel.ts

@@ -0,0 +1,8 @@
+export function renderDbBarrelContentTemplate({
+  exportLinesContent
+}: {
+  exportLinesContent: string
+}): string {
+  return `export * from './core/schema'
+${exportLinesContent}`
+}

package/dist/assets/adapters/next/templates/renderers/snapshots/barrels/render-navigation-barrel.ts

@@ -0,0 +1,63 @@
+export function renderNavigationBarrelImportsTemplate({
+  namespacePascal,
+  namespaceAlias,
+  extractImports,
+  namespaceRoutePath,
+  spreadLinesContent,
+  namespaceCamel
+}: {
+  namespacePascal: string
+  namespaceAlias: string
+  extractImports: string
+  namespaceRoutePath: string
+  spreadLinesContent: string
+  namespaceCamel: string
+}): string {
+  return `import { House, ImagePlay } from 'lucide-react'
+import type { ${namespacePascal}NavigationItem } from '${namespaceAlias}/types/navigation'${extractImports}
+
+export type { ${namespacePascal}NavigationItem } from '${namespaceAlias}/types/navigation'
+
+const coreNav: ${namespacePascal}NavigationItem[] = [
+  {
+    label: 'Overview',
+    href: '${namespaceRoutePath}',
+    icon: House,
+    group: 'General',
+    position: 0,
+  },
+  {
+    label: 'Media',
+    href: '${namespaceRoutePath}/media',
+    icon: ImagePlay,
+    group: 'General',
+    position: 1,
+  },
+]
+
+function comparePositions(a?: number, b?: number): number {
+  if (a != null && b != null) return a - b
+  if (a != null) return -1
+  if (b != null) return 1
+  return 0
+}
+
+const combinedNavigation = [
+  ...coreNav${spreadLinesContent}
+]
+
+const dashboard = combinedNavigation.find((item) => item.href === '${namespaceRoutePath}')
+const others = combinedNavigation.filter((item) => item.href !== '${namespaceRoutePath}')
+
+others.sort((a, b) => {
+  if (!a.group && b.group) return -1
+  if (a.group && !b.group) return 1
+  if (a.group && b.group && a.group !== b.group) {
+    return comparePositions(a.groupPosition, b.groupPosition) || a.group.localeCompare(b.group)
+  }
+  return comparePositions(a.position, b.position) || a.label.localeCompare(b.label)
+})
+
+export const ${namespaceCamel}Navigation = [...(dashboard ? [dashboard] : []), ...others]
+`
+}

package/dist/assets/adapters/next/templates/renderers/snapshots/barrels/render-webhook-events-barrel.ts

@@ -0,0 +1,16 @@
+export function renderWebhookEventsBarrelImportsTemplate({
+  namespaceAlias,
+  extractImports,
+  entries
+}: {
+  namespaceAlias: string
+  extractImports: string
+  entries: string
+}): string {
+  return `import type { WebhookEventSource } from '${namespaceAlias}/types/webhooks'${extractImports}
+
+export type { WebhookEventSource } from '${namespaceAlias}/types/webhooks'
+
+export const webhookEventSources: WebhookEventSource[] = ${entries}
+`
+}