fix: clinic setup stepper

src/views/ClinicSetup/index.jsx

@@ -326,9 +326,7 @@ If No  -Pt who do not have a Medicare card / Private  patients with or without I
     }
 
     if (activeStep == 1) {
-      if (
+      if (!audioListenDone) {
-        !audioListenDone
-      ) {
         pushNotification(
           "Please listen to the audio before proceeding",
           "error"
@@ -337,13 +335,15 @@ If No  -Pt who do not have a Medicare card / Private  patients with or without I
       }
     }
 
-    const newActiveStep =
+    // Only move to next step without marking as completed
-      isLastStep() && !allStepsCompleted()
+    if (!isLastStep()) {
-        ? // It's the last step, but not all steps have been completed,
+      setActiveStep(activeStep + 1);
-          // find the first step that has not been completed
+    } else if (!allStepsCompleted()) {
-          steps.findIndex((step, i) => !(i in completed))
+      // If it's the last step and not all steps are completed,
-        : activeStep + 1;
+      // find the first uncompleted step
-    setActiveStep(newActiveStep);
+      const firstUncompletedStep = steps.findIndex((step, i) => !(i in completed));
+      setActiveStep(firstUncompletedStep);
+    }
   };
 
   // Listen to voice using rime.ai API
@@ -518,20 +518,25 @@ If No  -Pt who do not have a Medicare card / Private  patients with or without I
 
   // Handle complete step
   const handleComplete = () => {
-
+    if (activeStep == 4 && !testConnDone) {
-    if( activeStep == 4 && !testConnDone){
       pushNotification("Please test connection before proceeding", NOTIFICATION.ERROR);
       return;
     }
 
-    if (true) {
+    // Mark current step as completed
-      const newCompleted = { ...completed };
+    const newCompleted = { ...completed };
-      newCompleted[activeStep] = true;
+    newCompleted[activeStep] = true;
-      setCompleted(newCompleted);
+    setCompleted(newCompleted);
-      handleNext();
+    
+    // Move to next step or first uncompleted step
+    if (!isLastStep()) {
+      setActiveStep(activeStep + 1);
+    } else if (!allStepsCompleted()) {
+      const firstUncompletedStep = steps.findIndex((step, i) => !(i in newCompleted));
+      setActiveStep(firstUncompletedStep);
     } else {
-      // Scroll to the top to make error messages visible
+      // All steps completed
-      window.scrollTo(0, 0);
+      setActiveStep(steps.length);
     }
   };
 
@@ -1042,13 +1047,15 @@ If No  -Pt who do not have a Medicare card / Private  patients with or without I
             const stepProps = {};
             const labelProps = {};
             // Determine if this step is clickable
-            const isClickable = confirmPhoneNumber && completed[index];
+            const isClickable = confirmPhoneNumber && (completed[index] || index < activeStep);
+            // Only show as completed if explicitly marked as completed
+            const isStepCompleted = completed[index] === true;
 
             return (
-              <Step key={label} {...stepProps} completed={completed[index]}>
+              <Step key={label} {...stepProps} completed={isStepCompleted}>
                 <StepLabel
                   {...labelProps}
-                  onClick={handleStep(index)}
+                  onClick={isClickable ? handleStep(index) : undefined}
                   sx={{
                     cursor: isClickable ? "pointer" : "not-allowed",
                     opacity: isClickable ? 1 : 0.7,

src/views/ClinicsList/index.jsx

@@ -532,7 +532,7 @@ const ClinicsList = () => {
                 options={{
                   enableRowSelection: false,
                   showTopBar: false,
-                  showFilters: true,
+                  showFilters: false,
                 }}
                 searchText="Clinics"
                 showSearchBox={true}
@@ -544,7 +544,11 @@ const ClinicsList = () => {
                 hideTopToolbar
                 columns={columnsRegistered}
                 getData={(filters) => getData(filters, false)} // false for registered
-                options={{ enableRowSelection: true, showTopBar: false }}
+                options={{
+                  enableRowSelection: false,
+                  showTopBar: false,
+                  showFilters: false,
+                }}
                 showSearchBox={true}
                 ref={ref}
                 showAction={true}

src/views/StaffManagement/index.jsx

@@ -20,7 +20,7 @@ import CustomBreadcrumbs from "../../components/CustomBreadcrumbs";
 import PageHeader from "../../components/PageHeader";
 import { createAdmin, getAdmins, updateAdmin, deleteAdmin } from "../../services/auth.services";
 import { pushNotification } from "../../utils/notification";
-import { NOTIFICATION } from "../../constants";
+import { NOT_AVAILABLE_TEXT, NOTIFICATION } from "../../constants";
 import { useStyles } from "./staffStyles";
 import Table from "../../components/Table";
 
@@ -215,7 +215,7 @@ const StaffManagement = () => {
     },
     {
       size: 280,
-      accessorKey: "username",
+      accessorFn: ({ username }) => (username ? username.charAt(0).toUpperCase() + username.slice(1) : NOT_AVAILABLE_TEXT),
       header: "User Name",
       enableColumnFilter: false,
     },
@@ -304,7 +304,7 @@ const StaffManagement = () => {
                 label="First Name"
                 fullWidth
                 margin="normal"
-                value={firstName}
+                value={firstName.charAt(0).toUpperCase() + firstName.slice(1)}
                 onChange={(e) => setFirstName(e.target.value)}
                 placeholder="First Name"
                 required

src/views/User/index.jsx

@@ -196,7 +196,7 @@ function Users() {
       },
       {
         size: 100,
-        accessorFn: ({ name }) => name || NOT_AVAILABLE_TEXT,
+        accessorFn: ({ name }) => (name ? name.charAt(0).toUpperCase() + name.slice(1) : NOT_AVAILABLE_TEXT),
         accessorKey: "name",
         header: "Doctor/Nurse Name",
         isBold: true,