fix ui

src/common/lib/util.ts

 import {
   AddressType,
-  ApplicationType,
   CandidateType,
   OrganizationType,
   Reducers,
@@ -53,7 +52,7 @@ export const getUserId = (state: Reducers): string => {
   return profile._id as string;
 };
 
-export const getStatusColor = (status?: ApplicationType["status"]) => {
+export const getStatusColor = (status?: string) => {
   const color =
     status === "Accepted"
       ? "text-bg-success"

src/common/types.ts

@@ -216,7 +216,7 @@ export type ApplicationPayloadType = {
   _id: string;
   candidate: CandidateType;
   job: string;
-  status: "Pending" | "Accepted" | "In progress" | "Rejected";
+  status: string;
   interview?: {
     date: string;
     time: string;

src/components/Application/Interview.tsx

@@ -20,7 +20,7 @@ import {
 import Progress from "../Progress";
 import { fileStorage } from "../../common/config";
 import { useDispatch } from "react-redux";
-import { updateApplication } from "../../common/actions/common";
+import { getJobs, updateApplication } from "../../common/actions/common";
 import { getVerificationColor } from "../../common/lib/util";
 
 type OwnProps = {
@@ -46,6 +46,10 @@ const Interview = ({ application }: OwnProps) => {
   const _video = useRef<ReactPlayer>(null);
   const _hiddenFileInput = useRef<HTMLInputElement>(null);
 
+  useEffect(() => {
+    dispatch(getJobs());
+  }, []);
+
   const onPressStartFacialExpression = () => {
     setIsFacialAnalyzing(true);
     const url = `ws://127.0.0.1:8000/facial/ws/emotions?application_id=${application._id}`;
@@ -214,7 +218,9 @@ const Interview = ({ application }: OwnProps) => {
         </strong>
       );
     }
-    return null;
+    return (
+      <strong className="text-primary">Voice verification: Pending</strong>
+    );
   };
 
   return (

src/components/Jobs.tsx

@@ -52,12 +52,14 @@ const Jobs = ({ jobs, onSelectJob, selectedIndex }: OwnProps) => {
           Salary : {job.salary.min} - {job.salary.max} {job.salary.currency}{" "}
         </p>
         <p className="desc">{job.description.slice(0, 200)}...</p>
-        <p className="desc mt-2">
-          <label>Applicattions : </label>{" "}
-          <a href={`/applications?jobId=${job._id}`}>
-            ({job.applications?.length}) Candidates
-          </a>
-        </p>
+        {userType === USER_TYPE.ORGANIZATION && (
+          <p className="desc mt-2">
+            <label>Applicattions : </label>{" "}
+            <a href={`/applications?jobId=${job._id}`}>
+              ({job.applications?.length}) Candidates
+            </a>
+          </p>
+        )}
       </div>
     );
   };

src/views/Application.tsx

@@ -14,24 +14,24 @@ const Application = () => {
   const dispatch = useDispatch();
   const [searchParams] = useSearchParams();
   const [selectedTab, setSelectedTab] = useState("Candidate");
-  const [status, setStatus] = useState("Pending");
   const job = useOutletContext<JobPayloadType>();
   const applicationId = searchParams.get("applicationId");
   const application = (job.applications as ApplicationPayloadType[])?.find(
     (_application) => _application._id === applicationId
   );
+  const [status, setStatus] = useState(application?.status);
 
   const statusValues = useMemo(() => {
     if (status === "Pending") {
       return ["Schedule", "Reject"];
-    } else if (status === "Schedule") {
+    } else if (status === "In progress") {
       return ["Accept", "Reject"];
     } else if (status === "Rejected") {
       return ["Pending", "Schedule"];
     } else {
       return [];
     }
-  }, [status]);
+  }, []);
 
   useEffect(() => {
     if (application) {
@@ -54,17 +54,22 @@ const Application = () => {
     } else if (status === "Reject") {
       applicationStatus = "Rejected";
     }
-    dispatch(
-      updateApplication({
-        applicationId: application._id,
-        update: { status: applicationStatus },
-        candidateId: application.candidate._id || "",
-      })
-    );
+
+    console.log("STATUS ", status, applicationStatus);
+
+    // dispatch(
+    //   updateApplication({
+    //     applicationId: application._id,
+    //     update: { status: applicationStatus },
+    //     candidateId: application.candidate._id || "",
+    //   })
+    // );
   };
 
   const onChangeStatus = (e: ChangeEvent<HTMLSelectElement>) => {
-    setStatus(e.target.value);
+    if (e.target.value !== "select") {
+      setStatus(e.target.value);
+    }
   };
 
   const renderOptions = (option: string, index: number) => (
@@ -92,6 +97,7 @@ const Application = () => {
                 value={status}
                 onChange={onChangeStatus}
               >
+                <option value="select">Select</option>
                 {statusValues.map(renderOptions)}
               </select>
               <button

src/views/Applications.view.tsx

@@ -13,7 +13,7 @@ const Applications = () => {
 
   useEffect(() => {
     if (job) {
-      sortApplications("skills", job);
+      sortApplications("total", job);
     }
   }, [job]);
 
@@ -91,9 +91,9 @@ const Applications = () => {
             aria-label="Default select example"
             onChange={onSelectSort}
           >
+            <option value="total">Total score</option>
             <option value="skills">Skills score</option>
             <option value="similarity">Similarity</option>
-            <option value="total">Total score</option>
           </select>
         </div>
       </div>