diff --git a/frontend/pages/admin/SettingsWrapper/SettingsWrapper.tsx b/frontend/pages/admin/SettingsWrapper/SettingsWrapper.tsx
index 77c633eb6f..9cb16d5440 100644
--- a/frontend/pages/admin/SettingsWrapper/SettingsWrapper.tsx
+++ b/frontend/pages/admin/SettingsWrapper/SettingsWrapper.tsx
@@ -32,7 +32,7 @@ interface ISettingsWrapperProp {
   }
 }
 
-const getDefaultTabIndex = (path: string): number => {
+const getTabIndex = (path: string): number => {
   return settingsSubNav.findIndex((navItem) => {
     return navItem.pathname.includes(path);
   });
@@ -53,10 +53,10 @@ const SettingsWrapper = (props: ISettingsWrapperProp): JSX.Element => {
     <div className={baseClass}>
       <div className={`${baseClass}__nav-header`}>
         <h1>Settings</h1>
-        <Tabs defaultIndex={getDefaultTabIndex(pathname)} onSelect={i => navigateToNav(i)}>
+        <Tabs selectedIndex={getTabIndex(pathname)} onSelect={i => navigateToNav(i)}>
           <TabList>
             {settingsSubNav.map((navItem) => {
-              return <Tab>{navItem.name}</Tab>;
+              return <Tab key={navItem.name}>{navItem.name}</Tab>;
             })}
           </TabList>
         </Tabs>