push files left (#360) (#804)

apps/client/public/locales/en-US/translation.json

@@ -148,6 +148,7 @@
   "Select role to assign to all invited members": "Select role to assign to all invited members",
   "Select theme": "Select theme",
   "Send invitation": "Send invitation",
+  "Invitation sent": "Invitation sent",
   "Settings": "Settings",
   "Setup workspace": "Setup workspace",
   "Sign In": "Sign In",

apps/client/src/features/workspace/components/members/components/invite-action-menu.tsx

@@ -1,6 +1,6 @@
 import { Menu, ActionIcon, Text } from "@mantine/core";
 import React from "react";
-import { IconDots, IconTrash } from "@tabler/icons-react";
+import { IconCopy, IconDots, IconSend, IconTrash } from "@tabler/icons-react";
 import { modals } from "@mantine/modals";
 import {
   useResendInvitationMutation,
@@ -9,6 +9,9 @@ import {
 } from "@/features/workspace/queries/workspace-query.ts";
 import { useTranslation } from "react-i18next";
 import { notifications } from "@mantine/notifications";
+import { useClipboard } from "@mantine/hooks";
+import { getInviteLink } from "@/features/workspace/services/workspace-service.ts";
+import useUserRole from "@/hooks/use-user-role.tsx";
 
 interface Props {
   invitationId: string;
@@ -17,17 +20,21 @@ export default function InviteActionMenu({ invitationId }: Props) {
   const { t } = useTranslation();
   const resendInvitationMutation = useResendInvitationMutation();
   const revokeInvitationMutation = useRevokeInvitationMutation();
-  const { data: inviteLink, error, } = useGetInviteLink(invitationId);
+  const { isAdmin } = useUserRole();
+  const clipboard = useClipboard();
 
-  const onCopyLink = async () => {
-    if (error) {
-      notifications.show({ message: error.message, color: "red" })
-    } else {
-      navigator.clipboard.writeText(inviteLink.inviteLink)
-      notifications.show({ message: "Invite link copied to clipboard!"})
+  const handleCopyLink = async (invitationId: string) => {
+    try {
+      const link = await getInviteLink({ invitationId });
+      clipboard.copy(link.inviteLink);
+      notifications.show({ message: t("Link copied") });
+    } catch (err) {
+      notifications.show({
+        message: err["response"]?.data?.message,
+        color: "red",
+      });
     }
-  }
-
+  };
 
   const onResend = async () => {
     await resendInvitationMutation.mutateAsync({ invitationId });
@@ -70,14 +77,26 @@ export default function InviteActionMenu({ invitationId }: Props) {
         </Menu.Target>
 
         <Menu.Dropdown>
-          <Menu.Item onClick={onResend}>{t("Resend invitation")}</Menu.Item>
-          <Menu.Item onClick={onCopyLink}>Copy invite link</Menu.Item>
-          <Menu.Item onClick={onResend}>Resend invitation</Menu.Item>
+          <Menu.Item
+            onClick={() => handleCopyLink(invitationId)}
+            leftSection={<IconCopy size={16} />}
+            disabled={!isAdmin}
+          >
+            {t("Copy link")}
+          </Menu.Item>
+          <Menu.Item
+            onClick={onResend}
+            leftSection={<IconSend size={16} />}
+            disabled={!isAdmin}
+          >
+            {t("Resend invitation")}
+          </Menu.Item>
           <Menu.Divider />
           <Menu.Item
             c="red"
             onClick={openRevokeModal}
-            leftSection={<IconTrash size={16} stroke={2} />}
+            leftSection={<IconTrash size={16} />}
+            disabled={!isAdmin}
           >
             {t("Revoke invitation")}
           </Menu.Item>

apps/client/src/features/workspace/queries/workspace-query.ts

@@ -26,6 +26,7 @@ import {
   IWorkspace,
 } from "@/features/workspace/types/workspace.types.ts";
 import { IUser } from "@/features/user/types/user.types.ts";
+import { useTranslation } from "react-i18next";
 
 export function useWorkspaceQuery(): UseQueryResult<IWorkspace, Error> {
   return useQuery({
@@ -92,12 +93,13 @@ export function useGetInviteLink(
 }
 
 export function useCreateInvitationMutation() {
+  const { t } = useTranslation();
   const queryClient = useQueryClient();
 
   return useMutation<void, Error, ICreateInvite>({
     mutationFn: (data) => createInvitation(data),
     onSuccess: (data, variables) => {
-      notifications.show({ message: "Invitation sent" });
+      notifications.show({ message: t("Invitation sent") });
       queryClient.refetchQueries({
         queryKey: ["invitations"],
       });