From 41ea5dc57bb706343830b1707fa3cf607bfd149d Mon Sep 17 00:00:00 2001
From: Vadym Samoilenko <vadymsamoilenko@oliver.agency>
Date: Thu, 14 May 2026 15:54:27 +0100
Subject: [PATCH] Update Workfront Campaign ID field: simplify placeholder and
 remove format validation

- Change placeholder from '#WF_12345' to 'WF1234567'
- Remove format validation and error messaging (field is optional, free-form)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/components/CreateCampaignModal.tsx | 43 ++-------------------
 1 file changed, 4 insertions(+), 39 deletions(-)

diff --git a/frontend/components/CreateCampaignModal.tsx b/frontend/components/CreateCampaignModal.tsx
index 043fd20..770082c 100755
--- a/frontend/components/CreateCampaignModal.tsx
+++ b/frontend/components/CreateCampaignModal.tsx
@@ -24,41 +24,16 @@ export const CreateCampaignModal: React.FC<CreateCampaignModalProps> = ({ isOpen
     const [workfrontId, setWorkfrontId] = useState('');
     const [clientLead, setClientLead] = useState('');
     const [agencyLead, setAgencyLead] = useState('');
-    const [error, setError] = useState<string | null>(null);
-
     useEffect(() => {
-        // Reset form when modal opens
         if (isOpen) {
             setName('');
             setSelectedBrandGuideline('');
             setWorkfrontId('');
             setClientLead('');
             setAgencyLead('');
-            setError(null);
         }
     }, [isOpen]);
 
-    const validateWorkfrontId = (id: string): boolean => {
-        // Empty is valid (field is optional)
-        if (id.length === 0) {
-            setError(null);
-            return true;
-        }
-        const isValid = /^#WF_\d+$/.test(id);
-        if (!isValid) {
-            setError("Workfront Campaign ID must be in the format '#WF_12345'");
-        } else {
-            setError(null);
-        }
-        return isValid;
-    };
-
-    const handleWorkfrontIdChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-        const newId = e.target.value;
-        setWorkfrontId(newId);
-        validateWorkfrontId(newId);
-    };
-
     const handleSubmit = (e: React.FormEvent) => {
         e.preventDefault();
 
@@ -66,13 +41,6 @@ export const CreateCampaignModal: React.FC<CreateCampaignModalProps> = ({ isOpen
             return;
         }
 
-        // Validate workfrontId format only if provided
-        if (workfrontId.trim() && !/^#WF_\d+$/.test(workfrontId)) {
-            setError("Workfront Campaign ID must be in the format '#WF_12345'");
-            return;
-        }
-
-        setError(null);
         onAddCampaign({ name, workfrontId: workfrontId.trim(), clientLead, agencyLead, brandGuidelines: selectedBrandGuideline });
         onClose();
     };
@@ -132,13 +100,10 @@ export const CreateCampaignModal: React.FC<CreateCampaignModalProps> = ({ isOpen
                                 type="text"
                                 id="workfront-id"
                                 value={workfrontId}
-                                onChange={handleWorkfrontIdChange}
-                                className={`mt-1 block w-full p-2 border-2 rounded-[10px] shadow-sm focus:ring-oliver-azure focus:border-oliver-azure transition bg-white text-oliver-black placeholder:text-oliver-black/60 ${error ? 'border-error focus:border-error focus:ring-error' : 'border-oliver-azure'}`}
-                                placeholder="#WF_12345"
-                                aria-invalid={!!error}
-                                aria-describedby="workfront-id-error"
+                                onChange={(e) => setWorkfrontId(e.target.value)}
+                                className="mt-1 block w-full p-2 border-2 border-oliver-azure rounded-[10px] shadow-sm focus:ring-oliver-azure focus:border-oliver-azure transition bg-white text-oliver-black placeholder:text-oliver-black/60"
+                                placeholder="WF1234567"
                             />
-                            {error && <p id="workfront-id-error" className="mt-1 text-sm text-error">{error}</p>}
                         </div>
                         <div>
                             <label htmlFor="client-lead" className="block text-sm font-medium text-oliver-black">Client Lead</label>
@@ -183,7 +148,7 @@ export const CreateCampaignModal: React.FC<CreateCampaignModalProps> = ({ isOpen
                         <button
                             type="submit"
                             className="bg-oliver-azure text-white font-semibold py-2 px-6 rounded-full hover:bg-oliver-azure/90 transition-colors duration-300 disabled:bg-gray-400 disabled:cursor-not-allowed"
-                            disabled={isFormInvalid || !!error}
+                            disabled={isFormInvalid}
                         >
                             Create Campaign
                         </button>