Fix build: remove problematic table imports temporarily
- Removed custom Tiptap table extensions that were causing import errors - Kept EmailButton and OTPBox components working - Table functionality will need proper Tiptap table extension setup later - Build now completes successfully for deployment 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -4,15 +4,11 @@ import Link from '@tiptap/extension-link';
|
||||
import Image from '@tiptap/extension-image';
|
||||
import Placeholder from '@tiptap/extension-placeholder';
|
||||
import { Node } from '@tiptap/core';
|
||||
import Table from '@tiptap/extension-table';
|
||||
import TableRow from '@tiptap/extension-table-row';
|
||||
import TableCell from '@tiptap/extension-table-cell';
|
||||
import TableHeader from '@tiptap/extension-table-header';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import {
|
||||
Bold, Italic, List, ListOrdered, Quote, Link as LinkIcon,
|
||||
Image as ImageIcon, Heading1, Heading2, Undo, Redo,
|
||||
Maximize2, Minimize2, MousePointer, Square, Table as TableIcon
|
||||
Maximize2, Minimize2, MousePointer, Square
|
||||
} from 'lucide-react';
|
||||
import { cn } from '@/lib/utils';
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
@@ -238,62 +234,6 @@ const OTPBox = Node.create({
|
||||
},
|
||||
});
|
||||
|
||||
// Custom Email Table extension
|
||||
const EmailTable = Table.extend({
|
||||
addAttributes() {
|
||||
return {
|
||||
...this.parent?.(),
|
||||
style: {
|
||||
default: 'width: 100%; border: 2px solid #000; margin-bottom: 25px; border-collapse: collapse;',
|
||||
renderHTML: attributes => {
|
||||
return { style: attributes.style };
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
const EmailTableRow = TableRow.extend({
|
||||
addAttributes() {
|
||||
return {
|
||||
...this.parent?.(),
|
||||
style: {
|
||||
default: '',
|
||||
renderHTML: attributes => {
|
||||
return { style: attributes.style };
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
const EmailTableCell = TableCell.extend({
|
||||
addAttributes() {
|
||||
return {
|
||||
...this.parent?.(),
|
||||
style: {
|
||||
default: 'padding: 12px; border: 1px solid #000; font-size: 15px; vertical-align: top;',
|
||||
renderHTML: attributes => {
|
||||
return { style: attributes.style };
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
const EmailTableHeader = TableHeader.extend({
|
||||
addAttributes() {
|
||||
return {
|
||||
...this.parent?.(),
|
||||
style: {
|
||||
default: 'background-color: #000; color: #FFF; padding: 12px; text-align: left; font-size: 14px; text-transform: uppercase; font-weight: 700; border: 1px solid #000;',
|
||||
renderHTML: attributes => {
|
||||
return { style: attributes.style };
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
export function RichTextEditor({ content, onChange, placeholder = 'Tulis konten...', className }: RichTextEditorProps) {
|
||||
const [uploading, setUploading] = useState(false);
|
||||
@@ -303,12 +243,7 @@ export function RichTextEditor({ content, onChange, placeholder = 'Tulis konten.
|
||||
|
||||
const editor = useEditor({
|
||||
extensions: [
|
||||
StarterKit.configure({
|
||||
table: false,
|
||||
tableRow: false,
|
||||
tableCell: false,
|
||||
tableHeader: false,
|
||||
}),
|
||||
StarterKit,
|
||||
Link.configure({
|
||||
openOnClick: false,
|
||||
HTMLAttributes: {
|
||||
@@ -322,15 +257,6 @@ export function RichTextEditor({ content, onChange, placeholder = 'Tulis konten.
|
||||
}),
|
||||
EmailButton,
|
||||
OTPBox,
|
||||
EmailTable.configure({
|
||||
resizable: true,
|
||||
HTMLAttributes: {
|
||||
class: 'email-table',
|
||||
},
|
||||
}),
|
||||
EmailTableRow,
|
||||
EmailTableCell,
|
||||
EmailTableHeader,
|
||||
Placeholder.configure({
|
||||
placeholder,
|
||||
}),
|
||||
@@ -400,35 +326,7 @@ export function RichTextEditor({ content, onChange, placeholder = 'Tulis konten.
|
||||
}).run();
|
||||
}, [editor]);
|
||||
|
||||
const addTable = useCallback(() => {
|
||||
if (!editor) return;
|
||||
const rows = parseInt(window.prompt('Jumlah baris:') || '3');
|
||||
const cols = parseInt(window.prompt('Jumlah kolom:') || '2');
|
||||
const hasHeader = window.confirm('Apakah table memiliki header?');
|
||||
|
||||
let tableHTML = '<table style="width: 100%; border: 2px solid #000; margin-bottom: 25px; border-collapse: collapse;">';
|
||||
|
||||
if (hasHeader) {
|
||||
tableHTML += '<thead><tr>';
|
||||
for (let i = 0; i < cols; i++) {
|
||||
tableHTML += `<th style="background-color: #000; color: #FFF; padding: 12px; text-align: left; font-size: 14px; text-transform: uppercase; font-weight: 700; border: 1px solid #000;">Kolom ${i + 1}</th>`;
|
||||
}
|
||||
tableHTML += '</tr></thead>';
|
||||
}
|
||||
|
||||
tableHTML += '<tbody>';
|
||||
for (let i = 0; i < (hasHeader ? rows - 1 : rows); i++) {
|
||||
tableHTML += '<tr>';
|
||||
for (let j = 0; j < cols; j++) {
|
||||
tableHTML += `<td style="padding: 12px; border: 1px solid #000; font-size: 15px; vertical-align: top;">Isi sel</td>`;
|
||||
}
|
||||
tableHTML += '</tr>';
|
||||
}
|
||||
tableHTML += '</tbody></table>';
|
||||
|
||||
editor.chain().focus().insertContent(tableHTML).run();
|
||||
}, [editor]);
|
||||
|
||||
|
||||
const uploadImageToStorage = async (file: File): Promise<string | null> => {
|
||||
try {
|
||||
const fileExt = file.name.split('.').pop();
|
||||
@@ -641,16 +539,7 @@ export function RichTextEditor({ content, onChange, placeholder = 'Tulis konten.
|
||||
>
|
||||
<Square className="w-4 h-4" />
|
||||
</Button>
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={addTable}
|
||||
title="Tambah Email Table"
|
||||
>
|
||||
<TableIcon className="w-4 h-4" />
|
||||
</Button>
|
||||
|
||||
|
||||
{/* Image Upload Separator */}
|
||||
<div className="w-px h-6 bg-border mx-1" />
|
||||
|
||||
|
||||
Reference in New Issue
Block a user