✨ feat(i18n): translate permissions

dashpresshq · Apr 28, 2024 · ef45551 · ef45551
1 parent 89e9e5e
commit ef45551
Show file tree

Hide file tree

Showing 90 changed files with 741 additions and 389 deletions.
diff --git a/.husky/pre-commit b/.husky/pre-commit
@@ -2,3 +2,5 @@
 . "$(dirname "$0")/_/husky.sh"
 
 npx lint-staged
+npm run translations:extract
+
diff --git a/src/__tests__/api/integrations/actions/[key]/implementations.spec.ts b/src/__tests__/api/integrations/actions/[key]/implementations.spec.ts
@@ -38,7 +38,10 @@ describe("/api/integrations/actions/[key]/implementations", () => {
             },
           },
           "key": "GET",
-          "label": "GET",
+          "label": {
+            "id": "GET",
+            "message": "GET",
+          },
         },
         {
           "configurationSchema": {
@@ -72,7 +75,10 @@ describe("/api/integrations/actions/[key]/implementations", () => {
             },
           },
           "key": "PUT",
-          "label": "PUT",
+          "label": {
+            "id": "PUT",
+            "message": "PUT",
+          },
         },
         {
           "configurationSchema": {
@@ -106,7 +112,10 @@ describe("/api/integrations/actions/[key]/implementations", () => {
             },
           },
           "key": "POST",
-          "label": "POST",
+          "label": {
+            "id": "POST",
+            "message": "POST",
+          },
         },
         {
           "configurationSchema": {
@@ -140,7 +149,10 @@ describe("/api/integrations/actions/[key]/implementations", () => {
             },
           },
           "key": "PATCH",
-          "label": "PATCH",
+          "label": {
+            "id": "PATCH",
+            "message": "PATCH",
+          },
         },
         {
           "configurationSchema": {
@@ -174,85 +186,10 @@ describe("/api/integrations/actions/[key]/implementations", () => {
             },
           },
           "key": "DELETE",
-          "label": "DELETE",
-        },
-      ]
-    `);
-  });
-
-  it("should show an integration implementation for other keys", async () => {
-    const { req, res } = createAuthenticatedMocks({
-      method: "GET",
-      query: {
-        key: "smtp",
-      },
-    });
-    await handler(req, res);
-
-    expect(res._getStatusCode()).toBe(200);
-    expect(res._getJSONData()).toMatchInlineSnapshot(`
-      [
-        {
-          "configurationSchema": {
-            "body": {
-              "label": {
-                "id": "bGQplw",
-                "message": "Body",
-              },
-              "type": "richtext",
-              "validations": [
-                {
-                  "validationType": "required",
-                },
-              ],
-            },
-            "senderEmail": {
-              "label": {
-                "id": "oWvSIB",
-                "message": "Sender Email",
-              },
-              "type": "text",
-              "validations": [
-                {
-                  "validationType": "required",
-                },
-              ],
-            },
-            "senderName": {
-              "label": {
-                "id": "fXHEMx",
-                "message": "Sender Name",
-              },
-              "type": "text",
-              "validations": [],
-            },
-            "subject": {
-              "label": {
-                "id": "UJmAAK",
-                "message": "Subject",
-              },
-              "type": "text",
-              "validations": [
-                {
-                  "validationType": "required",
-                },
-              ],
-            },
-            "to": {
-              "label": {
-                "id": "/jQctM",
-                "message": "To",
-              },
-              "type": "text",
-              "validations": [
-                {
-                  "validationType": "required",
-                },
-              ],
-            },
+          "label": {
+            "id": "DELETE",
+            "message": "DELETE",
           },
-          "key": "SEND_MAIL",
-          "label": "Send Mail",
         },
       ]
     `);

diff --git a/src/__tests__/integrations/variables__credentials--non-admin.spec.tsx b/src/__tests__/integrations/variables__credentials--non-admin.spec.tsx
@@ -10,7 +10,7 @@ import { BASE_TEST_URL } from "__tests__/_/api-handlers/_utils";
 import { setupApiHandlers } from "__tests__/_/setupApihandlers";
 import userEvent from "@testing-library/user-event";
 import { IAuthenticatedUserBag } from "shared/types/user";
-import { USER_PERMISSIONS } from "shared/constants/user";
+import { UserPermissions } from "shared/constants/user";
 import { AuthActions } from "frontend/hooks/auth/auth.actions";
 import { getTableRows } from "__tests__/_/utils/getTableRows";
 import { USE_ROUTER_PARAMS } from "__tests__/_/constants";
@@ -32,7 +32,7 @@ describe("pages/integrations/variables => credentials -- non admin", () => {
 
     const CUSTOM_ROLE_USER: IAuthenticatedUserBag = {
       name: "Custom Role",
-      permissions: [USER_PERMISSIONS.CAN_CONFIGURE_APP],
+      permissions: [UserPermissions.CAN_CONFIGURE_APP],
       role: "custom-role",
       username: "root",
     };

diff --git a/src/__tests__/users/[username]/index__non-admin.spec.tsx b/src/__tests__/users/[username]/index__non-admin.spec.tsx
@@ -7,14 +7,14 @@ import UserUpdate from "pages/users/[username]/index";
 import { setupApiHandlers } from "__tests__/_/setupApihandlers";
 import { BASE_TEST_URL } from "__tests__/_/api-handlers/_utils";
 import { IAuthenticatedUserBag } from "shared/types/user";
-import { USER_PERMISSIONS } from "shared/constants/user";
+import { UserPermissions } from "shared/constants/user";
 import { USE_ROUTER_PARAMS } from "__tests__/_/constants";
 
 const server = setupApiHandlers();
 
 const VIEWER: IAuthenticatedUserBag = {
   name: "Root User",
-  permissions: [USER_PERMISSIONS.CAN_MANAGE_USERS],
+  permissions: [UserPermissions.CAN_MANAGE_USERS],
   role: "custom-role",
   username: "root",
 };

diff --git a/src/backend/lib/request/validations/implementations/__tests__/can-user.spec.ts b/src/backend/lib/request/validations/implementations/__tests__/can-user.spec.ts
@@ -1,5 +1,5 @@
 import { requestHandler } from "backend/lib/request";
-import { USER_PERMISSIONS } from "shared/constants/user";
+import { UserPermissions } from "shared/constants/user";
 import {
   createAuthenticatedMocks,
   createAuthenticatedViewerMocks,
@@ -14,7 +14,7 @@ const handler = requestHandler(
   [
     {
       _type: "canUser",
-      body: USER_PERMISSIONS.CAN_MANAGE_DASHBOARD,
+      body: UserPermissions.CAN_MANAGE_DASHBOARD,
     },
   ]
 );

diff --git a/src/backend/lib/request/validations/implementations/__tests__/entity.spec.ts b/src/backend/lib/request/validations/implementations/__tests__/entity.spec.ts
@@ -1,5 +1,5 @@
 import { requestHandler } from "backend/lib/request";
-import { USER_PERMISSIONS } from "shared/constants/user";
+import { UserPermissions } from "shared/constants/user";
 import {
   createAuthenticatedCustomRoleMocks,
   createAuthenticatedMocks,
@@ -90,7 +90,7 @@ describe("Request Validations => entityValidationImpl", () => {
     await setupRolesTestData([
       {
         id: "custom-role",
-        permissions: [USER_PERMISSIONS.CAN_MANAGE_DASHBOARD],
+        permissions: [UserPermissions.CAN_MANAGE_DASHBOARD],
       },
     ]);
     const { req, res } = createAuthenticatedCustomRoleMocks({

diff --git a/src/backend/lib/request/validations/implementations/can-user.ts b/src/backend/lib/request/validations/implementations/can-user.ts
@@ -1,15 +1,15 @@
 import { ForbiddenError, progammingError } from "backend/lib/errors";
 import { rolesApiService } from "backend/roles/roles.service";
 import { userFriendlyCase } from "shared/lib/strings/friendly-case";
-import { USER_PERMISSIONS } from "shared/constants/user";
+import { UserPermissions } from "shared/constants/user";
 import { ValidationImplType } from "./types";
 
 const ERROR_MESSAGE =
   "Your account doesn't have enough priviledge to perform this action";
 
 export const canUserValidationImpl: ValidationImplType<void> = async (
   req,
-  requiredPermission: string
+  requiredPermission: UserPermissions
 ): Promise<void> => {
   progammingError(
     "Please provide the required permission",
@@ -18,7 +18,7 @@ export const canUserValidationImpl: ValidationImplType<void> = async (
 
   progammingError(
     "The provided permission seems to be invalid",
-    !Object.values(USER_PERMISSIONS).includes(requiredPermission)
+    !Object.values(UserPermissions).includes(requiredPermission)
   );
 
   if (

diff --git a/src/backend/menu/menu.service.ts b/src/backend/menu/menu.service.ts
@@ -5,7 +5,7 @@ import {
   SystemLinks,
 } from "shared/types/menu";
 import { userFriendlyCase } from "shared/lib/strings/friendly-case";
-import { META_USER_PERMISSIONS, USER_PERMISSIONS } from "shared/constants/user";
+import { META_USER_PERMISSIONS, UserPermissions } from "shared/constants/user";
 import { GranularEntityPermissions } from "shared/types/user";
 import {
   EntitiesApiService,
@@ -28,19 +28,19 @@ const SYSTEM_LINKS_CONFIG_MAP: Record<
   }
 > = {
   [SystemLinks.Settings]: {
-    permission: USER_PERMISSIONS.CAN_CONFIGURE_APP,
+    permission: UserPermissions.CAN_CONFIGURE_APP,
   },
   [SystemLinks.Home]: {
     permission: META_USER_PERMISSIONS.NO_PERMISSION_REQUIRED,
   },
   [SystemLinks.Roles]: {
-    permission: USER_PERMISSIONS.CAN_MANAGE_PERMISSIONS,
+    permission: UserPermissions.CAN_MANAGE_PERMISSIONS,
   },
   [SystemLinks.Users]: {
-    permission: USER_PERMISSIONS.CAN_MANAGE_USERS,
+    permission: UserPermissions.CAN_MANAGE_USERS,
   },
   [SystemLinks.Integrations]: {
-    permission: USER_PERMISSIONS.CAN_MANAGE_APP_CREDENTIALS,
+    permission: UserPermissions.CAN_MANAGE_APP_CREDENTIALS,
   },
 };
 

diff --git a/src/frontend/components/SchemaForm/form-grid.tsx b/src/frontend/components/SchemaForm/form-grid.tsx
@@ -9,8 +9,9 @@ const Root = styled.div`
   align-items: end;
 `;
 
+// TOOD fix
 const Container = styled.div`
-  container-type: inline-size;
+  // container-type: inline-size;
 `;
 
 export const FormGrid = {

diff --git a/src/frontend/design-system/components/Table/filters/__tests__/index.spec.tsx b/src/frontend/design-system/components/Table/filters/__tests__/index.spec.tsx
@@ -58,8 +58,8 @@ describe("Table Filters", () => {
         .toMatchInlineSnapshot(`
           [
             "Contains",
-            "Equal To",
-            "Not Equal To",
+            "Equal",
+            "Not Equal",
           ]
         `);
     });
@@ -82,7 +82,7 @@ describe("Table Filters", () => {
 
       await userEvent.selectOptions(
         screen.getByRole("combobox", { name: "Select Filter Operator" }),
-        "Equal To"
+        "Equal"
       );
 
       await waitFor(() => {
@@ -139,8 +139,8 @@ describe("Table Filters", () => {
       expect(screen.getAllByRole("option").map((option) => option.textContent))
         .toMatchInlineSnapshot(`
         [
-          "Equal To",
-          "Not Equal To",
+          "Equal",
+          "Not Equal",
           "Between",
           "Greater Than",
           "Less Than",
@@ -247,7 +247,7 @@ describe("Table Filters", () => {
           .map((option) => option.textContent)
       ).toMatchInlineSnapshot(`
           [
-            "Equal To",
+            "Equal",
           ]
         `);
     });
@@ -440,8 +440,8 @@ describe("Table Filters", () => {
       expect(screen.getAllByRole("option").map((option) => option.textContent))
         .toMatchInlineSnapshot(`
         [
-          "In",
-          "Not In",
+          "Is In",
+          "Is Not In",
         ]
       `);
     });

diff --git a/src/frontend/design-system/components/Table/hooks.tsx b/src/frontend/design-system/components/Table/hooks.tsx
@@ -21,7 +21,8 @@ export const useInternalColumns = (columns: ITableColumn[]) => {
   const { _ } = useLingui();
   return useMemo(() => {
     return columns.map((column) => {
-      const header = _(column.Header);
+      const header =
+        typeof column.Header === "function" ? column.Header : _(column.Header);
 
       return columnHelper.accessor(column.accessor, {
         id: column.accessor,

diff --git a/src/frontend/design-system/components/Table/index.tsx b/src/frontend/design-system/components/Table/index.tsx
@@ -83,7 +83,7 @@ export function Table<T extends unknown>({
         typescriptSafeObjectDotEntries(datum).map(([key, value]) => [
           key,
           // eslint-disable-next-line no-nested-ternary
-          typeof value === "object" // TODO react elements
+          typeof value === "object"
             ? JSON.stringify(value)
             : typeof value === "number"
             ? `${value}`

diff --git a/src/frontend/design-system/components/Table/types.ts b/src/frontend/design-system/components/Table/types.ts
@@ -6,10 +6,15 @@ import {
   TableFilterType,
 } from "shared/types/data";
 import { MessageDescriptor } from "@lingui/core";
+import { HeaderContext } from "@tanstack/react-table";
 import { IEmptyWrapperProps } from "../EmptyWrapper/types";
 
 export interface ITableColumn {
-  Header: MessageDescriptor;
+  Header:
+    | MessageDescriptor
+    | ((
+        headerContext: HeaderContext<Record<string, unknown>, unknown>
+      ) => ReactNode);
   accessor: string;
   disableSortBy?: boolean;
   filter?: TableFilterType;
Original file line number	Diff line number	Diff line change
Expand Up		@@ -2,3 +2,5 @@
		. "$(dirname "$0")/_/husky.sh"

		npx lint-staged
		npm run translations:extract