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;