fix: prevent modal from showing unexpectedly and fix inline actions

Remove duplicate inline actions from Forms page title column to prevent
conflicts with DataTable's built-in actions column.

Fix DataTable actions column:
- Only show delete/duplicate on hover using CSS
- Add proper event propagation handling (stopPropagation)
- Remove unnecessary wrapper div that was causing issues

Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
dwindown
2026-04-18 17:28:49 +07:00
parent bb74df4d6b
commit 83b7294fa4
11 changed files with 90 additions and 92 deletions

View File

@@ -438,25 +438,36 @@ export default function DataTable({
{/* Actions */}
{actions.inline && (
<td className="column-actions">
<div className="row-actions">
<a href={`${window.formipayAdmin?.siteUrl || ''}/wp-admin/post.php?post=${rowId}&action=edit`}>
{__('Edit', 'formipay')}
</a>
{' | '}
<a href={`${window.formipayAdmin?.siteUrl || ''}/wp-admin/post.php?post=${rowId}&action=edit`}>
{__('Edit', 'formipay')}
</a>
{' | '}
<span
className="row-actions"
style={{ visibility: 'hidden' }}
>
<button
className="button-link delete"
onClick={() => handleDelete(rowId)}
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
handleDelete(rowId);
}}
>
{__('Delete', 'formipay')}
</button>
{' | '}
<button
className="button-link duplicate"
onClick={() => handleDuplicate(rowId)}
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
handleDuplicate(rowId);
}}
>
{__('Duplicate', 'formipay')}
</button>
</div>
</span>
</td>
)}
</tr>

View File

@@ -20,23 +20,9 @@ export default function FormsPage() {
key: 'title',
label: __('Title', 'formipay'),
render: (row) => (
<>
<a href={`${window.formipayAdmin?.siteUrl || ''}/wp-admin/post.php?post=${row.ID}&action=edit`}>
<strong>{row.title}</strong>
<br />
<span className="row-actions" style={{ display: 'none', visibility: 'hidden' }}>
<a href={`${window.formipayAdmin?.siteUrl || ''}/wp-admin/post.php?post=${row.ID}&action=edit`}>
{__('Edit', 'formipay')}
</a>
{' | '}
<button className="button-link delete" data-id={row.ID}>
{__('Delete', 'formipay')}
</button>
{' | '}
<button className="button-link duplicate" data-id={row.ID}>
{__('Duplicate', 'formipay')}
</button>
</span>
</>
</a>
)
},
{