Merge pull request #12301 from bbc/WSTEAM1-1494-remove-client-side-ra…

…dio-schedule

WSTEAM1-1494: Remove client side radio schedule

src/app/legacy/containers/RadioSchedule/Canonical/index.jsx

@@ -1,7 +1,6 @@
-import React, { useEffect, useState, useContext } from 'react';
+import React, { useContext } from 'react';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
-import moment from 'moment';
 import {
   GEL_GROUP_1_SCREEN_WIDTH_MIN,
   GEL_GROUP_2_SCREEN_WIDTH_MIN,
@@ -18,14 +17,8 @@ import {
 import { getLongPrimer } from '#psammead/gel-foundations/src/typography';
 import { getSansRegular } from '#psammead/psammead-styles/src/font-styles';
 import SectionLabel from '#psammead/psammead-section-label/src';
-import { RequestContext } from '#contexts/RequestContext';
 import RadioSchedule from '#components/RadioSchedule';
-import webLogger from '#lib/logger.web';
-import { RADIO_SCHEDULE_FETCH_ERROR } from '#lib/logger.const';
 import { ServiceContext } from '../../../../contexts/ServiceContext';
-import processRadioSchedule from '../utilities/processRadioSchedule';
-
-const logger = webLogger();
 
 const RadioScheduleSection = styled.section`
   background-color: ${props => props.theme.palette.LUNAR};
@@ -94,8 +87,7 @@ const RadioFrequencyLink = styled.a`
 `;
 
 const CanonicalRadioSchedule = ({
-  initialData,
-  endpoint,
+  radioSchedule,
   lang = null,
   className = '',
 }) => {
@@ -106,56 +98,13 @@ const CanonicalRadioSchedule = ({
     radioSchedule: radioScheduleConfig = {},
   } = useContext(ServiceContext);
 
-  const { timeOnServer } = useContext(RequestContext);
-
-  const [radioSchedule, setRadioSchedule] = useState(initialData);
-
   const { header, frequenciesPageUrl, frequenciesPageLabel, durationLabel } =
     radioScheduleConfig;
 
   const {
     palette: { LUNAR },
   } = useTheme();
 
-  useEffect(() => {
-    if (!radioSchedule) {
-      const handleResponse = url => async response => {
-        if (!response.ok) {
-          throw Error(
-            `Unexpected response (HTTP status code ${response.status}) when requesting ${url}`,
-          );
-        }
-
-        const radioScheduleData = await response.json();
-        const timeOnClient = parseInt(moment.utc().format('x'), 10);
-        const processedSchedule = processRadioSchedule(
-          radioScheduleData,
-          service,
-          timeOnServer || timeOnClient,
-        );
-        setRadioSchedule(processedSchedule);
-      };
-
-      const fetchRadioScheduleData = pathname =>
-        fetch(pathname, { mode: 'no-cors' })
-          .then(handleResponse(pathname))
-          .catch(error => {
-            logger.error(
-              JSON.stringify(
-                {
-                  event: RADIO_SCHEDULE_FETCH_ERROR,
-                  message: error.toString(),
-                },
-                null,
-                2,
-              ),
-            );
-          });
-
-      fetchRadioScheduleData(endpoint);
-    }
-  }, [endpoint, service, timeOnServer, radioSchedule]);
-
   if (!radioSchedule) {
     return null;
   }

src/app/legacy/containers/RadioSchedule/Canonical/index.test.jsx

@@ -7,12 +7,10 @@ import {
   act,
 } from '../../../../components/react-testing-library-with-providers';
 import { ServiceContextProvider } from '../../../../contexts/ServiceContext';
-import CanonicalRadioSchedule from '.';
+import RadioSchedule from '.';
 import processRadioSchedule from '../utilities/processRadioSchedule';
 
-const endpoint = 'https://localhost/arabic/bbc_arabic_radio/schedule.json';
-
-const RadioScheduleWithContext = ({ initialData, lang }) => (
+const RadioScheduleWithContext = ({ radioSchedule, lang }) => (
   <RequestContextProvider
     isAmp={false}
     pageType={FRONT_PAGE}
@@ -21,16 +19,12 @@ const RadioScheduleWithContext = ({ initialData, lang }) => (
     timeOnServer={Date.now()}
   >
     <ServiceContextProvider service="arabic">
-      <CanonicalRadioSchedule
-        initialData={initialData}
-        endpoint={endpoint}
-        lang={lang}
-      />
+      <RadioSchedule radioSchedule={radioSchedule} lang={lang} />
     </ServiceContextProvider>
   </RequestContextProvider>
 );
 
-describe('Canonical RadioSchedule', () => {
+describe('RadioSchedule', () => {
   beforeEach(() => {
     fetch.resetMocks();
   });
@@ -49,7 +43,7 @@ describe('Canonical RadioSchedule', () => {
       let container;
       await act(async () => {
         container = render(
-          <RadioScheduleWithContext initialData={initialData} />,
+          <RadioScheduleWithContext radioSchedule={initialData} />,
         ).container;
       });
       expect(container).toMatchSnapshot();
@@ -65,7 +59,7 @@ describe('Canonical RadioSchedule', () => {
 
       await act(async () => {
         container = render(
-          <RadioScheduleWithContext initialData={initialData} />,
+          <RadioScheduleWithContext radioSchedule={initialData} />,
         ).container;
       });
       expect(container.querySelectorAll('li').length).toEqual(4);
@@ -111,91 +105,4 @@ describe('Canonical RadioSchedule', () => {
       expect(container).toBeEmptyDOMElement();
     });
   });
-
-  describe('Without initial data', () => {
-    it('renders correctly for a service with a radio schedule and page frequency URL', async () => {
-      fetch.mockResponseOnce(JSON.stringify(arabicRadioScheduleData));
-      let container;
-
-      await act(async () => {
-        container = render(<RadioScheduleWithContext />).container;
-      });
-
-      expect(container).toMatchSnapshot();
-    });
-
-    it('contains four programs for a service with a radio schedule', async () => {
-      fetch.mockResponseOnce(JSON.stringify(arabicRadioScheduleData));
-      let container;
-
-      await act(async () => {
-        container = render(<RadioScheduleWithContext />).container;
-      });
-      expect(container.querySelectorAll('li').length).toEqual(4);
-    });
-
-    it('render radio schedules container with lang code', async () => {
-      fetch.mockResponseOnce(JSON.stringify(arabicRadioScheduleData));
-      let container;
-
-      await act(async () => {
-        container = render(<RadioScheduleWithContext lang="fa-AF" />).container;
-      });
-      expect(container.querySelector('section')).toHaveAttribute(
-        'lang',
-        'fa-AF',
-      );
-    });
-
-    it('does not render when data contains less than 4 programs', async () => {
-      const radioSchedule2Programmes = { ...arabicRadioScheduleData };
-      radioSchedule2Programmes.schedules =
-        radioSchedule2Programmes.schedules.slice(0, 2);
-
-      fetch.mockResponseOnce(JSON.stringify(radioSchedule2Programmes));
-
-      let container;
-
-      await act(async () => {
-        container = render(<RadioScheduleWithContext />).container;
-      });
-      expect(container).toBeEmptyDOMElement();
-    });
-
-    it('does not render when data contains no programs', async () => {
-      fetch.mockResponseOnce(
-        JSON.stringify({
-          schedules: [],
-        }),
-      );
-      let container;
-
-      await act(async () => {
-        container = render(<RadioScheduleWithContext />).container;
-      });
-      expect(container).toBeEmptyDOMElement();
-    });
-
-    it('does not render when data fetched returns non-ok status code', async () => {
-      global.console.error = jest.fn();
-      fetch.mockResponse({ status: 404 });
-      let container;
-
-      await act(async () => {
-        container = render(<RadioScheduleWithContext />).container;
-      });
-      expect(container).toBeEmptyDOMElement();
-    });
-
-    it('does not render when data fetch is rejected', async () => {
-      global.console.error = jest.fn();
-      fetch.mockRejectOnce(Error('Server not found'));
-      let container;
-
-      await act(async () => {
-        container = render(<RadioScheduleWithContext />).container;
-      });
-      expect(container).toBeEmptyDOMElement();
-    });
-  });
 });

src/app/legacy/containers/RadioSchedule/index.jsx

@@ -1,44 +1,28 @@
 import React, { useContext } from 'react';
 import pathOr from 'ramda/src/pathOr';
 import { RequestContext } from '#contexts/RequestContext';
-import useLocation from '#hooks/useLocation';
 import useToggle from '#hooks/useToggle';
-import { getRadioScheduleEndpoint } from '#lib/utilities/getUrlHelpers/getRadioSchedulesUrls';
 import { ServiceContext } from '../../../contexts/ServiceContext';
 import Canonical from './Canonical';
 
 const RadioSchedule = ({
   initialData,
-  radioScheduleEndpointOverride = null,
   lang = null,
   className = '',
   toggleName,
 }) => {
   const { enabled } = useToggle(toggleName);
-  const { isAmp, env } = useContext(RequestContext);
-  const { service, radioSchedule } = useContext(ServiceContext);
-  const location = useLocation();
+  const { isAmp } = useContext(RequestContext);
+  const { radioSchedule } = useContext(ServiceContext);
   const hasRadioSchedule = pathOr(null, ['hasRadioSchedule'], radioSchedule);
   const radioScheduleEnabled = !isAmp && enabled && hasRadioSchedule;
 
   if (!radioScheduleEnabled) {
     return null;
   }
-  const endpoint =
-    radioScheduleEndpointOverride ||
-    getRadioScheduleEndpoint({
-      service,
-      env,
-      queryString: location.search,
-    });
 
   return (
-    <Canonical
-      className={className}
-      endpoint={endpoint}
-      initialData={initialData}
-      lang={lang}
-    />
+    <Canonical className={className} radioSchedule={initialData} lang={lang} />
   );
 };