add mappers tab

src/client-scopes/form/ClientScopeForm.tsx

@@ -322,7 +322,7 @@ export const ClientScopeForm = () => {
           <Tab
             isHidden={!id}
             eventKey="mappers"
-            title={<TabTitleText>{t("mappers")}</TabTitleText>}
+            title={<TabTitleText>{t("common:mappers")}</TabTitleText>}
           >
             {clientScope && (
               <MapperList clientScope={clientScope} refresh={refresh} />

src/client-scopes/messages.json

@@ -28,7 +28,6 @@
     "createError": "Could not create client scope: '{{error}}'",
     "updateSuccess": "Client scope updated",
     "updateError": "Could not update client scope: '{{error}}'",
-    "mappers": "Mappers",
     "mappersSearchFor": "Search for mapper",
     "addMapper": "Add mapper",
     "addMapperExplain": "If you want more fine-grain control, you can create protocol mapper on this client",

src/common-messages.json

@@ -64,6 +64,7 @@
     "groups": "Groups",
     "sessions": "Sessions",
     "events": "Events",
+    "mappers": "Mappers",
 
     "configure": "Configure",
     "realmSettings": "Realm settings",

src/route-config.ts

@@ -219,7 +219,7 @@ export const routes: RoutesFn = (t: TFunction) => [
     access: "view-realm",
   },
   {
-    path: "/:realm/user-federation/ldap/:id",
+    path: "/:realm/user-federation/ldap/:id/:tab?",
     component: UserFederationLdapSettings,
     breadcrumb: t("common:settings"),
     access: "view-realm",

src/user-federation/UserFederationLdapSettings.tsx

@@ -8,6 +8,9 @@ import {
   DropdownSeparator,
   Form,
   PageSection,
+  Tab,
+  TabTitleText,
+  Text,
 } from "@patternfly/react-core";
 
 import { LdapSettingsAdvanced } from "./ldap/LdapSettingsAdvanced";
@@ -31,6 +34,8 @@ import { ViewHeader } from "../components/view-header/ViewHeader";
 import { useHistory, useParams } from "react-router-dom";
 import { ScrollForm } from "../components/scroll-form/ScrollForm";
 
+import { KeycloakTabs } from "../components/keycloak-tabs/KeycloakTabs";
+
 type LdapSettingsHeaderProps = {
   onChange: (value: string) => void;
   value: string;
@@ -276,6 +281,12 @@ export const UserFederationLdapSettings = () => {
         )}
       />
       <PageSection variant="light" isFilled>
+        <KeycloakTabs isBox>
+          <Tab
+            id="settings"
+            eventKey="settings"
+            title={<TabTitleText>{t("common:settings")}</TabTitleText>}
+          >
             <ScrollForm
               sections={[
                 t("generalOptions"),
@@ -314,6 +325,16 @@ export const UserFederationLdapSettings = () => {
                 </Button>
               </ActionGroup>
             </Form>
+          </Tab>
+          <Tab
+            id="mappers"
+            eventKey="mappers"
+            title={<TabTitleText>{t("common:mappers")}</TabTitleText>}
+          >
+            {/* <MapperList clientScope={clientScope} refresh={refresh} /> */}
+            <Text>Coming soon!</Text>
+          </Tab>
+        </KeycloakTabs>
       </PageSection>
     </>
   );