Cleaning up ui

messages/en-US.json

@@ -1848,8 +1848,8 @@
     "retryAttempts": "Retry Attempts",
     "expectedResponseCodes": "Expected Response Codes",
     "expectedResponseCodesDescription": "HTTP status code that indicates healthy status. If left blank, 200-300 is considered healthy.",
-    "customHeaders": "Custom Headers",
+    "customHeaders": "Custom Request Headers",
-    "customHeadersDescription": "Headers new line separated: Header-Name: value",
+    "customHeadersDescription": "Request headers sent to the downstream targets. Headers new line separated: Header-Name: value",
     "headersValidationError": "Headers must be in the format: Header-Name: value",
     "saveHealthCheck": "Save Health Check",
     "healthCheckSaved": "Health Check Saved",

src/components/ContactSalesBanner.tsx

@@ -0,0 +1,39 @@
+"use client";
+
+import { KeyRound, ExternalLink } from "lucide-react";
+import Link from "next/link";
+
+export function ContactSalesBanner() {
+    return (
+        <div className="rounded-md border border-black-500/30 bg-linear-to-br from-black-500/10 via-background to-background overflow-hidden">
+            <div className="py-3 px-4">
+                <div className="flex items-center gap-2.5 text-sm text-muted-foreground">
+                    <KeyRound className="size-4 shrink-0 text-black-500" />
+                    <span>
+                        Contact sales to enable this feature.{" "}
+                        <Link
+                            href="https://click.fossorial.io/ep922"
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className="inline-flex items-center gap-1 font-medium text-black-600 underline"
+                        >
+                            Book a demo
+                            <ExternalLink className="size-3.5 shrink-0" />
+                        </Link>
+                        {" or "}
+                        <Link
+                            href="https://pangolin.net/contact"
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className="inline-flex items-center gap-1 font-medium text-black-600 underline"
+                        >
+                            contact us
+                            <ExternalLink className="size-3.5 shrink-0" />
+                        </Link>
+                        .
+                    </span>
+                </div>
+            </div>
+        </div>
+    );
+}

src/components/DatadogDestinationCredenza.tsx

@@ -12,8 +12,7 @@ import {
     CredenzaTitle
 } from "@app/components/Credenza";
 import { Button } from "@app/components/ui/button";
-import { Plus, X, KeyRound, ExternalLink } from "lucide-react";
+import { ContactSalesBanner } from "@app/components/ContactSalesBanner";
-import Link from "next/link";
 import { useTranslations } from "next-intl";
 
 export interface DatadogDestinationCredenzaProps {
@@ -50,36 +49,7 @@ export function DatadogDestinationCredenza({
                 </CredenzaHeader>
 
                 <CredenzaBody>
-                    <div className="rounded-md border border-black-500/30 bg-linear-to-br from-black-500/10 via-background to-background overflow-hidden">
+                    <ContactSalesBanner />
-                        <div className="py-3 px-4">
-                            <div className="flex items-center gap-2.5 text-sm text-muted-foreground">
-                                <KeyRound className="size-4 shrink-0 text-black-500" />
-                                <span>
-                                    Contact sales to enable this feature.{" "}
-                                    <Link
-                                        href="https://click.fossorial.io/ep922"
-                                        target="_blank"
-                                        rel="noopener noreferrer"
-                                        className="inline-flex items-center gap-1 font-medium text-black-600 underline"
-                                    >
-                                        Book a demo
-                                        <ExternalLink className="size-3.5 shrink-0" />
-                                    </Link>
-                                    {" or "}
-                                    <Link
-                                        href="https://pangolin.net/contact"
-                                        target="_blank"
-                                        rel="noopener noreferrer"
-                                        className="inline-flex items-center gap-1 font-medium text-black-600 underline"
-                                    >
-                                        contact us
-                                        <ExternalLink className="size-3.5 shrink-0" />
-                                    </Link>
-                                    .
-                                </span>
-                            </div>
-                        </div>
-                    </div>
                 </CredenzaBody>
 
                 <CredenzaFooter>

src/components/HealthChecksTable.tsx

@@ -150,7 +150,7 @@ export default function HealthChecksTable({
                 </Button>
             ),
             cell: ({ row }) => (
-                <span>{row.original.name}</span>
+                <span>{row.original.name ? row.original.name : "-"}</span>
             )
         },
         {

src/components/S3DestinationCredenza.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useState, useEffect } from "react";
+
 import {
     Credenza,
     CredenzaBody,
@@ -12,8 +12,7 @@ import {
     CredenzaTitle
 } from "@app/components/Credenza";
 import { Button } from "@app/components/ui/button";
-import { Plus, X, KeyRound, ExternalLink } from "lucide-react";
+import { ContactSalesBanner } from "@app/components/ContactSalesBanner";
-import Link from "next/link";
 import { useTranslations } from "next-intl";
 
 export interface S3DestinationCredenzaProps {
@@ -50,36 +49,7 @@ export function S3DestinationCredenza({
                 </CredenzaHeader>
 
                 <CredenzaBody>
-                    <div className="rounded-md border border-black-500/30 bg-linear-to-br from-black-500/10 via-background to-background overflow-hidden">
+                    <ContactSalesBanner />
-                        <div className="py-3 px-4">
-                            <div className="flex items-center gap-2.5 text-sm text-muted-foreground">
-                                <KeyRound className="size-4 shrink-0 text-black-500" />
-                                <span>
-                                    Contact sales to enable this feature.{" "}
-                                    <Link
-                                        href="https://click.fossorial.io/ep922"
-                                        target="_blank"
-                                        rel="noopener noreferrer"
-                                        className="inline-flex items-center gap-1 font-medium text-black-600 underline"
-                                    >
-                                        Book a demo
-                                        <ExternalLink className="size-3.5 shrink-0" />
-                                    </Link>
-                                    {" or "}
-                                    <Link
-                                        href="https://pangolin.net/contact"
-                                        target="_blank"
-                                        rel="noopener noreferrer"
-                                        className="inline-flex items-center gap-1 font-medium text-black-600 underline"
-                                    >
-                                        contact us
-                                        <ExternalLink className="size-3.5 shrink-0" />
-                                    </Link>
-                                    .
-                                </span>
-                            </div>
-                        </div>
-                    </div>
                 </CredenzaBody>
 
                 <CredenzaFooter>