contentstack · snehalsankhe · May 15, 2024 · May 14, 2024 · May 14, 2024 · May 14, 2024
diff --git a/ui/public/index.html b/ui/public/index.html
@@ -65,7 +65,7 @@
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
-    <a  href="#root" class="skip-to-main-content-link">Skip to main content</a>
+    <a href="#root" class="skip-to-main-content-link">Skip to main content</a>
 
     <div id="root"></div>
   </body>

diff --git a/ui/src/components/AccountPage/index.scss b/ui/src/components/AccountPage/index.scss
@@ -143,9 +143,8 @@
 .copyright_text {
   bottom: 1.5rem;
   color: $color-font-base;
-  font-size: .75rem;
-  letter-spacing: .02em;
+  font-size: 0.75rem;
+  letter-spacing: 0.02em;
   left: 2.5rem;
   position: absolute;
 }
-
diff --git a/ui/src/components/AccountPage/index.tsx b/ui/src/components/AccountPage/index.tsx
@@ -36,7 +36,7 @@ const AccountPage = (props: AccountObj): JSX.Element => {
       </div>
       <div className="AccountPage__action">
         <div className="AccountPage__content">{props?.children}</div>
-        <p className='copyright_text'>{`© ${previousYear}-${currentYear} ${copyrightText}`}</p>
+        <p className="copyright_text">{`© ${previousYear}-${currentYear} ${copyrightText}`}</p>
       </div>
     </div>
   );

diff --git a/ui/src/components/AdvancePropertise/index.tsx b/ui/src/components/AdvancePropertise/index.tsx
@@ -11,19 +11,16 @@ import {
 
 import './index.scss';
 
-
 export interface SchemaProps {
   fieldtype: string;
   value: any;
   rowId: string;
-  updateFieldSettings:(rowId:string, value:any, checkBoxChanged:boolean)=> void;
-  isLocalised:boolean;
+  updateFieldSettings: (rowId: string, value: any, checkBoxChanged: boolean) => void;
+  isLocalised: boolean;
   closeModal: () => void;
-  data:any
+  data: any;
 }
-const AdvancePropertise = (props: SchemaProps) => { 
-
-
+const AdvancePropertise = (props: SchemaProps) => {
   const [toggleStates, setToggleStates] = useState({
     validationRegex: props?.value?.ValidationRegex,
     mandatory: props?.value?.Mandatory,
@@ -33,26 +30,31 @@ const AdvancePropertise = (props: SchemaProps) => {
   });
 
   const handleToggleChange = (field: string, value: boolean, checkBoxChanged: boolean) => {
-
-    setToggleStates(prevStates => ({
+    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 => ({
+    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);
+    }));
 
- }
+    props?.updateFieldSettings(
+      props?.rowId,
+      { [field?.charAt(0)?.toUpperCase() + field?.slice(1)]: event?.target?.value },
+      checkBoxChanged
+    );
+  };
 
-
   return (
     <>
       <ModalHeader title={`${props?.fieldtype} propertise`} closeModal={props?.closeModal} />
@@ -66,7 +68,7 @@ const AdvancePropertise = (props: SchemaProps) => {
           value={toggleStates?.validationRegex}
           placeholder="Enter value"
           version="v2"
-          onChange={(e:any)=> handleOnChange("validationRegex",e, true)}
+          onChange={(e: any) => handleOnChange('validationRegex', e, true)}
         />
         <FieldLabel className="option-label" htmlFor="someInput" version="v2">
           Options
@@ -77,33 +79,36 @@ const AdvancePropertise = (props: SchemaProps) => {
             labelColor="primary"
             labelPosition="right"
             checked={toggleStates?.mandatory}
-            onChange={(e:any) => handleToggleChange("mandatory" , e?.target?.checked, true)}
+            onChange={(e: any) => handleToggleChange('mandatory', e?.target?.checked, true)}
           />
           <ToggleSwitch
             label="Multiple"
             labelColor="primary"
             labelPosition="right"
             checked={toggleStates?.multiple}
-            onChange={(e:any) => handleToggleChange("multiple" ,e?.target?.checked, true)}
+            onChange={(e: any) => handleToggleChange('multiple', e?.target?.checked, true)}
           />
           <ToggleSwitch
             label="Unique"
             labelColor="primary"
             labelPosition="right"
             checked={toggleStates?.unique}
-            onChange={(e:any) => handleToggleChange("unique" , e?.target?.checked,true)}
+            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={toggleStates?.nonLocalizable}
-            onChange={(e:any) => handleToggleChange("nonLocalizable" , 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={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

diff --git a/ui/src/components/Card/card.scss b/ui/src/components/Card/card.scss
@@ -12,11 +12,17 @@
   padding: 1.75rem 2rem 0.688rem;
 }
 .ProjectCard__title {
-  color: $color-font-black;
-  font-size: $size-font-2-xl;
-  font-weight: $font-weight-extra-bold;
-  height: 1.563rem;
-  line-height: $line-height-reset;
+  color: $color-font-base;
+  display: -webkit-box;
+  font-size: $size-font-xl;
+  font-weight: $font-weight-semi-bold;
+  height: $px-48;
+  line-height: $line-height-default;
+  overflow: hidden;
+  padding: 0;
+  white-space: normal;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
 }
 .ProjectCard__footer {
   display: flex;

diff --git a/ui/src/components/Card/index.tsx b/ui/src/components/Card/index.tsx
@@ -43,7 +43,9 @@ const CardList = ({ project }: ProjectType) => {
             <div className="ProjectCard__stats">
               <div className="ProjectCard__unit">
                 <span className="ProjectCard__stats-number">Project Status</span>
-                <span className="ProjectCard__stats-category">{PROJECT_STATUS?.[project?.status !== undefined ? project?.status : 0]}</span>
+                <span className="ProjectCard__stats-category">
+                  {PROJECT_STATUS?.[project?.status !== undefined ? project?.status : 0]}
+                </span>
               </div>
             </div>
           </div>

diff --git a/ui/src/components/Common/AddStack/addStack.scss b/ui/src/components/Common/AddStack/addStack.scss
@@ -9,4 +9,3 @@
 .ReactModal__Overlay .ReactModal__Content .ReactModal__Content__body.selectWrapperBody {
   overflow: visible;
 }
-
diff --git a/ui/src/components/Common/AddStack/addStack.tsx b/ui/src/components/Common/AddStack/addStack.tsx
@@ -81,24 +81,26 @@ const AddStack = (props: any): JSX.Element => {
         setIsLoading(false);
       });
 
-      //fetch all locales
-      getAllLocales(props?.selectedOrganisation).then((response:any) => {
-      const rawMappedLocalesMapped = validateObject(response?.data) && response?.data?.locales
-        ? Object?.keys(response?.data?.locales)?.map((key) => ({
-            uid: key,
-            label: response?.data?.locales[key],
-            value: key,
-            master_locale: key,
-            locales:[],
-            created_at: key
-          }))
-        : [];
+    //fetch all locales
+    getAllLocales(props?.selectedOrganisation)
+      .then((response: any) => {
+        const rawMappedLocalesMapped =
+          validateObject(response?.data) && response?.data?.locales
+            ? Object?.keys(response?.data?.locales)?.map((key) => ({
+                uid: key,
+                label: response?.data?.locales[key],
+                value: key,
+                master_locale: key,
+                locales: [],
+                created_at: key
+              }))
+            : [];
         setAllLocales(rawMappedLocalesMapped);
       })
       .catch((err: any) => {
         console.error(err);
       });
-      //org id will always be there
+    //org id will always be there
   }, []);
   return (
     <>

diff --git a/ui/src/components/ContentMapper/contentMapper.interface.ts b/ui/src/components/ContentMapper/contentMapper.interface.ts
@@ -10,11 +10,11 @@ interface mapDataType {
   projectId: string;
 }
 interface Advanced {
-  ValidationRegex: string,
-  mandatory:boolean,
-  multiple:boolean,
-  unique:boolean,
-  nonLocalizable:boolean
+  ValidationRegex: string;
+  mandatory: boolean;
+  multiple: boolean;
+  unique: boolean;
+  nonLocalizable: boolean;
 }
 export interface ContentMapperType {
   content_types_heading?: string;
@@ -64,7 +64,7 @@ export interface FieldMapType {
   uid: string;
   id: string;
   _canSelect?: boolean;
-  advanced:Advanced
+  advanced: Advanced;
 }
 
 export interface ItemStatus {

diff --git a/ui/src/components/ContentMapper/index.scss b/ui/src/components/ContentMapper/index.scss
@@ -75,7 +75,7 @@
   }
 }
 .disabled-field {
-  color: $color-font-disabled; 
+  color: $color-font-disabled;
 }
 .action-btn-wrapper {
   background-color: $color-brand-white-base;
Original file line number	Diff line number	Diff line change
Expand Up		@@ -9,4 +9,3 @@
		.ReactModal__Overlay .ReactModal__Content .ReactModal__Content__body.selectWrapperBody {
		overflow: visible;
		}