Dev

ui/src/components/AdvancePropertise/index.tsx

@@ -1,32 +1,72 @@
+import { useState } from 'react';
+
 import {
   ModalBody,
   ModalHeader,
   FieldLabel,
   TextInput,
-  ToggleSwitch
+  ToggleSwitch,
+  Tooltip
 } from '@contentstack/venus-components';
 
 import './index.scss';
 
+
 export interface SchemaProps {
   fieldtype: string;
   value: any;
   rowId: string;
+  updateFieldSettings:(rowId:string, value:any, checkBoxChanged:boolean)=> void;
+  isLocalised:boolean;
   closeModal: () => void;
+  data:any
 }
-const AdvancePropertise = (props: SchemaProps) => {
+const AdvancePropertise = (props: SchemaProps) => { 
+
+
+  const [toggleStates, setToggleStates] = useState({
+    validationRegex: props?.value?.ValidationRegex,
+    mandatory: props?.value?.Mandatory,
+    multiple: props?.value?.Multiple,
+    unique: props?.value?.Unique,
+    nonLocalizable: props?.value?.NonLocalizable
+  });
+
+  const handleToggleChange = (field: string, value: boolean, checkBoxChanged: boolean) => {
+
+    setToggleStates(prevStates => ({
+      ...prevStates,
+      [field]: value
+  }));
+
+    props?.updateFieldSettings(props?.rowId, {[field?.charAt(0)?.toUpperCase() + field?.slice(1)]: value}, checkBoxChanged);
+};
+
+ const handleOnChange = ( field: string, event: any, checkBoxChanged: boolean) => {
+    setToggleStates(prevStates => ({
+      ...prevStates,
+      [field]: event?.target?.value
+  }));
+
+  props?.updateFieldSettings(props?.rowId, {[field?.charAt(0)?.toUpperCase() + field?.slice(1)]: event?.target?.value}, checkBoxChanged);
+
+ }
+
+
   return (
     <>
-      <ModalHeader title={`${props.fieldtype} propertise`} closeModal={props.closeModal} />
+      <ModalHeader title={`${props?.fieldtype} propertise`} closeModal={props?.closeModal} />
       <ModalBody>
         <FieldLabel htmlFor="someInput" version="v2">
           Validation (Regex)
         </FieldLabel>
         <TextInput
           className="validation-input"
           type="text"
+          value={toggleStates?.validationRegex}
           placeholder="Enter value"
           version="v2"
+          onChange={(e:any)=> handleOnChange("validationRegex",e, true)}
         />
         <FieldLabel className="option-label" htmlFor="someInput" version="v2">
           Options
@@ -36,26 +76,35 @@ const AdvancePropertise = (props: SchemaProps) => {
             label="Mandatory"
             labelColor="primary"
             labelPosition="right"
-            checked={props?.value?.mandatory}
+            checked={toggleStates?.mandatory}
+            onChange={(e:any) => handleToggleChange("mandatory" , e?.target?.checked, true)}
           />
           <ToggleSwitch
             label="Multiple"
             labelColor="primary"
             labelPosition="right"
-            checked={props?.value?.multiple}
+            checked={toggleStates?.multiple}
+            onChange={(e:any) => handleToggleChange("multiple" ,e?.target?.checked, true)}
           />
           <ToggleSwitch
             label="Unique"
             labelColor="primary"
             labelPosition="right"
-            checked={props?.value?.unique}
+            checked={toggleStates?.unique}
+            onChange={(e:any) => handleToggleChange("unique" , e?.target?.checked,true)}
           />
+          <Tooltip content='Available only if there are multiple languages in your stack' position='top' disabled={props?.isLocalised}>
           <ToggleSwitch
+            id="disabled"
+            disabled={ ! props?.isLocalised}
             label="Non-localizable"
             labelColor="primary"
             labelPosition="right"
-            checked={props?.value?.non_localizable}
+            checked={toggleStates?.nonLocalizable}
+            onChange={(e:any) => handleToggleChange("nonLocalizable" , e?.target?.checked,true)}
           />
+
+          </Tooltip>
           <p className="non-localizable-message">
             If enabled, editing this field is restricted in localized entries. The field will use
             the value of the master-language entry in all localized entries.

ui/src/components/Common/AddStack/addStack.tsx

@@ -44,7 +44,7 @@ const AddStack = (props: any): JSX.Element => {
   const [addStackCMSData, setAddStackCMSData] = useState<AddStackCMSData>(defaultAddStackCMSData);
   const onSubmit = async (formData: any) => {
     setIsProcessing(true);
-    const resp = await props.onSubmit({
+    const resp = await props?.onSubmit({
       name: formData?.name || props?.defaultValues?.name,
       description: formData?.description || props?.defaultValues?.description,
       locale: formData?.locale?.value || props?.defaultValues?.locale
@@ -55,7 +55,7 @@ const AddStack = (props: any): JSX.Element => {
         notificationContent: { text: 'Stack created successfully' },
         type: 'success'
       });
-      props.closeModal();
+      props?.closeModal();
     } else {
       Notification({ notificationContent: { text: 'Failed to create the stack' }, type: 'error' });
     }
@@ -88,7 +88,8 @@ const AddStack = (props: any): JSX.Element => {
             uid: key,
             label: response?.data?.locales[key],
             value: key,
-            locale: key,
+            master_locale: key,
+            locales:[],
             created_at: key
           }))
         : [];

ui/src/components/ContentMapper/contentMapper.interface.ts

@@ -9,6 +9,13 @@ interface mapDataType {
   contentTypes: ContentType[];
   projectId: string;
 }
+interface Advanced {
+  ValidationRegex: string,
+  mandatory:boolean,
+  multiple:boolean,
+  unique:boolean,
+  nonLocalizable:boolean
+}
 export interface ContentMapperType {
   content_types_heading?: string;
   cta: CTA;
@@ -24,7 +31,7 @@ export interface ContentstackFields {
 
 export interface FieldTypes {
   label: string;
-  value: string;
+  value: any;
 }
 export interface TableTypes {
   sortBy: any;
@@ -57,6 +64,7 @@ export interface FieldMapType {
   uid: string;
   id: string;
   _invalid?: boolean;
+  advanced:Advanced
 }
 
 export interface ItemStatus {