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

Merge branch 'fix/email-alert-redirect' into 'master'

Fixed email redirects

See merge request !46
parents e8e4242d e792a0b9
Pipeline #165714 failed with stages
in 2 minutes and 53 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";
import { Partners } from "components/content/Partners";
import { JobDetails } from "components/job-details/JobDetails";
import { Metadata } from "components/Metadata";
import {
BrowserRouter as Router,
Redirect,
Route,
Switch,
} from "react-router-dom";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import { ErrorPage404 } from "../component-templates/ErrorPages/ErrorPage404";
import EmailAlertRedirects from "../components/alerts/EmailAlertRedirects";
import { HrExcellenceInResearch } from "../components/content/HrExcellenceInResearch";
import { Science4Refugees } from "../components/content/Science4Refugees";
import { ConditionsEmployment } from "../components/content/work-at-embl/conditions-employment/ConditionsEmployment";
......@@ -40,7 +36,7 @@ export function App() {
<Route
path="/alerts/alert-email/:jobRef"
render={({ match }) => (
<Redirect to={`/position/${match.params.jobRef}`} />
<EmailAlertRedirects jobId={match.params.jobRef} />
)}
/>
<Route path="/alerts" component={Alerts} />
......
......@@ -68,7 +68,7 @@ export function VFCard({
VFCard.Container = function VFCardContainer({ children }) {
return (
<section className="vf-card-container" id="about">
<section className="vf-card-container">
<div className="vf-card-container__inner">{children}</div>
</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";
import { EmblFooter } from "../EmblFooter";
import { EBICards } from "../EBICards";
import { VfIntro } from "component-templates/VFIntro";
import { useScrollToTop } from "../../helpers/useScrollToTop";
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 { 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 =
currentJob?.$stripped_field_jobs_duty_station === "EMBL-EBI Hinxton";
......@@ -80,8 +91,10 @@ export function JobDetails() {
currentJob?.field_jobs_staff_category !== "EICAT Advertising Only";
useEffect(() => {
const extendedJob = extendJobsObjects(data)[0];
setCurrentJob(extendedJob);
if (data) {
const extendedJob = extendJobsObjects(data)[0];
setCurrentJob(extendedJob);
}
}, [data]);
if (loading) {
......@@ -439,7 +452,7 @@ function renderWhyJoinUsVideo(jobType) {
);
}
function JobNotFound() {
export function JobNotFound() {
return (
<>
<VfIntro
......
......@@ -41,7 +41,10 @@ JobList.JobListItem = function JobListItem({ job, isIframe = false }) {
>
<h3 className="job-title vf-summary__title">
<Link
to={`/position/${job.field_jobs_reference_number}`}
to={{
pathname: `/position/${job.field_jobs_reference_number}`,
state: { job },
}}
target={isIframe ? "_parent" : "_self"}
className="vf-summary__link"
>
......
......@@ -25,7 +25,9 @@ export function useFetch(url, initialData) {
setLoading(false);
}
}
getData();
if (url) {
getData();
}
}, [url]);
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