Commit e792a0b9 authored by Nitin Jadhav's avatar Nitin Jadhav
Browse files

Fixed email redirects

parent e8e4242d
Pipeline #165712 failed with stages
in 3 minutes and 28 seconds
{
"version": "0.2.0",
"configurations": [
{
"type": "pwa-chrome",
"request": "launch",
"name": "Launch chrome against localhost",
"url": "http://localhost:3000",
"webRoot": "${workspaceFolder}"
}
]
}
...@@ -3,13 +3,9 @@ import { Apply } from "components/apply/Apply"; ...@@ -3,13 +3,9 @@ import { Apply } from "components/apply/Apply";
import { Partners } from "components/content/Partners"; import { Partners } from "components/content/Partners";
import { JobDetails } from "components/job-details/JobDetails"; import { JobDetails } from "components/job-details/JobDetails";
import { Metadata } from "components/Metadata"; import { Metadata } from "components/Metadata";
import { import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
BrowserRouter as Router,
Redirect,
Route,
Switch,
} from "react-router-dom";
import { ErrorPage404 } from "../component-templates/ErrorPages/ErrorPage404"; import { ErrorPage404 } from "../component-templates/ErrorPages/ErrorPage404";
import EmailAlertRedirects from "../components/alerts/EmailAlertRedirects";
import { HrExcellenceInResearch } from "../components/content/HrExcellenceInResearch"; import { HrExcellenceInResearch } from "../components/content/HrExcellenceInResearch";
import { Science4Refugees } from "../components/content/Science4Refugees"; import { Science4Refugees } from "../components/content/Science4Refugees";
import { ConditionsEmployment } from "../components/content/work-at-embl/conditions-employment/ConditionsEmployment"; import { ConditionsEmployment } from "../components/content/work-at-embl/conditions-employment/ConditionsEmployment";
...@@ -40,7 +36,7 @@ export function App() { ...@@ -40,7 +36,7 @@ export function App() {
<Route <Route
path="/alerts/alert-email/:jobRef" path="/alerts/alert-email/:jobRef"
render={({ match }) => ( render={({ match }) => (
<Redirect to={`/position/${match.params.jobRef}`} /> <EmailAlertRedirects jobId={match.params.jobRef} />
)} )}
/> />
<Route path="/alerts" component={Alerts} /> <Route path="/alerts" component={Alerts} />
......
...@@ -68,7 +68,7 @@ export function VFCard({ ...@@ -68,7 +68,7 @@ export function VFCard({
VFCard.Container = function VFCardContainer({ children }) { VFCard.Container = function VFCardContainer({ children }) {
return ( return (
<section className="vf-card-container" id="about"> <section className="vf-card-container">
<div className="vf-card-container__inner">{children}</div> <div className="vf-card-container__inner">{children}</div>
</section> </section>
); );
......
import { useEffect, useState } from "react";
import { Redirect } from "react-router-dom";
import { useFetchJobsList } from "../../services/useFetchJobsList";
import { VFLoaderBox } from "component-templates/VFLoader/VFLoader";
import { JobNotFound } from "components/job-details/JobDetails";
/* Raison d'être of this component is to redirect users that come from email alerts to actual job page */
export default function EmailAlertRedirects({ jobId }) {
const { filteredJobs, loading, error } = useFetchJobsList();
const [job, setJob] = useState();
useEffect(() => {
if (filteredJobs && filteredJobs.length) {
const foundJob = filteredJobs.find((job) => job.id === jobId);
setJob(foundJob);
}
}, [filteredJobs]);
if (job) {
return (
<Redirect
to={{
pathname: `/position/${job.field_jobs_reference_number}`,
state: { job },
}}
/>
);
} else if (loading) {
return <VFLoaderBox />;
} else if (error) {
return <JobNotFound />;
}
return null;
}
...@@ -14,6 +14,7 @@ import { EmblBreadcrumbs } from "../EmblBreadcrumbs"; ...@@ -14,6 +14,7 @@ import { EmblBreadcrumbs } from "../EmblBreadcrumbs";
import { EmblFooter } from "../EmblFooter"; import { EmblFooter } from "../EmblFooter";
import { EBICards } from "../EBICards"; import { EBICards } from "../EBICards";
import { VfIntro } from "component-templates/VFIntro"; import { VfIntro } from "component-templates/VFIntro";
import { useScrollToTop } from "../../helpers/useScrollToTop";
const shortcutLinks = [ const shortcutLinks = [
{ {
...@@ -67,12 +68,22 @@ const shortcutLinks = [ ...@@ -67,12 +68,22 @@ const shortcutLinks = [
*/ */
export function JobDetails() { export function JobDetails({ location }) {
/*
* Note that its possible that job object may have been provided ("location?.state?.job"), but not necessary as state from react-router
* If such object present ("providedJob"), use it else fetch object based on refId provided as part of URL
*/
const providedJob = location?.state?.job;
const { jobRef } = useParams(); const { jobRef } = useParams();
const { data, loading, error } = useFetch( const { data, loading, error } = useFetch(
`jobs?field_jobs_reference_number=${jobRef}&_format=json&source=contenthub` providedJob
? null
: `jobs?field_jobs_reference_number=${jobRef}&_format=json&source=contenthub`
); );
const [currentJob, setCurrentJob] = useState(); const [currentJob, setCurrentJob] = useState(providedJob);
// Scroll to top on job load
useScrollToTop();
const isLocationHinxton = const isLocationHinxton =
currentJob?.$stripped_field_jobs_duty_station === "EMBL-EBI Hinxton"; currentJob?.$stripped_field_jobs_duty_station === "EMBL-EBI Hinxton";
...@@ -80,8 +91,10 @@ export function JobDetails() { ...@@ -80,8 +91,10 @@ export function JobDetails() {
currentJob?.field_jobs_staff_category !== "EICAT Advertising Only"; currentJob?.field_jobs_staff_category !== "EICAT Advertising Only";
useEffect(() => { useEffect(() => {
const extendedJob = extendJobsObjects(data)[0]; if (data) {
setCurrentJob(extendedJob); const extendedJob = extendJobsObjects(data)[0];
setCurrentJob(extendedJob);
}
}, [data]); }, [data]);
if (loading) { if (loading) {
...@@ -439,7 +452,7 @@ function renderWhyJoinUsVideo(jobType) { ...@@ -439,7 +452,7 @@ function renderWhyJoinUsVideo(jobType) {
); );
} }
function JobNotFound() { export function JobNotFound() {
return ( return (
<> <>
<VfIntro <VfIntro
......
...@@ -41,7 +41,10 @@ JobList.JobListItem = function JobListItem({ job, isIframe = false }) { ...@@ -41,7 +41,10 @@ JobList.JobListItem = function JobListItem({ job, isIframe = false }) {
> >
<h3 className="job-title vf-summary__title"> <h3 className="job-title vf-summary__title">
<Link <Link
to={`/position/${job.field_jobs_reference_number}`} to={{
pathname: `/position/${job.field_jobs_reference_number}`,
state: { job },
}}
target={isIframe ? "_parent" : "_self"} target={isIframe ? "_parent" : "_self"}
className="vf-summary__link" className="vf-summary__link"
> >
......
...@@ -25,7 +25,9 @@ export function useFetch(url, initialData) { ...@@ -25,7 +25,9 @@ export function useFetch(url, initialData) {
setLoading(false); setLoading(false);
} }
} }
getData(); if (url) {
getData();
}
}, [url]); }, [url]);
return { data, loading, error }; return { data, loading, error };
......
const { useEffect } = require("react");
// Call this hook to enable scroll to top on load functionality
export function useScrollToTop() {
useEffect(() => {
window.scrollTo(0, 0);
}, []);
}
// Add any images to be used here
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment