@prenta/admin 1.16.0 → 1.17.1

package/src/components/SEOPerformance.tsx

@@ -1,163 +0,0 @@
-'use client'
-
-import {
-  Search,
-  AlertTriangle,
-  FileWarning,
-  ImageOff,
-  LinkIcon,
-  ChevronLeft,
-  ChevronRight,
-} from 'lucide-react'
-import { useState } from 'react'
-import { gradeFromScore, gradeMeta } from './seo/primitives.js'
-import { useApiData } from '../lib/useApiData.js'
-
-interface SEOSummary {
-  totalPages: number
-  issuesSummary: {
-    missingMetaDescriptions: number
-    brokenInternalLinks: number
-    missingAltText: number
-  }
-  topContent: { id: string; title: string; collection: string; score: number }[]
-}
-
-/**
- * The bands and their colours both come from the SEO primitives — this used to
- * restate 80/60 twice on adjacent lines, and `gradeMeta` already returns
- * exactly the token classes it was hand-writing.
- */
-function ScoreBadge({ score }: { score: number }) {
-  const { text: color, bg } = gradeMeta(gradeFromScore(score))
-  return (
-    <span
-      className={`inline-flex h-9 w-9 items-center justify-center rounded-full text-sm font-medium ${color} ${bg}`}
-    >
-      {score}
-    </span>
-  )
-}
-
-export interface SEOPerformanceProps {
-  onNavigate?: (path: string) => void
-}
-
-export function SEOPerformance({ onNavigate }: SEOPerformanceProps) {
-  const { data, loading, error } = useApiData<SEOSummary>('/seo/summary')
-  const [page, setPage] = useState(0)
-  const perPage = 5
-
-  if (loading || error || !data) return null
-
-  const issues = data.issuesSummary
-  const totalIssues =
-    issues.missingMetaDescriptions + issues.brokenInternalLinks + issues.missingAltText
-  const topContent = data.topContent ?? []
-  const totalPages = Math.max(1, Math.ceil(topContent.length / perPage))
-  const visible = topContent.slice(page * perPage, (page + 1) * perPage)
-
-  return (
-    <div className="border-border bg-card rounded-lg border">
-      <div className="border-border flex items-center justify-between border-b p-4">
-        <div className="flex items-center gap-2">
-          <Search className="text-muted-foreground h-4 w-4" />
-          <h2 className="text-foreground text-sm font-medium">SEO Performance</h2>
-        </div>
-        {totalIssues > 0 && (
-          <span className="text-muted-foreground text-xs">
-            {totalIssues} issue{totalIssues !== 1 ? 's' : ''} found
-          </span>
-        )}
-      </div>
-
-      <div className="divide-border grid grid-cols-1 divide-y lg:grid-cols-12 lg:divide-x lg:divide-y-0">
-        <div className="p-4 lg:col-span-7">
-          <h3 className="text-foreground mb-3 text-sm font-medium">Top Performing Content</h3>
-          <div className="space-y-2">
-            {visible.map((item) => (
-              <div key={item.id} className="flex items-center justify-between py-2">
-                <div className="mr-3 min-w-0 flex-1">
-                  <p className="text-foreground truncate text-sm font-medium">{item.title}</p>
-                  <p className="text-muted-foreground text-xs capitalize">{item.collection}</p>
-                </div>
-                <ScoreBadge score={item.score} />
-              </div>
-            ))}
-            {visible.length === 0 && (
-              <p className="text-muted-foreground py-4 text-center text-sm">
-                No published content yet
-              </p>
-            )}
-          </div>
-          {topContent.length > perPage && (
-            <div className="text-muted-foreground mt-3 flex items-center justify-between border-t border-gray-100 pt-3 text-xs">
-              <span>
-                Showing {page * perPage + 1}-{Math.min((page + 1) * perPage, topContent.length)} of{' '}
-                {topContent.length}
-              </span>
-              <div className="flex items-center gap-1">
-                <button
-                  onClick={() => setPage(Math.max(0, page - 1))}
-                  disabled={page === 0}
-                  className="hover:bg-accent rounded p-1 disabled:opacity-30"
-                >
-                  <ChevronLeft className="h-3.5 w-3.5" />
-                </button>
-                <span>
-                  Page {page + 1} of {totalPages}
-                </span>
-                <button
-                  onClick={() => setPage(Math.min(totalPages - 1, page + 1))}
-                  disabled={page >= totalPages - 1}
-                  className="hover:bg-accent rounded p-1 disabled:opacity-30"
-                >
-                  <ChevronRight className="h-3.5 w-3.5" />
-                </button>
-              </div>
-            </div>
-          )}
-        </div>
-
-        <div className="p-4 lg:col-span-5">
-          <h3 className="text-foreground mb-3 text-sm font-medium">SEO Issues</h3>
-          <div className="space-y-3">
-            <div className="flex items-center justify-between">
-              <div className="flex items-center gap-2">
-                <FileWarning className="h-4 w-4 text-red-400" />
-                <span className="text-foreground text-sm">Missing meta descriptions</span>
-              </div>
-              <span className="text-foreground text-sm font-medium">
-                {issues.missingMetaDescriptions}
-              </span>
-            </div>
-            <div className="flex items-center justify-between">
-              <div className="flex items-center gap-2">
-                <LinkIcon className="h-4 w-4 text-red-400" />
-                <span className="text-foreground text-sm">Broken internal links</span>
-              </div>
-              <span className="text-foreground text-sm font-medium">
-                {issues.brokenInternalLinks}
-              </span>
-            </div>
-            <div className="flex items-center justify-between">
-              <div className="flex items-center gap-2">
-                <ImageOff className="h-4 w-4 text-red-400" />
-                <span className="text-foreground text-sm">Missing alt text</span>
-              </div>
-              <span className="text-foreground text-sm font-medium">{issues.missingAltText}</span>
-            </div>
-          </div>
-          {totalIssues > 0 && (
-            <button
-              onClick={() => onNavigate?.('/seo')}
-              className="text-primary hover:text-primary/80 mt-4 text-sm font-medium"
-            >
-              View All Issues
-            </button>
-          )}
-        </div>
-      </div>
-    </div>
-  )
-}

package/src/components/ui/Avatar.tsx

@@ -1,42 +0,0 @@
-type AvatarSize = 'sm' | 'md' | 'lg'
-
-export interface AvatarProps {
-  src?: string | null
-  name?: string
-  size?: AvatarSize
-}
-
-const sizeClasses: Record<AvatarSize, string> = {
-  sm: 'h-6 w-6 text-[10px]',
-  md: 'h-9 w-9 text-xs',
-  lg: 'h-12 w-12 text-sm',
-}
-
-function getInitials(name: string): string {
-  return name
-    .split(' ')
-    .map((part) => part.charAt(0))
-    .join('')
-    .toUpperCase()
-    .slice(0, 2)
-}
-
-export function Avatar({ src, name = '', size = 'md' }: AvatarProps) {
-  if (src) {
-    return (
-      <img
-        src={src}
-        alt={name}
-        className={`inline-block shrink-0 rounded-full object-cover ${sizeClasses[size]}`}
-      />
-    )
-  }
-
-  return (
-    <span
-      className={`inline-flex shrink-0 items-center justify-center rounded-full bg-[var(--primary)] font-medium text-[var(--primary-foreground)] ${sizeClasses[size]}`}
-    >
-      {getInitials(name) || '?'}
-    </span>
-  )
-}

package/src/components/ui/CommandPalette.tsx

@@ -1,133 +0,0 @@
-'use client'
-
-import { useState, useEffect, useRef } from 'react'
-
-interface CommandItem {
-  id: string
-  label: string
-  group: string
-  onSelect: () => void
-}
-
-export interface CommandPaletteProps {
-  open: boolean
-  onClose: () => void
-  items: CommandItem[]
-}
-
-export function CommandPalette({ open, onClose, items }: CommandPaletteProps) {
-  const [query, setQuery] = useState('')
-  const [activeIndex, setActiveIndex] = useState(0)
-  const inputRef = useRef<HTMLInputElement>(null)
-
-  const filtered = items.filter((item) => item.label.toLowerCase().includes(query.toLowerCase()))
-
-  const groups = Array.from(new Set(filtered.map((i) => i.group)))
-
-  useEffect(() => {
-    if (open) {
-      setQuery('')
-      setActiveIndex(0)
-      requestAnimationFrame(() => inputRef.current?.focus())
-    }
-  }, [open])
-
-  useEffect(() => {
-    if (!open) return
-
-    function handleKey(e: KeyboardEvent) {
-      if (e.key === 'Escape') {
-        onClose()
-        return
-      }
-      if (e.key === 'ArrowDown') {
-        e.preventDefault()
-        setActiveIndex((i) => Math.min(i + 1, filtered.length - 1))
-      }
-      if (e.key === 'ArrowUp') {
-        e.preventDefault()
-        setActiveIndex((i) => Math.max(i - 1, 0))
-      }
-      if (e.key === 'Enter' && filtered[activeIndex]) {
-        filtered[activeIndex].onSelect()
-        onClose()
-      }
-    }
-
-    document.addEventListener('keydown', handleKey)
-    return () => document.removeEventListener('keydown', handleKey)
-  }, [open, onClose, filtered, activeIndex])
-
-  if (!open) return null
-
-  let flatIndex = -1
-
-  return (
-    <div className="fixed inset-0 z-[70] flex items-start justify-center pt-[20vh]">
-      <div className="fixed inset-0 bg-black/50" onClick={onClose} role="presentation" />
-      <div className="relative z-10 w-full max-w-lg overflow-hidden rounded-lg border border-[var(--border)] bg-[var(--popover)] shadow-2xl">
-        <div className="flex items-center border-b border-[var(--border)] px-4">
-          <svg
-            className="mr-2 h-4 w-4 text-[var(--muted-foreground)]"
-            fill="none"
-            viewBox="0 0 24 24"
-            stroke="currentColor"
-            strokeWidth={2}
-          >
-            <path
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
-            />
-          </svg>
-          <input
-            ref={inputRef}
-            type="text"
-            value={query}
-            onChange={(e) => {
-              setQuery(e.target.value)
-              setActiveIndex(0)
-            }}
-            placeholder="Type a command or search..."
-            className="flex-1 bg-transparent py-3 text-sm outline-none"
-          />
-        </div>
-
-        <div className="max-h-72 overflow-y-auto py-2">
-          {groups.map((group) => (
-            <div key={group}>
-              <div className="px-4 py-1.5 text-xs font-medium text-[var(--muted-foreground)]">
-                {group}
-              </div>
-              {filtered
-                .filter((i) => i.group === group)
-                .map((item) => {
-                  flatIndex++
-                  const idx = flatIndex
-                  return (
-                    <button
-                      key={item.id}
-                      onClick={() => {
-                        item.onSelect()
-                        onClose()
-                      }}
-                      className={`flex w-full px-4 py-2 text-sm ${
-                        idx === activeIndex ? 'bg-[var(--accent)]' : ''
-                      }`}
-                    >
-                      {item.label}
-                    </button>
-                  )
-                })}
-            </div>
-          ))}
-          {filtered.length === 0 && (
-            <p className="px-4 py-6 text-center text-sm text-[var(--muted-foreground)]">
-              No results found.
-            </p>
-          )}
-        </div>
-      </div>
-    </div>
-  )
-}

package/src/components/ui/DataTable.tsx

@@ -1,204 +0,0 @@
-'use client'
-
-import { useState, useRef, useEffect } from 'react'
-
-interface Column {
-  key: string
-  label: string
-  sortable?: boolean
-}
-
-interface Row {
-  id: string
-  [key: string]: any
-}
-
-export interface RowAction {
-  key: string
-  label: string
-  icon?: React.ReactNode
-  destructive?: boolean
-  onClick: (row: Row) => void
-}
-
-export interface DataTableProps {
-  columns: Column[]
-  rows: Row[]
-  selectedIds: string[]
-  onSelectionChange: (ids: string[]) => void
-  sortField?: string
-  sortDir?: 'asc' | 'desc'
-  onSort?: (field: string) => void
-  rowActions?: RowAction[]
-  onRowClick?: (row: Row) => void
-}
-
-export function DataTable({
-  columns,
-  rows,
-  selectedIds,
-  onSelectionChange,
-  sortField,
-  sortDir,
-  onSort,
-  rowActions,
-  onRowClick,
-}: DataTableProps) {
-  const allSelected = rows.length > 0 && selectedIds.length === rows.length
-
-  function toggleAll() {
-    onSelectionChange(allSelected ? [] : rows.map((r) => r.id))
-  }
-
-  function toggleRow(id: string) {
-    onSelectionChange(
-      selectedIds.includes(id) ? selectedIds.filter((s) => s !== id) : [...selectedIds, id],
-    )
-  }
-
-  return (
-    <div className="overflow-x-auto rounded-lg border border-[var(--border)]">
-      <table className="w-full text-left text-sm">
-        <thead className="bg-muted border-b border-[var(--border)]">
-          <tr>
-            <th className="w-10 px-4 py-3">
-              <input
-                type="checkbox"
-                checked={allSelected}
-                onChange={toggleAll}
-                className="rounded border-[var(--border)]"
-              />
-            </th>
-            {columns.map((col) => (
-              <th
-                key={col.key}
-                className="px-4 py-3 font-medium"
-                aria-sort={
-                  col.sortable && onSort
-                    ? sortField === col.key
-                      ? sortDir === 'asc'
-                        ? 'ascending'
-                        : 'descending'
-                      : 'none'
-                    : undefined
-                }
-              >
-                {col.sortable && onSort ? (
-                  <button
-                    onClick={() => onSort(col.key)}
-                    className="inline-flex items-center gap-1 hover:text-[var(--foreground)]"
-                  >
-                    {col.label}
-                    {sortField === col.key && (
-                      <span className="text-xs">{sortDir === 'asc' ? '↑' : '↓'}</span>
-                    )}
-                  </button>
-                ) : (
-                  col.label
-                )}
-              </th>
-            ))}
-            {rowActions && rowActions.length > 0 && <th className="w-20 px-4 py-3" />}
-          </tr>
-        </thead>
-        <tbody className="divide-y divide-[var(--border)]">
-          {rows.map((row) => (
-            <tr
-              key={row.id}
-              className={`hover:bg-[var(--accent)] ${selectedIds.includes(row.id) ? 'bg-[var(--accent)]' : ''}`}
-              onClick={() => onRowClick?.(row)}
-              style={onRowClick ? { cursor: 'pointer' } : undefined}
-            >
-              <td className="px-4 py-3" onClick={(e) => e.stopPropagation()}>
-                <input
-                  type="checkbox"
-                  checked={selectedIds.includes(row.id)}
-                  onChange={() => toggleRow(row.id)}
-                  className="rounded border-[var(--border)]"
-                />
-              </td>
-              {columns.map((col) => (
-                <td key={col.key} className="px-4 py-3">
-                  {row[col.key]}
-                </td>
-              ))}
-              {rowActions && rowActions.length > 0 && (
-                <td className="px-4 py-3" onClick={(e) => e.stopPropagation()}>
-                  <RowActionsMenu actions={rowActions} row={row} />
-                </td>
-              )}
-            </tr>
-          ))}
-        </tbody>
-      </table>
-    </div>
-  )
-}
-
-function RowActionsMenu({ actions, row }: { actions: RowAction[]; row: Row }) {
-  const [open, setOpen] = useState(false)
-  const ref = useRef<HTMLDivElement>(null)
-
-  useEffect(() => {
-    if (!open) return
-    function handleClickOutside(e: MouseEvent) {
-      if (ref.current && !ref.current.contains(e.target as Node)) {
-        setOpen(false)
-      }
-    }
-    document.addEventListener('mousedown', handleClickOutside)
-    return () => document.removeEventListener('mousedown', handleClickOutside)
-  }, [open])
-
-  return (
-    <div className="relative flex items-center justify-end gap-1" ref={ref}>
-      {actions
-        .filter((a) => a.icon)
-        .map((action) => (
-          <button
-            key={action.key}
-            onClick={() => action.onClick(row)}
-            className="hover:bg-muted rounded p-1 text-[var(--muted-foreground)] hover:text-[var(--foreground)]"
-            aria-label={action.label}
-            title={action.label}
-          >
-            {action.icon}
-          </button>
-        ))}
-      <button
-        onClick={() => setOpen((o) => !o)}
-        className="hover:bg-muted rounded p-1"
-        aria-label="More actions"
-      >
-        <MoreVerticalIcon />
-      </button>
-      {open && (
-        <div className="absolute top-full right-0 z-50 mt-1 w-40 rounded-md border border-[var(--border)] bg-[var(--popover)] py-1 shadow-lg">
-          {actions.map((action) => (
-            <button
-              key={action.key}
-              className={`flex w-full items-center gap-2 px-3 py-1.5 text-sm hover:bg-[var(--accent)] ${
-                action.destructive ? 'text-[var(--destructive)]' : ''
-              }`}
-              onClick={() => {
-                action.onClick(row)
-                setOpen(false)
-              }}
-            >
-              {action.icon && <span className="h-4 w-4">{action.icon}</span>}
-              {action.label}
-            </button>
-          ))}
-        </div>
-      )}
-    </div>
-  )
-}
-
-function MoreVerticalIcon() {
-  return (
-    <svg className="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
-      <path strokeLinecap="round" strokeLinejoin="round" d="M12 5v.01M12 12v.01M12 19v.01" />
-    </svg>
-  )
-}

package/src/components/ui/Pagination.tsx

@@ -1,94 +0,0 @@
-'use client'
-
-export interface PaginationProps {
-  page: number
-  perPage: number
-  total: number
-  onPageChange: (page: number) => void
-  onPerPageChange: (perPage: number) => void
-}
-
-export function Pagination({
-  page,
-  perPage,
-  total,
-  onPageChange,
-  onPerPageChange,
-}: PaginationProps) {
-  const totalPages = Math.max(1, Math.ceil(total / perPage))
-  const start = (page - 1) * perPage + 1
-  const end = Math.min(page * perPage, total)
-
-  function pageNumbers(): (number | 'ellipsis')[] {
-    const pages: (number | 'ellipsis')[] = []
-    for (let i = 1; i <= totalPages; i++) {
-      if (i === 1 || i === totalPages || Math.abs(i - page) <= 1) {
-        pages.push(i)
-      } else if (pages[pages.length - 1] !== 'ellipsis') {
-        pages.push('ellipsis')
-      }
-    }
-    return pages
-  }
-
-  return (
-    <div className="flex items-center justify-between text-sm">
-      <span className="text-[var(--muted-foreground)]">
-        {start}–{end} of {total} results
-      </span>
-
-      <div className="flex items-center gap-2">
-        <select
-          value={perPage}
-          onChange={(e) => {
-            onPerPageChange(Number(e.target.value))
-            onPageChange(1)
-          }}
-          className="rounded-md border border-[var(--border)] bg-[var(--input-background)] px-2 py-1 text-sm"
-        >
-          {[10, 25, 50, 100].map((n) => (
-            <option key={n} value={n}>
-              {n} / page
-            </option>
-          ))}
-        </select>
-
-        <nav className="flex items-center gap-1">
-          <button
-            onClick={() => onPageChange(page - 1)}
-            disabled={page <= 1}
-            className="rounded-md px-2 py-1 hover:bg-[var(--accent)] disabled:opacity-50"
-          >
-            Prev
-          </button>
-          {pageNumbers().map((p, i) =>
-            p === 'ellipsis' ? (
-              <span key={`e${i}`} className="px-1 text-[var(--muted-foreground)]">
-                …
-              </span>
-            ) : (
-              <button
-                key={p}
-                onClick={() => onPageChange(p)}
-                className={`min-w-[2rem] rounded-md px-2 py-1 ${
-                  p === page
-                    ? 'bg-[var(--primary)] text-[var(--primary-foreground)]'
-                    : 'hover:bg-[var(--accent)]'
-                }`}
-              >
-                {p}
-              </button>
-            ),
-          )}
-          <button
-            onClick={() => onPageChange(page + 1)}
-            disabled={page >= totalPages}
-            className="rounded-md px-2 py-1 hover:bg-[var(--accent)] disabled:opacity-50"
-          >
-            Next
-          </button>
-        </nav>
-      </div>
-    </div>
-  )
-}

package/src/components/ui/Select.tsx

@@ -1,53 +0,0 @@
-import { forwardRef, type SelectHTMLAttributes, type ReactNode } from 'react'
-import { cv, type VariantProps } from '../../lib/cv.js'
-import { formControlBase, formControlState } from './form-control.js'
-
-const select = cv(`${formControlBase} appearance-none pr-8`, {
-  variants: {
-    size: {
-      sm: 'py-1.5 pr-7 pl-3 text-[length:var(--fs-sub)]',
-      md: '',
-      lg: 'py-2.5 pr-9 pl-3',
-    },
-    state: {
-      default: formControlState.default,
-      invalid: formControlState.invalid,
-      valid: formControlState.valid,
-    },
-  },
-  defaultVariants: { size: 'md', state: 'default' },
-})
-
-export type SelectVariants = VariantProps<typeof select>
-
-export interface SelectProps
-  extends Omit<SelectHTMLAttributes<HTMLSelectElement>, 'size'>, SelectVariants {
-  children?: ReactNode
-}
-
-export const Select = forwardRef<HTMLSelectElement, SelectProps>(function Select(
-  { size, state, className, children, ...rest },
-  ref,
-) {
-  return (
-    <div className="relative">
-      <select ref={ref} className={select({ size, state, class: className })} {...rest}>
-        {children}
-      </select>
-      <svg
-        aria-hidden
-        className="pointer-events-none absolute top-1/2 right-2 h-4 w-4 -translate-y-1/2 text-[var(--muted)]"
-        viewBox="0 0 20 20"
-        fill="currentColor"
-      >
-        <path
-          fillRule="evenodd"
-          d="M5.23 7.21a.75.75 0 011.06.02L10 11.06l3.71-3.83a.75.75 0 111.08 1.04l-4.25 4.39a.75.75 0 01-1.08 0L5.21 8.27a.75.75 0 01.02-1.06z"
-          clipRule="evenodd"
-        />
-      </svg>
-    </div>
-  )
-})
-
-export { select as selectVariants }