policies and policy on resource structure in a good place

src/components/resource-policy/SharedPolicyResourceNotice.tsx

@@ -0,0 +1,44 @@
+"use client";
+
+import { Alert, AlertDescription } from "@app/components/ui/alert";
+import { useOrgContext } from "@app/hooks/useOrgContext";
+import { useResourcePolicyContext } from "@app/providers/ResourcePolicyProvider";
+import { InfoIcon } from "lucide-react";
+import Link from "next/link";
+import { useTranslations } from "next-intl";
+
+type SharedPolicyResourceNoticeProps = {
+    section: "authentication" | "rules";
+};
+
+export function SharedPolicyResourceNotice({
+    section
+}: SharedPolicyResourceNoticeProps) {
+    const t = useTranslations();
+    const { org } = useOrgContext();
+    const { policy } = useResourcePolicyContext();
+
+    const messageKey =
+        section === "authentication"
+            ? "resourceSharedPolicyAuthenticationNotice"
+            : "resourceSharedPolicyRulesNotice";
+
+    return (
+        <Alert variant="neutral">
+            <InfoIcon className="h-4 w-4" />
+            <AlertDescription>
+                {t.rich(messageKey, {
+                    policyName: policy.name,
+                    policyLink: (chunks) => (
+                        <Link
+                            href={`/${org.org.orgId}/settings/policies/resources/public/${policy.niceId}/${section}`}
+                            className="text-primary hover:underline"
+                        >
+                            {chunks}
+                        </Link>
+                    )
+                })}
+            </AlertDescription>
+        </Alert>
+    );
+}