diff --git a/src/frontend/src/components/ManageProject/EditTab/FormUpdateTab.tsx b/src/frontend/src/components/ManageProject/EditTab/FormUpdateTab.tsx index 6403ce3163..1d798554a9 100644 --- a/src/frontend/src/components/ManageProject/EditTab/FormUpdateTab.tsx +++ b/src/frontend/src/components/ManageProject/EditTab/FormUpdateTab.tsx @@ -1,9 +1,7 @@ -import React, { useEffect, useState } from 'react'; +import React, { useState } from 'react'; import UploadArea from '../../common/UploadArea'; -import { CustomSelect } from '../../common/Select'; import Button from '../../common/Button'; import CoreModules from '@/shared/CoreModules'; -import { diffObject } from '@/utilfunctions/compareUtils.js'; import { PostFormUpdate } from '@/api/CreateProjectService'; type FileType = { @@ -17,19 +15,10 @@ const FormUpdateTab = ({ projectId }) => { const dispatch = CoreModules.useAppDispatch(); const [uploadForm, setUploadForm] = useState(null); - const [selectedFormCategory, setSelectedFormCategory] = useState(null); - const formCategoryList = CoreModules.useAppSelector((state) => state.createproject.formCategoryList); - const previousXform_title = CoreModules.useAppSelector((state) => state.project.projectInfo.xform_title); - - useEffect(() => { - setSelectedFormCategory(previousXform_title); - }, [previousXform_title]); const onSave = () => { - const diffPayload = diffObject({ category: previousXform_title }, { category: selectedFormCategory }); dispatch( PostFormUpdate(`${import.meta.env.VITE_API_URL}/projects/update_category`, { - ...(Object.keys(diffPayload).length > 0 ? diffPayload : { category: selectedFormCategory }), project_id: projectId, upload: uploadForm && uploadForm?.[0]?.url, }), @@ -38,17 +27,6 @@ const FormUpdateTab = ({ projectId }) => { return (
- value && setSelectedFormCategory(value?.toString())} - className="fmtm-bg-white" - /> { - const dispatch = CoreModules.useAppDispatch(); const [tabView, setTabView] = useState<'Project Description' | 'Form Update'>('Project Description'); - useEffect(() => { - dispatch(FormCategoryService(`${import.meta.env.VITE_API_URL}/central/list-forms`)); - }, []); - return (
diff --git a/src/frontend/src/components/ProjectSubmissions/TaskSubmissions.tsx b/src/frontend/src/components/ProjectSubmissions/TaskSubmissions.tsx index 214ad1cabb..4a55aee747 100644 --- a/src/frontend/src/components/ProjectSubmissions/TaskSubmissions.tsx +++ b/src/frontend/src/components/ProjectSubmissions/TaskSubmissions.tsx @@ -1,21 +1,43 @@ -import React from 'react'; +import React, { useEffect, useState } from 'react'; import TaskSubmissionsMap from '@/components/ProjectSubmissions/TaskSubmissionsMap'; import InputTextField from '@/components/common/InputTextField'; import Button from '@/components/common/Button'; import AssetModules from '@/shared/AssetModules.js'; import CoreModules from '@/shared/CoreModules.js'; import { TaskCardSkeletonLoader } from '@/components/ProjectSubmissions/ProjectSubmissionsSkeletonLoader'; +import { taskInfoType } from '@/models/submission/submissionModel'; const TaskSubmissions = () => { const dispatch = CoreModules.useAppDispatch(); - const taskInfo = CoreModules.useAppSelector((state) => state.task.taskInfo); + const taskInfo: taskInfoType[] = CoreModules.useAppSelector((state) => state.task.taskInfo); const taskLoading = CoreModules.useAppSelector((state) => state.task.taskLoading); + const [searchedTaskId, setSearchedTaskId] = useState(''); + const [debouncedSearchedTaskId, setDebouncedSearchedTaskId] = useState(''); + const [filteredTaskInfo, setFilteredTaskInfo] = useState([]); const zoomToTask = (taskId) => { dispatch(CoreModules.TaskActions.SetSelectedTask(+taskId)); }; - const TaskCard = ({ task }) => ( + useEffect(() => { + const timeoutId = setTimeout(() => { + setDebouncedSearchedTaskId(searchedTaskId); + }, 500); + return () => clearTimeout(timeoutId); + }, [searchedTaskId, 1000]); + + useEffect(() => { + if (debouncedSearchedTaskId) { + const searchedTaskInfoList = taskInfo?.filter((task): boolean => { + return task.task_id.includes(debouncedSearchedTaskId); + }); + setFilteredTaskInfo(searchedTaskInfoList); + } else { + setFilteredTaskInfo(taskInfo); + } + }, [debouncedSearchedTaskId, taskInfo]); + + const TaskCard = ({ task }: { task: taskInfoType }) => (
@@ -45,17 +67,29 @@ const TaskSubmissions = () => { return (
- {}} value="" placeholder="Search by task id" /> + { + setSearchedTaskId(e.target.value); + }} + value={searchedTaskId} + placeholder="Search by task id" + />
{taskLoading ? (
- {Array.from({ length: 10 }).map((i) => ( + {Array.from({ length: 10 }).map((_, i) => ( ))}
- ) : ( + ) : filteredTaskInfo?.length > 0 ? (
- {taskInfo?.map((task) => )} + {filteredTaskInfo?.map((task: taskInfoType) => )} +
+ ) : ( +
+

No tasks found!

)}
diff --git a/src/frontend/src/models/submission/submissionModel.ts b/src/frontend/src/models/submission/submissionModel.ts index e69de29bb2..ce457d23bf 100644 --- a/src/frontend/src/models/submission/submissionModel.ts +++ b/src/frontend/src/models/submission/submissionModel.ts @@ -0,0 +1,6 @@ +export type taskInfoType = { + task_id: string; + submission_count: number; + last_submission: string | null; + feature_count: number; +};