Fix: Fixing UI issue #2184 #2101 (#2302)

openmetadata-ui/src/main/resources/ui/src/components/UserList/UserList.tsx

@@ -20,6 +20,7 @@ import { UserType } from '../../enums/user.enum';
 import { Team } from '../../generated/entity/teams/team';
 import { User } from '../../generated/entity/teams/user';
 import { getCountBadge } from '../../utils/CommonUtils';
+import ErrorPlaceHolder from '../common/error-with-placeholder/ErrorPlaceHolder';
 import Searchbar from '../common/searchbar/Searchbar';
 import UserDetailsModal from '../Modals/UserDetailsModal/UserDetailsModal';
 import UserDataCard from '../UserDataCard/UserDataCard';
@@ -311,8 +312,15 @@ const UserList: FunctionComponent<Props> = ({
   };
 
   return (
-    <PageLayout leftPanel={getLeftPanel()}>
+    <PageLayout leftPanel={allUsers.length > 0 && getLeftPanel()}>
+      <>
         {!isLoading ? (
+          <>
+            {allUsers.length === 0 ? (
+              <ErrorPlaceHolder>
+                <p className="w-text-lg tw-text-center">No Users Added.</p>
+              </ErrorPlaceHolder>
+            ) : (
               <>
                 {getTabs()}
                 {currentTab === 1 && getUserCards(UserType.ISUSER)}
@@ -327,9 +335,12 @@ const UserList: FunctionComponent<Props> = ({
                   />
                 )}
               </>
+            )}
+          </>
         ) : (
           <Loader />
         )}
+      </>
     </PageLayout>
   );
 };

openmetadata-ui/src/main/resources/ui/src/components/nav-bar/NavBar.tsx

@@ -55,7 +55,7 @@ const NavBar = ({
       <div className="tw-h-16 tw-py-3 tw-border-b-2 tw-border-separator">
         <div className="tw-flex tw-items-center tw-flex-row tw-justify-between tw-flex-nowrap tw-px-6 centered-layout">
           <div className="tw-flex tw-items-center tw-flex-row tw-justify-between tw-flex-nowrap">
-            <NavLink id="openmetadata_logo" to="/">
+            <NavLink className="tw-flex-shrink-0" id="openmetadata_logo" to="/">
               <SVGIcons alt="OpenMetadata Logo" icon={Icons.LOGO} width="90" />
             </NavLink>
             <div className="tw-ml-5">
@@ -121,7 +121,7 @@ const NavBar = ({
           </div>
           <div className="tw-flex tw-ml-auto tw-pl-36">
             <button
-              className="tw-nav focus:tw-no-underline hover:tw-underline"
+              className="tw-nav focus:tw-no-underline hover:tw-underline tw-flex-shrink-0"
               data-testid="whatsnew-modal"
               onClick={() => handleFeatureModal(true)}>
               <PopOver
@@ -137,7 +137,7 @@ const NavBar = ({
               </PopOver>
             </button>
             <button
-              className="tw-nav focus:tw-no-underline hover:tw-underline"
+              className="tw-nav focus:tw-no-underline hover:tw-underline tw-flex-shrink-0"
               data-testid="tour">
               <PopOver
                 position="bottom"
@@ -153,7 +153,7 @@ const NavBar = ({
                 </Link>
               </PopOver>
             </button>
-            <div>
+            <div className="tw-flex-shrink-0">
               <DropDown
                 dropDownList={supportDropdown}
                 icon={