Link to primary org only when you can see billing

src/app/[orgId]/layout.tsx

@@ -21,7 +21,6 @@ import { Layout } from "@app/components/Layout";
 import ApplyInternalRedirect from "@app/components/ApplyInternalRedirect";
 import SubscriptionViolation from "@app/components/SubscriptionViolation";
 
-
 export default async function OrgLayout(props: {
     children: React.ReactNode;
     params: Promise<{ orgId: string }>;
@@ -42,6 +41,26 @@ export default async function OrgLayout(props: {
         redirect(`/`);
     }
 
+    let orgs: ListUserOrgsResponse["orgs"] = [];
+    try {
+        const getOrgs = cache(async () =>
+            internal.get<AxiosResponse<ListUserOrgsResponse>>(
+                `/user/${user.userId}/orgs`,
+                await authCookieHeader()
+            )
+        );
+        const res = await getOrgs();
+        if (res && res.data.data.orgs) {
+            orgs = res.data.data.orgs;
+        }
+    } catch (e) {}
+
+    const primaryOrg = orgs.find((org) => org.isPrimaryOrg);
+    const canViewPrimaryBilling = Boolean(primaryOrg?.isOwner);
+    const primaryOrgBillingHref = primaryOrg
+        ? `/${primaryOrg.orgId}/settings/billing`
+        : null;
+
     let accessRes: CheckOrgUserAccessResponse | null = null;
     try {
         const checkOrgAccess = cache(() =>
@@ -58,19 +77,6 @@ export default async function OrgLayout(props: {
 
     if (!accessRes?.allowed) {
         // For non-admin users, show the member resources portal
-        let orgs: ListUserOrgsResponse["orgs"] = [];
-        try {
-            const getOrgs = cache(async () =>
-                internal.get<AxiosResponse<ListUserOrgsResponse>>(
-                    `/user/${user.userId}/orgs`,
-                    await authCookieHeader()
-                )
-            );
-            const res = await getOrgs();
-            if (res && res.data.data.orgs) {
-                orgs = res.data.data.orgs;
-            }
-        } catch (e) {}
         return (
             <UserProvider user={user}>
                 <ApplyInternalRedirect orgId={orgId} />
@@ -110,7 +116,12 @@ export default async function OrgLayout(props: {
         >
             <ApplyInternalRedirect orgId={orgId} />
             {props.children}
-            {build === "saas" && <SubscriptionViolation />}
+            {build === "saas" && (
+                <SubscriptionViolation
+                    canViewBilling={canViewPrimaryBilling}
+                    billingHref={primaryOrgBillingHref}
+                />
+            )}
 
             <SetLastOrgCookie orgId={orgId} />
         </SubscriptionStatusProvider>

src/components/SubscriptionViolation.tsx

@@ -4,20 +4,23 @@ import { Button } from "@app/components/ui/button";
 import { useSubscriptionStatusContext } from "@app/hooks/useSubscriptionStatusContext";
 import { useState } from "react";
 import Link from "next/link";
-import { useParams } from "next/navigation";
 import { useTranslations } from "next-intl";
 
-export default function SubscriptionViolation() {
+interface SubscriptionViolationProps {
+    billingHref?: string | null;
+    canViewBilling?: boolean;
+}
+
+export default function SubscriptionViolation({
+    billingHref,
+    canViewBilling = false
+}: SubscriptionViolationProps) {
     const context = useSubscriptionStatusContext();
     const [isDismissed, setIsDismissed] = useState(false);
-    const params = useParams();
-    const orgId = params?.orgId as string | undefined;
     const t = useTranslations();
 
     if (!context?.limitsExceeded || isDismissed) return null;
 
-    const billingHref = orgId ? `/${orgId}/settings/billing` : "/";
-
     return (
         <div className="fixed bottom-0 left-0 right-0 w-full bg-amber-600 text-white p-4 text-center z-50">
             <div className="flex flex-wrap justify-center items-center gap-2 sm:gap-4">
@@ -25,16 +28,18 @@ export default function SubscriptionViolation() {
                     {t("subscriptionViolationMessage")}
                 </p>
                 <div className="flex items-center gap-2">
-                    <Button
+                    {canViewBilling && billingHref && (
-                        variant="secondary"
+                        <Button
-                        size="sm"
+                            variant="secondary"
-                        className="bg-white/20 hover:bg-white/30 text-white border-0"
+                            size="sm"
-                        asChild
+                            className="bg-white/20 hover:bg-white/30 text-white border-0"
-                    >
+                            asChild
-                        <Link href={billingHref}>
+                        >
-                            {t("subscriptionViolationViewBilling")}
+                            <Link href={billingHref}>
-                        </Link>
+                                {t("subscriptionViolationViewBilling")}
-                    </Button>
+                            </Link>
+                        </Button>
+                    )}
                     <Button
                         variant="ghost"
                         size="sm"