@windstream/react-shared-components 0.2.41 → 0.2.42

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@windstream/react-shared-components",
-  "version": "0.2.41",
+  "version": "0.2.42",
   "type": "module",
   "description": "Shared React components for Kinetic applications",
   "main": "dist/index.js",

package/src/components/link/index.test.tsx

@@ -155,14 +155,14 @@ describe("Link", () => {
       expect(el).toHaveAttribute("target", "_blank");
     });
 
-    it("adds rel=noopener noreferrer for external links", () => {
+    it("adds rel=noopener for external links", () => {
       render(
         <Link href="https://example.com" external={true}>
           External
         </Link>
       );
       const el = screen.getByText("External").closest("a");
-      expect(el).toHaveAttribute("rel", "noopener noreferrer");
+      expect(el).toHaveAttribute("rel", "noopener");
     });
 
     it("does not add target for disabled external links", () => {

package/src/components/link/index.tsx

@@ -88,7 +88,7 @@ export const Link = forwardRef<HTMLAnchorElement, LinkProps>(
       ...(external &&
         !disabled && {
           target: "_blank",
-          rel: "noopener noreferrer",
+          rel: "noopener",
         }),
       ...(disabled && {
         "aria-disabled": true,

package/src/hooks/contentful/use-contentful-rich-text.tsx

@@ -20,10 +20,66 @@ const isEmptyParagraph = (node: any): boolean =>
   Array.isArray(node?.content) &&
   node.content.every(
     (child: any) =>
-      child?.nodeType === "text" &&
-      (!child.value || child.value.trim() === "")
+      child?.nodeType === "text" && (!child.value || child.value.trim() === "")
   );
 
+// A link is "external" only when it belongs to a different app than the one
+// currently rendering this shared component (business vs. main/www are separate
+// apps). Matching is environment-agnostic so a prod link like
+// business.gokinetic.com is still "internal" while running on business-dev.
+const hostFromUrl = (value?: string): string => {
+  if (!value) return "";
+  try {
+    const withProtocol = /^https?:\/\//i.test(value)
+      ? value
+      : `https://${value}`;
+    return new URL(withProtocol).hostname.toLowerCase();
+  } catch {
+    return "";
+  }
+};
+
+// e.g. "business-dev.gokinetic.com" -> "gokinetic.com|business",
+//      "kinetic-dev.gokinetic.com" / "www.gokinetic.com" -> "gokinetic.com|main"
+const appIdentity = (host: string): string => {
+  const clean = host.toLowerCase().replace(/\.$/, "");
+  const base = clean.split(".").slice(-2).join(".");
+  const subdomain = clean
+    .slice(0, clean.length - base.length)
+    .replace(/\.$/, "");
+  const firstLabel = (subdomain.split(".")[0] || "").replace(
+    /-(dev|development|staging|stage|qa|test|uat|prod|production)$/,
+    ""
+  );
+  const app =
+    firstLabel === "" || firstLabel === "www" || firstLabel === "kinetic"
+      ? "main"
+      : firstLabel;
+  return `${base}|${app}`;
+};
+
+const getCurrentHost = (): string => {
+  const envHost =
+    hostFromUrl(process.env.NEXT_PUBLIC_SITE_URL) ||
+    hostFromUrl(process.env.NEXT_PUBLIC_MAIN_SITE_URL);
+  if (envHost) return envHost;
+  if (typeof window !== "undefined")
+    return window.location.hostname.toLowerCase();
+  return "";
+};
+
+const isExternalUrl = (url: string): boolean => {
+  if (!/^https?:\/\//i.test(url)) return false; // relative links are always internal
+  try {
+    const linkHost = new URL(url).hostname.toLowerCase();
+    const currentHost = getCurrentHost();
+    if (!currentHost) return true; // host unknown (SSR without env) → treat as external
+    return appIdentity(linkHost) !== appIdentity(currentHost);
+  } catch {
+    return false;
+  }
+};
+
 const defaultOptions: Options = {
   renderMark: {
     [MARKS.BOLD]: text => <strong className="font-black">{text}</strong>,
@@ -80,12 +136,12 @@ const defaultOptions: Options = {
 
     [INLINES.HYPERLINK]: (node, children) => {
       const url = (node as any)?.data?.uri as string;
-      const external = /^https?:\/\//.test(url);
+      const external = isExternalUrl(url);
       return (
         <a
           href={url}
           target={external ? "_blank" : undefined}
-          rel={external ? "noopener noreferrer" : undefined}
+          rel={external ? "noopener" : undefined}
         >
           {children}
         </a>
@@ -167,22 +223,26 @@ export function renderContentfulRichText(
       ...options?.renderNode,
       // Logic for links based on the isTargetBlank flag
       [BLOCKS.PARAGRAPH]: (node, children) => (
-        <div className={[className, "whitespace-pre-line"].filter(Boolean).join(" ")}>
+        <div
+          className={[className, "whitespace-pre-line"]
+            .filter(Boolean)
+            .join(" ")}
+        >
           {isEmptyParagraph(node) ? "\n" : children}
         </div>
       ),
       [INLINES.HYPERLINK]: (node, children) => {
         const url = (node as any)?.data?.uri as string;
-        const external = /^https?:\/\//.test(url);
+        const external = isExternalUrl(url);
 
-        // Priority: 1. Manual flag from Contentful, 2. Regex check for external URLs
+        // Priority: 1. Manual flag from Contentful, 2. Same-domain URLs are internal
         const shouldOpenBlank = target ?? external;
 
         return (
           <Link
             href={url}
-            target={shouldOpenBlank ? "_blank" : "_self"}
-            rel={shouldOpenBlank ? "noopener noreferrer" : undefined}
+            target={shouldOpenBlank ? "_blank" : undefined}
+            rel={shouldOpenBlank ? "noopener" : undefined}
             variant="default"
             className={linkClassName}
           >