Display an error toaster on newsfeed fetch failure

Author: rylnd

x-pack/legacy/plugins/siem/public/components/news_feed/helpers.ts

@@ -9,7 +9,7 @@ import moment from 'moment';
 import uuid from 'uuid';
 
 import { NewsItem, RawNewsApiItem, RawNewsApiResponse } from './types';
-import { throwIfNotOk } from '../../hooks/api/api';
+import { KibanaServices } from '../../lib/kibana';
 
 /**
  * Removes the `-SNAPSHOT` that is sometimes appended to the Kibana version,
@@ -90,15 +90,11 @@ export const fetchNews = async ({
 }: {
   newsFeedUrl: string;
 }): Promise<RawNewsApiResponse> => {
-  const response = await fetch(newsFeedUrl, {
-    credentials: 'omit',
+  return KibanaServices.get().http.fetch<RawNewsApiResponse>(newsFeedUrl, {
     method: 'GET',
+    credentials: 'omit',
     mode: 'cors',
   });
-
-  await throwIfNotOk(response);
-
-  return response.json();
 };
 
 /**

x-pack/legacy/plugins/siem/public/components/news_feed/index.tsx

@@ -9,8 +9,10 @@ import chrome from 'ui/chrome';
 
 import { fetchNews, getNewsFeedUrl, getNewsItemsFromApiResponse } from './helpers';
 import { useKibana, useUiSetting$ } from '../../lib/kibana';
+import { errorToToaster, useStateToaster } from '../toasters';
 import { NewsFeed } from './news_feed';
 import { NewsItem } from './types';
+import * as i18n from './translations';
 
 export const StatefulNewsFeed = React.memo<{
   enableNewsFeedSetting: string;
@@ -20,6 +22,7 @@ export const StatefulNewsFeed = React.memo<{
   const [enableNewsFeed] = useUiSetting$<boolean>(enableNewsFeedSetting);
   const [newsFeedUrlSetting] = useUiSetting$<string>(newsFeedSetting);
   const [news, setNews] = useState<NewsItem[] | null>(null);
+  const [, dispatchToaster] = useStateToaster();
 
   // respect kibana's global newsfeed.enabled setting
   const newsfeedEnabled = kibanaNewsfeedEnabled && enableNewsFeed;
@@ -39,7 +42,8 @@ export const StatefulNewsFeed = React.memo<{
         if (!canceled) {
           setNews(getNewsItemsFromApiResponse(apiResponse));
         }
-      } catch {
+      } catch (error) {
+        errorToToaster({ title: i18n.NEWSFEED_FETCH_ERROR, error, dispatchToaster });
         if (!canceled) {
           setNews([]);
         }

x-pack/legacy/plugins/siem/public/components/news_feed/translations.ts

@@ -11,6 +11,10 @@ export const NO_NEWS_MESSAGE = i18n.translate('xpack.siem.newsFeed.noNewsMessage
     'Your current news feed URL returned no recent news. You may update the URL or disable security news via',
 });
 
+export const NEWSFEED_FETCH_ERROR = i18n.translate('xpack.siem.newsFeed.fetchErrorMessage', {
+  defaultMessage: 'There was an error retrieving the news feed.',
+});
+
 export const ADVANCED_SETTINGS_LINK_TITLE = i18n.translate(
   'xpack.siem.newsFeed.advancedSettingsLinkTitle',
   {