From e6c465c519096f9601f8a4830605554ac3a79566 Mon Sep 17 00:00:00 2001 From: Nishit Suwal <81785002+NSUWAL123@users.noreply.github.com> Date: Wed, 28 Aug 2024 14:27:37 +0545 Subject: [PATCH] feat: add project not found page (#1762) * feat(images): no-file image add * fix(store): projectNotFound slice and type add * feat(projectNotFound): project not found component display if api throw 404 * fix(mainView): show projectNotFound page if state is true * fix(api): show project not found page if api throws 404 * fix(submissionInstancePage): update submission instance page route --- src/frontend/src/api/CreateProjectService.ts | 3 ++ src/frontend/src/api/Project.ts | 6 +++ src/frontend/src/assets/images/no-file.png | Bin 0 -> 3339 bytes .../ProjectSubmissions/SubmissionsTable.tsx | 4 +- src/frontend/src/routes.jsx | 2 +- src/frontend/src/store/slices/CommonSlice.ts | 4 ++ src/frontend/src/store/types/ICommon.ts | 1 + src/frontend/src/views/MainView.tsx | 49 +++++++++++------- src/frontend/src/views/ProjectNotFound.tsx | 33 ++++++++++++ 9 files changed, 81 insertions(+), 21 deletions(-) create mode 100644 src/frontend/src/assets/images/no-file.png create mode 100644 src/frontend/src/views/ProjectNotFound.tsx diff --git a/src/frontend/src/api/CreateProjectService.ts b/src/frontend/src/api/CreateProjectService.ts index b2ee671d05..4ac164106b 100755 --- a/src/frontend/src/api/CreateProjectService.ts +++ b/src/frontend/src/api/CreateProjectService.ts @@ -286,6 +286,9 @@ const GetIndividualProjectDetails = (url: string) => { dispatch(CreateProjectActions.SetIndividualProjectDetails(modifiedResponse)); dispatch(CreateProjectActions.SetIndividualProjectDetailsLoading(false)); } catch (error) { + if (error.response.status === 404) { + dispatch(CommonActions.SetProjectNotFound(true)); + } dispatch(CreateProjectActions.SetIndividualProjectDetailsLoading(false)); } finally { dispatch(CreateProjectActions.SetIndividualProjectDetailsLoading(false)); diff --git a/src/frontend/src/api/Project.ts b/src/frontend/src/api/Project.ts index 6aec85a702..1f5718f71e 100755 --- a/src/frontend/src/api/Project.ts +++ b/src/frontend/src/api/Project.ts @@ -53,6 +53,9 @@ export const ProjectById = (projectId: string) => { ); dispatch(ProjectActions.SetProjectDetialsLoading(false)); } catch (error) { + if (error.response.status === 404) { + dispatch(CommonActions.SetProjectNotFound(true)); + } dispatch(ProjectActions.SetProjectDetialsLoading(false)); dispatch( CommonActions.SetSnackBar({ @@ -221,6 +224,9 @@ export const GetProjectDashboard = (url: string) => { dispatch(ProjectActions.SetProjectDashboardDetail(response.data)); dispatch(ProjectActions.SetProjectDashboardLoading(false)); } catch (error) { + if (error.response.status === 404) { + dispatch(CommonActions.SetProjectNotFound(true)); + } dispatch(ProjectActions.SetProjectDashboardLoading(false)); } finally { dispatch(ProjectActions.SetProjectDashboardLoading(false)); diff --git a/src/frontend/src/assets/images/no-file.png b/src/frontend/src/assets/images/no-file.png new file mode 100644 index 0000000000000000000000000000000000000000..25174e76ab4c82d6760ff5a7ad8814f5b6844489 GIT binary patch literal 3339 zcmZ`+dpwhU8{blhR#;T#lsObdO(*r&smv)YM62#fSc_BruL>F z5ItM`2WAHdw5!wxY3g(ty!hH4>)~=B>D{NS0JYE{b-d8QN7g5~VwCW1VYdekN%p9m zLfeY&^zAAae5C1W+#K3X7P9P})yJ~DLg$?MM}N4KMG1AEFp-oZcL!FZEk!=J{QLN(O^xTsqed=H_VQ^hds{CZ)m%i>*#&=G3hLujr%^&eWK_BaP zH5YamK))u8>$ksA3u-oH9gq-33H)v(#9IPyiG6`T-n+pD;ll5u6}b|7JHHrAC9 zuezSIIWsHuG7cpUe28!6IxWBEbdGEKhot5q*t;TcJb;foHjXx8~i7_$2z533? zSl72Q7(#bdFTtX?Rz9XAk$NQ-ENFXO<<85brc2Z?L99QsCGZcm* zhZ(q$eQ)l;5d60S6le-fjPiDy5up^C(M8_X$@EDqszJJ8Tqo8t0wgh-1Emu#Fn!_M_4I8iJ|u4dAN!r#72HORi5Wrt3S`z(o9 zQZpFLs!Su7|1@ENUuFTjDJ%J9Iyo`bJf4WyZ~qS&!x)tea#lEl4D&zZ+J~VnydJ3QLF)LIuQIKIHXC`Fx(0k1P8QaT z`5A=v*B`pjx=OYx+>_uMA7Ck8UBVdtwt^izWcQxAQ692Pr;4#7WO)l`8yqZ9KOm&{ z`SljcFX=pvu?mqkkRCFfFgLqia`(ROnigXZeG1( z5~LMP1@!5x{mFx2zsAYQcfN3m&53P^UB%CNZmg0WN(#h>-m7rqj-DRd*`j*r!KsGm zXA?v}rVkn2k}!3#B4E(X?iO7_`uPb#>7z_b*k8iJz(cZG7yb27pjrw{EqiW}V%Eln9XtJPTJmHlCzbhw6Fys-_dq zNP~~EE;e%Px%Xl4#!nm zoq;C~*l3%0OIPwd!@fZ2VRDY>9!Py_XO=I%6kJ&Nez!9gBO+Vchdny_raZ!h_0<3) zG*PclVM{lj`k-1hk)*LWHtsp4Xegsc0Rdce*7UFsh@7}&y!=sC4~7PLPN*|lt`AsB zo80A4JQvp0i&nQeUCL5fI-sY{0C^U|Nx_64<0$~za7jHl3C#Bpt`AuIn0Q~Qnx;W4 zrG#4Qmoh#b5F9#m%5(}lT?%m;*Wu1Q*ayT%%jysDb{U@f&;vPPlGkfPO(>Z5zb^&= zw2-CNeHTP3$fce7uw#CBzYSX->ktRtz)~lEYWG~r=}yv{)E`1zXKJiFV;l3g{U`b>8>$DU4(M3GdttXXb~qq& zAGT<qRp7*=4uukBp*;60)=S1fbO>=nqw;78k8f3(J;LrfjqqFfgDQQC|tg)lz~q4xM~- zl~dL}c><~?gGXOI*}D&5XoA<0{76P1T|)8dIdOMZvT!+Ku$B#;jQxM*scAJqaiBv zU-d^%mY22r)HUpN9Q{2_uN~qlQu)(2wFC=9d!z$;bHvZtP=V#7Dp233+*Wu`7Ddcm z6z1sHnEwcd?(Mxuza;=-mxZ&ey}bIuOji?+xOE#1b8LtX_*aRJqD%B)CNMLu)z0p2 zQ&p-qGQmEB45{%Y`WV9*B8^^_kTAc^{atRTk zIA0?J|28GCqlX;Br_A9^Y(RmvT+0TRTfy9SOcV9P6?`)@Rwv7v8NWKiHlv=!$>Klu yJsBs_kKZBr-jM-$jt136yuW^g+s0ku2!X3EKQ@jm_zwKLfNU%rkTqt1r2HEiIy}Ju literal 0 HcmV?d00001 diff --git a/src/frontend/src/components/ProjectSubmissions/SubmissionsTable.tsx b/src/frontend/src/components/ProjectSubmissions/SubmissionsTable.tsx index 17ed993eb1..a81a041874 100644 --- a/src/frontend/src/components/ProjectSubmissions/SubmissionsTable.tsx +++ b/src/frontend/src/components/ProjectSubmissions/SubmissionsTable.tsx @@ -434,7 +434,9 @@ const SubmissionsTable = ({ toggleView }) => { { - navigate(`/project/${projectId}/tasks/${taskUId}/submission/${row?.meta?.instanceID}`); + navigate( + `/project-submissions/${projectId}/tasks/${taskUId}/submission/${row?.meta?.instanceID}`, + ); }} />{' '} {' '} diff --git a/src/frontend/src/routes.jsx b/src/frontend/src/routes.jsx index b010f0066a..176b3967a5 100755 --- a/src/frontend/src/routes.jsx +++ b/src/frontend/src/routes.jsx @@ -81,7 +81,7 @@ const routes = createBrowserRouter([ ), }, { - path: '/project/:projectId/tasks/:taskId/submission/:instanceId', + path: '/project-submissions/:projectId/tasks/:taskId/submission/:instanceId', element: ( }> diff --git a/src/frontend/src/store/slices/CommonSlice.ts b/src/frontend/src/store/slices/CommonSlice.ts index d6553c0f3e..67211bafc6 100755 --- a/src/frontend/src/store/slices/CommonSlice.ts +++ b/src/frontend/src/store/slices/CommonSlice.ts @@ -15,6 +15,7 @@ const initialState: CommonStateTypes = { step: 1, }, }, + projectNotFound: false, }; const CommonSlice = createSlice({ @@ -33,6 +34,9 @@ const CommonSlice = createSlice({ SetCurrentStepFormStep(state, action) { state.currentStepFormStep[action.payload.flag] = { step: action.payload.step }; }, + SetProjectNotFound(state, action) { + state.projectNotFound = action.payload; + }, }, }); diff --git a/src/frontend/src/store/types/ICommon.ts b/src/frontend/src/store/types/ICommon.ts index 83ad79f385..c5ef875c85 100644 --- a/src/frontend/src/store/types/ICommon.ts +++ b/src/frontend/src/store/types/ICommon.ts @@ -7,6 +7,7 @@ export type CommonStateTypes = { step: number; }; }; + projectNotFound: boolean; }; type snackbarTypes = { diff --git a/src/frontend/src/views/MainView.tsx b/src/frontend/src/views/MainView.tsx index 944525cfc7..57c65733dc 100755 --- a/src/frontend/src/views/MainView.tsx +++ b/src/frontend/src/views/MainView.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useEffect } from 'react'; import windowDimention from '@/hooks/WindowDimension'; import PrimaryAppBar from '@/utilities/PrimaryAppBar'; import CoreModules from '@/shared/CoreModules'; @@ -8,6 +8,7 @@ import Loader from '@/utilities/AppLoader'; import MappingHeader from '@/utilities/MappingHeader'; import { useLocation, useSearchParams } from 'react-router-dom'; import { useAppSelector } from '@/types/reduxTypes'; +import ProjectNotFound from './ProjectNotFound'; const MainView = () => { const dispatch = CoreModules.useAppDispatch(); @@ -17,6 +18,7 @@ const MainView = () => { const checkTheme = useAppSelector((state) => state.theme.hotTheme); const theme = CoreModules.createTheme(checkTheme); const stateSnackBar = useAppSelector((state) => state.common.snackbar); + const projectNotFound = useAppSelector((state) => state.common.projectNotFound); const handleClose = (event: React.SyntheticEvent, reason: string) => { if (reason === 'clickaway') { @@ -34,6 +36,11 @@ const MainView = () => { const popupInParams = searchParams.get('popup'); + useEffect(() => { + if (!projectNotFound) return; + dispatch(CommonActions.SetProjectNotFound(false)); + }, [pathname]); + return ( { )} - + ) : ( + - - {/* Footer */} - + : pathname.includes('project/') && windowSize.width <= 640 + ? '100vh' + : windowSize.width <= 599 + ? '90vh' + : '92vh', + overflow: 'auto', + // p: '1.3rem', + }} + > + + {/* Footer */} + + )} diff --git a/src/frontend/src/views/ProjectNotFound.tsx b/src/frontend/src/views/ProjectNotFound.tsx new file mode 100644 index 0000000000..703814451b --- /dev/null +++ b/src/frontend/src/views/ProjectNotFound.tsx @@ -0,0 +1,33 @@ +import React from 'react'; +import NoFileImage from '@/assets/images/no-file.png'; +import Button from '@/components/common/Button'; +import { useNavigate } from 'react-router-dom'; + +const ProjectNotFound = () => { + const navigate = useNavigate(); + return ( +
+
+
+ Project Not Found Photo +
+
+

+ PROJECT NOT FOUND +

+

+ There is no project to show, please create a project by clicking the button below.{' '} +

+
+
+
+ ); +}; + +export default ProjectNotFound;