Просмотр исходного кода

Disable configure buttons if there are no permissions

davitbejanyan 2 лет назад
Родитель
Сommit
a7f41fd851

+ 21 - 5
kafka-ui-react-app/src/components/Dashboard/ClusterTableActionsCell.tsx

@@ -1,17 +1,33 @@
-import React from 'react';
-import { Cluster } from 'generated-sources';
+import React, { useMemo } from 'react';
+import { Cluster, ResourceType } from 'generated-sources';
 import { CellContext } from '@tanstack/react-table';
-import { Button } from 'components/common/Button/Button';
 import { clusterConfigPath } from 'lib/paths';
+import { useGetUserInfo } from 'lib/hooks/api/roles';
+import { ActionCanButton } from 'components/common/ActionComponent';
 
 type Props = CellContext<Cluster, unknown>;
 
 const ClusterTableActionsCell: React.FC<Props> = ({ row }) => {
   const { name } = row.original;
+  const { data } = useGetUserInfo();
+
+  const isApplicationConfig = useMemo(() => {
+    return (
+      data?.userInfo?.permissions.some(
+        (permission) => permission.resource === ResourceType.APPLICATIONCONFIG
+      ) || false
+    );
+  }, [data]);
+
   return (
-    <Button buttonType="secondary" buttonSize="S" to={clusterConfigPath(name)}>
+    <ActionCanButton
+      buttonType="secondary"
+      buttonSize="S"
+      to={clusterConfigPath(name)}
+      canDoAction={isApplicationConfig}
+    >
       Configure
-    </Button>
+    </ActionCanButton>
   );
 };
 

+ 19 - 5
kafka-ui-react-app/src/components/Dashboard/Dashboard.tsx

@@ -1,23 +1,25 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import PageHeading from 'components/common/PageHeading/PageHeading';
 import * as Metrics from 'components/common/Metrics';
 import { Tag } from 'components/common/Tag/Tag.styled';
 import Switch from 'components/common/Switch/Switch';
 import { useClusters } from 'lib/hooks/api/clusters';
-import { Cluster, ServerStatus } from 'generated-sources';
+import { Cluster, ResourceType, ServerStatus } from 'generated-sources';
 import { ColumnDef } from '@tanstack/react-table';
 import Table, { SizeCell } from 'components/common/NewTable';
 import useBoolean from 'lib/hooks/useBoolean';
-import { Button } from 'components/common/Button/Button';
 import { clusterNewConfigPath } from 'lib/paths';
 import { GlobalSettingsContext } from 'components/contexts/GlobalSettingsContext';
 import { useNavigate } from 'react-router-dom';
+import { ActionCanButton } from 'components/common/ActionComponent';
+import { useGetUserInfo } from 'lib/hooks/api/roles';
 
 import * as S from './Dashboard.styled';
 import ClusterName from './ClusterName';
 import ClusterTableActionsCell from './ClusterTableActionsCell';
 
 const Dashboard: React.FC = () => {
+  const { data } = useGetUserInfo();
   const clusters = useClusters();
   const { value: showOfflineOnly, toggle } = useBoolean(false);
   const appInfo = React.useContext(GlobalSettingsContext);
@@ -62,6 +64,13 @@ const Dashboard: React.FC = () => {
     }
   }, [clusters, appInfo.hasDynamicConfig]);
 
+  const isApplicationConfig = useMemo(() => {
+    return (
+      data?.userInfo?.permissions.some(
+        (permission) => permission.resource === ResourceType.APPLICATIONCONFIG
+      ) || false
+    );
+  }, [data]);
   return (
     <>
       <PageHeading text="Dashboard" />
@@ -87,9 +96,14 @@ const Dashboard: React.FC = () => {
           <label>Only offline clusters</label>
         </div>
         {appInfo.hasDynamicConfig && (
-          <Button buttonType="primary" buttonSize="M" to={clusterNewConfigPath}>
+          <ActionCanButton
+            buttonType="primary"
+            buttonSize="M"
+            to={clusterNewConfigPath}
+            canDoAction={isApplicationConfig}
+          >
             Configure new cluster
-          </Button>
+          </ActionCanButton>
         )}
       </S.Toolbar>
       <Table

+ 1 - 1
kafka-ui-react-app/src/components/Topics/Topic/Messages/Filters/AddEditFilterContainer.tsx

@@ -27,7 +27,7 @@ export interface AddEditFilterContainerProps {
   inputDisplayNameDefaultValue?: string;
   inputCodeDefaultValue?: string;
   isAdd?: boolean;
-  submitCallback?: (values: AddMessageFilters) => Promise<void>;
+  submitCallback?: (values: AddMessageFilters) => void;
 }
 
 const AddEditFilterContainer: React.FC<AddEditFilterContainerProps> = ({