ui-nyla/src/components/Prompts/PromptsTable.tsx
2025-10-12 14:36:39 +02:00

105 lines
3 KiB
TypeScript

import { FormGenerator } from '../FormGenerator/FormGenerator';
import { Popup } from '../ui/Popup/Popup';
import { EditForm } from '../ui/Popup/EditForm';
import { usePromptsLogic } from './promptsLogic';
import { PromptsTableProps, Prompt } from './promptsTypes';
import { useLanguage } from '../../contexts/LanguageContext';
import styles from './PromptsTable.module.css';
// Helper function to determine if a prompt can be selected/deleted
const isPromptSelectable = (prompt: Prompt): boolean => {
// Primary check: If backend explicitly sets _hideDelete, respect that
if (prompt._hideDelete === true) {
return false;
}
// Hardcoded list of the six default system prompt IDs that cannot be selected/deleted
const systemPromptIds = [
"097d34f0-9fcc-4233-bf1e-e64e13818464",
"17546dc6-b792-40e1-9aa1-0fcc4860d0c1",
"17c42519-2bf6-49b4-83f9-3cde7498310c",
"2bb85d1e-4e02-4de8-98ae-0e815267d864",
"93343a5b-49f0-4dbf-9513-2ab5f6938fd8",
"cfb51260-486f-4b42-96fe-ef03f406dcf1"
];
// Check if this prompt is one of the system default prompts
return !systemPromptIds.includes(prompt.id);
};
function PromptsTable({ className = '' }: PromptsTableProps) {
const { t } = useLanguage();
const {
prompts,
loading,
error,
columns,
actions,
handleDeleteSingle,
handleDeleteMultiple,
editModalOpen,
editingPrompt,
editPromptFields,
handleSavePrompt,
handleCancelEdit,
refetch
} = usePromptsLogic();
if (error) {
return (
<div className={styles.errorState}>
<p>{t('prompts.error.loading', 'Error loading prompts:')} {error}</p>
<button onClick={refetch} className={styles.retryButton}>
{t('common.retry', 'Retry')}
</button>
</div>
);
}
return (
<div className={`${styles.promptsTable} ${className}`}>
<FormGenerator
data={prompts}
columns={columns}
title={t('prompts.title', 'Prompts')}
searchable={true}
filterable={true}
sortable={true}
resizable={true}
pagination={true}
pageSize={10}
selectable={true}
isRowSelectable={isPromptSelectable}
loading={loading}
actions={actions}
onDelete={handleDeleteSingle}
onDeleteMultiple={handleDeleteMultiple}
onRefresh={refetch}
className={styles.promptsFormGenerator}
/>
{/* Edit Modal */}
<Popup
isOpen={editModalOpen}
title={t('prompts.modal.edit.title', 'Edit Prompt')}
onClose={handleCancelEdit}
size="large"
>
{editingPrompt && (
<EditForm
data={editingPrompt}
fields={editPromptFields}
onSave={handleSavePrompt}
onCancel={handleCancelEdit}
saveButtonText={t('prompts.modal.edit.save', 'Save Changes')}
cancelButtonText={t('common.cancel', 'Cancel')}
/>
)}
</Popup>
</div>
);
}
export default PromptsTable;