rohit/probo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update common tracker / third party display on trackers and tracker detail pages

Browse Source 
Signed-off-by: Émile Ré <emile@probo.com>
This commit is contained in:
Émile Ré
2026-06-08 15:51:52 +02:00
parent 92a73e9302
commit 99fdccf1e8
2 changed files with 28 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
apps/console/src/pages/organizations/cookie-banners/configuration/trackers/_components/TrackerPatternPropertiesSection.tsx
View File

@@ -14,7 +14,7 @@
import { getTrackerSourceBadge, getTrackerTypeBadge, humanizeSeconds } from "@probo/helpers";
import { useTranslate } from "@probo/i18n";
import { Badge, Card, PropertyRow } from "@probo/ui";
import { Badge, Card, IconSquareBehindSquare2, PropertyRow, useToast } from "@probo/ui";
import { graphql, useFragment } from "react-relay";
import type { TrackerPatternPropertiesSection_trackerPattern$key } from "#/__generated__/core/TrackerPatternPropertiesSection_trackerPattern.graphql";
@@ -50,6 +50,7 @@ interface TrackerPatternPropertiesSectionProps {
export function TrackerPatternPropertiesSection({
trackerPatternKey,
}: TrackerPatternPropertiesSectionProps) {
const { toast } = useToast();
const { __ } = useTranslate();
const pattern = useFragment(
trackerPatternPropertiesSectionFragment,
@@ -91,6 +92,7 @@ export function TrackerPatternPropertiesSection({
: pattern.commonThirdParty
? (
<div className="flex items-center gap-2">
<Badge variant="info">{__("Common catalog")}</Badge>
<span className="text-sm">{pattern.commonThirdParty.name}</span>
</div>
)
@@ -102,20 +104,32 @@ export function TrackerPatternPropertiesSection({
</span>
</PropertyRow>
{pattern.description && (
<PropertyRow label={__("Description")}>
<span className="text-sm">{pattern.description}</span>
</PropertyRow>
<>
<PropertyRow label={__("Description")}>
<span className="text-sm">{pattern.description}</span>
</PropertyRow>
<PropertyRow label={__("Description source")}>
{pattern.commonTrackerPatternId
? (
<div className="flex items-center gap-2">
<Badge variant="info">{__("Common catalog")}</Badge>
<span className="font-mono text-xs text-txt-tertiary">{pattern.commonTrackerPatternId}</span>
<button
type="button"
className="p-1 rounded hover:bg-bg-hover transition-colors cursor-pointer"
onClick={() => {
void navigator.clipboard.writeText(pattern.commonTrackerPatternId);
toast({ title: __("Copied"), description: __("Common Tracker ID copied to clipboard"), variant: "success" });
}}
>
<IconSquareBehindSquare2 size={16} />
</button>
</div>
)
: <Badge variant="neutral">{__("Manual")}</Badge>}
</PropertyRow>
</>
)}
<PropertyRow label={__("Description source")}>
{pattern.commonTrackerPatternId
? (
<div className="flex items-center gap-2">
<Badge variant="info">{__("Common catalog")}</Badge>
<span className="font-mono text-xs text-txt-tertiary">{pattern.commonTrackerPatternId}</span>
</div>
)
: <Badge variant="neutral">{__("Manual")}</Badge>}
</PropertyRow>
<PropertyRow label={__("Excluded")}>
<span className="text-sm">{pattern.excluded ? __("Yes") : __("No")}</span>
</PropertyRow>

9
apps/console/src/pages/organizations/cookie-banners/configuration/trackers/_components/TrackerPatternRow.tsx
View File

@@ -48,7 +48,6 @@ const trackerPatternFragment = graphql`
maxAgeSeconds
excluded
lastMatchedAt
commonTrackerPatternId
cookieCategory {
id
name
@@ -288,7 +287,6 @@ export function TrackerPatternRow({ patternKey, connectionId }: TrackerPatternRo
const typeBadge = getTrackerTypeBadge(pattern.trackerType, __);
const srcBadge = pattern.source ? getTrackerSourceBadge(pattern.source, __) : null;
const commonTrackerPatternId = pattern.commonTrackerPatternId;
return (
<Tr to={pattern.id} className={pattern.excluded ? "bg-txt-quaternary opacity-80 line-through" : undefined}>
@@ -298,13 +296,6 @@ export function TrackerPatternRow({ patternKey, connectionId }: TrackerPatternRo
<Td>
<div className="flex flex-col min-w-0 max-w-xs gap-1">
<span className={pattern.excluded ? undefined : "font-medium"}>{pattern.displayName}</span>
{commonTrackerPatternId
? (
<span className="text-xs font-mono text-txt-tertiary truncate" title={commonTrackerPatternId}>
{commonTrackerPatternId}
</span>
)
: <span className="text-xs text-txt-tertiary">{__("Manual")}</span>}
{pattern.description && (
<span className="text-xs text-txt-tertiary wrap-break-word line-clamp-1">
{pattern.description}