betterstart-cli 0.0.12 → 0.0.13

package/dist/assets/adapters/next/templates/init/pages/audit-log/audit-log-page-content.tsx

@@ -0,0 +1,279 @@
+'use client'
+
+import type { AuditLogEntry, AuditLogQuery } from '@admin/actions/audit'
+import { PageHeader } from '@admin/components/shared/page-header'
+import { Badge } from '@admin/components/ui/badge'
+import { Button } from '@admin/components/ui/button'
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow
+} from '@admin/components/ui/table'
+import { useAuditLogs, useCleanupAuditLogs } from '@admin/hooks/use-audit-log'
+import { LoaderCircle, Trash2 } from 'lucide-react'
+import { parseAsInteger, parseAsString, useQueryStates } from 'nuqs'
+import * as React from 'react'
+import { toast } from 'sonner'
+import { AuditLogDetailDrawer } from './audit-log-detail-drawer'
+import { AuditLogFilters } from './audit-log-filters'
+
+const DEFAULT_PAGE_SIZE = 25
+
+const auditLogParsers = {
+  q: parseAsString.withDefault(''),
+  category: parseAsString.withDefault(''),
+  action: parseAsString.withDefault(''),
+  targetType: parseAsString.withDefault(''),
+  actor: parseAsString.withDefault(''),
+  createdAtFrom: parseAsString.withDefault(''),
+  createdAtTo: parseAsString.withDefault(''),
+  page: parseAsInteger.withDefault(1)
+}
+
+function formatDateTime(value: string): string {
+  const date = new Date(value)
+  if (Number.isNaN(date.getTime())) return value
+
+  return new Intl.DateTimeFormat('en-US', {
+    month: 'short',
+    day: '2-digit',
+    year: 'numeric',
+    hour: 'numeric',
+    minute: '2-digit'
+  }).format(date)
+}
+
+function formatEventLabel(auditLog: AuditLogEntry): string {
+  return `${auditLog.category}.${auditLog.action}`
+}
+
+export function AuditLogPageContent() {
+  const [selectedAuditLog, setSelectedAuditLog] = React.useState<AuditLogEntry | null>(null)
+  const [filters, setFilters] = useQueryStates(auditLogParsers)
+  const safePage = Math.max(1, filters.page)
+  const query = React.useMemo<AuditLogQuery>(
+    () => ({
+      search: filters.q || undefined,
+      category: filters.category ? (filters.category as AuditLogQuery['category']) : undefined,
+      action: filters.action ? (filters.action as AuditLogQuery['action']) : undefined,
+      targetType: filters.targetType || undefined,
+      actor: filters.actor || undefined,
+      createdAtFrom: filters.createdAtFrom || undefined,
+      createdAtTo: filters.createdAtTo || undefined,
+      page: safePage,
+      pageSize: DEFAULT_PAGE_SIZE
+    }),
+    [filters, safePage]
+  )
+  const auditLogsQuery = useAuditLogs(query)
+  const cleanupMutation = useCleanupAuditLogs()
+  const auditLogs = auditLogsQuery.data?.auditLogs ?? []
+  const total = auditLogsQuery.data?.total ?? 0
+  const totalPages = auditLogsQuery.data?.totalPages ?? 1
+  const activeFilterCount = [
+    filters.q,
+    filters.category,
+    filters.action,
+    filters.targetType,
+    filters.actor,
+    filters.createdAtFrom || filters.createdAtTo
+  ].filter(Boolean).length
+
+  function updateFilter(updates: Partial<typeof filters>) {
+    void setFilters({ ...updates, page: 1 })
+  }
+
+  function clearFilters() {
+    void setFilters({
+      q: null,
+      category: null,
+      action: null,
+      targetType: null,
+      actor: null,
+      createdAtFrom: null,
+      createdAtTo: null,
+      page: 1
+    })
+  }
+
+  function runCleanup() {
+    cleanupMutation.mutate(undefined, {
+      onSuccess: (result) => {
+        if (!result.success) {
+          toast.error(result.error ?? 'Failed to clean up audit logs')
+          return
+        }
+        if (result.skipped) {
+          toast.info('Audit retention is not enabled')
+          return
+        }
+        toast.success(`Deleted ${result.deletedCount ?? 0} audit log rows`)
+      },
+      onError: () => {
+        toast.error('Failed to clean up audit logs')
+      }
+    })
+  }
+
+  return (
+    <>
+      <PageHeader
+        title="Audit Log"
+        actions={
+          <Button
+            type="button"
+            variant="outline"
+            size="sm"
+            disabled={cleanupMutation.isPending}
+            onClick={runCleanup}
+          >
+            {cleanupMutation.isPending ? <LoaderCircle className="animate-spin" /> : <Trash2 />}
+            Cleanup
+          </Button>
+        }
+      />
+      <main className="flex min-h-0 flex-1 flex-col">
+        <AuditLogFilters
+          search={filters.q}
+          category={filters.category}
+          action={filters.action}
+          targetType={filters.targetType}
+          actor={filters.actor}
+          createdAtFrom={filters.createdAtFrom}
+          createdAtTo={filters.createdAtTo}
+          activeFilterCount={activeFilterCount}
+          onSearchChange={(value) => updateFilter({ q: value })}
+          onCategoryChange={(value) => updateFilter({ category: value })}
+          onActionChange={(value) => updateFilter({ action: value })}
+          onTargetTypeChange={(value) => updateFilter({ targetType: value })}
+          onActorChange={(value) => updateFilter({ actor: value })}
+          onCreatedAtFromChange={(value) => updateFilter({ createdAtFrom: value })}
+          onCreatedAtToChange={(value) => updateFilter({ createdAtTo: value })}
+          onClear={clearFilters}
+        />
+        <div className="min-h-0 flex-1 overflow-auto px-4 py-3">
+          <div className="overflow-hidden rounded-lg border border-border bg-card">
+            <Table>
+              <TableHeader>
+                <TableRow>
+                  <TableHead className="w-[180px]">Time</TableHead>
+                  <TableHead className="w-[160px]">Event</TableHead>
+                  <TableHead>Target</TableHead>
+                  <TableHead className="w-[220px]">Actor</TableHead>
+                  <TableHead className="w-[180px]">Source</TableHead>
+                  <TableHead className="w-[180px]">Fields</TableHead>
+                </TableRow>
+              </TableHeader>
+              <TableBody>
+                {auditLogsQuery.isPending ? (
+                  <TableRow>
+                    <TableCell colSpan={6} className="h-40 text-center text-muted-foreground">
+                      Loading audit logs...
+                    </TableCell>
+                  </TableRow>
+                ) : null}
+                {!auditLogsQuery.isPending && auditLogs.length === 0 ? (
+                  <TableRow>
+                    <TableCell colSpan={6} className="h-40 text-center text-muted-foreground">
+                      No audit logs found.
+                    </TableCell>
+                  </TableRow>
+                ) : null}
+                {auditLogs.map((auditLog) => (
+                  <TableRow
+                    key={auditLog.id}
+                    className="cursor-pointer"
+                    onClick={() => setSelectedAuditLog(auditLog)}
+                  >
+                    <TableCell className="whitespace-nowrap text-muted-foreground">
+                      {formatDateTime(auditLog.createdAt)}
+                    </TableCell>
+                    <TableCell>
+                      <Badge variant="secondary">{formatEventLabel(auditLog)}</Badge>
+                    </TableCell>
+                    <TableCell className="min-w-[220px]">
+                      <div className="flex min-w-0 flex-col">
+                        <span className="truncate font-medium">
+                          {auditLog.targetLabel ?? auditLog.targetId ?? 'Unknown'}
+                        </span>
+                        <span className="truncate text-xs text-muted-foreground">
+                          {auditLog.targetType}
+                        </span>
+                      </div>
+                    </TableCell>
+                    <TableCell className="min-w-[180px]">
+                      <div className="flex min-w-0 flex-col">
+                        <span className="truncate">
+                          {auditLog.actorEmail ?? auditLog.actorName ?? 'Unknown'}
+                        </span>
+                        <span className="truncate text-xs text-muted-foreground">
+                          {auditLog.actorRole ?? 'No role'}
+                        </span>
+                      </div>
+                    </TableCell>
+                    <TableCell className="min-w-[160px] text-muted-foreground">
+                      <div className="truncate">{auditLog.sourceType}</div>
+                      <div className="truncate text-xs">{auditLog.ipAddress ?? 'No IP'}</div>
+                    </TableCell>
+                    <TableCell className="min-w-[160px]">
+                      {auditLog.changedFields.length > 0 ? (
+                        <div className="flex flex-wrap gap-1">
+                          {auditLog.changedFields.slice(0, 3).map((field) => (
+                            <Badge key={field} variant="outline">
+                              {field}
+                            </Badge>
+                          ))}
+                          {auditLog.changedFields.length > 3 ? (
+                            <Badge variant="outline">+{auditLog.changedFields.length - 3}</Badge>
+                          ) : null}
+                        </div>
+                      ) : (
+                        <span className="text-muted-foreground">None</span>
+                      )}
+                    </TableCell>
+                  </TableRow>
+                ))}
+              </TableBody>
+            </Table>
+          </div>
+        </div>
+        <div className="flex h-[53px] shrink-0 items-center justify-between border-t border-border bg-background px-4">
+          <p className="text-sm text-muted-foreground">{total} rows</p>
+          <div className="flex items-center gap-2">
+            <Button
+              type="button"
+              variant="outline"
+              size="sm"
+              disabled={safePage <= 1}
+              onClick={() => void setFilters({ page: safePage - 1 })}
+            >
+              Previous
+            </Button>
+            <span className="min-w-20 text-center text-sm text-muted-foreground">
+              {safePage} / {totalPages}
+            </span>
+            <Button
+              type="button"
+              variant="outline"
+              size="sm"
+              disabled={safePage >= totalPages}
+              onClick={() => void setFilters({ page: safePage + 1 })}
+            >
+              Next
+            </Button>
+          </div>
+        </div>
+      </main>
+      <AuditLogDetailDrawer
+        auditLog={selectedAuditLog}
+        open={!!selectedAuditLog}
+        onOpenChange={(open) => {
+          if (!open) setSelectedAuditLog(null)
+        }}
+      />
+    </>
+  )
+}

package/dist/assets/adapters/next/templates/init/pages/audit-log/audit-log-page-skeleton.tsx

@@ -0,0 +1,19 @@
+import { PageHeader } from '@admin/components/shared/page-header'
+import { Skeleton } from '@admin/components/ui/skeleton'
+
+export function AuditLogPageSkeleton() {
+  return (
+    <>
+      <PageHeader title="Audit Log" />
+      <main className="flex min-h-0 flex-1 flex-col gap-4 p-4">
+        <div className="grid gap-2 md:grid-cols-4">
+          <Skeleton className="h-9" />
+          <Skeleton className="h-9" />
+          <Skeleton className="h-9" />
+          <Skeleton className="h-9" />
+        </div>
+        <Skeleton className="h-[520px]" />
+      </main>
+    </>
+  )
+}

package/dist/assets/adapters/next/templates/init/pages/audit-log/audit-log-page.tsx

@@ -0,0 +1,14 @@
+import { requireRole, UserRole } from '@admin/auth/middleware'
+import * as React from 'react'
+import { AuditLogPageContent } from './audit-log-page-content'
+import { AuditLogPageSkeleton } from './audit-log-page-skeleton'
+
+export default async function AuditLogPage() {
+  await requireRole([UserRole.ADMIN])
+
+  return (
+    <React.Suspense fallback={<AuditLogPageSkeleton />}>
+      <AuditLogPageContent />
+    </React.Suspense>
+  )
+}

package/dist/assets/adapters/next/templates/init/pages/dashboard-page.tsx

@@ -63,7 +63,7 @@ export default function DashboardPage() {
                       <div className="flex flex-col w-full gap-1">
                         {envVariables.map((env) => (
                           <div
-                            className="flex flex-col w-full bg-card border shadow-card border-border rounded-lg pl-4 pr-2 py-2"
+                            className="flex flex-col w-full bg-card border shadow-card border-border rounded-xl pl-4 pr-2 py-2"
                             key={env.name}
                           >
                             <div className="flex items-center justify-between">

package/dist/assets/adapters/next/templates/init/pages/forgot-password-page-skeleton.tsx

@@ -1,6 +1,6 @@
 export function ForgotPasswordPageSkeleton() {
   return (
-    <div className="overflow-hidden rounded-lg border bg-card">
+    <div className="overflow-hidden rounded-xl border bg-card">
       <div className="grid md:grid-cols-[5fr_7fr]">
         <div className="hidden min-h-[460px] bg-muted md:block" />
         <div className="flex min-h-[460px] flex-col gap-10 p-6 md:p-20">

package/dist/assets/adapters/next/templates/init/pages/login-page-skeleton.tsx

@@ -1,6 +1,6 @@
 export function LoginPageSkeleton() {
   return (
-    <div className="overflow-hidden rounded-lg border bg-card">
+    <div className="overflow-hidden rounded-xl border bg-card">
       <div className="grid md:grid-cols-[5fr_7fr]">
         <div className="hidden min-h-[540px] bg-muted md:block" />
         <div className="flex min-h-[540px] flex-col gap-10 p-6 md:p-20">

package/dist/assets/adapters/next/templates/init/pages/reset-password-page-skeleton.tsx

@@ -1,6 +1,6 @@
 export function ResetPasswordPageSkeleton() {
   return (
-    <div className="overflow-hidden rounded-lg border bg-card">
+    <div className="overflow-hidden rounded-xl border bg-card">
       <div className="grid md:grid-cols-[5fr_7fr]">
         <div className="hidden min-h-[520px] bg-muted md:block" />
         <div className="flex min-h-[520px] flex-col gap-10 p-6 md:p-20">

package/dist/assets/adapters/next/templates/init/utils/audit/audit.ts

@@ -0,0 +1,54 @@
+const REDACTED_FIELD_PATTERNS = [/password/i, /token/i, /secret/i, /key/i]
+const SYSTEM_FIELD_NAMES = new Set([
+  'id',
+  'createdAt',
+  'updatedAt',
+  'createdBy',
+  'updatedBy',
+  'createdByUser',
+  'updatedByUser'
+])
+
+function shouldTrackField(fieldName: string): boolean {
+  if (SYSTEM_FIELD_NAMES.has(fieldName)) return false
+  return !REDACTED_FIELD_PATTERNS.some((pattern) => pattern.test(fieldName))
+}
+
+function normalizeComparableValue(value: unknown): string {
+  if (value instanceof Date) return value.toISOString()
+  if (Array.isArray(value)) {
+    return JSON.stringify(value.map((item) => normalizeComparableValue(item)))
+  }
+  if (value && typeof value === 'object') {
+    const entries = Object.entries(value as Record<string, unknown>)
+      .sort(([a], [b]) => a.localeCompare(b))
+      .map(([key, item]) => [key, normalizeComparableValue(item)])
+    return JSON.stringify(entries)
+  }
+
+  return JSON.stringify(value ?? null)
+}
+
+export function getTouchedFieldNames(input: Record<string, unknown> | null | undefined): string[] {
+  if (!input) return []
+
+  return Object.keys(input)
+    .filter(shouldTrackField)
+    .sort((a, b) => a.localeCompare(b))
+}
+
+export function getChangedFieldNames(
+  previous: Record<string, unknown> | null | undefined,
+  next: Record<string, unknown> | null | undefined
+): string[] {
+  if (!next) return []
+
+  return Object.keys(next)
+    .filter(shouldTrackField)
+    .filter((fieldName) => {
+      const previousValue = previous?.[fieldName]
+      const nextValue = next[fieldName]
+      return normalizeComparableValue(previousValue) !== normalizeComparableValue(nextValue)
+    })
+    .sort((a, b) => a.localeCompare(b))
+}

package/dist/assets/adapters/next/templates/init/utils/editor/tiptap.ts

@@ -12,7 +12,6 @@ import {
   type TableRect
 } from '@tiptap/pm/tables'
 import { type Editor, findParentNodeClosestToPos, type NodeWithPos } from '@tiptap/react'
-import type { CSSProperties } from 'react'
 import {
   type ContentEditorInlineMathDelimiter,
   type ContentEditorMathKind,
@@ -146,29 +145,6 @@ export function runSlashCommand(
   return command.run(editor)
 }
 
-export function getSlashMenuStyle(rect: DOMRect): CSSProperties {
-  const margin = 8
-  const menuWidth = 288
-  const menuMaxHeight = 320
-
-  if (typeof window === 'undefined') {
-    return {
-      left: rect.left,
-      position: 'fixed',
-      top: rect.bottom + margin
-    }
-  }
-
-  const maxLeft = Math.max(margin, window.innerWidth - menuWidth - margin)
-  const maxTop = Math.max(margin, window.innerHeight - menuMaxHeight - margin)
-
-  return {
-    left: Math.min(Math.max(margin, rect.left), maxLeft),
-    position: 'fixed',
-    top: Math.min(Math.max(margin, rect.bottom + margin), maxTop)
-  }
-}
-
 function isContentEditorTableAlignment(value: unknown): value is ContentEditorTableAlignment {
   return value === 'left' || value === 'center' || value === 'right'
 }

package/dist/assets/shared-assets/react-admin/custom/content-editor/horizontal-rule-button.tsx

@@ -16,7 +16,7 @@ export function HorizontalRuleButton({ editor }: { editor: Editor | null }) {
       title="Divider"
       onClick={() => editor?.chain().focus().setHorizontalRule().run()}
     >
-      <Minus className="tiptap-button-icon" />
+      <Minus />
     </Button>
   )
 }

package/dist/assets/shared-assets/react-admin/custom/content-editor/index.tsx

@@ -39,6 +39,7 @@ export function ContentEditor({
 
   const {
     activeSlashIndex,
+    closeSlashMenu,
     editor,
     filteredSlashCommands,
     handleModeChange,
@@ -47,7 +48,9 @@ export function ContentEditor({
     mode,
     selectSlashCommand,
     setActiveSlashIndex,
+    setSlashSearch,
     slashMenu,
+    slashSearchQuery,
     sourceValue,
     sourceSelectionRequest
   } = useContentEditor({
@@ -123,8 +126,11 @@ export function ContentEditor({
                   activeIndex={activeSlashIndex}
                   commands={filteredSlashCommands}
                   onActiveIndexChange={setActiveSlashIndex}
+                  onClose={closeSlashMenu}
                   onCommandSelect={selectSlashCommand}
+                  onSearchChange={setSlashSearch}
                   slashMenu={slashMenu}
+                  searchQuery={slashSearchQuery}
                 />
 
                 <EditorContent

package/dist/assets/shared-assets/react-admin/custom/content-editor/main-toolbar-content.tsx

@@ -103,7 +103,7 @@ export function MainToolbarContent({
                 mediaInsertion.insertMedia()
               }}
             >
-              <ImagePlusIcon className="tiptap-button-icon" />
+              <ImagePlusIcon />
               <span className="tiptap-button-text">Media</span>
             </Button>
           ) : null}

package/dist/assets/shared-assets/react-admin/custom/content-editor/math-bubble-menu.tsx

@@ -63,7 +63,7 @@ export function MathBubbleMenu({ editor }: { editor: Editor }) {
         role="toolbar"
         aria-label="Math formatting toolbar"
         className={cn(
-          'flex items-center gap-1 overflow-x-auto border-border rounded-lg border bg-popover p-0 text-popover-foreground shadow-menu [scrollbar-width:none] [&::-webkit-scrollbar]:hidden',
+          'flex items-center gap-1 overflow-x-auto border-border rounded-xl border bg-popover p-0 text-popover-foreground shadow-menu [scrollbar-width:none] [&::-webkit-scrollbar]:hidden',
           'relative z-50'
         )}
       >

package/dist/assets/shared-assets/react-admin/custom/content-editor/math-button.tsx

@@ -13,7 +13,7 @@ export function MathButton({ children, text, ...props }: MathButtonProps) {
     <Button type="button" variant="ghost" size={text ? 'sm' : 'icon-sm'} {...props}>
       {children ?? (
         <>
-          <SigmaIcon className="tiptap-button-icon" />
+          <SigmaIcon />
           {text ? <span className="tiptap-button-text">{text}</span> : null}
         </>
       )}

package/dist/assets/shared-assets/react-admin/custom/content-editor/math-editor-controls.tsx

@@ -1,16 +1,13 @@
 'use client'
 
 import { Button } from '@admin/components/ui/button'
-import { Separator } from '@admin/components/ui/separator'
 import { Textarea } from '@admin/components/ui/textarea'
-import { cn } from '@admin/utils/shared/cn'
-import { CornerDownLeftIcon, TrashIcon } from 'lucide-react'
+import { TrashIcon } from 'lucide-react'
 import * as React from 'react'
 
 export interface MathEditorControlsProps {
   disabled?: boolean
   initialValue?: string
-  layout?: 'popover' | 'toolbar'
   onApply: (value: string) => boolean | undefined
   onComplete?: () => void
   onRemove?: () => boolean | undefined
@@ -19,14 +16,19 @@ export interface MathEditorControlsProps {
 export function MathEditorControls({
   disabled,
   initialValue = '',
-  layout = 'toolbar',
   onApply,
   onComplete,
   onRemove
 }: MathEditorControlsProps) {
   const [value, setValue] = React.useState(initialValue)
+  const textareaRef = React.useRef<HTMLTextAreaElement>(null)
   const canApply = Boolean(value.trim()) && !disabled
-  const isPopoverLayout = layout === 'popover'
+
+  React.useEffect(() => {
+    if (disabled) return
+
+    textareaRef.current?.focus({ preventScroll: true })
+  }, [disabled])
 
   const applyMath = React.useCallback(() => {
     if (!canApply) return
@@ -60,57 +62,42 @@ export function MathEditorControls({
   )
 
   return (
-    <div
-      className={
-        isPopoverLayout
-          ? 'flex w-72 max-w-[calc(100vw-2rem)] flex-col gap-3 p-3'
-          : 'flex min-w-72 max-w-[calc(100vw-2rem)] items-start gap-2 p-2'
-      }
-    >
+    <div className="flex w-72 flex-col gap-3 p-4">
       <Textarea
+        ref={textareaRef}
         value={value}
         onChange={(event) => setValue(event.target.value)}
         onKeyDown={handleKeyDown}
         placeholder="Paste LaTeX..."
         disabled={disabled}
-        autoFocus
         className="min-h-24 resize-y rounded-md text-sm"
       />
 
-      <div
-        className={cn({
-          'flex flex-col gap-2': isPopoverLayout,
-          'flex shrink-0 items-center gap-1': !isPopoverLayout
-        })}
-      >
+      <div className="flex items-center flex-wrap gap-1">
+        {onRemove ? (
+          <Button
+            type="button"
+            variant="destructive"
+            disabled={disabled}
+            aria-label="Remove math"
+            title="Remove"
+            onClick={removeMath}
+          >
+            <TrashIcon />
+          </Button>
+        ) : null}
+
         <Button
           type="button"
-          variant={isPopoverLayout ? 'default' : 'ghost'}
-          size={isPopoverLayout ? 'sm' : 'icon-sm'}
+          variant="default"
+          className="flex-1"
           disabled={!canApply}
           aria-label="Enter math"
           title="Enter"
           onClick={applyMath}
         >
-          {isPopoverLayout ? 'Enter' : <CornerDownLeftIcon className="tiptap-button-icon" />}
+          Insert
         </Button>
-
-        {onRemove ? (
-          <>
-            <Separator orientation="vertical" decorative className="h-6 my-auto self-center" />
-            <Button
-              type="button"
-              variant="ghost"
-              size="icon-sm"
-              disabled={disabled}
-              aria-label="Remove math"
-              title="Remove"
-              onClick={removeMath}
-            >
-              <TrashIcon className="tiptap-button-icon" />
-            </Button>
-          </>
-        ) : null}
       </div>
     </div>
   )

package/dist/assets/shared-assets/react-admin/custom/content-editor/math-popover-button.tsx

@@ -49,7 +49,6 @@ export function MathPopoverButton({
       <PopoverContent align="start" className="w-auto gap-0 p-0">
         <MathEditorControls
           disabled={disabled || !canInsert}
-          layout="popover"
           onApply={applyMath}
           onComplete={() => setIsOpen(false)}
         />

package/dist/assets/shared-assets/react-admin/custom/content-editor/mobile-toolbar-content.tsx

@@ -27,13 +27,13 @@ export function MobileToolbarContent({
           aria-label="Back to formatting toolbar"
           title="Back"
         >
-          <ArrowLeftIcon className="tiptap-button-icon" />
+          <ArrowLeftIcon />
           {type === 'highlighter' ? (
-            <HighlighterIcon className="tiptap-button-icon" />
+            <HighlighterIcon />
           ) : type === 'math' ? (
-            <SigmaIcon className="tiptap-button-icon" />
+            <SigmaIcon />
           ) : (
-            <LinkIcon className="tiptap-button-icon" />
+            <LinkIcon />
           )}
         </Button>
       </div>

package/dist/assets/shared-assets/react-admin/custom/content-editor/mode-toggle-button.tsx

@@ -22,7 +22,7 @@ export function ModeToggleButton({
       onClick={onClick}
       className="min-w-40"
     >
-      <FileCode2 className="tiptap-button-icon" />
+      <FileCode2 />
       <span className="tiptap-button-text">{label}</span>
     </Button>
   )