Bug 1978222: make Users list empty state message more clear

frontend/packages/console-shared/src/hooks/oauth.ts

@@ -0,0 +1,24 @@
+import { useK8sWatchResource } from '@console/internal/components/utils/k8s-watch-hook';
+import { useAccessReview } from '@console/internal/components/utils/rbac';
+import { OAuthModel } from '@console/internal/models';
+import { OAuthKind, referenceForModel } from '@console/internal/module/k8s';
+
+export const useCanEditIdentityProviders = () =>
+  useAccessReview({
+    group: OAuthModel.apiGroup,
+    resource: OAuthModel.plural,
+    name: 'cluster',
+    verb: 'patch',
+  });
+
+export const useOAuthData = (canEdit: boolean) =>
+  useK8sWatchResource<OAuthKind>(
+    canEdit
+      ? {
+          kind: referenceForModel(OAuthModel),
+          isList: false,
+          namespaced: false,
+          name: 'cluster',
+        }
+      : null,
+  );

frontend/public/components/dashboard/dashboards-page/cluster-dashboard/getting-started/cluster-setup-identity-provider-link.ts

@@ -3,30 +3,8 @@ import { useTranslation } from 'react-i18next';
 import { GettingStartedLink } from '@console/shared/src/components/getting-started';
 
 import { OAuthModel } from '@console/internal/models';
-import { OAuthKind, referenceForModel } from '@console/internal/module/k8s';
 import { resourcePathFromModel } from '@console/internal/components/utils';
-import { useAccessReview } from '@console/internal/components/utils/rbac';
-import { useK8sWatchResource } from '@console/internal/components/utils/k8s-watch-hook';
-
-const useCanEditIdentityProviders = () =>
-  useAccessReview({
-    group: OAuthModel.apiGroup,
-    resource: OAuthModel.plural,
-    name: 'cluster',
-    verb: 'patch',
-  });
-
-const useOAuthData = (canEdit: boolean) =>
-  useK8sWatchResource<OAuthKind>(
-    canEdit
-      ? {
-          kind: referenceForModel(OAuthModel),
-          isList: false,
-          namespaced: false,
-          name: 'cluster',
-        }
-      : null,
-  );
+import { useCanEditIdentityProviders, useOAuthData } from '@console/shared/src/hooks/oauth';
 
 export const useIdentityProviderLink = (): GettingStartedLink | null => {
   const { t } = useTranslation();

frontend/public/components/user.tsx

@@ -5,6 +5,7 @@ import * as _ from 'lodash-es';
 import { Button } from '@patternfly/react-core';
 import { sortable } from '@patternfly/react-table';
 
+import { useCanEditIdentityProviders, useOAuthData } from '@console/shared/src/hooks/oauth';
 import * as UIActions from '../actions/ui';
 import { OAuthModel, UserModel } from '../models';
 import { K8sKind, referenceForModel, UserKind } from '../module/k8s';
@@ -67,35 +68,56 @@ const UserTableRow: RowFunction<UserKind> = ({ obj, index, key, style }) => {
   );
 };
 
+const UsersHelpText = () => {
+  const { t } = useTranslation();
+  return <>{t('public~Users are automatically added the first time they log in.')}</>;
+};
+
 const EmptyMsg = () => {
   const { t } = useTranslation();
   return <MsgBox title={t('public~No Users found')} />;
 };
 const oAuthResourcePath = resourcePathFromModel(OAuthModel, 'cluster');
 
-const NoDataEmptyMsg = () => {
+const NoDataEmptyMsgDetail = () => {
   const { t } = useTranslation();
+  const canEditIdentityProviders = useCanEditIdentityProviders();
+  const [oauth, oauthLoaded] = useOAuthData(canEditIdentityProviders);
   return (
-    <MsgBox
-      title={t('public~No Users found')}
-      detail={
-        <>
-          <p>
-            {t(
-              'public~Add identity providers (IDPs) to the OAuth configuration to allow others to log in.',
-            )}
-          </p>
+    <>
+      {canEditIdentityProviders && oauthLoaded ? (
+        oauth?.spec?.identityProviders?.length > 0 ? (
           <p>
-            <Link to={oAuthResourcePath}>
-              <Button variant="primary">{t('public~Add IDP')}</Button>
-            </Link>
+            <UsersHelpText />
           </p>
-        </>
-      }
-    />
+        ) : (
+          <>
+            <p>
+              {t(
+                'public~Add identity providers (IDPs) to the OAuth configuration to allow others to log in.',
+              )}
+            </p>
+            <p>
+              <Link to={oAuthResourcePath}>
+                <Button variant="primary">{t('public~Add IDP')}</Button>
+              </Link>
+            </p>
+          </>
+        )
+      ) : (
+        <p>
+          <UsersHelpText />
+        </p>
+      )}
+    </>
   );
 };
 
+const NoDataEmptyMsg = () => {
+  const { t } = useTranslation();
+  return <MsgBox title={t('public~No Users found')} detail={<NoDataEmptyMsgDetail />} />;
+};
+
 export const UserList: React.FC = (props) => {
   const { t } = useTranslation();
   const UserTableHeader = () => {
@@ -144,7 +166,7 @@ export const UserPage: React.FC<UserPageProps> = (props) => {
     <ListPage
       {...props}
       title={t('public~Users')}
-      helpText={<>{t('public~Users are automatically added the first time they log in.')}</>}
+      helpText={<UsersHelpText />}
       kind={referenceForModel(UserModel)}
       ListComponent={UserList}
       canCreate={false}

frontend/public/locales/en/public.json

@@ -1440,12 +1440,12 @@
   "Block": "Block",
   "Collapse": "Collapse",
   "Impersonate User {{name}}": "Impersonate User {{name}}",
+  "Users are automatically added the first time they log in.": "Users are automatically added the first time they log in.",
   "No Users found": "No Users found",
   "Add identity providers (IDPs) to the OAuth configuration to allow others to log in.": "Add identity providers (IDPs) to the OAuth configuration to allow others to log in.",
   "Add IDP": "Add IDP",
   "Full name": "Full name",
   "Identities": "Identities",
-  "Users are automatically added the first time they log in.": "Users are automatically added the first time they log in.",
   "User details": "User details",
   "There is {{count}} {{variant}} alert.": "There is {{count}} {{variant}} alert.",
   "There is {{count}} {{variant}} alert._plural": "There is {{count}} {{variant}} alert.s",