feat: add effective ACL (#1036)

Author: Raubzeug

src/containers/Tenant/Acl/Acl.scss

@@ -2,20 +2,20 @@
 
 .ydb-acl {
     width: 100%;
-    &__owner-container {
-        padding-bottom: 25px;
-    }
     &__result {
-        padding-bottom: 16px;
-    }
-
-    &__owner {
-        font-weight: 600;
+        padding-bottom: var(--g-spacing-4);
+        padding-left: var(--g-spacing-2);
     }
     &__definition-content {
         display: flex;
         flex-direction: column;
     }
+    &__list-title {
+        margin: var(--g-spacing-3) 0 var(--g-spacing-5);
+
+        font-weight: 600;
+        @include subheader-2-typography();
+    }
     &__group-label {
         @include subheader-2-typography();
     }

src/containers/Tenant/Acl/Acl.tsx

@@ -1,15 +1,16 @@
 import React from 'react';
 
-import type {DefinitionListItem} from '@gravity-ui/components';
 import {DefinitionList} from '@gravity-ui/components';
+import type {DefinitionListItem} from '@gravity-ui/components';
 
 import {ResponseError} from '../../../components/Errors/ResponseError';
 import {Loader} from '../../../components/Loader';
 import {schemaAclApi} from '../../../store/reducers/schemaAcl/schemaAcl';
 import type {TACE} from '../../../types/api/acl';
 import {valueIsDefined} from '../../../utils';
 import {cn} from '../../../utils/cn';
-import i18n from '../i18n';
+
+import i18n from './i18n';
 
 import './Acl.scss';
 
@@ -113,26 +114,28 @@ function getAclListItems(acl?: TACE[]): DefinitionListItem[] {
     });
 }
 
-function getOwnerItem(owner?: string) {
+function getOwnerItem(owner?: string): DefinitionListItem[] {
     const preparedOwner = prepareLogin(owner);
     if (!preparedOwner) {
         return [];
     }
     return [
         {
             name: <span className={b('owner')}>{preparedOwner}</span>,
-            content: <span className={b('owner')}>{i18n('acl.owner')}</span>,
+            content: <span className={b('owner')}>{i18n('title_owner')}</span>,
         },
-    ] as DefinitionListItem[];
+    ];
 }
 
 export const Acl = ({path}: {path: string}) => {
     const {currentData, isFetching, error} = schemaAclApi.useGetSchemaAclQuery({path});
 
     const loading = isFetching && !currentData;
-    const {acl, owner} = currentData || {};
+
+    const {acl, effectiveAcl, owner} = currentData || {};
 
     const aclListItems = getAclListItems(acl);
+    const effectiveAclListItems = getAclListItems(effectiveAcl);
 
     const ownerItem = getOwnerItem(owner);
 
@@ -144,21 +147,33 @@ export const Acl = ({path}: {path: string}) => {
         return <ResponseError error={error} />;
     }
 
-    if (!acl && !owner) {
-        return <React.Fragment>{i18n('acl.empty')}</React.Fragment>;
+    if (!acl && !owner && !effectiveAcl) {
+        return <React.Fragment>{i18n('description_empty')}</React.Fragment>;
     }
 
+    const accessRightsItems = ownerItem.concat(aclListItems);
+
     return (
         <div className={b()}>
-            {ownerItem.length ? (
-                <DefinitionList
-                    items={ownerItem}
-                    nameMaxWidth={200}
-                    className={b('owner-container')}
-                />
+            {accessRightsItems.length ? (
+                <React.Fragment>
+                    <div className={b('list-title')}>{i18n('title_rights')}</div>
+                    <DefinitionList
+                        items={accessRightsItems}
+                        nameMaxWidth={200}
+                        className={b('result')}
+                    />
+                </React.Fragment>
             ) : null}
-            {aclListItems.length ? (
-                <DefinitionList items={aclListItems} nameMaxWidth={200} className={b('result')} />
+            {effectiveAclListItems.length ? (
+                <React.Fragment>
+                    <div className={b('list-title')}>{i18n('title_effective-rights')}</div>
+                    <DefinitionList
+                        items={effectiveAclListItems}
+                        nameMaxWidth={200}
+                        className={b('result')}
+                    />
+                </React.Fragment>
             ) : null}
         </div>
     );

src/containers/Tenant/Acl/i18n/en.json

@@ -0,0 +1,6 @@
+{
+  "title_rights": "Access Rights",
+  "title_effective-rights": "Effective Access Rights",
+  "title_owner": "Owner",
+  "description_empty": "No Acl data"
+}

src/containers/Tenant/Acl/i18n/index.ts

@@ -0,0 +1,7 @@
+import {registerKeysets} from '../../../../utils/i18n';
+
+import en from './en.json';
+
+const COMPONENT = 'ydb-acl';
+
+export default registerKeysets(COMPONENT, {en});

src/containers/Tenant/i18n/en.json

@@ -2,8 +2,6 @@
   "page.title": "Database",
   "pages.query": "Query",
   "pages.diagnostics": "Diagnostics",
-  "acl.owner": "Owner",
-  "acl.empty": "No Acl data",
   "summary.navigation": "Navigation",
   "summary.showPreview": "Show preview",
   "summary.source-type": "Source Type",

src/store/reducers/schemaAcl/schemaAcl.ts

@@ -6,7 +6,13 @@ export const schemaAclApi = api.injectEndpoints({
             queryFn: async ({path}: {path: string}, {signal}) => {
                 try {
                     const data = await window.api.getSchemaAcl({path}, {signal});
-                    return {data: {acl: data.Common.ACL, owner: data.Common.Owner}};
+                    return {
+                        data: {
+                            acl: data.Common.ACL,
+                            effectiveAcl: data.Common.EffectiveACL,
+                            owner: data.Common.Owner,
+                        },
+                    };
                 } catch (error) {
                     return {error};
                 }

src/styles/mixins.scss

@@ -40,6 +40,11 @@
     line-height: var(--g-text-subheader-2-line-height);
 }
 
+@mixin subheader-3-typography() {
+    font-size: var(--g-text-subheader-3-font-size);
+    line-height: var(--g-text-subheader-3-line-height);
+}
+
 @mixin header-1-typography() {
     font-size: var(--g-text-header-1-font-size);
     line-height: var(--g-text-header-1-line-height);

src/types/api/acl.ts

@@ -14,6 +14,7 @@ export interface TMetaCommonInfo {
     Path: string;
     Owner?: string;
     ACL?: TACE[];
+    EffectiveACL?: TACE[];
 }
 
 export interface TACE {