feat(infisical-pg): changed frontend api types _id to normal id

frontend/src/views/Project/MembersPage/components/MemberListTab/MemberListTab.tsx

@@ -2,7 +2,7 @@ import { useCallback, useMemo, useState } from "react";
 import { Controller, useForm } from "react-hook-form";
 import { useTranslation } from "react-i18next";
 import Link from "next/link";
-import { faMagnifyingGlass, faPlus, faUsers,faXmark } from "@fortawesome/free-solid-svg-icons";
+import { faMagnifyingGlass, faPlus, faUsers, faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
@@ -40,7 +40,8 @@ import {
   useOrganization,
   useSubscription,
   useUser,
-  useWorkspace} from "@app/context";
+  useWorkspace
+} from "@app/context";
 import { usePopUp } from "@app/hooks";
 import {
   useAddUserToWs,
@@ -50,7 +51,8 @@ import {
   useGetUserWsKey,
   useGetWorkspaceUsers,
   useUpdateUserWorkspaceRole,
-  useUploadWsKey} from "@app/hooks/api";
+  useUploadWsKey
+} from "@app/hooks/api";
 
 const addMemberFormSchema = z.object({
   orgMembershipId: z.string().trim()
@@ -67,9 +69,9 @@ export const MemberListTab = () => {
   const { currentWorkspace } = useWorkspace();
   const { user } = useUser();
 
-  const userId = user?._id || "";
-  const orgId = currentOrg?._id || "";
-  const workspaceId = currentWorkspace?._id || "";
+  const userId = user?.id || "";
+  const orgId = currentOrg?.id || "";
+  const workspaceId = currentWorkspace?.id || "";
 
   const { data: roles, isLoading: isRolesLoading } = useGetRoles({
     orgId,
@@ -79,7 +81,7 @@ export const MemberListTab = () => {
   const { data: wsKey } = useGetUserWsKey(workspaceId);
   const { data: members, isLoading: isMembersLoading } = useGetWorkspaceUsers(workspaceId);
   const { data: orgUsers } = useGetOrgUsers(orgId);
-  
+
   const [searchMemberFilter, setSearchMemberFilter] = useState("");
 
   const { handlePopUpToggle, popUp, handlePopUpOpen, handlePopUpClose } = usePopUp([
@@ -101,7 +103,7 @@ export const MemberListTab = () => {
   const { mutateAsync: updateUserWorkspaceRole } = useUpdateUserWorkspaceRole();
 
   const onAddMember = async ({ orgMembershipId }: TAddMemberForm) => {
-    if (!currentOrg?._id) return;
+    if (!currentOrg?.id) return;
     // TODO(akhilmhdh): Move to memory storage
     const userPrivateKey = localStorage.getItem("PRIVATE_KEY");
     if (!userPrivateKey || !wsKey) {
@@ -110,7 +112,7 @@ export const MemberListTab = () => {
       });
       return;
     }
-    const orgUser = (orgUsers || []).find(({ _id }) => _id === orgMembershipId);
+    const orgUser = (orgUsers || []).find(({ id }) => id === orgMembershipId);
     if (!orgUser) return;
 
     try {
@@ -137,7 +139,7 @@ export const MemberListTab = () => {
 
   const handleRemoveUser = async () => {
     const membershipId = (popUp?.removeMember?.data as { id: string })?.id;
-    if (!currentOrg?._id) return;
+    if (!currentOrg?.id) return;
 
     try {
       await removeUserFromWorkspace(membershipId);
@@ -156,30 +158,30 @@ export const MemberListTab = () => {
   };
 
   const isIamOwner = useMemo(
-    () => members?.find(({ user: u }) => userId === u?._id)?.role === "owner",
+    () => members?.find(({ user: u }) => userId === u?.id)?.role === "owner",
     [userId, members]
   );
 
   const findRoleFromId = useCallback(
     (roleId: string) => {
-      return (roles || []).find(({ _id: id }) => id === roleId);
+      return (roles || []).find(({ id }) => id === roleId);
     },
     [roles]
   );
 
   const onRoleChange = async (membershipId: string, role: string) => {
-    if (!currentOrg?._id) return;
+    if (!currentOrg?.id) return;
 
     try {
       const isCustomRole = !["admin", "member", "viewer"].includes(role);
-          
+
       if (isCustomRole && subscription && !subscription?.rbac) {
         handlePopUpOpen("upgradePlan", {
           description: "You can assign custom roles to members if you upgrade your Infisical plan."
         });
         return;
       }
-          
+
       await updateUserWorkspaceRole({ membershipId, role });
       createNotification({
         text: "Successfully updated user role",
@@ -215,7 +217,7 @@ export const MemberListTab = () => {
       ({ status, user: u }) => status === "accepted" && !wsUserEmails.has(u.email)
     );
   }, [orgUsers, members]);
-  
+
   const onGrantAccess = async (grantedUserId: string, publicKey: string) => {
     try {
       const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
@@ -239,7 +241,7 @@ export const MemberListTab = () => {
         userId: grantedUserId,
         nonce,
         encryptedKey: ciphertext,
-        workspaceId: currentWorkspace?._id || ""
+        workspaceId: currentWorkspace?.id || ""
       });
     } catch (err) {
       console.error(err);
@@ -254,25 +256,20 @@ export const MemberListTab = () => {
 
   return (
     <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
-      <div className="flex justify-between items-center mb-4">
-        <p className="text-xl font-semibold text-mineshaft-100">
-            Members
-        </p>
-        <ProjectPermissionCan
-            I={ProjectPermissionActions.Create} 
-            a={ProjectPermissionSub.Member}
-        >
-            {(isAllowed) => (
-                <Button
-                colorSchema="primary"
-                type="submit"
-                leftIcon={<FontAwesomeIcon icon={faPlus} />}
-                onClick={() => handlePopUpOpen("addMember")}
-                isDisabled={!isAllowed}
-                >
-                    Add Member
-                </Button>
-            )}
+      <div className="mb-4 flex items-center justify-between">
+        <p className="text-xl font-semibold text-mineshaft-100">Members</p>
+        <ProjectPermissionCan I={ProjectPermissionActions.Create} a={ProjectPermissionSub.Member}>
+          {(isAllowed) => (
+            <Button
+              colorSchema="primary"
+              type="submit"
+              leftIcon={<FontAwesomeIcon icon={faPlus} />}
+              onClick={() => handlePopUpOpen("addMember")}
+              isDisabled={!isAllowed}
+            >
+              Add Member
+            </Button>
+          )}
         </ProjectPermissionCan>
       </div>
       <Input
@@ -296,7 +293,7 @@ export const MemberListTab = () => {
               {isLoading && <TableSkeleton columns={4} innerKey="project-members" />}
               {!isLoading &&
                 filterdUsers?.map(
-                  ({ user: u, inviteEmail, _id: membershipId, status, customRole, role }) => {
+                  ({ user: u, inviteEmail, id: membershipId, status, customRole, role }) => {
                     const name = u ? `${u.firstName} ${u.lastName}` : "-";
                     const email = u?.email || inviteEmail;
 
@@ -315,7 +312,7 @@ export const MemberListTab = () => {
                                   value={
                                     role === "custom" ? findRoleFromId(customRole)?.slug : role
                                   }
-                                  isDisabled={userId === u?._id || !isAllowed}
+                                  isDisabled={userId === u?.id || !isAllowed}
                                   className="w-40 bg-mineshaft-600"
                                   dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
                                   onValueChange={(selectedRole) =>
@@ -337,7 +334,7 @@ export const MemberListTab = () => {
                                     <Button
                                       colorSchema="secondary"
                                       isDisabled={!isAllowed}
-                                      onClick={() => onGrantAccess(u?._id, u?.publicKey)}
+                                      onClick={() => onGrantAccess(u?.id, u?.publicKey)}
                                     >
                                       Grant Access
                                     </Button>
@@ -348,7 +345,7 @@ export const MemberListTab = () => {
                           </ProjectPermissionCan>
                         </Td>
                         <Td>
-                          {userId !== u?._id && (
+                          {userId !== u?.id && (
                             <ProjectPermissionCan
                               I={ProjectPermissionActions.Delete}
                               a={ProjectPermissionSub.Member}
@@ -360,7 +357,7 @@ export const MemberListTab = () => {
                                   variant="plain"
                                   ariaLabel="update"
                                   className="ml-4"
-                                  isDisabled={userId === u?._id || !isAllowed}
+                                  isDisabled={userId === u?.id || !isAllowed}
                                   onClick={() =>
                                     handlePopUpOpen("removeMember", { id: membershipId })
                                   }
@@ -405,7 +402,7 @@ export const MemberListTab = () => {
                       value={field.value}
                       onValueChange={field.onChange}
                     >
-                      {filteredOrgUsers.map(({ _id: orgUserId, user: u }) => (
+                      {filteredOrgUsers.map(({ id: orgUserId, user: u }) => (
                         <SelectItem value={orgUserId} key={`org-membership-join-${orgUserId}`}>
                           {u?.email}
                         </SelectItem>

frontend/src/views/Project/MembersPage/components/ProjectRoleListTab/components/ProjectRoleList/ProjectRoleList.tsx

@@ -38,9 +38,9 @@ export const ProjectRoleList = ({ onSelectRole }: Props) => {
   const { popUp, handlePopUpOpen, handlePopUpClose } = usePopUp(["deleteRole"] as const);
   const { currentOrg } = useOrganization();
   const { currentWorkspace } = useWorkspace();
-  const orgId = currentOrg?._id || "";
-  const workspaceId = currentWorkspace?._id || "";
-  
+  const orgId = currentOrg?.id || "";
+  const workspaceId = currentWorkspace?.id || "";
+
   const { data: roles, isLoading: isRolesLoading } = useGetRoles({
     orgId,
     workspaceId
@@ -49,7 +49,7 @@ export const ProjectRoleList = ({ onSelectRole }: Props) => {
   const { mutateAsync: deleteRole } = useDeleteRole();
 
   const handleRoleDelete = async () => {
-    const { _id: id } = popUp?.deleteRole?.data as TRole<string>;
+    const { id } = popUp?.deleteRole?.data as TRole<string>;
     try {
       await deleteRole({
         orgId,
@@ -100,7 +100,7 @@ export const ProjectRoleList = ({ onSelectRole }: Props) => {
             <TBody>
               {isRolesLoading && <TableSkeleton columns={4} innerKey="org-roles" />}
               {(roles as TRole<string>[])?.map((role) => {
-                const { _id: id, name, slug } = role;
+                const { id, name, slug } = role;
                 const isNonMutatable = ["admin", "member", "viewer", "no-access"].includes(slug);
 
                 return (
@@ -108,7 +108,7 @@ export const ProjectRoleList = ({ onSelectRole }: Props) => {
                     <Td>{name}</Td>
                     <Td>{slug}</Td>
                     <Td>
-                      <div className="flex space-x-2 justify-end">
+                      <div className="flex justify-end space-x-2">
                         <ProjectPermissionCan
                           I={ProjectPermissionActions.Edit}
                           a={ProjectPermissionSub.Role}

frontend/src/views/Project/MembersPage/components/ProjectRoleListTab/components/ProjectRoleModifySection/ProjectRoleModifySection.tsx

@@ -121,9 +121,9 @@ export const ProjectRoleModifySection = ({ role, onGoBack }: Props) => {
 
   const { createNotification } = useNotificationContext();
   const { currentOrg } = useOrganization();
-  const orgId = currentOrg?._id || "";
+  const orgId = currentOrg?.id || "";
   const { currentWorkspace } = useWorkspace();
-  const workspaceId = currentWorkspace?._id || "";
+  const workspaceId = currentWorkspace?.id || "";
 
   const {
     handleSubmit,
@@ -139,12 +139,12 @@ export const ProjectRoleModifySection = ({ role, onGoBack }: Props) => {
   const { mutateAsync: updateRole } = useUpdateRole();
 
   const handleRoleUpdate = async (el: TFormSchema) => {
-    if (!role?._id) return;
-    
+    if (!role?.id) return;
+
     try {
       await updateRole({
         orgId,
-        id: role?._id,
+        id: role?.id,
         workspaceId,
         ...el,
         permissions: formRolePermission2API(el.permissions)

frontend/src/views/Project/MembersPage/components/ServiceTokenTab/components/ServiceTokenV3Section/ServiceTokenV3Table.tsx

@@ -1,47 +1,44 @@
-import { faKey, faPencil,faXmark } from "@fortawesome/free-solid-svg-icons";
+import { faKey, faPencil, faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { format } from "date-fns";
 
 import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
 import { ProjectPermissionCan } from "@app/components/permissions";
 import {
-    EmptyState,
-    IconButton,
-    Switch,
-    Table,
-    TableContainer,
-    TableSkeleton,
-    TBody,
-    Td,
-    Th,
-    THead,
-    Tr
+  EmptyState,
+  IconButton,
+  Switch,
+  Table,
+  TableContainer,
+  TableSkeleton,
+  TBody,
+  Td,
+  Th,
+  THead,
+  Tr
 } from "@app/components/v2";
-import { ProjectPermissionActions, ProjectPermissionSub , useWorkspace } from "@app/context";
-import {
-    useGetWorkspaceServiceTokenDataV3,
-    useUpdateServiceTokenV3
-} from "@app/hooks/api";
-import { ServiceTokenV3TrustedIp } from "@app/hooks/api/serviceTokens/types"
+import { ProjectPermissionActions, ProjectPermissionSub, useWorkspace } from "@app/context";
+import { useGetWorkspaceServiceTokenDataV3, useUpdateServiceTokenV3 } from "@app/hooks/api";
+import { ServiceTokenV3TrustedIp } from "@app/hooks/api/serviceTokens/types";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
 type Props = {
-    handlePopUpOpen: (
-      popUpName: keyof UsePopUpState<["deleteServiceTokenV3", "serviceTokenV3"]>,
-      data?: {
-        serviceTokenDataId?: string;
-        name?: string;
-        role?: string;
-        customRole?: {
-            name: string;
-            slug: string;
-        };
-        trustedIps?: ServiceTokenV3TrustedIp[];
-        accessTokenTTL?: number;
-        isRefreshTokenRotationEnabled?: boolean;
-      }
-    ) => void;
-  };
+  handlePopUpOpen: (
+    popUpName: keyof UsePopUpState<["deleteServiceTokenV3", "serviceTokenV3"]>,
+    data?: {
+      serviceTokenDataId?: string;
+      name?: string;
+      role?: string;
+      customRole?: {
+        name: string;
+        slug: string;
+      };
+      trustedIps?: ServiceTokenV3TrustedIp[];
+      accessTokenTTL?: number;
+      isRefreshTokenRotationEnabled?: boolean;
+    }
+  ) => void;
+};
 
 export const ServiceTokenV3Table = ({
     handlePopUpOpen
@@ -51,30 +48,29 @@ export const ServiceTokenV3Table = ({
     const { data, isLoading } = useGetWorkspaceServiceTokenDataV3(currentWorkspace?.id || "");
     const { mutateAsync: updateMutateAsync } = useUpdateServiceTokenV3();
 
-    const handleToggleServiceTokenDataStatus = async ({
+  const handleToggleServiceTokenDataStatus = async ({
+    serviceTokenDataId,
+    isActive
+  }: {
+    serviceTokenDataId: string;
+    isActive: boolean;
+  }) => {
+    try {
+      await updateMutateAsync({
         serviceTokenDataId,
         isActive
-    }: {
-        serviceTokenDataId: string;
-        isActive: boolean;
-    }) => {
-        try {
-            await updateMutateAsync({
-                serviceTokenDataId,
-                isActive
-            });
+      });
 
-            createNotification({
-                text: `Successfully ${isActive ? "enabled" : "disabled"} service token v3`,
-                type: "success"
-              });
-        } catch (err) {
-            console.log(err);
-            createNotification({
-                text: `Failed to ${isActive ? "enable" : "disable"} service token v3`,
-                type: "error"
-            });
-        }
+      createNotification({
+        text: `Successfully ${isActive ? "enabled" : "disabled"} service token v3`,
+        type: "success"
+      });
+    } catch (err) {
+      console.log(err);
+      createNotification({
+        text: `Failed to ${isActive ? "enable" : "disable"} service token v3`,
+        type: "error"
+      });
     }
       
     return (
@@ -203,16 +199,76 @@ export const ServiceTokenV3Table = ({
                                 </Td>
                             </Tr>
                         );
-                    })}
-                    {!isLoading && data && data?.length === 0 && (
-                        <Tr>
-                            <Td colSpan={7}>
-                                <EmptyState title="No service token v3 on file" icon={faKey} />
-                            </Td>
-                        </Tr>
-                    )}
-                </TBody>
-            </Table>
-        </TableContainer>
-    );
-}
+                      })}
+                    </Td>
+                    <Td>{accessTokenTTL}</Td>
+                    <Td>{format(new Date(createdAt), "yyyy-MM-dd")}</Td>
+                    <Td>{expiresAt ? format(new Date(expiresAt), "yyyy-MM-dd") : "-"}</Td>
+                    <Td className="flex justify-end">
+                      <ProjectPermissionCan
+                        I={ProjectPermissionActions.Edit}
+                        a={ProjectPermissionSub.ServiceTokens}
+                      >
+                        {(isAllowed) => (
+                          <IconButton
+                            onClick={async () => {
+                              handlePopUpOpen("serviceTokenV3", {
+                                serviceTokenDataId: id,
+                                name,
+                                role,
+                                customRole,
+                                trustedIps,
+                                accessTokenTTL,
+                                isRefreshTokenRotationEnabled
+                              });
+                            }}
+                            size="lg"
+                            colorSchema="primary"
+                            variant="plain"
+                            ariaLabel="update"
+                            isDisabled={!isAllowed}
+                          >
+                            <FontAwesomeIcon icon={faPencil} />
+                          </IconButton>
+                        )}
+                      </ProjectPermissionCan>
+                      <ProjectPermissionCan
+                        I={ProjectPermissionActions.Delete}
+                        a={ProjectPermissionSub.ServiceTokens}
+                      >
+                        {(isAllowed) => (
+                          <IconButton
+                            onClick={() => {
+                              handlePopUpOpen("deleteServiceTokenV3", {
+                                serviceTokenDataId: id,
+                                name
+                              });
+                            }}
+                            size="lg"
+                            colorSchema="danger"
+                            variant="plain"
+                            ariaLabel="update"
+                            className="ml-4"
+                            isDisabled={!isAllowed}
+                          >
+                            <FontAwesomeIcon icon={faXmark} />
+                          </IconButton>
+                        )}
+                      </ProjectPermissionCan>
+                    </Td>
+                  </Tr>
+                );
+              }
+            )}
+          {!isLoading && data && data?.length === 0 && (
+            <Tr>
+              <Td colSpan={7}>
+                <EmptyState title="No service token v3 on file" icon={faKey} />
+              </Td>
+            </Tr>
+          )}
+        </TBody>
+      </Table>
+    </TableContainer>
+  );
+};