mirror of
https://github.com/audacity/audacity.github.io.git
synced 2026-04-20 20:20:38 -05:00
feat: support promo suppression by path
This commit is contained in:
@@ -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!",
|
||||
|
||||
@@ -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 =
|
||||
|
||||
@@ -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}
|
||||
|
||||
Reference in New Issue
Block a user