From f322edec105d640c4768dbcd15a9dde3da80eea9 Mon Sep 17 00:00:00 2001
From: Erik Jan de Wit <erikjan.dewit@gmail.com>
Date: Tue, 8 Jun 2021 15:13:04 +0200
Subject: [PATCH] fixing issue comment: (#656)

https://github.com/keycloak/keycloak-admin-ui/issues/396#issuecomment-846901717
---
 src/components/realm-selector/RealmSelector.tsx  | 9 ++++++---
 src/components/realm-selector/realm-selector.css | 7 -------
 src/components/realm-selector/recent-used.ts     | 2 +-
 3 files changed, 7 insertions(+), 11 deletions(-)

diff --git a/src/components/realm-selector/RealmSelector.tsx b/src/components/realm-selector/RealmSelector.tsx
index 3849cd4b79..12664f235f 100644
--- a/src/components/realm-selector/RealmSelector.tsx
+++ b/src/components/realm-selector/RealmSelector.tsx
@@ -37,6 +37,7 @@ export const RealmSelector = () => {
   const { t } = useTranslation("common");
   const recentUsed = new RecentUsed();
   const all = recentUsed.used
+    .filter((r) => r !== realm)
     .map((name) => {
       return { name, used: true };
     })
@@ -133,6 +134,11 @@ export const RealmSelector = () => {
           searchInputValue={search}
           onSearchInputChange={(value) => setSearch(value)}
           className="keycloak__realm_selector__context_selector"
+          footer={
+            <ContextSelectorItem key="add">
+              <AddRealm />
+            </ContextSelectorItem>
+          }
         >
           {(filteredItems || all).map((item) => (
             <ContextSelectorItem key={item.name}>
@@ -140,9 +146,6 @@ export const RealmSelector = () => {
               {item.used && <Label>{t("recent")}</Label>}
             </ContextSelectorItem>
           ))}
-          <ContextSelectorItem key="add">
-            <AddRealm />
-          </ContextSelectorItem>
         </ContextSelector>
       )}
       {realms.length <= 5 && (
diff --git a/src/components/realm-selector/realm-selector.css b/src/components/realm-selector/realm-selector.css
index 0df592c6bd..40fd0473f1 100644
--- a/src/components/realm-selector/realm-selector.css
+++ b/src/components/realm-selector/realm-selector.css
@@ -31,13 +31,6 @@
   text-align: left;
 }
 
-/* the last child is the realm selector button, and this is the only way to style the li around it */
-.keycloak__realm_selector__context_selector li:last-child {
-  position: sticky;
-  bottom: 0;
-  background-color: var(--pf-c-context-selector__menu--BackgroundColor);
-}
-
 .keycloak__page_nav__nav_item__realm-selector {
   margin-top: var(--pf-c-nav__link--PaddingTop);
   padding-right: var(--pf-c-nav__link--PaddingRight);
diff --git a/src/components/realm-selector/recent-used.ts b/src/components/realm-selector/recent-used.ts
index be49955821..8fb1961de7 100644
--- a/src/components/realm-selector/recent-used.ts
+++ b/src/components/realm-selector/recent-used.ts
@@ -1,5 +1,5 @@
 export class RecentUsed {
-  private readonly MAX_NUM = 3;
+  private readonly MAX_NUM = 4; // 3 plus current realm
   private readonly KEY = "recent-used-realms";
   private recentUsedRealms: string[];