fix space role translation

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"
 }

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}

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";
 
 export function useGetSpacesQuery(
   params?: QueryParams,
@@ -47,6 +48,7 @@ export function useSpaceQuery(spaceId: string): UseQueryResult<ISpace, Error> {
 
 export function useCreateSpaceMutation() {
   const queryClient = useQueryClient();
+  const { t } = useTranslation();
 
   return useMutation<ISpace, Error, Partial<ISpace>>({
     mutationFn: (data) => createSpace(data),
@@ -54,7 +56,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;
@@ -76,11 +78,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",
@@ -105,11 +108,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({
@@ -147,11 +151,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],
       });
@@ -165,11 +170,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],
       });
@@ -183,11 +189,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],

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.",
   },
 ];