feat(pam): PAM Platform V1

frontend/src/components/projects/NewProjectModal.tsx

@@ -80,6 +80,10 @@ const PROJECT_TYPE_MENU_ITEMS = [
   {
     label: "Secret Scanning",
     value: ProjectType.SecretScanning
+  },
+  {
+    label: "PAM",
+    value: ProjectType.PAM
   }
 ];
 
@@ -193,12 +197,12 @@ const NewProjectForm = ({ onOpenChange }: NewProjectFormProps) => {
               errorText={error?.message}
               className="flex-1"
             >
-              <div className="mt-2 grid grid-cols-5 gap-4">
+              <div className="mt-2 grid grid-cols-3 gap-3">
                 {PROJECT_TYPE_MENU_ITEMS.map((el) => (
                   <div
                     key={el.value}
                     className={twMerge(
-                      "flex cursor-pointer flex-col items-center gap-2 rounded border border-mineshaft-600 p-4 opacity-75 transition-all hover:border-primary-400 hover:bg-mineshaft-600",
+                      "flex cursor-pointer flex-col items-center gap-2 rounded border border-mineshaft-600 px-2 py-4 opacity-75 transition-all hover:border-primary-400 hover:bg-mineshaft-600",
                       field.value === el.value && "border-primary-400 bg-mineshaft-600 opacity-100"
                     )}
                     onClick={() => field.onChange(el.value)}

frontend/src/components/v2/HighlightText/HighlightText.tsx

@@ -8,9 +8,24 @@ export const HighlightText = ({
   highlightClassName?: string;
 }) => {
   if (!text) return null;
+
+  const renderTextWithNewlines = (input: string, baseKeyPrefix: string = ""): React.ReactNode[] => {
+    if (!input) return [];
+    const lines = input.split("\n");
+    return lines.flatMap((line, index) => {
+      const nodes: React.ReactNode[] = [line];
+      if (index < lines.length - 1) {
+        nodes.push(<br key={`${baseKeyPrefix}-br-${line}`} />);
+      }
+      return nodes;
+    });
+  };
+
   const searchTerm = highlight.toLowerCase().trim();
 
-  if (!searchTerm) return <span>{text}</span>;
+  if (!searchTerm) {
+    return <span>{renderTextWithNewlines(text, "full-text")}</span>;
+  }
 
   const parts: React.ReactNode[] = [];
   let lastIndex = 0;
@@ -20,12 +35,17 @@ export const HighlightText = ({
 
   text.replace(regex, (match: string, offset: number) => {
     if (offset > lastIndex) {
-      parts.push(<span key={`pre-${lastIndex}`}>{text.substring(lastIndex, offset)}</span>);
+      const preMatchText = text.substring(lastIndex, offset);
+      parts.push(
+        <span key={`pre-${lastIndex}`}>
+          {renderTextWithNewlines(preMatchText, `pre-${lastIndex}`)}
+        </span>
+      );
     }
 
     parts.push(
       <span key={`match-${offset}`} className={highlightClassName || "bg-yellow/30"}>
-        {match}
+        {renderTextWithNewlines(match, `match-${offset}`)}
       </span>
     );
 
@@ -35,7 +55,12 @@ export const HighlightText = ({
   });
 
   if (lastIndex < text.length) {
-    parts.push(<span key={`post-${lastIndex}`}>{text.substring(lastIndex)}</span>);
+    const postMatchText = text.substring(lastIndex);
+    parts.push(
+      <span key={`post-${lastIndex}`}>
+        {renderTextWithNewlines(postMatchText, `post-${lastIndex}`)}
+      </span>
+    );
   }
 
   return parts;