refactor: create component for access denied

Author: artemmufazalov

src/components/Errors/403/AccessDenied.tsx

@@ -0,0 +1,19 @@
+import EmptyState from '../../EmptyState/EmptyState';
+import {Illustration} from '../../Illustration';
+
+import i18n from '../i18n';
+
+interface AccessDeniedProps {
+    title?: string;
+    description?: string;
+}
+
+export const AccessDenied = ({title, description}: AccessDeniedProps) => {
+    return (
+        <EmptyState
+            image={<Illustration name="403" />}
+            title={title || i18n('403.title')}
+            description={description || i18n('403.description')}
+        />
+    );
+};

src/components/Errors/403/index.ts

@@ -0,0 +1 @@
+export * from './AccessDenied';

src/components/Errors/i18n/en.json

@@ -0,0 +1,4 @@
+{
+  "403.title": "Access denied",
+  "403.description": "You don’t have the necessary roles to view this page."
+}

src/components/Errors/i18n/index.ts

@@ -0,0 +1,11 @@
+import {i18n, Lang} from '../../../utils/i18n';
+
+import en from './en.json';
+import ru from './ru.json';
+
+const COMPONENT = 'ydb-errors-access-denied';
+
+i18n.registerKeyset(Lang.En, COMPONENT, en);
+i18n.registerKeyset(Lang.Ru, COMPONENT, ru);
+
+export default i18n.keyset(COMPONENT);

src/components/Errors/i18n/ru.json

@@ -0,0 +1,4 @@
+{
+  "403.title": "Доступ запрещен",
+  "403.description": "У вас недостаточно прав для просмотра данной страницы."
+}

src/containers/Tenant/Tenant.tsx

@@ -4,8 +4,7 @@ import cn from 'bem-cn-lite';
 import {useLocation} from 'react-router';
 import qs from 'qs';
 
-import EmptyState from '../../components/EmptyState/EmptyState';
-import {Illustration} from '../../components/Illustration';
+import {AccessDenied} from '../../components/Errors/403';
 
 import {setHeader} from '../../store/reducers/header';
 import ObjectGeneralTabs from './ObjectGeneralTabs/ObjectGeneralTabs';
@@ -129,11 +128,7 @@ function Tenant(props: TenantProps) {
     return (
         <div className={b()}>
             {showBlockingError ? (
-                <EmptyState
-                    image={<Illustration name="403" />}
-                    title="Access denied"
-                    description="You don’t have the necessary roles to view this page."
-                />
+                <AccessDenied />
             ) : (
                 <>
                     <ObjectGeneralTabs />