feat: support promo suppression by path

This commit is contained in:
Teetow
2025-10-16 14:49:39 +02:00
parent d77170bf17
commit 6a3d347202
3 changed files with 79 additions and 66 deletions

View File

@@ -2,6 +2,7 @@ export type PromoData = {
isActive?: boolean;
priority?: number;
osTargets?: string[];
suppressOnPaths?: string[];
message: string;
styles?: {
container?: string;
@@ -23,20 +24,26 @@ const promoData: Record<string, PromoData> = {
audacity4Alpha: {
isActive: true,
priority: 50,
suppressOnPaths: ["/au4", "/download"],
message: "Want a peek at our next big release?",
cta: {
text: "Try the Audacity 4 Alpha",
link: "/au4",
},
tracking: {
category: "Promo CTA",
action: "Promo CTA button",
name: "Audacity 4 Alpha",
},
styles: {
container: "bg-[#0f004d]",
message: "text-gray-100",
button: "bg-[#ff3254] hover:bg-[#ff1a3c] text-white",
}
},
},
voiceByAuribus: {
isActive: true,
priority: 0,
priority: 50,
osTargets: ["Windows", "OS X"],
message:
"AI powered professional vocals. Transform any track with Voice by Auribus!",

View File

@@ -22,6 +22,14 @@ const STATIC_PROMOS: PromoData[] = Object.values(promoData);
const isPromoActive = (promo: PromoData | null | undefined) =>
promo?.isActive ?? true;
const isSuppressedOnPath = (promo: PromoData, path: string | null) => {
if (!path) {
return false;
}
const suppressedPaths = promo.suppressOnPaths ?? [];
return suppressedPaths.includes(path);
};
const getHighestPriorityPromo = (promos: PromoData[]) =>
promos.reduce<PromoData | null>((selected, current) => {
if (!current) {
@@ -74,11 +82,13 @@ const selectWeightedPromo = (promos: PromoData[]) => {
return promos[promos.length - 1] ?? null;
};
const buildPromoList = (): PromoData[] => STATIC_PROMOS;
const buildPromoList = (path: string | null): PromoData[] =>
STATIC_PROMOS.filter((promo) => !isSuppressedOnPath(promo, path));
const PromoBanner: React.FC = () => {
const browserOS = useBrowserOS();
const promos = buildPromoList();
const pathName = typeof window !== "undefined" ? window.location.pathname : null;
const promos = buildPromoList(pathName);
const eligiblePromos = getEligiblePromos(promos, browserOS);
const fallbackPromos = promos.filter((promo) => isPromoActive(promo));
const selectionPool =

View File

@@ -74,11 +74,11 @@ const formatCampaignLinkLabel = (
</div>
</section>
<aside class="col-start-2 col-span-10 sm:col-start-8 sm:col-span-3">
<div>
<h2 class="text-sm uppercase font-normal text-gray-600">
Pre-release builds
</h2>
{hasDownloadCampaigns ? (
{hasDownloadCampaigns && (
<div>
<h2 class="text-sm uppercase font-normal text-gray-600">
Pre-release builds
</h2>
<div class="flex flex-col gap-6 mt-2">
{activeDownloadEntries.map((entry) => {
const downloads = entry.downloads;
@@ -89,66 +89,62 @@ const formatCampaignLinkLabel = (
return (
<div class="flex flex-col gap-3">
<h3 class="text-base font-semibold text-gray-900">
{versionLabel}
</h3>
<p class="text-sm text-gray-700">
{entry.summary}
</p>
<ul class="flex flex-col gap-2 text-sm">
{
windowsBuilds.map((build) => (
<li>
<a
class="hyperlink"
href={build.browser_download_url}
>
{formatCampaignLinkLabel(entry, "Windows", build.name)}
</a>
</li>
))
}
{
macBuilds.map((build) => (
<li>
<a
class="hyperlink"
href={build.browser_download_url}
>
{formatCampaignLinkLabel(entry, "macOS", build.name)}
</a>
</li>
))
}
{
linuxBuilds.map((build) => (
<li>
<a
class="hyperlink"
href={build.browser_download_url}
>
{formatCampaignLinkLabel(entry, "Linux", build.name)}
</a>
</li>
))
}
</ul>
<div class="flex items-center gap-1">
<a href={entry.pageHref} class="hyperlink text-sm">
{`Learn more about ${versionLabel}`}
</a>
<span class="align-middle icon icon-share text-blue-600"></span>
</div>
<h3 class="text-base font-semibold text-gray-900">
{versionLabel}
</h3>
<p class="text-sm text-gray-700">
{entry.summary}
</p>
<ul class="flex flex-col gap-2 text-sm">
{
windowsBuilds.map((build) => (
<li>
<a
class="hyperlink"
href={build.browser_download_url}
>
{formatCampaignLinkLabel(entry, "Windows", build.name)}
</a>
</li>
))
}
{
macBuilds.map((build) => (
<li>
<a
class="hyperlink"
href={build.browser_download_url}
>
{formatCampaignLinkLabel(entry, "macOS", build.name)}
</a>
</li>
))
}
{
linuxBuilds.map((build) => (
<li>
<a
class="hyperlink"
href={build.browser_download_url}
>
{formatCampaignLinkLabel(entry, "Linux", build.name)}
</a>
</li>
))
}
</ul>
<div class="flex items-center gap-1">
<a href={entry.pageHref} class="hyperlink text-sm">
{`Learn more about ${versionLabel}`}
</a>
<span class="align-middle icon icon-share text-blue-600"></span>
</div>
</div>
);
})}
</div>
) : (
<p class="text-sm text-gray-700 mt-2">
Pre-release downloads are currently unavailable.
</p>
)}
</div>
</div>
)}
<h2 class="text-sm uppercase font-normal text-gray-600 mt-10">
Additional resources
</h2>
@@ -179,7 +175,7 @@ const formatCampaignLinkLabel = (
<div>
<h3 class="additional-resource-heading">Source code</h3>
<div class="flex flex-col gap-2">
<!-- TODO - Ensure accordions are inclueded in the tab hierarchy -->
<!-- TODO - Ensure accordions are included in the tab hierarchy -->
{primarySourceDownload ? (
<ChecksumAccordion
title={primarySourceDownload.type}