feat: completed conditional rendering of identity for sub org

frontend/src/hooks/api/identities/types.ts

@@ -20,6 +20,7 @@ export type Identity = {
   createdAt: string;
   updatedAt: string;
   isInstanceAdmin?: boolean;
+  orgId: string;
 };
 
 export type IdentityAccessToken = {

frontend/src/pages/organization/AccessManagementPage/components/OrgIdentityTab/components/IdentitySection/IdentityModal.tsx

@@ -53,6 +53,7 @@ export const IdentityModal = ({ popUp, handlePopUpToggle }: Props) => {
   const orgId = currentOrg?.id || "";
 
   const { data: roles } = useGetOrgRoles(orgId);
+  const isOrgIdentity = orgId === popUp?.identity?.data?.orgId;
 
   const { mutateAsync: createMutateAsync } = useCreateIdentity();
   const { mutateAsync: updateMutateAsync } = useUpdateIdentity();
@@ -113,6 +114,7 @@ export const IdentityModal = ({ popUp, handlePopUpToggle }: Props) => {
         name: string;
         role: string;
         hasDeleteProtection: boolean;
+        orgId: string;
       };
 
       if (identity) {
@@ -196,16 +198,23 @@ export const IdentityModal = ({ popUp, handlePopUpToggle }: Props) => {
         title={`${popUp?.identity?.data ? "Update" : "Create"} Identity`}
       >
         <form onSubmit={handleSubmit(onFormSubmit)}>
-          <Controller
-            control={control}
-            defaultValue=""
-            name="name"
-            render={({ field, fieldState: { error } }) => (
-              <FormControl label="Name" isError={Boolean(error)} errorText={error?.message}>
-                <Input {...field} placeholder="Machine 1" />
-              </FormControl>
-            )}
-          />
+          {isOrgIdentity && (
+            <Controller
+              control={control}
+              defaultValue=""
+              name="name"
+              render={({ field, fieldState: { error } }) => (
+                <FormControl
+                  className="mb-4"
+                  label="Name"
+                  isError={Boolean(error)}
+                  errorText={error?.message}
+                >
+                  <Input {...field} placeholder="Machine 1" />
+                </FormControl>
+              )}
+            />
+          )}
           <Controller
             control={control}
             name="role"
@@ -214,7 +223,6 @@ export const IdentityModal = ({ popUp, handlePopUpToggle }: Props) => {
                 label={`${popUp?.identity?.data ? "Update" : ""} Role`}
                 errorText={error?.message}
                 isError={Boolean(error)}
-                className="mt-4"
               >
                 <FilterableSelect
                   placeholder="Select role..."
@@ -227,24 +235,26 @@ export const IdentityModal = ({ popUp, handlePopUpToggle }: Props) => {
               </FormControl>
             )}
           />
-          <Controller
-            control={control}
-            name="hasDeleteProtection"
-            render={({ field: { onChange, value }, fieldState: { error } }) => (
-              <FormControl errorText={error?.message} isError={Boolean(error)}>
-                <Switch
-                  className="mr-2 ml-0 bg-mineshaft-400/80 shadow-inner data-[state=checked]:bg-green/80"
-                  containerClassName="flex-row-reverse w-fit"
-                  id="delete-protection-enabled"
-                  thumbClassName="bg-mineshaft-800"
-                  onCheckedChange={onChange}
-                  isChecked={value}
-                >
-                  <p>Delete Protection {value ? "Enabled" : "Disabled"}</p>
-                </Switch>
-              </FormControl>
-            )}
-          />
+          {isOrgIdentity && (
+            <Controller
+              control={control}
+              name="hasDeleteProtection"
+              render={({ field: { onChange, value }, fieldState: { error } }) => (
+                <FormControl errorText={error?.message} isError={Boolean(error)}>
+                  <Switch
+                    className="mr-2 ml-0 bg-mineshaft-400/80 shadow-inner data-[state=checked]:bg-green/80"
+                    containerClassName="flex-row-reverse w-fit"
+                    id="delete-protection-enabled"
+                    thumbClassName="bg-mineshaft-800"
+                    onCheckedChange={onChange}
+                    isChecked={value}
+                  >
+                    <p>Delete Protection {value ? "Enabled" : "Disabled"}</p>
+                  </Switch>
+                </FormControl>
+              )}
+            />
+          )}
           <div>
             <FormLabel label="Metadata" />
           </div>

frontend/src/pages/organization/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx

@@ -33,6 +33,7 @@ const Page = () => {
   const orgId = currentOrg?.id || "";
   const { data } = useGetIdentityById(identityId);
   const { mutateAsync: deleteIdentity } = useDeleteIdentity();
+  const isAuthHidden = orgId !== data?.identity?.orgId;
 
   const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } = usePopUp([
     "identity",
@@ -91,10 +92,12 @@ const Page = () => {
           <div className="flex">
             <div className="mr-4 w-96">
               <IdentityDetailsSection identityId={identityId} handlePopUpOpen={handlePopUpOpen} />
-              <IdentityAuthenticationSection
-                identityId={identityId}
-                handlePopUpOpen={handlePopUpOpen}
-              />
+              {!isAuthHidden && (
+                <IdentityAuthenticationSection
+                  identityId={identityId}
+                  handlePopUpOpen={handlePopUpOpen}
+                />
+              )}
             </div>
             <IdentityProjectsSection identityId={identityId} />
           </div>

frontend/src/pages/organization/IdentityDetailsByIDPage/components/IdentityDetailsSection.tsx

@@ -28,13 +28,14 @@ import { UsePopUpState } from "@app/hooks/usePopUp";
 
 type Props = {
   identityId: string;
+  isOrgIdentity?: boolean;
   handlePopUpOpen: (
     popUpName: keyof UsePopUpState<["identity", "identityAuthMethod", "deleteIdentity"]>,
     data?: object
   ) => void;
 };
 
-export const IdentityDetailsSection = ({ identityId, handlePopUpOpen }: Props) => {
+export const IdentityDetailsSection = ({ identityId, handlePopUpOpen, isOrgIdentity }: Props) => {
   const [copyTextId, isCopyingId, setCopyTextId] = useTimedReset<string>({
     initialState: "Copy ID to clipboard"
   });
@@ -75,6 +76,7 @@ export const IdentityDetailsSection = ({ identityId, handlePopUpOpen }: Props) =
                     handlePopUpOpen("identity", {
                       identityId,
                       name: data.identity.name,
+                      orgId: data.identity.orgId,
                       hasDeleteProtection: data.identity.hasDeleteProtection,
                       role: data.role,
                       customRole: data.customRole,
@@ -140,24 +142,30 @@ export const IdentityDetailsSection = ({ identityId, handlePopUpOpen }: Props) =
           <p className="text-sm font-medium text-mineshaft-300">Name</p>
           <p className="text-sm text-mineshaft-300">{data.identity.name}</p>
         </div>
-        <div className="mb-4">
-          <p className="text-sm font-medium text-mineshaft-300">Last Login Auth Method</p>
-          <p className="text-sm text-mineshaft-300">
-            {data.lastLoginAuthMethod ? identityAuthToNameMap[data.lastLoginAuthMethod] : "-"}
-          </p>
-        </div>
-        <div className="mb-4">
-          <p className="text-sm font-medium text-mineshaft-300">Last Login Time</p>
-          <p className="text-sm text-mineshaft-300">
-            {data.lastLoginTime ? format(data.lastLoginTime, "PPpp") : "-"}
-          </p>
-        </div>
-        <div className="mb-4">
-          <p className="text-sm font-medium text-mineshaft-300">Delete Protection</p>
-          <p className="text-sm text-mineshaft-300">
-            {data.identity.hasDeleteProtection ? "On" : "Off"}
-          </p>
-        </div>
+        {isOrgIdentity && (
+          <div className="mb-4">
+            <p className="text-sm font-medium text-mineshaft-300">Last Login Auth Method</p>
+            <p className="text-sm text-mineshaft-300">
+              {data.lastLoginAuthMethod ? identityAuthToNameMap[data.lastLoginAuthMethod] : "-"}
+            </p>
+          </div>
+        )}
+        {isOrgIdentity && (
+          <div className="mb-4">
+            <p className="text-sm font-medium text-mineshaft-300">Last Login Time</p>
+            <p className="text-sm text-mineshaft-300">
+              {data.lastLoginTime ? format(data.lastLoginTime, "PPpp") : "-"}
+            </p>
+          </div>
+        )}
+        {isOrgIdentity && (
+          <div className="mb-4">
+            <p className="text-sm font-medium text-mineshaft-300">Delete Protection</p>
+            <p className="text-sm text-mineshaft-300">
+              {data.identity.hasDeleteProtection ? "On" : "Off"}
+            </p>
+          </div>
+        )}
         <div className="mb-4">
           <p className="text-sm font-medium text-mineshaft-300">Organization Role</p>
           <p className="text-sm text-mineshaft-300">{data.role}</p>