feat: adds support for last logged in auth method field

frontend/src/components/organization/LastLoginSection/LastLoginSection.tsx

@@ -0,0 +1,23 @@
+import { faEnvelope } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+type Props = {
+  lastLoggedInAuthMethod: string;
+};
+
+export const LastLoginSection = ({ lastLoggedInAuthMethod }: Props) => (
+  <div className="">
+    <div className="mb-2 flex items-center gap-2 border-b border-mineshaft-600 pb-1">
+      <div className="font-medium">Last Login Details</div>
+    </div>
+    <div className="flex items-center gap-2 text-sm">
+      <div className="rounded bg-mineshaft-700 p-1 px-2">
+        <FontAwesomeIcon icon={faEnvelope} />
+      </div>
+      <div className="flex flex-col">
+        <div className="text-sm font-medium">Authentication Method</div>
+        <div className="text-sm">{lastLoggedInAuthMethod}</div>
+      </div>
+    </div>
+  </div>
+);

frontend/src/components/organization/LastLoginSection/index.tsx

@@ -0,0 +1 @@
+export { LastLoginSection } from "./LastLoginSection";

frontend/src/components/v2/Badge/Badge.tsx

@@ -1,3 +1,4 @@
+import { forwardRef } from "react";
 import { cva, VariantProps } from "cva";
 import { twMerge } from "tailwind-merge";
 
@@ -24,13 +25,16 @@ const badgeVariants = cva(
 
 export type BadgeProps = VariantProps<typeof badgeVariants> & IProps;
 
-export const Badge = ({ children, className, variant, ...props }: BadgeProps) => {
-  return (
-    <div
-      className={twMerge(badgeVariants({ variant: variant || "primary" }), className)}
-      {...props}
-    >
-      {children}
-    </div>
-  );
-};
+export const Badge = forwardRef<HTMLDivElement, BadgeProps>(
+  ({ children, className, variant, ...props }, ref) => {
+    return (
+      <div
+        className={twMerge(badgeVariants({ variant: variant || "primary" }), className)}
+        {...props}
+        ref={ref}
+      >
+        {children}
+      </div>
+    );
+  }
+);