diff --git a/forms-flow-web/src/components/Form/Steps/PreviewStepper.js b/forms-flow-web/src/components/Form/Steps/PreviewStepper.js
index dc476bc743..6fb3d23399 100644
--- a/forms-flow-web/src/components/Form/Steps/PreviewStepper.js
+++ b/forms-flow-web/src/components/Form/Steps/PreviewStepper.js
@@ -404,8 +404,9 @@ const Preview = React.memo(
                             </Popover>
                           )}
                         >
-                          <Button id="addDesigner" className="btn btn-primary btn-md form-btn pull-left btn-left">
-                            <Translation>{(t) => t("Add")}</Translation> <b>+</b>
+                          <Button id="addDesigner" className="btn btn-primary  btn-small">
+                          <i className="fa-solid fa-plus mr-2"></i>
+                            <Translation>{(t) => t("Add")}</Translation>
                           </Button>
                         </OverlayTrigger>
                       </div>
@@ -415,7 +416,7 @@ const Preview = React.memo(
                   </div>
                   <div>
                     <div>
-                      <hr className="mt-1" />
+                      <hr className="mt-3" />
                       <span
                         className="font-weight-bold"
                         title={t(
@@ -492,8 +493,9 @@ const Preview = React.memo(
                               </Popover>
                             )}
                           >
-                            <Button id="addClient" className="btn btn-primary btn-md form-btn pull-left btn-left">
-                              <Translation>{(t) => t("Add")}</Translation> <b>+</b>
+                            <Button id="addClient" className="btn btn-primary btn-small ">
+                            <i className="fa-solid fa-plus mr-2"></i>
+                              <Translation>{(t) => t("Add")}</Translation>
                             </Button>
                           </OverlayTrigger>
                         </div>
@@ -504,7 +506,7 @@ const Preview = React.memo(
 
                     <div>
                       <div>
-                        <hr className="mt-1" />
+                        <hr className="mt-3" />
                         <span
                           className="font-weight-bold"
                           title={t("Permission for submission tracking.")}
@@ -584,8 +586,9 @@ const Preview = React.memo(
                                 </Popover>
                               )}
                             >
-                              <Button id="addReviewer" className="btn btn-primary btn-md form-btn pull-left btn-left">
-                                <Translation>{(t) => t("Add")}</Translation> <b>+</b>
+                              <Button id="addReviewer" className="btn btn-primary  btn-small ">
+                              <i className="fa-solid fa-plus mr-2"></i>
+                                <Translation>{(t) => t("Add")}</Translation>
                               </Button>
                             </OverlayTrigger>
                           </div>
diff --git a/forms-flow-web/src/components/Form/Steps/TaskvariableCreate.js b/forms-flow-web/src/components/Form/Steps/TaskvariableCreate.js
index a42102f38e..e0afc8b479 100644
--- a/forms-flow-web/src/components/Form/Steps/TaskvariableCreate.js
+++ b/forms-flow-web/src/components/Form/Steps/TaskvariableCreate.js
@@ -52,7 +52,7 @@ const TaskvariableCreate = ({ options, addTaskVariable }) => {
             inputId="selectTaskVariable"
           />
         </Col>
-        <Col xs={12} md={2}>
+        <Col xs={12} md={3}>
           <label>{t("Label")}</label>
           <input
             type="text"
@@ -64,13 +64,14 @@ const TaskvariableCreate = ({ options, addTaskVariable }) => {
             placeholder={t("Enter Label")}
           />
         </Col>
-        <Col xs={12} md={2}>
+        <Col xs={12} md={3}>
 
           <Form.Group controlId="showInListCheckbox" style={{ marginTop: "34px" }}>
             <div className="d-flex align-items-center mt-3 mr-4">
               <Form.Label className="mr-2">{t("Show in list")}</Form.Label>
               <Form.Check
                 type="checkbox"
+
                 onChange={() => {
                   setShowInList(!showInList);
                 }}
@@ -79,15 +80,15 @@ const TaskvariableCreate = ({ options, addTaskVariable }) => {
           </Form.Group>
         </Col>
 
-        <Col xs={12} md={1}>
+        <Col xs={12} md={2}>
           <Button
-            style={{ marginTop: "30px" }}
+            style={{ marginTop: "25px" }}
             variant="outline-primary"
             onClick={() => {
               addTask();
             }}
           >
-            <i className="fa fa-check"></i> {t("Add")}
+            <i className="fa fa-check mr-2"></i> {t("Add")}
           </Button>
         </Col>
       </Row>
diff --git a/forms-flow-web/src/components/Form/constants/FormTable.js b/forms-flow-web/src/components/Form/constants/FormTable.js
index f48eb3622a..32a73c74e0 100644
--- a/forms-flow-web/src/components/Form/constants/FormTable.js
+++ b/forms-flow-web/src/components/Form/constants/FormTable.js
@@ -1,9 +1,8 @@
-/* eslint-disable */
+
 import React, { useState, useEffect } from "react";
 import {
   InputGroup,
   FormControl,
-  DropdownButton,
   Dropdown,
 } from "react-bootstrap";
 import { useDispatch, useSelector } from "react-redux";
@@ -14,8 +13,7 @@ import {
   setBPMFormListPage,
   setBPMFormListSort,
   setBpmFormSearch,
-  setFormDeleteStatus,
-  // setBpmFormType,
+  setFormDeleteStatus, 
 } from "../../../actions/formActions";
 import SelectFormForDownload from "../FileUpload/SelectFormForDownload";
 import LoadingOverlay from "react-loading-overlay";
@@ -28,7 +26,7 @@ import {
 import { useTranslation } from "react-i18next";
 import { Translation } from "react-i18next";
 import { getAllApplicationCount, getFormProcesses, resetFormProcessData } from "../../../apiManager/services/processServices";
-import { setIsApplicationCountLoading, setResetProcess } from "../../../actions/processActions";
+import { setIsApplicationCountLoading } from "../../../actions/processActions";
 import { HelperServices } from "@formsflow/service";
 import _ from "lodash";
 
@@ -52,18 +50,7 @@ function FormTable() {
   const searchText = useSelector((state) => state.bpmForms.searchText);
   const [search, setSearch] = useState(searchText || "");
   const redirectUrl = MULTITENANCY_ENABLED ? `/tenant/${tenantKey}/` : "/";
-
-  const [openIndex, setOpenIndex] = useState(-1); // -1 means no dropdown open
-
-  const toggleDropdown = (index) => {
-    if (openIndex === index) {
-      // Clicking on the currently open row should close it
-      setOpenIndex(-1);
-    } else {
-      // Clicking on a different row should open it and close the previous one
-      setOpenIndex(index);
-    }
-  };
+  const isApplicationCountLoading = useSelector((state) => state.process.isApplicationCountLoading);
 
   const pageOptions = [
     {
@@ -92,12 +79,7 @@ function FormTable() {
     dispatch(setBPMFormListSort(updatedSort));
     dispatch(setBPMFormListPage(1));
   };
-
-  // const handleTypeChange = (type) => {
-  //   dispatch(setBPMFormListPage(1));
-  //   dispatch(setBPMFormLimit(5));
-  //   dispatch(setBpmFormType(type));
-  // };
+ 
 
   useEffect(() => {
     setSearch(searchText);
@@ -116,13 +98,12 @@ function FormTable() {
 
   const viewOrEditForm = (formId) => {
     dispatch(resetFormProcessData());
-    dispatch(setResetProcess());
     dispatch(push(`${redirectUrl}formflow/${formId}/view-edit`));
   };
 
   const submitNewForm = (formId)=>{
     dispatch(push(`${redirectUrl}form/${formId}`));
-  }
+  };
 
   const handleClearSearch = () => {
     setSearch("");
@@ -147,16 +128,7 @@ function FormTable() {
     </button>
   );
 
-  const submitNew = (formData) => {
-    return (
-      <button
-        className="btn btn-link mt-2"
-        onClick={() => submitNewForm(formData._id)}
-      >
-        <Translation>{(t) => t("Submit New")}</Translation>
-      </button>
-    );
-  };
+ 
 
   const deleteForms = (formData) => {
     dispatch(setIsApplicationCountLoading(true));
@@ -183,6 +155,21 @@ function FormTable() {
       })
     );
   };
+
+  const CustomToggle = React.forwardRef(({ children, onClick }, ref) => (
+    <button
+      className="btn btn-link text-dark"
+      ref={ref}
+      onClick={(e) => {
+        e.preventDefault();
+        onClick(e);
+      }}
+    >
+      {children}
+    </button>
+  ));
+
+
   
   const noDataFound = () => {
     return (
@@ -203,7 +190,7 @@ function FormTable() {
   };
   return (
     <>
-      <LoadingOverlay active={searchFormLoading} spinner text="Loading...">
+      <LoadingOverlay active={searchFormLoading || isApplicationCountLoading} spinner text="Loading...">
         <div style={{ minHeight: "400px" }}>
           <table className="table custom-table table-responsive-sm">
             <thead>
@@ -301,38 +288,44 @@ function FormTable() {
                       <td>{e.anonymous ? t("Anonymous") : t("Private")}</td>
                       <td>
                         {" "}
-                        <button 
-                          className={`btn ${e.status === 'active' ? 'published-forms-label' : 'unpublished-forms-label'}`}
+                        <span 
+                          className={`badge rounded-pill px-3 py-2 ${e.status === 'active' ? 'published-forms-label' : 'unpublished-forms-label'}`}
                         >
                           {e.status === 'active' ? t("Published") : t("Unpublished")}
-                        </button>
+                        </span>
                       </td>
 
                       <td>
                         <span> {viewOrEdit(e)}</span>
                       </td>
                        
-                      <td style={{ position: "relative" }}>
-                        <div
-                          className="dots mb-2 mr-5"
-                          onClick={() => toggleDropdown(index)}
-                        >
-                          ...
-                        </div>
-                        {openIndex === index && (
-                          <Dropdown className="shadow position-absolute bg-white" style={{zIndex:99}}>
+                      <td>
+                    
+                            <Dropdown  >
+                          <Dropdown.Toggle
+                            as={CustomToggle} 
+                            id="dropdown-basic"
+                          >
+                            <i className="fa-solid fa-ellipsis"></i>
+                          </Dropdown.Toggle>
+                          <Dropdown.Menu className="shadow  bg-white">
+                            {userRoles.includes(STAFF_REVIEWER) ||
+                            userRoles.includes(CLIENT) ? (
+                              <Dropdown.Item
+                                onClick={() => {
+                                  submitNewForm(e?._id);
+                                }}
+                              >
+                                <i className="fa fa-pencil mr-2 text-primary" />
+                                {t("Submit New")}
+                              </Dropdown.Item>
+                            ) : null}
                             <Dropdown.Item onClick={() => deleteForms(e)}>
                               <i className="fa fa-trash mr-2 text-danger" />
                               {t("Delete")}
                             </Dropdown.Item>
-                           {(userRoles.includes(STAFF_REVIEWER) || userRoles.includes(CLIENT))?(
-                             <Dropdown.Item onClick={() => {console.log(e);submitNewForm(e?._id)}}>
-                             <i className="fa fa-pencil mr-2 text-primary" />
-                             {t("Submit New")}
-                           </Dropdown.Item>
-                           ) : null}
-                          </Dropdown>
-                        )}
+                          </Dropdown.Menu>
+                        </Dropdown>
                       </td>
                     </tr>
                   );
@@ -372,7 +365,7 @@ function FormTable() {
                 </Dropdown.Menu>
               </Dropdown>
             <span className="ml-2">
-              {t("Showing")} {limit * pageNo - (limit - 1)} {t("to")}{" "}
+              {t("Showing")} {(limit * pageNo) - (limit - 1)} {t("to")}{" "}
               {limit * pageNo > totalForms ? totalForms : limit * pageNo}{" "}
               {t("of")} {totalForms} {t("results")}
             </span>
diff --git a/forms-flow-web/src/components/Modeler/Editors/BpmnEditor/index.js b/forms-flow-web/src/components/Modeler/Editors/BpmnEditor/index.js
index 90578c874c..11efdb1c00 100644
--- a/forms-flow-web/src/components/Modeler/Editors/BpmnEditor/index.js
+++ b/forms-flow-web/src/components/Modeler/Editors/BpmnEditor/index.js
@@ -54,8 +54,8 @@ export default React.memo(
     const [lintErrors, setLintErrors] = useState([]);
     const [deploymentLoading, setDeploymentLoading] = useState(false);
     const redirectUrl = MULTITENANCY_ENABLED ? `/tenant/${tenantKey}/` : "/";
-    const [processName,setProcessName] = useState(true);
-    const bpmPropertyInput = document.getElementById("bio-properties-panel-name")?.value;
+    // const [processName,setProcessName] = useState(true);
+    // const bpmPropertyInput = document.getElementById("bio-properties-panel-name")?.value;
 
     const containerRef = useCallback((node) => {
       if (node !== null) {
@@ -63,11 +63,11 @@ export default React.memo(
       }
     }, []);
 
-    useEffect(() => {
-      if (bpmPropertyInput) {
-        setProcessName(false);
-      }
-  }, [!bpmPropertyInput]);
+  //   useEffect(() => {
+  //     if (bpmPropertyInput) {
+  //       setProcessName(false);
+  //     }
+  // }, [!bpmPropertyInput]);
 
     const cancel = () => {
       dispatch(push(`${redirectUrl}processes`));
@@ -326,14 +326,14 @@ export default React.memo(
               variant="outline-dark"
               className="ml-3"
               onClick={handleExport}
-              disabled={processName || !bpmPropertyInput}
+              // disabled={processName || !bpmPropertyInput}
             >
               {t("Export")}
             </Button>
             <Button
               className="ml-3"
               onClick={deployProcess}
-              disabled={processName || !bpmPropertyInput}
+              // disabled={processName || !bpmPropertyInput}
             >
               {t("Deploy")}
             </Button>
diff --git a/forms-flow-web/src/components/Modeler/constants/bpmnTable.js b/forms-flow-web/src/components/Modeler/constants/bpmnTable.js
index 3081c13bfc..e8f560aecb 100644
--- a/forms-flow-web/src/components/Modeler/constants/bpmnTable.js
+++ b/forms-flow-web/src/components/Modeler/constants/bpmnTable.js
@@ -46,7 +46,7 @@ function BpmnTable() {
       )
     );
     setCountLoading(true);
-    fetchAllBpmProcessesCount(tenantKey, search)
+    fetchAllBpmProcessesCount(tenantKey, searchText)
       .then((result) => {
         setTotalProcess(result.data?.count || 0);
       })
@@ -96,8 +96,8 @@ function BpmnTable() {
           <table className="table custom-table table-responsive-sm mt-2">
             <thead>
               <tr>
-                <th scope="col">{t("Key")}</th>
                 <th scope="col">{t("Workflow Name")}</th>
+                <th scope="col">{t("Key")}</th>
                 <th scope="col">{t("Type")}</th>
                 <th colSpan="2">
                 <InputGroup className="input-group">
@@ -140,7 +140,7 @@ function BpmnTable() {
                     style={{ height: "300px" }}
                     className="text-center"
                   >
-                    {t("No Process Found")}
+                     { isLoading ? null : t("No Process Found")}
                   </td>
                 </tr>
               </tbody>
@@ -148,13 +148,14 @@ function BpmnTable() {
               <tbody>
                 {process.map((processItem) => (
                   <tr key={processItem.id}>
-                    <td>{processItem.key}</td>
                     <td>{processItem.name}</td>
+                    <td>{processItem.key}</td>
                     <td>{t("BPMN")}</td>
-                    <td>
+                    <td className="d-flex justify-content-end w-100">
                       <Link
                         to={`${redirectUrl}processes/bpmn/${processItem.key}/edit`}
                       > 
+                      <i className="fas fa-edit mr-2"/>
                         {t("Edit Workflow")}
                       </Link>
                     </td>
diff --git a/forms-flow-web/src/components/Modeler/constants/dmnTable.js b/forms-flow-web/src/components/Modeler/constants/dmnTable.js
index 98b8651abb..2b7dcf2dad 100644
--- a/forms-flow-web/src/components/Modeler/constants/dmnTable.js
+++ b/forms-flow-web/src/components/Modeler/constants/dmnTable.js
@@ -48,7 +48,7 @@ function DmnTable() {
       )
     );
     setCountLoading(true);
-    fetchAllDmnProcessesCount(tenantKey, search)
+    fetchAllDmnProcessesCount(tenantKey, searchText)
       .then((result) => {
         setTotalProcess(result.data?.count || 0);
       })
@@ -97,8 +97,8 @@ function DmnTable() {
           <table className="table custom-table  table-responsive-sm mt-2">
             <thead>
               <tr>
-                <th scope="col">{t("Key")}</th>
                 <th scope="col">{t("Workflow Name")}</th>
+                <th scope="col">{t("Key")}</th>
                 <th scope="col">{t("Type")}</th>
                 <th colSpan="2">
                 <InputGroup className="input-group">
@@ -141,7 +141,7 @@ function DmnTable() {
                     style={{ height: "300px" }}
                     className="text-center"
                   >
-                    {t("No DMN Found")}
+                   { isLoading ? null : t("No Process Found")}
                   </td>
                 </tr>
               </tbody>
@@ -149,13 +149,14 @@ function DmnTable() {
               <tbody>
                 {dmn.map((processItem) => (
                   <tr key={processItem.id}>
-                    <td>{processItem.key}</td>
                     <td>{processItem.name}</td>
+                    <td>{processItem.key}</td>
                     <td>{t("DMN")}</td>
-                    <td>
+                    <td className="d-flex justify-content-end w-100">
                       <Link
                         to={`${redirectUrl}processes/dmn/${processItem.key}/edit`}
                       >
+                        <i className="fas fa-edit mr-2"/>
                         {t("Edit Workflow")}
                       </Link>
                     </td>