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

frontend/src/components/basic/dialog/UpgradePlan.tsx

@@ -4,73 +4,64 @@ import { Dialog, Transition } from "@headlessui/react";
 
 import { useOrganization } from "@app/context";
 
-// REFACTOR: Move all these modals into one reusable one 
+// REFACTOR: Move all these modals into one reusable one
 type Props = {
   isOpen?: boolean;
-  onClose: ()=>void;
+  onClose: () => void;
   text: string;
-}
+};
 
-const UpgradePlanModal = ({
-  isOpen,
-  onClose,
-  text,
-}:Props) => {
+const UpgradePlanModal = ({ isOpen, onClose, text }: Props) => {
   const router = useRouter();
   const { currentOrg } = useOrganization();
 
   return (
     <div>
       <Transition appear show={isOpen} as={Fragment}>
-        <Dialog as='div' className='relative z-10' onClose={onClose}>
+        <Dialog as="div" className="relative z-10" onClose={onClose}>
           <Transition.Child
             as={Fragment}
-            enter='ease-out duration-300'
-            enterFrom='opacity-0'
-            enterTo='opacity-100'
-            leave='ease-in duration-150'
-            leaveFrom='opacity-100'
-            leaveTo='opacity-0'
+            enter="ease-out duration-300"
+            enterFrom="opacity-0"
+            enterTo="opacity-100"
+            leave="ease-in duration-150"
+            leaveFrom="opacity-100"
+            leaveTo="opacity-0"
           >
-            <div className='fixed inset-0 bg-black bg-opacity-50 drop-shadow-xl' />
+            <div className="fixed inset-0 bg-black bg-opacity-50 drop-shadow-xl" />
           </Transition.Child>
-          <div className='fixed inset-0 overflow-y-auto'>
-            <div className='flex min-h-full items-center justify-center p-4 text-center'>
+          <div className="fixed inset-0 overflow-y-auto">
+            <div className="flex min-h-full items-center justify-center p-4 text-center">
               <Transition.Child
                 as={Fragment}
-                enter='ease-out duration-300'
-                enterFrom='opacity-0 scale-95'
-                enterTo='opacity-100 scale-100'
-                leave='ease-in duration-200'
-                leaveFrom='opacity-100 scale-100'
-                leaveTo='opacity-0 scale-95'
+                enter="ease-out duration-300"
+                enterFrom="opacity-0 scale-95"
+                enterTo="opacity-100 scale-100"
+                leave="ease-in duration-200"
+                leaveFrom="opacity-100 scale-100"
+                leaveTo="opacity-0 scale-95"
               >
-                <Dialog.Panel className='w-full max-w-md transform overflow-hidden rounded-md bg-bunker border border-mineshaft-500 p-6 pt-5 text-left align-middle shadow-xl transition-all'>
-                  <Dialog.Title
-                    as='h3'
-                    className='text-xl font-medium leading-6 text-primary'
-                  >
+                <Dialog.Panel className="w-full max-w-md transform overflow-hidden rounded-md border border-mineshaft-500 bg-bunker p-6 pt-5 text-left align-middle shadow-xl transition-all">
+                  <Dialog.Title as="h3" className="text-xl font-medium leading-6 text-primary">
                     Unleash Infisical&apos;s Full Power
                   </Dialog.Title>
-                  <div className='mt-2'>
-                    <p className='text-sm text-bunker-300 mb-1'>
-                      {text}
-                    </p>
-                    <p className='text-sm text-bunker-300'>
+                  <div className="mt-2">
+                    <p className="mb-1 text-sm text-bunker-300">{text}</p>
+                    <p className="text-sm text-bunker-300">
                       Upgrade and get access to this, as well as to other powerful enhancements.
                     </p>
                   </div>
-                  <div className='mt-4'>
+                  <div className="mt-4">
                     <button
-                      type='button'
-                      className='inline-flex justify-center rounded-md border border-transparent bg-primary opacity-80 hover:opacity-100 px-4 py-2 text-sm font-medium text-black hover:text-semibold duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2'
+                      type="button"
+                      className="hover:text-semibold inline-flex justify-center rounded-md border border-transparent bg-primary px-4 py-2 text-sm font-medium text-black opacity-80 duration-200 hover:opacity-100 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2"
                       onClick={() => router.push(`/org/${currentOrg?.id}/billing`)}
                     >
                       Upgrade Now
                     </button>
                     <button
-                      type='button'
-                      className='ml-2 inline-flex justify-center rounded-md border border-transparent bg-gray-800 px-4 py-2 text-sm font-medium text-gray-400 hover:border-red hover:text-red hover:text-semibold duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2'
+                      type="button"
+                      className="hover:text-semibold ml-2 inline-flex justify-center rounded-md border border-transparent bg-gray-800 px-4 py-2 text-sm font-medium text-gray-400 duration-200 hover:border-red hover:text-red focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2"
                       onClick={onClose}
                     >
                       Maybe Later

frontend/src/components/basic/table/ProjectUsersTable.tsx

@@ -10,7 +10,8 @@ import {
   useDeleteUserFromWorkspace,
   useGetUserWsKey,
   useUpdateUserWorkspaceRole,
-  useUploadWsKey} from "@app/hooks/api";
+  useUploadWsKey
+} from "@app/hooks/api";
 
 import { decryptAssymmetric, encryptAssymmetric } from "../../utilities/cryptography/crypto";
 import guidGenerator from "../../utilities/randomId";
@@ -64,7 +65,7 @@ const ProjectUsersTable = ({ userData, changeData, myUser, filter, isUserListLoa
 
   const handleRoleUpdate = async (index: number, e: string) => {
     await updateUserWorkspaceRoleMutateAsync({
-      membershipId: userData[index].membershipId, 
+      membershipId: userData[index].membershipId,
       role: e.toLowerCase()
     });
     createNotification({
@@ -191,11 +192,15 @@ const ProjectUsersTable = ({ userData, changeData, myUser, filter, isUserListLoa
         <UpgradePlanModal
           isOpen={isUpgradeModalOpen}
           onClose={closeUpgradeModal}
-          text={subscription.slug === null ? "You can use RBAC under an Enterprise license" : "You can use RBAC if you switch to Infisical's Team Plan."}
+          text={
+            subscription.slug === null
+              ? "You can use RBAC under an Enterprise license"
+              : "You can use RBAC if you switch to Infisical's Team Plan."
+          }
         />
       )}
       <table className="my-0.5 w-full">
-        <thead className="text-xs font-light text-gray-400 bg-mineshaft-800">
+        <thead className="bg-mineshaft-800 text-xs font-light text-gray-400">
           <tr>
             <th className="py-3.5 pl-4 text-left">NAME</th>
             <th className="py-3.5 pl-4 text-left">EMAIL</th>
@@ -213,12 +218,13 @@ const ProjectUsersTable = ({ userData, changeData, myUser, filter, isUserListLoa
           </tr>
         </thead>
         <tbody>
-          {!isUserListLoading && userData?.filter(
-            (user) =>
-              user.firstName?.toLowerCase().includes(filter) ||
-              user.lastName?.toLowerCase().includes(filter) ||
-              user.email?.toLowerCase().includes(filter)
-          ).length > 0 &&
+          {!isUserListLoading &&
+            userData?.filter(
+              (user) =>
+                user.firstName?.toLowerCase().includes(filter) ||
+                user.lastName?.toLowerCase().includes(filter) ||
+                user.email?.toLowerCase().includes(filter)
+            ).length > 0 &&
             userData
               ?.filter(
                 (user) =>
@@ -373,10 +379,18 @@ const ProjectUsersTable = ({ userData, changeData, myUser, filter, isUserListLoa
                   </td>
                 </tr>
               ))}
-              {isUserListLoading && <>
-                <tr key={guidGenerator()} className="bg-mineshaft-800 text-sm animate-pulse h-14 w-full"/>
-                <tr key={guidGenerator()} className="bg-mineshaft-800 text-sm animate-pulse h-14 w-full"/>
-              </>}
+          {isUserListLoading && (
+            <>
+              <tr
+                key={guidGenerator()}
+                className="h-14 w-full animate-pulse bg-mineshaft-800 text-sm"
+              />
+              <tr
+                key={guidGenerator()}
+                className="h-14 w-full animate-pulse bg-mineshaft-800 text-sm"
+              />
+            </>
+          )}
         </tbody>
       </table>
     </div>