feat(ui): create CustomLink component and refactor links to use it (#8341)

Co-authored-by: alejandrobailo <alejandrobailo94@gmail.com>

ui/components/integrations/forms/saml-config-form.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import Link from "next/link";
 import { Dispatch, SetStateAction, useEffect, useRef, useState } from "react";
 import { useFormState } from "react-dom";
 import { z } from "zod";
@@ -9,6 +8,7 @@ import { createSamlConfig, updateSamlConfig } from "@/actions/integrations";
 import { AddIcon } from "@/components/icons";
 import { useToast } from "@/components/ui";
 import { CustomButton, CustomServerInput } from "@/components/ui/custom";
+import { CustomLink } from "@/components/ui/custom/custom-link";
 import { SnippetChip } from "@/components/ui/entities";
 import { FormButtons } from "@/components/ui/form";
 import { apiBaseUrl } from "@/lib";
@@ -239,9 +239,9 @@ export const SamlConfigForm = ({
               assign the user's role. If the role does not exist, one will
               be created with minimal permissions. You can assign permissions to
               roles on the{" "}
-              <Link href="/roles">
-                <span className="underline">Roles</span>
-              </Link>{" "}
+              <CustomLink href="/roles" target="_self">
+                <span>Roles</span>
+              </CustomLink>{" "}
               page.
             </p>
           </div>