Dev

api/src/config/dev.config.ts

@@ -10,4 +10,6 @@ export const devConfig = {
     AZURE_NA: "https://azure-na-app.contentstack.com/#!",
     AZURE_EU: "https://azure-eu-app.contentstack.com/#!",
   },
-};
+  LOG_FILE_PATH:
+    process.platform === "win32" ? ".\\combine.log" : "./combine.log", // Replace with the actual path to your log file
+};

api/src/config/prod.config.ts

@@ -11,4 +11,6 @@ export const prodConfig = {
     AZURE_NA: "https://azure-na-app.contentstack.com/#!",
     AZURE_EU: "https://azure-eu-app.contentstack.com/#!",
   },
+  LOG_FILE_PATH:
+    process.platform === "win32" ? ".\\combine.log" : "./combine.log", // Replace with the actual path to your log file
 };

api/src/server.ts

@@ -20,6 +20,7 @@ import chokidar from "chokidar";
 import { Server } from "socket.io";
 import http from "http";
 import fs from "fs";
+
 try {
   const app = express();
   app.use(
@@ -55,9 +56,17 @@ try {
       logger.info(`Server listening at port ${config.PORT}`)
     );
     // Chokidar - Watch for log file changes
-    const logFilePath = "/Users/sayali.joshi/Projects/migration-v2-node-server/api/combine.log"; // Replace with the actual path to your log file
+    const logFilePath = config.LOG_FILE_PATH;
     const watcher = chokidar.watch(logFilePath);
     // Socket.IO - Send logs to client
+    /**
+     * The Socket.IO server instance.
+     *
+     * @remarks
+     * This server instance is responsible for handling real-time communication between the client and the server using the Socket.IO library.
+     *
+     * @type {Server}
+     */
     const io = new Server(
       server,
       (http,
@@ -94,4 +103,4 @@ try {
 } catch (e) {
   logger.error("Error while starting the server!");
   logger.error(e);
-}
+}

ui/src/common/assets/icons.tsx

@@ -770,4 +770,21 @@ export const LOG_OUT = (
   <path fillRule="evenodd" clipRule="evenodd" d="M9.1875 12C9.1875 11.6893 9.43934 11.4375 9.75 11.4375H20.25C20.5607 11.4375 20.8125 11.6893 20.8125 12C20.8125 12.3107 20.5607 12.5625 20.25 12.5625H9.75C9.43934 12.5625 9.1875 12.3107 9.1875 12Z" fill="#475161"/>
   <path fillRule="evenodd" clipRule="evenodd" d="M4.5 4.3125C4.45027 4.3125 4.40258 4.33225 4.36742 4.36742C4.33225 4.40258 4.3125 4.45027 4.3125 4.5V19.5C4.3125 19.5497 4.33225 19.5974 4.36742 19.6326C4.40258 19.6677 4.45027 19.6875 4.5 19.6875H9.75C10.0607 19.6875 10.3125 19.9393 10.3125 20.25C10.3125 20.5607 10.0607 20.8125 9.75 20.8125H4.5C4.1519 20.8125 3.81806 20.6742 3.57192 20.4281C3.32578 20.1819 3.1875 19.8481 3.1875 19.5V4.5C3.1875 4.1519 3.32578 3.81806 3.57192 3.57192C3.81806 3.32578 4.1519 3.1875 4.5 3.1875H9.75C10.0607 3.1875 10.3125 3.43934 10.3125 3.75C10.3125 4.06066 10.0607 4.3125 9.75 4.3125H4.5Z" fill="#475161"/>
   </svg>
-);  
+);  
+
+export const MAGNIFY = (
+<svg width="20" height="20" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M13.625 11.25C13.625 11.0429 13.4571 10.875 13.25 10.875C13.0429 10.875 12.875 11.0429 12.875 11.25V12.875H11.25C11.0429 12.875 10.875 13.0429 10.875 13.25C10.875 13.4571 11.0429 13.625 11.25 13.625H12.875V15.25C12.875 15.4571 13.0429 15.625 13.25 15.625C13.4571 15.625 13.625 15.4571 13.625 15.25V13.625H15.25C15.4571 13.625 15.625 13.4571 15.625 13.25C15.625 13.0429 15.4571 12.875 15.25 12.875H13.625V11.25Z" fill="#475161"/>
+  <path fillRule="evenodd" clipRule="evenodd" d="M7.625 13.25C7.625 10.1434 10.1434 7.625 13.25 7.625C16.3566 7.625 18.875 10.1434 18.875 13.25C18.875 14.6683 18.3501 15.9641 17.4838 16.9535L20.2652 19.7349C20.4116 19.8813 20.4116 20.1187 20.2652 20.2652C20.1187 20.4116 19.8813 20.4116 19.7349 20.2652L16.9535 17.4838C15.9641 18.3501 14.6683 18.875 13.25 18.875C10.1434 18.875 7.625 16.3566 7.625 13.25ZM13.25 8.375C10.5576 8.375 8.375 10.5576 8.375 13.25C8.375 15.9424 10.5576 18.125 13.25 18.125C15.9424 18.125 18.125 15.9424 18.125 13.25C18.125 10.5576 15.9424 8.375 13.25 8.375Z" fill="#475161"/>
+</svg>
+);
+
+export const DEMAGNIFY = (
+  <svg width="20" height="20" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M11.25 13.625H15.25C15.4571 13.625 15.625 13.4571 15.625 13.25C15.625 13.0429 15.4571 12.875 15.25 12.875H11.25C11.0429 12.875 10.875 13.0429 10.875 13.25C10.875 13.4571 11.0429 13.625 11.25 13.625Z" fill="#475161"/>
+  <path fillRule="evenodd" clipRule="evenodd" d="M7.625 13.25C7.625 10.1434 10.1434 7.625 13.25 7.625C16.3566 7.625 18.875 10.1434 18.875 13.25C18.875 14.6683 18.3501 15.9641 17.4838 16.9535L20.2652 19.7349C20.4116 19.8813 20.4116 20.1187 20.2652 20.2652C20.1187 20.4116 19.8813 20.4116 19.7349 20.2652L16.9535 17.4838C15.9641 18.3501 14.6683 18.875 13.25 18.875C10.1434 18.875 7.625 16.3566 7.625 13.25ZM13.25 8.375C10.5576 8.375 8.375 10.5576 8.375 13.25C8.375 15.9424 10.5576 18.125 13.25 18.125C15.9424 18.125 18.125 15.9424 18.125 13.25C18.125 10.5576 15.9424 8.375 13.25 8.375Z" fill="#475161"/>
+</svg>
+
+);
+
+

ui/src/components/ContentMapper/index.tsx

@@ -60,6 +60,85 @@ import AdvanceSettings from '../AdvancePropertise';
 
 // Styles
 import './index.scss';
+const dummy_obj:any = {
+  'single_line_text':{
+    label : 'Single Line Textbox',
+    options : {
+      'Single Line Textbox':'single_line_text',
+      'Multi Line Textbox':'multi_line_text',
+      'HTML Rich text Editor':'html',
+      'JSON Rich Text Editor':'json'}
+  },
+  'multi_line_text':{
+    label : 'Multi Line Textbox',
+    options : {
+      'HTML Rich text Editor': 'html',
+      'JSON Rich Text Editor':'json'}
+  },
+  'json':{
+    label:'JSON Rich Text Editor',
+    options : {
+      'JSON Rich Text Editor':'json'}
+  },
+  'html':{
+    label : 'HTML Rich text Editor',
+    options : {
+      'HTML Rich text Editor': 'html',
+      'JSON Rich Text Editor':'json'}
+
+  },
+  'text':{
+    label : 'Single Line Textbox',
+    options: {'Single Line Textbox':'single_line_text'}
+  },
+  'url': {
+    label: 'URL',
+    options:{'URL':'url'}
+  },
+  'file': {
+    label:'File',
+    options: {'File':'file'}
+  },
+  'number': { 
+    label:'Number',
+    options: {'Number':'number'}
+  },
+  'isodate': { label :'Date',
+    options: {'Date':'isodate'}
+  },
+  'boolean': {
+    label: 'Boolean',
+    options: {'Boolean':'boolean'}
+  },
+  'link': {
+    label:'Link',
+    options: {'Link':'link'}
+  },
+  'reference':{
+    label: 'Reference',
+    options: {'Reference':'reference'}
+  },
+  'dropdown': {
+    label:'Dropdown',
+    options: {'Dropdown':'dropdown'}
+  },
+  'radio': {
+    label :'Select',
+    options: {'Select':'select'}
+  },
+  'CheckBox': {
+    label:'Select',
+    options: {'Select':'checkbox'}
+  },
+  'global_field':{
+    label : 'Global',
+    options: {'Global':'global_field'}},
+  'group': {
+    label: 'Group',
+    options: {'Group':'group'}
+  }
+
+}
 
 const Fields: Mapping = {
   'Single Line Textbox': [
@@ -162,6 +241,7 @@ const ContentMapper = () => {
   const [contentTypeSchema, setContentTypeSchema] = useState<ContentTypesSchema[]>([]);
   const [showFilter, setShowFilter] = useState<boolean>(false);
   const [filteredContentTypes, setFilteredContentTypes] = useState<ContentType[]>([])
+  const [count, setCount] = useState<number>(0);
 
   /** ALL HOOKS Here */
   const { projectId = '' } = useParams();
@@ -244,6 +324,7 @@ const ContentMapper = () => {
     const { data } = await getContentTypes(projectId || '', 0, 5000, searchContentType || ''); //org id will always present
 
     setContentTypes(data?.contentTypes);
+    setCount(data?.contentTypes?.length);
     setFilteredContentTypes(data?.contentTypes);
     setSelectedContentType(data?.contentTypes?.[0]);
     setTotalCounts(data?.contentTypes?.[0]?.fieldMapping?.length);
@@ -480,21 +561,36 @@ const ContentMapper = () => {
     });
   };
   const SelectAccessor = (data: FieldMapType) => {
-    const OptionsForRow = Fields[data?.backupFieldType as keyof Mapping];
-
-    const option = Array.isArray(OptionsForRow)
-      ? OptionsForRow.map((option) => ({ label: option, value: option }))
-      : [{ label: OptionsForRow, value: OptionsForRow }];
+
+    //const OptionsForRow = Fields[data?.backupFieldType as keyof Mapping];
+    const OptionsForRow = dummy_obj?.[data?.backupFieldType]?.options ;
+    const initialOption = {
+      label: dummy_obj?.[data?.ContentstackFieldType]?.label,
+      value: dummy_obj?.[data?.ContentstackFieldType]?.label,
+    };
+    let option:any;
+    if (Array.isArray(OptionsForRow)) {
+       option = OptionsForRow.map((option) => ({
+        label: option,
+        value: option,
+      }));
+    } else if (typeof OptionsForRow === 'object') {
+      option = Object.entries(OptionsForRow).map(([label, value]) => ({
+        label,
+        value,
+      }));
+    }else{
+      option = [{ label: OptionsForRow, value: OptionsForRow }]
+    }
 
       const fieldLabel = data?.ContentstackFieldType === 'url' || data?.ContentstackFieldType === 'group'
         ? data?.ContentstackFieldType : option?.[0]?.label
-
     return (
       <div className="table-row">
         <div className="select">
           <Select
             id={data?.uid}
-            value={{ label: data?.ContentstackFieldType, value: fieldValue }}
+            value={initialOption || fieldValue}
             onChange={(selectedOption: FieldTypes) => handleValueChange(selectedOption, data?.uid)}
             placeholder="Select Field"
             version={'v2'}
@@ -925,13 +1021,15 @@ const ContentMapper = () => {
     }
 
     (e?.target as HTMLElement)?.closest('li')?.classList?.add('active-filter');
-    const filteredCT = contentTypes?.filter((ct) => CONTENT_MAPPING_STATUS[ct?.status] === value);
-
+    const filteredCT = contentTypes?.filter((ct) => {return CONTENT_MAPPING_STATUS[ct?.status] === value});
+    
     if (value !== 'All') {
-      setFilteredContentTypes(filteredCT)
+      setFilteredContentTypes(filteredCT);
+      setCount(filteredCT?.length);
     } else {
-      setFilteredContentTypes(contentTypes)
-    }
+      setFilteredContentTypes(contentTypes);
+      setCount(contentTypes?.length);
+    }   
     setShowFilter(false);
   }
 
@@ -952,15 +1050,15 @@ const ContentMapper = () => {
     return result;
   }
   const tableHeight = calcHeight();
-
+   
   return (
     <div className="step-container">
       <div className="d-flex flex-wrap table-container">
         {/* Content Types List */}
         <div className="content-types-list-wrapper">
           <div className="content-types-list-header d-flex align-items-center justify-content-between">
             {contentTypesHeading && <h2>{contentTypesHeading}</h2> }
-            {contentTypes && validateArray(contentTypes) && contentTypes?.length }
+            {contentTypes && validateArray(contentTypes) &&  count }
           </div>
 
           <div className='ct-search-wrapper'>