improvements: fix doc endpoint and minor ui adjustments/permission check

docs/api-reference/endpoints/project-identities/get-by-id.mdx

@@ -1,4 +1,4 @@
 ---
-title: "Get Identity By Id"
+title: "Get Identity by ID"
 openapi: "GET /api/v1/projects/{projectId}/identities/{identityId}"
 ---

docs/api-reference/endpoints/project-identities/list-identity.mdx

@@ -1,4 +1,4 @@
 ---
-title: "List Identity"
+title: "List Identities"
-openapi: "POST /api/v1/projects/{projectId}/identities"
+openapi: "GET /api/v1/projects/{projectId}/identities"
 ---

frontend/src/components/v2/Alert/Alert.tsx

@@ -9,7 +9,7 @@ import { cva, type VariantProps } from "cva";
 import { twMerge } from "tailwind-merge";
 
 const alertVariants = cva(
-  "w-full bg-mineshaft-800 rounded-lg border border-bunker-400 px-4 py-3 text-sm flex items-center gap-x-4",
+  "w-full bg-mineshaft-800 rounded-lg border border-bunker-400 px-4 py-3 text-sm flex items-center gap-x-3",
   {
     variants: {
       variant: {
@@ -28,6 +28,7 @@ type AlertProps = {
   title?: string;
   hideTitle?: boolean;
   icon?: React.ReactNode;
+  iconClassName?: string;
 };
 
 const variantTitleMap = {
@@ -45,7 +46,11 @@ const variantIconMap = {
 const Alert = forwardRef<
   HTMLDivElement,
   React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants> & AlertProps
->(({ className, variant, title, icon, hideTitle = false, children, ...props }, ref) => {
+>(
+  (
+    { className, variant, title, icon, hideTitle = false, children, iconClassName, ...props },
+    ref
+  ) => {
     const defaultTitle = title ?? variantTitleMap[variant ?? "default"];
     return (
       <div
@@ -59,7 +64,7 @@ const Alert = forwardRef<
             <>{icon} </>
           ) : (
             <FontAwesomeIcon
-            className="text-lg text-primary"
+              className={twMerge("text-lg text-primary", iconClassName)}
               icon={variantIconMap[variant ?? "default"]}
             />
           )}
@@ -74,7 +79,8 @@ const Alert = forwardRef<
         </div>
       </div>
     );
-});
+  }
+);
 Alert.displayName = "Alert";
 
 const AlertDescription = forwardRef<

frontend/src/pages/project/IdentityDetailsByIDPage/IdentityDetailsByIDPage.tsx

@@ -8,7 +8,7 @@ import { Link, useNavigate, useParams } from "@tanstack/react-router";
 import { formatRelative } from "date-fns";
 
 import { createNotification } from "@app/components/notifications";
-import { ProjectPermissionCan } from "@app/components/permissions";
+import { OrgPermissionCan, ProjectPermissionCan } from "@app/components/permissions";
 import {
   Alert,
   AlertDescription,
@@ -20,6 +20,8 @@ import {
   Spinner
 } from "@app/components/v2";
 import {
+  OrgPermissionIdentityActions,
+  OrgPermissionSubjects,
   ProjectPermissionActions,
   ProjectPermissionIdentityActions,
   ProjectPermissionSub,
@@ -211,19 +213,28 @@ const Page = () => {
             </div>
           </PageHeader>
           {!isProjectIdentity && (
-            <Alert hideTitle className="mb-4 border-primary/50 bg-primary/10">
+            <Alert hideTitle iconClassName="text-info" className="mb-4 border-info/50 bg-info/10">
               <AlertDescription>
                 This identity is managed by your organization.{" "}
+                <OrgPermissionCan
+                  I={OrgPermissionIdentityActions.Read}
+                  an={OrgPermissionSubjects.Identity}
+                >
+                  {(isAllowed) =>
+                    isAllowed ? (
                       <Link
                         to="/organization/identities/$identityId"
                         params={{
                           identityId
                         }}
                       >
-                  <span className="cursor-pointer text-primary underline underline-offset-2">
+                        <span className="cursor-pointer text-info underline underline-offset-2">
-                    Click here to retrieve credentials.
+                          Click here to manage identity.
                         </span>
                       </Link>
+                    ) : null
+                  }
+                </OrgPermissionCan>
               </AlertDescription>
             </Alert>
           )}