From 660b22d0b1446be5b1e6210c9aa09bdf8594b577 Mon Sep 17 00:00:00 2001
From: Jingyi Gao <jingyi.gao@thetradedesk.com>
Date: Fri, 6 Oct 2023 16:14:06 +1100
Subject: [PATCH] Show error page if keyset not exists

---
 src/web/screens/sharingPermissions.tsx | 22 ++++++++++++++--------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/src/web/screens/sharingPermissions.tsx b/src/web/screens/sharingPermissions.tsx
index 8d2d2e26a..192d29cd6 100644
--- a/src/web/screens/sharingPermissions.tsx
+++ b/src/web/screens/sharingPermissions.tsx
@@ -1,4 +1,4 @@
-import { useCallback, useContext, useEffect, useState } from 'react';
+import { useContext, useEffect, useState } from 'react';
 
 import { ClientType } from '../../api/services/adminServiceHelpers';
 import { Collapsible } from '../components/Core/Collapsible';
@@ -14,6 +14,8 @@ import {
   GetSharingList,
 } from '../services/participant';
 import { preloadAllSitesList, preloadAvailableSiteList } from '../services/site';
+import { ApiError } from '../utils/apiError';
+import { useAsyncError } from '../utils/errorHandler';
 import { PortalRoute } from './routeUtils';
 
 import './sharingPermissions.scss';
@@ -24,6 +26,7 @@ function SharingPermissions() {
   const [sharedSiteIds, setSharedSiteIds] = useState<number[]>([]);
   const [sharedTypes, setSharedTypes] = useState<ClientType[]>([]);
   const [statusPopup, setStatusPopup] = useState<StatusNotificationType>();
+  const throwError = useAsyncError();
 
   const handleSaveSharingType = async (selectedTypes: ClientType[]) => {
     try {
@@ -95,15 +98,18 @@ function SharingPermissions() {
     }
   };
 
-  const loadSharingList = useCallback(async () => {
-    const response = await GetSharingList();
-    setSharedSiteIds(response.allowed_sites);
-    setSharedTypes(response.allowed_types ?? []);
-  }, []);
-
   useEffect(() => {
+    const loadSharingList = async () => {
+      try {
+        const response = await GetSharingList();
+        setSharedSiteIds(response.allowed_sites);
+        setSharedTypes(response.allowed_types ?? []);
+      } catch (e: unknown) {
+        if (e instanceof ApiError) throwError(e);
+      }
+    };
     loadSharingList();
-  }, [loadSharingList]);
+  }, [throwError]);
 
   return (
     <div className='sharingPermissions'>