tee3apps-cms-sdk-react 0.0.10 → 0.0.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tee3apps-cms-sdk-react",
-  "version": "0.0.10",
+  "version": "0.0.11",
   "description": "Uses JSON to dynamically generate and render UI pages in a website",
   "main": "dist/index.js",
   "module": "dist/index.mjs",

package/src/PageFormComponents/BoxRenderer.tsx

@@ -218,7 +218,7 @@ const BoxRenderer: React.FC<BoxRendererProps> = ({
             );
           } else if (component.name === 'TextComponent') {
             return <TextComponent key={index} props={component.props} />;
-          } else if (component.name === 'TermsAndCondition' || component.name === 'TERMSANDCONDITION') {
+          } else if (component.name === 'TermsAndCondition' ) {
             const code = getFieldCode(component);
             const hasError = validationErrors[code];
             return (

package/src/PageFormComponents/Button.tsx

@@ -85,7 +85,11 @@ const Button: React.FC<ButtonProps> = ({
   };
 
   // Handle button click based on button type
-  const handleClick = () => {
+  const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {
+    // Prevent default form submission behavior
+    e.preventDefault();
+    e.stopPropagation();
+    
     const buttonType = props.buttonType || 'submit';
     
     // Handle different button types
@@ -145,7 +149,7 @@ const Button: React.FC<ButtonProps> = ({
     <div className="mb-6">
       <button
         onClick={handleClick}
-        type={props.buttonType === 'submit' ? 'submit' : 'button'}
+        type="button"
         disabled={props.disabled || (isSubmitting && props.buttonType === 'submit')}
         style={{
           backgroundColor: currentMode.bgColor || '#3498db',

package/src/PageFormComponents/PageForm.tsx

@@ -209,7 +209,8 @@ const PageForm: React.FC<PageFormProps> = ({ jsonData, onSubmit, isUrl = false,
     const transformedData = transformFormValuesToNames();
 
     // Check if we should send to URL or use onSubmit callback
-    if (isUrl && url) {
+    // If URL is provided, automatically use it for API submission
+    if (url && url.trim() !== '') {
       // Send data to API URL
       setIsSubmitting(true);
       try {
@@ -223,13 +224,17 @@ const PageForm: React.FC<PageFormProps> = ({ jsonData, onSubmit, isUrl = false,
 
         // For GET requests, append data as query parameters
         // For POST requests, send data in the body
-        let requestUrl = url;
+        let requestUrl = url.trim();
         if (httpMethod === 'GET') {
           const queryParams = new URLSearchParams();
           Object.keys(transformedData).forEach((key) => {
-            queryParams.append(key, String(transformedData[key]));
+            const value = transformedData[key];
+            if (value !== null && value !== undefined && value !== '') {
+              queryParams.append(key, String(value));
+            }
           });
-          requestUrl = `${url}?${queryParams.toString()}`;
+          const queryString = queryParams.toString();
+          requestUrl = queryString ? `${requestUrl}?${queryString}` : requestUrl;
         } else {
           // POST, PUT, PATCH, etc.
           requestOptions.body = JSON.stringify(transformedData);
@@ -237,11 +242,28 @@ const PageForm: React.FC<PageFormProps> = ({ jsonData, onSubmit, isUrl = false,
 
         const response = await fetch(requestUrl, requestOptions);
         
+        // Read response as text first (can only read body once)
+        const responseText = await response.text().catch(() => '');
+        
         if (!response.ok) {
-          throw new Error(`HTTP error! status: ${response.status}`);
+          const errorText = responseText || response.statusText || `HTTP ${response.status}`;
+          throw new Error(`HTTP error! status: ${response.status}, message: ${errorText}`);
         }
 
-        const responseData = await response.json().catch(() => response.text());
+        // Try to parse as JSON, fallback to text if not JSON
+        let responseData;
+        const contentType = response.headers.get('content-type');
+        if (contentType && contentType.includes('application/json') && responseText) {
+          try {
+            responseData = JSON.parse(responseText);
+          } catch {
+            // If JSON parsing fails, use text as message
+            responseData = { message: responseText };
+          }
+        } else {
+          // Not JSON or empty response, use text as message
+          responseData = responseText ? { message: responseText } : { message: 'Success' };
+        }
         
         setIsSubmitting(false);
         showToast('Form submitted successfully!', 'success');
@@ -253,6 +275,7 @@ const PageForm: React.FC<PageFormProps> = ({ jsonData, onSubmit, isUrl = false,
       } catch (error) {
         setIsSubmitting(false);
         const errorMessage = error instanceof Error ? error.message : 'Failed to submit form';
+        console.error('Form submission error:', error);
         showToast(`Error submitting form: ${errorMessage}`, 'error');
         
         // Still call onSubmit with error data if provided
@@ -264,6 +287,9 @@ const PageForm: React.FC<PageFormProps> = ({ jsonData, onSubmit, isUrl = false,
       // Send transformed data back to parent component via onSubmit callback
       if (onSubmit) {
         onSubmit(transformedData);
+      } else {
+        // If neither URL nor onSubmit is provided, show a warning
+        showToast('No submission handler configured. Please provide either a URL or onSubmit callback.', 'warning');
       }
     }
   }, [formValues, validateForm, getRequiredFields, transformFormValuesToNames, onSubmit, showToast, isUrl, method, url]);