Added support for inOperators and dateTimeOperators

build/index.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wp-components', 'wp-element'), 'version' => '33ab959b55f1e87d13f0');
+<?php return array('dependencies' => array('react', 'wp-components', 'wp-element'), 'version' => '52797c520f45e7063c70');

src/components/DraggableItem.js

@@ -29,7 +29,7 @@ const DraggableItem = ({ id, index, moveItem, postType, children }) => {
     // State management
     const [ruleType, setRuleType] = useState('post');
     const [lockType, setLockType] = useState('has_subscription');
-    const [operator, setOperator] = useState('=');
+    const [operator, setOperator] = useState('');
     const [metaKey, setMetaKey] = useState('');
     const [roles, setRoles] = useState([]); // State to store user roles
     const [taxonomies, setTaxonomies] = useState([]); // State to store taxonomies
@@ -41,11 +41,12 @@ const DraggableItem = ({ id, index, moveItem, postType, children }) => {
     const [postDateOperator, setPostDateOperator] = useState('=');
     const [metaKeyOperator, setMetaKeyOperator] = useState('=');
     const [metaValue, setMetaValue] = useState('');
-
+    const [userRegistered, setUserRegistered] = useState('');
+    const [userRegisteredOperator, setUserRegisteredOperator] = useState('=');
 
     // Fetch user roles from the WordPress REST API
     useEffect(() => {
-        if (lockType === 'has_role') {
+        if (lockType === 'role') {
             fetch('/localcontentpro/wp-json/lcp-paywall/v1/user-roles') // Your custom REST API endpoint
                 .then((response) => response.json())
                 .then((data) => {
@@ -53,11 +54,11 @@ const DraggableItem = ({ id, index, moveItem, postType, children }) => {
                 })
                 .catch((error) => console.error('Error fetching roles:', error));
         }
-    }, [lockType]); // Fetch only when lockType is 'has_role'
+    }, [lockType]); // Fetch only when lockType is 'role'
 
     // Fetch taxonomies for the current post type
     useEffect(() => {
-        if ((lockType === 'in_term' || lockType === 'not_in_term') && postType) {
+        if (lockType === 'post_term' && postType) {
             fetch(`/localcontentpro/wp-json/lcp-paywall/v1/taxonomies?post_type=${postType}`)
                 .then(response => response.json())
                 .then(data => {
@@ -73,7 +74,7 @@ const DraggableItem = ({ id, index, moveItem, postType, children }) => {
 
     // Fetch terms when lockType is in_term or not_in_term and a taxonomy is selected
     useEffect(() => {
-        if ((lockType === 'in_term' || lockType === 'not_in_term') && metaKey) {
+        if (lockType === 'post_term' && metaKey) {
             fetch(`/localcontentpro/wp-json/lcp-paywall/v1/terms?taxonomy=${metaKey}`)
                 .then(response => response.json())
                 .then(data => {
@@ -89,31 +90,24 @@ const DraggableItem = ({ id, index, moveItem, postType, children }) => {
 
     const postLockTypeOptions = [
         { value: 'post_content_length', label: 'Post Content Length' },
-        { value: 'post_in', label: 'Post In' },
+        { value: 'post', label: 'Post' },
-        {value: 'post_not_in', label: 'Post Not In' },
         { value: 'meta_value', label: 'Meta Value' },
-        { value: 'in_term', label: 'In Term' },
+        { value: 'post_term', label: 'Term' },
-        { value: 'not_in_term', label: 'Not In Term' },
+        { value: 'author', label: 'Author' },
-        { value: 'older_than', label: 'Older Than' },
-        { value: 'newer_than', label: 'Newer Than' },
-        { value: 'author_in', label: 'Author In' },
-        { value: 'author_not_in', label: 'Author Not In' },
         { value: 'post_date', label: 'Post Date' }
     ];
 
     const userLockTypeOptions = [
         { label: 'Has Subscription', value: 'has_subscription' },
         { label: 'Is Logged In', value: 'is_logged_in' },
-        { label: 'Role In', value: 'role_in' },
+        { label: 'Role In', value: 'role' },
-        { label: 'Role Not In', value: 'role_not_in' },
+        { label: 'Meta Value', value: 'meta_value' },
-        { label: 'Meta Value', value: 'meta_value' }
+        { label: 'Registration Date', value: 'registration_date' },
     ];
 
     const userDeviceLockTypeOptions = [
-        { label: 'Browser In', value: 'browser_in' },
+        { label: 'Browser', value: 'browser' },
-        { label: 'Browser Not In', value: 'browser_not_in' },
+        { label: 'Operating System', value: 'os' },
-        { label: 'Operating System In', value: 'os_in' },
-        { label: 'Operating System Not In', value: 'os_not_in' }
     ];
 
     const comparisonOperators = [
@@ -125,6 +119,15 @@ const DraggableItem = ({ id, index, moveItem, postType, children }) => {
         { label: '<=', value: '<=' },
     ];
 
+    const dateTimeComparisonOperators = [
+        { label: 'Before', value: 'before' },
+        { label: 'After', value: 'after' },
+        { label: 'Between', value: 'between' },
+    ];
+    const inOperators = [
+        { label: 'In', value: 'in' },
+        { label: 'Not In', value: 'not in' }
+    ];
 
     return (
         <div 
@@ -173,16 +176,28 @@ const DraggableItem = ({ id, index, moveItem, postType, children }) => {
                         </>
                 )}
 
-                {lockType === 'has_role' && (
+                {lockType === 'role' && (
-                    <SelectControl
+                    <>
-                        value={metaKey}
+                        <SelectControl
-                        options={roles}
+                            value={operator}
-                        onChange={setMetaKey}
+                            options={inOperators}
-                    />
+                            onChange={setOperator}
+                        />
+                        <SelectControl
+                            value={metaKey}
+                            options={roles}
+                            onChange={setMetaKey}
+                        />
+                    </>
                 )}
 
-                {(lockType === 'in_term' || lockType === 'not_in_term') && (
+                {lockType === 'term'  && (
                     <>
+                        <SelectControl
+                            value={operator}
+                            options={inOperators}
+                            onChange={setOperator}
+                        />
                         <SelectControl
                             value={metaKey}
                             options={taxonomies}
@@ -219,7 +234,7 @@ const DraggableItem = ({ id, index, moveItem, postType, children }) => {
                     <>
                         <SelectControl
                             value={postDateOperator}
-                            options={comparisonOperators}
+                            options={dateTimeComparisonOperators}
                             onChange={setPostDateOperator}
                         />
                         <DateTimePicker
@@ -228,6 +243,28 @@ const DraggableItem = ({ id, index, moveItem, postType, children }) => {
                         />
                     </>
                 )}
+                {lockType === 'registration_date' && (
+                    <>
+                        <SelectControl
+                            value={userRegisteredOperator}
+                            options={dateTimeComparisonOperators}
+                            onChange={setUserRegisteredOperator}
+                        />
+                        <DateTimePicker
+                            value={userRegistered}
+                            onChange={setUserRegistered}
+                        />
+                    </>
+                )}
+                {lockType === 'author' && (
+                    <>
+                        <SelectControl
+                            value={operator}
+                            options={inOperators}
+                            onChange={setOperator}
+                        />
+                    </>
+                )}
             </div>
             {children}
         </div>