Skip to content

Commit

Permalink
fix (frontend): remove usage of encode and decode of id's (#1387)
Browse files Browse the repository at this point in the history
  • Loading branch information
NSUWAL123 authored Mar 29, 2024
1 parent 684197e commit 66d743a
Show file tree
Hide file tree
Showing 20 changed files with 88 additions and 117 deletions.
3 changes: 1 addition & 2 deletions src/frontend/src/components/Activities.jsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
import React from 'react';
import IconButtonCard from '@/utilities/IconButtonCard';
import environment from '@/environment';
import { easeIn, easeOut } from 'ol/easing';
import CoreModules from '@/shared/CoreModules';
import AssetModules from '@/shared/AssetModules';
//Activity Model to be display in Activities panel
const Activities = ({ history, defaultTheme, mapDivPostion, map, view, state, params }) => {
const index = state.projectTaskBoundries.findIndex((project) => project.id == environment.decode(params.id));
const index = state.projectTaskBoundries.findIndex((project) => project.id == params.id);

return (
<CoreModules.Stack minWidth={100} direction={'column'} spacing={1}>
Expand Down
3 changes: 1 addition & 2 deletions src/frontend/src/components/ActivitiesPanel.jsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import React, { useEffect, useState } from 'react';
import BasicCard from '@/utilities/BasicCard';
import Activities from '@/components/Activities';
import environment from '@/environment';
import CoreModules from '@/shared/CoreModules';
import AssetModules from '@/shared/AssetModules';

Expand Down Expand Up @@ -67,7 +66,7 @@ const ActivitiesPanel = ({ defaultTheme, state, params, map, view, mapDivPostion
};

useEffect(() => {
const index = state.findIndex((project) => project.id == environment.decode(params.id));
const index = state.findIndex((project) => project.id == params.id);
let taskHistories = [];

if (index != -1) {
Expand Down
4 changes: 2 additions & 2 deletions src/frontend/src/components/DialogTaskActions.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,8 @@ export default function Dialog({ taskId, feature, map, view }) {
const geojsonStyles = MapStyles();
const dispatch = CoreModules.useAppDispatch();
const params = CoreModules.useParams();
const currentProjectId = environment.decode(params.id);
const currentTaskId = environment.encode(taskId);
const currentProjectId = params.id;
const currentTaskId = taskId;
const projectIndex = projectData.findIndex((project) => project.id == currentProjectId);
const currentStatus = {
...projectData?.[projectIndex]?.taskBoundries?.filter((task) => {
Expand Down
9 changes: 4 additions & 5 deletions src/frontend/src/components/GenerateBasemap.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,7 @@ import { ProjectActions } from '@/store/slices/ProjectSlice';
const GenerateBasemap = ({ projectInfo }) => {
const dispatch = CoreModules.useAppDispatch();
const params = CoreModules.useParams();
const encodedId = params.id;
const decodedId = environment.decode(encodedId);
const id = params.id;

const [selectedTileSource, setSelectedTileSource] = useState(null);
const [selectedOutputFormat, setSelectedOutputFormat] = useState(null);
Expand All @@ -37,7 +36,7 @@ const GenerateBasemap = ({ projectInfo }) => {
};

const getTilesList = () => {
dispatch(GetTilesList(`${import.meta.env.VITE_API_URL}/projects/tiles_list/${decodedId}/`));
dispatch(GetTilesList(`${import.meta.env.VITE_API_URL}/projects/tiles_list/${id}/`));
};

useEffect(() => {
Expand Down Expand Up @@ -81,8 +80,8 @@ const GenerateBasemap = ({ projectInfo }) => {
GenerateProjectTiles(
`${
import.meta.env.VITE_API_URL
}/projects/tiles/${decodedId}?source=${selectedTileSource}&format=${selectedOutputFormat}&tms=${tmsUrl}`,
decodedId,
}/projects/tiles/${id}?source=${selectedTileSource}&format=${selectedOutputFormat}&tms=${tmsUrl}`,
id,
),
);
}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
/* eslint-disable react/jsx-key */
import React, { useEffect, useState } from 'react';
import environment from '@/environment';
import AssetModules from '@/shared/AssetModules';
import { Feature } from 'ol';
import { Polygon } from 'ol/geom';
Expand All @@ -23,7 +22,7 @@ const ActivitiesPanel = ({ defaultTheme, state, params, map, view, mapDivPostion
};

useEffect(() => {
const index = state.findIndex((project) => project.id == environment.decode(params.id));
const index = state.findIndex((project) => project.id == params.id);
let taskHistories: taskHistoryListType[] = [];

if (index != -1) {
Expand Down
3 changes: 1 addition & 2 deletions src/frontend/src/components/ProjectDetailsV2/Comments.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import Button from '@/components/common/Button';
import { PostProjectComments, GetProjectComments } from '@/api/Project';
import { useDispatch } from 'react-redux';
import { useParams } from 'react-router-dom';
import environment from '@/environment';
import { useAppSelector } from '@/types/reduxTypes';
import AssetModules from '@/shared/AssetModules';
import { ProjectCommentsSekeletonLoader } from '@/components/ProjectDetailsV2/SkeletonLoader';
Expand All @@ -21,7 +20,7 @@ const Comments = () => {
const projectPostCommentsLoading = useAppSelector((state) => state?.project?.projectPostCommentsLoading);
const selectedTask = useAppSelector((state) => state.task.selectedTask);

const projectId = environment.decode(params.id);
const projectId = params.id;

useEffect(() => {
dispatch(
Expand Down
18 changes: 8 additions & 10 deletions src/frontend/src/components/ProjectDetailsV2/ProjectOptions.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import React from 'react';
import CoreModules from '@/shared/CoreModules';
import AssetModules from '@/shared/AssetModules';
import environment from '@/environment';
import { DownloadDataExtract, DownloadProjectForm } from '@/api/Project';
import { ProjectActions } from '@/store/slices/ProjectSlice';
import Button from '@/components/common/Button';
Expand All @@ -20,31 +19,30 @@ const ProjectOptions = () => {
(state) => state.project.downloadDataExtractLoading,
);

const encodedId: string = params.id;
const decodedId: number = environment.decode(encodedId);
const projectId: string = params.id;

const handleDownload = (downloadType) => {
if (downloadType === 'form') {
dispatch(
DownloadProjectForm(
`${import.meta.env.VITE_API_URL}/projects/download-form/${decodedId}/`,
`${import.meta.env.VITE_API_URL}/projects/download-form/${projectId}/`,
downloadType,
decodedId,
projectId,
),
);
} else if (downloadType === 'geojson') {
dispatch(
DownloadProjectForm(
`${import.meta.env.VITE_API_URL}/projects/${decodedId}/download_tasks`,
`${import.meta.env.VITE_API_URL}/projects/${projectId}/download_tasks`,
downloadType,
decodedId,
projectId,
),
);
}
};
const onDataExtractDownload = () => {
dispatch(
DownloadDataExtract(`${import.meta.env.VITE_API_URL}/projects/features/download/?project_id=${decodedId}`),
DownloadDataExtract(`${import.meta.env.VITE_API_URL}/projects/features/download/?project_id=${projectId}`),
);
};
return (
Expand Down Expand Up @@ -108,7 +106,7 @@ const ProjectOptions = () => {
Generate MbTiles
</CoreModules.Button>
<CoreModules.Button
onClick={() => navigate(`/manage-project/${encodedId}`)}
onClick={() => navigate(`/manage-project/${projectId}`)}
variant="contained"
color="error"
sx={{ width: '200px', mr: '15px' }}
Expand All @@ -118,7 +116,7 @@ const ProjectOptions = () => {
Manage Project
</CoreModules.Button>
<CoreModules.Button
onClick={() => navigate(`/project-submissions/${encodedId}`)}
onClick={() => navigate(`/project-submissions/${projectId}`)}
variant="contained"
color="error"
sx={{ width: '200px', mr: '15px' }}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const TaskSectionPopup = ({ taskId, body, feature }: TaskSectionPopupPropType) =
const [task_status, set_task_status] = useState('READY');
const taskModalStatus = CoreModules.useAppSelector((state) => state.project.taskModalStatus);
const params = CoreModules.useParams();
const currentProjectId = environment.decode(params.id);
const currentProjectId = params.id;
const projectData = CoreModules.useAppSelector((state) => state.project.projectTaskBoundries);
const projectIndex = projectData.findIndex((project) => project.id == currentProjectId);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { projectDashboardDetailTypes, projectInfoType } from '@/models/project/p
const ProjectInfo = () => {
const navigate = useNavigate();
const params = CoreModules.useParams();
const encodedId = params.projectId;
const projectId = params.projectId;
const projectInfo: projectInfoType = CoreModules.useAppSelector((state) => state.project.projectInfo);
const projectDashboardDetail: projectDashboardDetailTypes = CoreModules.useAppSelector(
(state) => state.project.projectDashboardDetail,
Expand Down Expand Up @@ -55,7 +55,7 @@ const ProjectInfo = () => {
<p className="fmtm-text-[#706E6E] fmtm-text-base">
<span
className="hover:fmtm-text-primaryRed fmtm-cursor-pointer fmtm-duration-200"
onClick={() => navigate(`/project_details/${encodedId}`)}
onClick={() => navigate(`/project_details/${projectId}`)}
>
{projectInfo?.title}{' '}
</span>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ import {
ProjectSubmissionInfographicsService,
ValidatedVsMappedInfographicsService,
} from '@/api/SubmissionService';
import environment from '@/environment';
import {
submissionContributorsTypes,
submissionInfographicsTypes,
Expand Down Expand Up @@ -96,8 +95,7 @@ const SubmissionsInfographics = ({ toggleView }) => {
const dispatch = CoreModules.useAppDispatch();

const params = CoreModules.useParams();
const encodedId = params.projectId;
const decodedId = environment.decode(encodedId);
const projectId = params.projectId;

const submissionInfographicsData: submissionInfographicsTypes[] = CoreModules.useAppSelector(
(state) => state.submission.submissionInfographics,
Expand All @@ -124,19 +122,19 @@ const SubmissionsInfographics = ({ toggleView }) => {
useEffect(() => {
dispatch(
ProjectSubmissionInfographicsService(
`${import.meta.env.VITE_API_URL}/submission/submission_page/${decodedId}?days=${submissionProjection}`,
`${import.meta.env.VITE_API_URL}/submission/submission_page/${projectId}?days=${submissionProjection}`,
),
);
}, [submissionProjection]);

useEffect(() => {
dispatch(
ValidatedVsMappedInfographicsService(`${import.meta.env.VITE_API_URL}/tasks/activity/?project_id=${decodedId}`),
ValidatedVsMappedInfographicsService(`${import.meta.env.VITE_API_URL}/tasks/activity/?project_id=${projectId}`),
);
}, []);

useEffect(() => {
dispatch(ProjectContributorsService(`${import.meta.env.VITE_API_URL}/projects/contributors/${decodedId}`));
dispatch(ProjectContributorsService(`${import.meta.env.VITE_API_URL}/projects/contributors/${projectId}`));
}, []);

const FormSubmissionSubHeader = () => (
Expand Down
24 changes: 11 additions & 13 deletions src/frontend/src/components/ProjectSubmissions/SubmissionsTable.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import windowDimention from '@/hooks/WindowDimension';
import Table, { TableHeader } from '@/components/common/CustomTable';
import { SubmissionFormFieldsService, SubmissionTableService } from '@/api/SubmissionService';
import CoreModules from '@/shared/CoreModules.js';
import environment from '@/environment';
import { SubmissionsTableSkeletonLoader } from '@/components/ProjectSubmissions/ProjectSubmissionsSkeletonLoader.js';
import { Loader2 } from 'lucide-react';
import { SubmissionActions } from '@/store/slices/SubmissionSlice';
Expand Down Expand Up @@ -46,8 +45,7 @@ const SubmissionsTable = ({ toggleView }) => {
const params = CoreModules.useParams();
const navigate = useNavigate();

const encodedId = params.projectId;
const decodedId = environment.decode(encodedId);
const projectId = params.projectId;
const submissionFormFields = useAppSelector((state) => state.submission.submissionFormFields);
const submissionTableData = useAppSelector((state) => state.submission.submissionTableData);
const submissionFormFieldsLoading = useAppSelector((state) => state.submission.submissionFormFieldsLoading);
Expand Down Expand Up @@ -96,21 +94,21 @@ const SubmissionsTable = ({ toggleView }) => {

useEffect(() => {
dispatch(
SubmissionFormFieldsService(`${import.meta.env.VITE_API_URL}/submission/submission_form_fields/${decodedId}`),
SubmissionFormFieldsService(`${import.meta.env.VITE_API_URL}/submission/submission_form_fields/${projectId}`),
);
}, []);

useEffect(() => {
if (!filter.task_id) {
dispatch(
SubmissionTableService(`${import.meta.env.VITE_API_URL}/submission/submission_table/${decodedId}`, {
SubmissionTableService(`${import.meta.env.VITE_API_URL}/submission/submission_table/${projectId}`, {
page: paginationPage,
...filter,
}),
);
} else {
dispatch(
SubmissionTableService(`${import.meta.env.VITE_API_URL}/submission/task_submissions/${decodedId}`, {
SubmissionTableService(`${import.meta.env.VITE_API_URL}/submission/task_submissions/${projectId}`, {
page: paginationPage,
...filter,
}),
Expand All @@ -124,19 +122,19 @@ const SubmissionsTable = ({ toggleView }) => {

const refreshTable = () => {
dispatch(
SubmissionFormFieldsService(`${import.meta.env.VITE_API_URL}/submission/submission_form_fields/${decodedId}`),
SubmissionFormFieldsService(`${import.meta.env.VITE_API_URL}/submission/submission_form_fields/${projectId}`),
);
dispatch(SubmissionActions.SetSubmissionTableRefreshing(true));
if (!filter.task_id) {
dispatch(
SubmissionTableService(`${import.meta.env.VITE_API_URL}/submission/submission_table/${decodedId}`, {
SubmissionTableService(`${import.meta.env.VITE_API_URL}/submission/submission_table/${projectId}`, {
page: paginationPage,
...filter,
}),
);
} else {
dispatch(
SubmissionTableService(`${import.meta.env.VITE_API_URL}/submission/task_submissions/${decodedId}`, {
SubmissionTableService(`${import.meta.env.VITE_API_URL}/submission/task_submissions/${projectId}`, {
page: paginationPage,
...filter,
}),
Expand Down Expand Up @@ -198,7 +196,7 @@ const SubmissionsTable = ({ toggleView }) => {
const uploadToJOSM = () => {
dispatch(
ConvertXMLToJOSM(
`${import.meta.env.VITE_API_URL}/submission/get_osm_xml/${decodedId}`,
`${import.meta.env.VITE_API_URL}/submission/get_osm_xml/${projectId}`,
projectInfo?.outline_geojson?.properties?.bbox,
),
);
Expand All @@ -208,13 +206,13 @@ const SubmissionsTable = ({ toggleView }) => {
if (downloadType === 'csv') {
dispatch(
getDownloadProjectSubmission(
`${import.meta.env.VITE_API_URL}/submission/download?project_id=${decodedId}&export_json=false`,
`${import.meta.env.VITE_API_URL}/submission/download?project_id=${projectId}&export_json=false`,
),
);
} else if (downloadType === 'json') {
dispatch(
getDownloadProjectSubmissionJson(
`${import.meta.env.VITE_API_URL}/submission/download-submission?project_id=${decodedId}`,
`${import.meta.env.VITE_API_URL}/submission/download-submission?project_id=${projectId}`,
),
);
}
Expand Down Expand Up @@ -447,7 +445,7 @@ const SubmissionsTable = ({ toggleView }) => {
<AssetModules.VisibilityOutlinedIcon
className="fmtm-text-[#545454] hover:fmtm-text-primaryRed"
onClick={() => {
navigate(`/project/${encodedId}/tasks/${row?.phonenumber}/submission/${row?.meta?.instanceID}`);
navigate(`/project/${projectId}/tasks/${row?.phonenumber}/submission/${row?.meta?.instanceID}`);
}}
/>{' '}
<span className="fmtm-text-primaryRed fmtm-border-[1px] fmtm-border-primaryRed fmtm-mx-1"></span>{' '}
Expand Down
5 changes: 2 additions & 3 deletions src/frontend/src/components/createnewproject/SplitTasks.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ import {
GetDividedTaskFromGeojson,
TaskSplittingPreviewService,
} from '@/api/CreateProjectService';
import environment from '@/environment';
import { Modal } from '@/components/common/Modal';
import ProgressBar from '@/components/common/ProgressBar';
import { task_split_type } from '@/types/enums';
Expand Down Expand Up @@ -211,7 +210,7 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customDataExtractUpload
);
} else if (generateQrSuccess && generateProjectLog?.status === 'SUCCESS') {
clearInterval(generateProjectLogIntervalCb);
const encodedProjectId = environment.encode(projectDetailsResponse?.id);
const projectId = projectDetailsResponse?.id;
dispatch(
CommonActions.SetSnackBar({
open: true,
Expand All @@ -222,7 +221,7 @@ const SplitTasks = ({ flag, geojsonFile, setGeojsonFile, customDataExtractUpload
);
dispatch(CreateProjectActions.SetGenerateProjectLog(null));
dispatch(CreateProjectActions.SetGenerateProjectQRSuccess(null));
navigate(`/project_details/${encodedProjectId}`);
navigate(`/project_details/${projectId}`);
dispatch(CreateProjectActions.ClearCreateProjectFormData());
dispatch(CreateProjectActions.SetCanSwitchCreateProjectSteps(false));
}
Expand Down
3 changes: 1 addition & 2 deletions src/frontend/src/components/home/ExploreProjectCard.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import * as React from 'react';
import CustomizedImage from '@/utilities/CustomizedImage';
import CustomizedProgressBar from '@/utilities/CustomizedProgressBar';
import environment from '@/environment';
import { HomeActions } from '@/store/slices/HomeSlice';
import { HomeProjectCardModel, projectType } from '@/models/home/homeModel';
import CoreModules from '@/shared/CoreModules';
Expand Down Expand Up @@ -60,7 +59,7 @@ export default function ExploreProjectCard({ data }: { data: projectType }) {
const project: projectType = data;
// dispatch(ProjectActions.SetProjectTaskBoundries([]))
dispatch(HomeActions.SetSelectedProject(project));
navigate(`/project_details/${environment.encode(data.id)}`);
navigate(`/project_details/${data.id}`);
}}
style={cardInnerStyles.card}
sx={{ boxShadow: 0 }}
Expand Down
5 changes: 2 additions & 3 deletions src/frontend/src/components/home/ProjectListMap.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ import { geojsonObjectModel } from '@/constants/geojsonObjectModal';
import { defaultStyles, getStyles } from '@/components/MapComponent/OpenLayersComponent/helpers/styleUtils';
import MarkerIcon from '@/assets/images/red_marker.png';
import { useNavigate } from 'react-router-dom';
import environment from '@/environment';
import { Style, Text, Icon, Fill } from 'ol/style';
import { projectType } from '@/models/home/homeModel';

Expand Down Expand Up @@ -74,8 +73,8 @@ const ProjectListMap = () => {
}, [homeProjectSummary]);

const projectClickOnMap = (properties: any) => {
const encodedProjectId = environment.encode(properties.id);
navigate(`/project_details/${encodedProjectId}`);
const projectId = properties.id;
navigate(`/project_details/${projectId}`);
};

return (
Expand Down
Loading

0 comments on commit 66d743a

Please sign in to comment.