fix: prevent asset conflicts between React and Grid.js versions

Add coexistence checks to all enqueue methods to prevent loading
both React and Grid.js assets simultaneously.

Changes:
- ReactAdmin.php: Only enqueue React assets when ?react=1
- Init.php: Skip Grid.js when React active on admin pages
- Form.php, Coupon.php, Access.php: Restore classic assets when ?react=0
- Customer.php, Product.php, License.php: Add coexistence checks

Now the toggle between Classic and React versions works correctly.

Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>

src/admin/pages/Access.js

@@ -1,14 +1,94 @@
 /**
- * Access Page - Placeholder
+ * Access Page - Access items management
  */
 
 import { __ } from '@wordpress/i18n';
+import { useState, useCallback, useEffect } from '@wordpress/element';
+import { Button } from '@wordpress/components';
+import { accessApi } from '../api/client';
+import DataTable from '../components/shared/DataTable';
+import './AdminPages.css';
 
 export default function AccessPage({ initialData }) {
+    const [items, setItems] = useState([]);
+    const [loading, setLoading] = useState(true);
+
+    const loadItems = useCallback(() => {
+        setLoading(true);
+        accessApi.list()
+            .then(result => {
+                // Handle both WordPress format and direct format
+                const items = result.data?.results || result.results || result.data || [];
+                setItems(items);
+            })
+            .catch(error => {
+                console.error('Load access items error:', error);
+            })
+            .finally(() => {
+                setLoading(false);
+            });
+    }, []);
+
+    useEffect(() => {
+        loadItems();
+    }, [loadItems]);
+
+    const columns = [
+        {
+            key: 'id',
+            label: __('ID', 'formipay'),
+            render: (row) => <strong>#{row.id}</strong>
+        },
+        {
+            key: 'title',
+            label: __('Title', 'formipay'),
+        },
+        {
+            key: 'product_name',
+            label: __('Product', 'formipay'),
+        },
+        {
+            key: 'status',
+            label: __('Status', 'formipay'),
+            render: (row) => {
+                const status = row.post_status || row.status || 'unknown';
+                const statusLabel = {
+                    publish: __('Published', 'formipay'),
+                    draft: __('Draft', 'formipay'),
+                }[status] || status;
+                return (
+                    <span className={`status-badge status-${status}`}>
+                        {statusLabel}
+                    </span>
+                );
+            }
+        },
+        {
+            key: 'date',
+            label: __('Date', 'formipay'),
+            render: (row) => {
+                const date = row.post_date || row.date;
+                if (!date) return '-';
+                return new Date(date).toLocaleDateString();
+            }
+        },
+    ];
+
     return (
         <div className="formipay-page-access">
-            <h1>{ __('Access Items', 'formipay') }</h1>
-            <p>{ __('Access items management coming soon. Use the classic editor for now.', 'formipay') }</p>
+            <div className="formipay-page-header">
+                <h1>{ __('Access Items', 'formipay') }</h1>
+                <Button variant="primary" href={window.formipayAdmin?.siteUrl + '/wp-admin/post-new.php?post_type=formipay-access'}>
+                    { __('+ Add New Item', 'formipay') }
+                </Button>
+            </div>
+
+            <DataTable
+                columns={columns}
+                data={items}
+                loading={loading}
+                emptyMessage={__('No access items found', 'formipay')}
+            />
         </div>
     );
 }