diff --git a/src/user/adSet/AdSetList.tsx b/src/user/adSet/AdSetList.tsx index 2e7977b3..dfb5cf3b 100644 --- a/src/user/adSet/AdSetList.tsx +++ b/src/user/adSet/AdSetList.tsx @@ -9,6 +9,7 @@ import { StatsMetric } from "user/analytics/analyticsOverview/types"; import { AdSetFragment } from "graphql/ad-set.generated"; import { AdDetailTable } from "user/views/user/AdDetailTable"; import { displayFromCampaignState } from "util/displayState"; +import { uiLabelsForBillingType } from "util/billingType"; interface Props { loading: boolean; @@ -98,8 +99,7 @@ export function AdSetList({ campaign, loading, engagements }: Props) { }, { title: "Type", - value: (c) => - c.billingType === "cpm" ? "Impressions (CPM)" : "Clicks (CPC)", + value: (c) => uiLabelsForBillingType(c.billingType).longLabel, }, { title: "Platforms", diff --git a/src/user/library/index.test.ts b/src/user/library/index.test.ts index 873cd2bb..aad02ce5 100644 --- a/src/user/library/index.test.ts +++ b/src/user/library/index.test.ts @@ -185,4 +185,14 @@ describe("pricing logic (write)", () => { expect(inputObject.price).toEqual("9"); expect(inputObject.priceType).toEqual(ConfirmationType.Click); }); + + it("should not convert CPV to per-impression values when populating a CPV creative", () => { + const inputObject = transformCreative(creative, { + billingType: "cpv", + price: 9, + }); + + expect(inputObject.price).toEqual("9"); + expect(inputObject.priceType).toEqual(ConfirmationType.Landed); + }); }); diff --git a/src/user/library/index.ts b/src/user/library/index.ts index b8f146c8..b097fd05 100644 --- a/src/user/library/index.ts +++ b/src/user/library/index.ts @@ -88,6 +88,9 @@ export function transformCreative( if (campaign.billingType === "cpm") { price = BigNumber(campaign.price).dividedBy(1000); priceType = ConfirmationType.View; + } else if (campaign.billingType === "cpv") { + price = BigNumber(campaign.price); + priceType = ConfirmationType.Landed; } else { price = BigNumber(campaign.price); priceType = ConfirmationType.Click; diff --git a/src/user/views/adsManager/types/index.ts b/src/user/views/adsManager/types/index.ts index c248e8a6..e8670198 100644 --- a/src/user/views/adsManager/types/index.ts +++ b/src/user/views/adsManager/types/index.ts @@ -7,7 +7,7 @@ import { defaultEndDate, defaultStartDate } from "form/DateFieldHelpers"; import { MIN_PER_CAMPAIGN } from "validation/CampaignSchema"; import { IAdvertiser } from "auth/context/auth.interface"; -export type Billing = "cpm" | "cpc"; +export type Billing = "cpm" | "cpc" | "cpv"; export type CampaignForm = { draftId?: string; diff --git a/src/user/views/adsManager/views/advanced/components/campaign/fields/BudgetField.tsx b/src/user/views/adsManager/views/advanced/components/campaign/fields/BudgetField.tsx index 544ae7e4..dc7c56ba 100644 --- a/src/user/views/adsManager/views/advanced/components/campaign/fields/BudgetField.tsx +++ b/src/user/views/adsManager/views/advanced/components/campaign/fields/BudgetField.tsx @@ -8,6 +8,7 @@ import { MIN_PER_CAMPAIGN, MIN_PER_DAY } from "validation/CampaignSchema"; import { useAdvertiser } from "auth/hooks/queries/useAdvertiser"; import _ from "lodash"; import { CardContainer } from "components/Card/CardContainer"; +import { uiLabelsForBillingType } from "util/billingType"; interface Props { isEdit: boolean; @@ -94,8 +95,14 @@ export function BudgetField({ isEdit }: Props) { diff --git a/src/user/views/adsManager/views/advanced/components/review/components/CampaignReview.tsx b/src/user/views/adsManager/views/advanced/components/review/components/CampaignReview.tsx index 4fcbeab3..98d5489d 100644 --- a/src/user/views/adsManager/views/advanced/components/review/components/CampaignReview.tsx +++ b/src/user/views/adsManager/views/advanced/components/review/components/CampaignReview.tsx @@ -2,6 +2,7 @@ import { CampaignForm } from "../../../../../types"; import { FormikErrors } from "formik"; import { ReviewField } from "./ReviewField"; import { ReviewContainer } from "user/views/adsManager/views/advanced/components/review/components/ReviewContainer"; +import { uiLabelsForBillingType } from "util/billingType"; interface Props { values: CampaignForm; @@ -21,10 +22,6 @@ export function CampaignReview({ values, errors }: Props) { return new Date(date).toLocaleDateString("en-US", options); }; - const billing = (v: string) => { - return v === "cpm" ? "Impressions (CPM)" : "Clicks (CPC)"; - }; - return ( @@ -46,7 +43,7 @@ export function CampaignReview({ values, errors }: Props) { /> bt.value === billingType); + return ( + entry ?? { + value: billingType, + shortLabel: billingType.toUpperCase(), + longLabel: billingType.toUpperCase(), + } + ); +}