From 8826cca539c643fd4334b64fd926959b5691db20 Mon Sep 17 00:00:00 2001
From: Philip Okugbe <16838612+Philipinho@users.noreply.github.com>
Date: Fri, 7 Mar 2025 00:03:57 +0000
Subject: [PATCH] fix space translations (#826)

---
 .../public/locales/en-US/translation.json     |  8 +++++++-
 .../space/components/space-member-role.tsx    | 10 +++++++++-
 .../src/features/space/queries/space-query.ts | 19 +++++++++++++------
 .../features/space/types/space-role-data.ts   | 13 ++++++-------
 4 files changed, 35 insertions(+), 15 deletions(-)

diff --git a/apps/client/public/locales/en-US/translation.json b/apps/client/public/locales/en-US/translation.json
index d3619bc1..209280b1 100644
--- a/apps/client/public/locales/en-US/translation.json
+++ b/apps/client/public/locales/en-US/translation.json
@@ -340,5 +340,11 @@
   "Write anything. Enter \"/\" for commands": "Write anything. Enter \"/\" for commands",
   "Names do not match": "Names do not match",
   "Today, {{time}}": "Today, {{time}}",
-  "Yesterday, {{time}}": "Yesterday, {{time}}"
+  "Yesterday, {{time}}": "Yesterday, {{time}}",
+  "Space created successfully": "Space created successfully",
+  "Space updated successfully": "Space updated successfully",
+  "Space deleted successfully": "Space deleted successfully",
+  "Members added successfully": "Members added successfully",
+  "Member removed successfully": "Member removed successfully",
+  "Member role updated successfully": "Member role updated successfully"
 }
diff --git a/apps/client/src/features/space/components/space-member-role.tsx b/apps/client/src/features/space/components/space-member-role.tsx
index b6b70a47..17e2e358 100644
--- a/apps/client/src/features/space/components/space-member-role.tsx
+++ b/apps/client/src/features/space/components/space-member-role.tsx
@@ -2,6 +2,8 @@ import { IconCheck } from "@tabler/icons-react";
 import { Group, Select, SelectProps, Text } from "@mantine/core";
 import React from "react";
 import { spaceRoleData } from "@/features/space/types/space-role-data.ts";
+import { useTranslation } from "react-i18next";
+import { IRoleData } from "@/lib/types.ts";
 
 const iconProps = {
   stroke: 1.5,
@@ -38,9 +40,15 @@ export function SpaceMemberRole({
   defaultRole,
   label,
 }: SpaceMemberRoleProps) {
+  const { t } = useTranslation();
+
   return (
     <Select
-      data={spaceRoleData}
+      data={spaceRoleData.map((role: IRoleData) => ({
+        label: t(role.label),
+        value: role.value,
+        description: t(role.description),
+      }))}
       defaultValue={defaultRole}
       label={label}
       onChange={onSelect}
diff --git a/apps/client/src/features/space/queries/space-query.ts b/apps/client/src/features/space/queries/space-query.ts
index ae6641cc..28f61295 100644
--- a/apps/client/src/features/space/queries/space-query.ts
+++ b/apps/client/src/features/space/queries/space-query.ts
@@ -25,6 +25,7 @@ import {
 } from "@/features/space/services/space-service.ts";
 import { notifications } from "@mantine/notifications";
 import { IPagination, QueryParams } from "@/lib/types.ts";
+import { useTranslation } from "react-i18next";
 import { queryClient } from "@/main.tsx";
 import { getRecentChanges } from "@/features/page/services/page-service.ts";
 import { useEffect } from "react";
@@ -76,6 +77,7 @@ export const prefetchSpace = (spaceSlug: string, spaceId?: string) => {
 
 export function useCreateSpaceMutation() {
   const queryClient = useQueryClient();
+  const { t } = useTranslation();
 
   return useMutation<ISpace, Error, Partial<ISpace>>({
     mutationFn: (data) => createSpace(data),
@@ -83,7 +85,7 @@ export function useCreateSpaceMutation() {
       queryClient.invalidateQueries({
         queryKey: ["spaces"],
       });
-      notifications.show({ message: "Space created successfully" });
+      notifications.show({ message: t("Space created successfully") });
     },
     onError: (error) => {
       const errorMessage = error["response"]?.data?.message;
@@ -105,11 +107,12 @@ export function useGetSpaceBySlugQuery(
 
 export function useUpdateSpaceMutation() {
   const queryClient = useQueryClient();
+  const { t } = useTranslation();
 
   return useMutation<ISpace, Error, Partial<ISpace>>({
     mutationFn: (data) => updateSpace(data),
     onSuccess: (data, variables) => {
-      notifications.show({ message: "Space updated successfully" });
+      notifications.show({ message: t("Space updated successfully") });
 
       const space = queryClient.getQueryData([
         "space",
@@ -134,11 +137,12 @@ export function useUpdateSpaceMutation() {
 
 export function useDeleteSpaceMutation() {
   const queryClient = useQueryClient();
+  const { t } = useTranslation();
 
   return useMutation({
     mutationFn: (data: Partial<ISpace>) => deleteSpace(data.id),
     onSuccess: (data, variables) => {
-      notifications.show({ message: "Space deleted successfully" });
+      notifications.show({ message: t("Space deleted successfully") });
 
       if (variables.slug) {
         queryClient.removeQueries({
@@ -176,11 +180,12 @@ export function useSpaceMembersQuery(
 
 export function useAddSpaceMemberMutation() {
   const queryClient = useQueryClient();
+  const { t } = useTranslation();
 
   return useMutation<void, Error, IAddSpaceMember>({
     mutationFn: (data) => addSpaceMember(data),
     onSuccess: (data, variables) => {
-      notifications.show({ message: "Members added successfully" });
+      notifications.show({ message: t("Members added successfully") });
       queryClient.invalidateQueries({
         queryKey: ["spaceMembers", variables.spaceId],
       });
@@ -194,11 +199,12 @@ export function useAddSpaceMemberMutation() {
 
 export function useRemoveSpaceMemberMutation() {
   const queryClient = useQueryClient();
+  const { t } = useTranslation();
 
   return useMutation<void, Error, IRemoveSpaceMember>({
     mutationFn: (data) => removeSpaceMember(data),
     onSuccess: (data, variables) => {
-      notifications.show({ message: "Removed successfully" });
+      notifications.show({ message: t("Member removed successfully") });
       queryClient.invalidateQueries({
         queryKey: ["spaceMembers", variables.spaceId],
       });
@@ -212,11 +218,12 @@ export function useRemoveSpaceMemberMutation() {
 
 export function useChangeSpaceMemberRoleMutation() {
   const queryClient = useQueryClient();
+  const { t } = useTranslation();
 
   return useMutation<void, Error, IChangeSpaceMemberRole>({
     mutationFn: (data) => changeMemberRole(data),
     onSuccess: (data, variables) => {
-      notifications.show({ message: "Member role updated successfully" });
+      notifications.show({ message: t("Member role updated successfully") });
       // due to pagination levels, change in cache instead
       queryClient.refetchQueries({
         queryKey: ["spaceMembers", variables.spaceId],
diff --git a/apps/client/src/features/space/types/space-role-data.ts b/apps/client/src/features/space/types/space-role-data.ts
index cabcc413..fccdcdff 100644
--- a/apps/client/src/features/space/types/space-role-data.ts
+++ b/apps/client/src/features/space/types/space-role-data.ts
@@ -1,21 +1,20 @@
 import { IRoleData, SpaceRole } from "@/lib/types.ts";
-import i18n from "@/i18n.ts";
 
 export const spaceRoleData: IRoleData[] = [
   {
-    label: i18n.t("Full access"),
+    label: "Full access",
     value: SpaceRole.ADMIN,
-    description: i18n.t("Has full access to space settings and pages."),
+    description: "Has full access to space settings and pages.",
   },
   {
-    label: i18n.t("Can edit"),
+    label: "Can edit",
     value: SpaceRole.WRITER,
-    description: i18n.t("Can create and edit pages in space."),
+    description: "Can create and edit pages in space.",
   },
   {
-    label: i18n.t("Can view"),
+    label: "Can view",
     value: SpaceRole.READER,
-    description: i18n.t("Can view pages in space but not edit."),
+    description: "Can view pages in space but not edit.",
   },
 ];