Improve error message on timedout requests (#944)

common/components/graphics/ChartPlaceHolder.tsx

@@ -17,7 +17,7 @@ export const ChartPlaceHolder: React.FC<ChartPlaceHolder> = ({
   const isError = query?.isError || readyState === 'error';
   return (
     <div className="relative flex h-60 w-full items-center justify-center">
-      {isError ? <ErrorNotice inverse={inverse} /> : <LoadingSpinner />}
+      {isError ? <ErrorNotice query={query} inverse={inverse} /> : <LoadingSpinner />}
     </div>
   );
 };

common/components/notices/ErrorNotice.tsx

@@ -2,17 +2,22 @@ import { faTriangleExclamation } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import classNames from 'classnames';
 import React from 'react';
+import type { UseQueryResult } from '@tanstack/react-query';
 import { useDelimitatedRoute } from '../../utils/router';
 import { mbtaTextConfig } from '../../styles/general';
 
 interface ErrorNoticeProps {
+  query?: UseQueryResult<unknown>;
   isWidget?: boolean;
   inverse?: boolean;
 }
 
-export const ErrorNotice: React.FC<ErrorNoticeProps> = ({ isWidget, inverse }) => {
+export const ErrorNotice: React.FC<ErrorNoticeProps> = ({ isWidget, inverse, query }) => {
   const { line } = useDelimitatedRoute();
 
+  const errorMessage = query?.error?.['message'];
+  const timeout = errorMessage === 'network request failed';
+
   const color = !inverse && line ? mbtaTextConfig[line] : undefined;
   return (
     <div
@@ -22,7 +27,14 @@ export const ErrorNotice: React.FC<ErrorNoticeProps> = ({ isWidget, inverse }) =
       )}
     >
       <FontAwesomeIcon size={'3x'} icon={faTriangleExclamation} className={color} />
-      <>An error has occurred</>
+      {timeout ? (
+        <>
+          <p>The response took too long</p>
+          <p>Try shrinking the date range and try again</p>
+        </>
+      ) : (
+        <p>An error has occurred</p>
+      )}
     </div>
   );
 };

server/app.py

@@ -49,7 +49,7 @@ def healthcheck():
     checks = {
         "API Key Present": (lambda: len(secrets.MBTA_V2_API_KEY) > 0),
         "S3 Headway Fetching": (
-            lambda: "2020-11-07 10:33:40"
+            lambda: "2020-11-07T10:33:40"
             in json.dumps(data_funcs.headways(date(year=2020, month=11, day=7), ["70061"]))
         ),
         "Performance API Check": (