diff --git a/.eslintignore b/.eslintignore index 3505e434..f17a0f5f 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1 +1,2 @@ **/*.generated.tsx +codegen.ts diff --git a/codegen.ts b/codegen.ts index 4e6ca5ab..08b45739 100644 --- a/codegen.ts +++ b/codegen.ts @@ -17,7 +17,7 @@ const config: CodegenConfig = { baseTypesPath: "graphql/types.ts", }, plugins: ["typescript-operations", "typescript-react-apollo"], - config: { withHooks: true, withRefetchFn: true }, + config: { withHooks: true, withRefetchFn: true, skipTypename: true }, }, "src/graphql/types.ts": { plugins: ["typescript"], diff --git a/src/components/Campaigns/CampaignAgeFilter.tsx b/src/components/Campaigns/CampaignAgeFilter.tsx index 49d691e5..2e7792a9 100644 --- a/src/components/Campaigns/CampaignAgeFilter.tsx +++ b/src/components/Campaigns/CampaignAgeFilter.tsx @@ -1,17 +1,17 @@ import { FormControlLabel, Switch, Typography } from "@mui/material"; import _ from "lodash"; import moment from "moment"; -import { Dispatch } from "react"; +import { useContext } from "react"; +import { FilterContext } from "state/context"; interface Props { - fromDate: Date | null; - onChange: Dispatch; disabled?: boolean; } -export const CampaignAgeFilter = ({ fromDate, onChange, disabled }: Props) => { +export const CampaignAgeFilter = ({ disabled }: Props) => { + const { fromDate, setFromDate } = useContext(FilterContext); const onOldCampaignToggle = (showOld: boolean) => { - onChange( + setFromDate( showOld ? null : moment().subtract(6, "month").startOf("day").toDate(), ); }; diff --git a/src/components/Campaigns/CloneCampaign.tsx b/src/components/Campaigns/CloneCampaign.tsx index 2fad2d29..1214878f 100644 --- a/src/components/Campaigns/CloneCampaign.tsx +++ b/src/components/Campaigns/CloneCampaign.tsx @@ -14,12 +14,13 @@ import { useCreateCampaignMutation, } from "graphql/campaign.generated"; import { useHistory } from "react-router-dom"; -import { useState } from "react"; -import { AdvertiserCampaignsDocument } from "graphql/advertiser.generated"; +import { useContext, useState } from "react"; +import { refetchAdvertiserCampaignsQuery } from "graphql/advertiser.generated"; import { createCampaignFromFragment } from "form/fragmentUtil"; import { useAdvertiser } from "auth/hooks/queries/useAdvertiser"; import ContentCopyIcon from "@mui/icons-material/ContentCopy"; import { useUser } from "auth/hooks/queries/useUser"; +import { FilterContext } from "state/context"; interface Props { campaignFragment?: CampaignFragment | null; @@ -28,6 +29,7 @@ interface Props { export function CloneCampaign({ campaignFragment, useChip }: Props) { const { advertiser } = useAdvertiser(); + const { fromDate } = useContext(FilterContext); const { userId } = useUser(); const history = useHistory(); const [open, setOpen] = useState(false); @@ -35,8 +37,10 @@ export function CloneCampaign({ campaignFragment, useChip }: Props) { const [copyCampaign, { loading }] = useCreateCampaignMutation({ refetchQueries: [ { - query: AdvertiserCampaignsDocument, - variables: { id: advertiser.id }, + ...refetchAdvertiserCampaignsQuery({ + id: advertiser.id, + filter: { from: fromDate }, + }), }, ], onCompleted(data) { diff --git a/src/components/EnhancedTable/renderers.tsx b/src/components/EnhancedTable/renderers.tsx index cb10af4c..161e8a5b 100644 --- a/src/components/EnhancedTable/renderers.tsx +++ b/src/components/EnhancedTable/renderers.tsx @@ -2,7 +2,7 @@ import { Box, Tooltip } from "@mui/material"; import _ from "lodash"; import { format, formatDistanceToNow, parseISO } from "date-fns"; import { CellValue } from "./EnhancedTable"; -import { ReactChild, ReactNode } from "react"; +import { ReactChild, ReactNode, useContext } from "react"; import { formatInTimeZone } from "date-fns-tz"; import enUS from "date-fns/locale/en-US"; import { @@ -10,15 +10,12 @@ import { LoadCampaignAdsDocument, useUpdateCampaignMutation, } from "graphql/campaign.generated"; -import { AdvertiserCampaignsDocument } from "graphql/advertiser.generated"; -import { - useUpdateAdMutation, - useUpdateAdSetMutation, -} from "graphql/ad-set.generated"; +import { useUpdateAdSetMutation } from "graphql/ad-set.generated"; import { OnOff } from "../Switch/OnOff"; -import { AdDetails } from "user/ads/AdList"; import { displayFromCampaignState } from "util/displayState"; import { AdSetDetails } from "user/adSet/AdSetList"; +import { FilterContext } from "state/context"; +import { refetchAdvertiserCampaignsQuery } from "graphql/advertiser.generated"; export type CellValueRenderer = (value: CellValue) => ReactNode; const ADS_DEFAULT_TIMEZONE = "America/New_York"; @@ -94,16 +91,16 @@ export function renderMonetaryAmount( } export function campaignOnOffState( - c: CampaignSummaryFragment & { fromDate: Date | null; advertiserId: string }, + c: CampaignSummaryFragment & { advertiserId: string }, ): ReactNode { + const { fromDate } = useContext(FilterContext); const [updateCampaign, { loading }] = useUpdateCampaignMutation({ refetchQueries: [ { - query: AdvertiserCampaignsDocument, - variables: { + ...refetchAdvertiserCampaignsQuery({ id: c.advertiserId, - filter: { from: c.fromDate }, - }, + filter: { from: fromDate }, + }), }, ], }); @@ -163,36 +160,3 @@ export function adSetOnOffState(c: AdSetDetails): ReactNode { /> ); } - -export function adOnOffState(c: AdDetails): ReactNode { - const [updateAd, { loading }] = useUpdateAdMutation({ - refetchQueries: [ - { - query: AdvertiserCampaignsDocument, - variables: { id: c.campaignId }, - }, - ], - }); - - return ( - { - { - updateAd({ - variables: { - updateAdInput: { - id: c.id, - state: s, - }, - }, - }); - } - }} - loading={loading} - state={c.state} - end={c.campaignEnd} - source={c.campaignSource} - type="Ad" - /> - ); -} diff --git a/src/graphql/ad-set.generated.tsx b/src/graphql/ad-set.generated.tsx index e04e0f5b..0adb3893 100644 --- a/src/graphql/ad-set.generated.tsx +++ b/src/graphql/ad-set.generated.tsx @@ -5,7 +5,6 @@ import { CreativeFragmentDoc } from "./creative.generated"; import * as Apollo from "@apollo/client"; const defaultOptions = {} as const; export type AdSetFragment = { - __typename?: "AdSet"; id: string; createdAt: any; billingType?: string | null; @@ -13,40 +12,32 @@ export type AdSetFragment = { totalMax: number; perDay: number; state: string; - execution: string; + execution?: string | null; keywords?: Array | null; keywordSimilarity?: number | null; negativeKeywords?: Array | null; bannedKeywords?: Array | null; - segments?: Array<{ - __typename?: "Segment"; - code: string; - name: string; - }> | null; - oses?: Array<{ __typename?: "OS"; code: string; name: string }> | null; + segments?: Array<{ code: string; name: string }> | null; + oses?: Array<{ code: string; name: string }> | null; conversions?: Array<{ - __typename?: "Conversion"; id: string; type: string; urlPattern: string; observationWindow: number; }> | null; ads?: Array<{ - __typename?: "Ad"; id: string; state: string; price: string; priceType: Types.ConfirmationType; creative: { - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -56,21 +47,18 @@ export type AdSetFragment = { }; export type AdFragment = { - __typename?: "Ad"; id: string; state: string; price: string; priceType: Types.ConfirmationType; creative: { - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -83,9 +71,7 @@ export type CreateAdSetMutationVariables = Types.Exact<{ }>; export type CreateAdSetMutation = { - __typename?: "Mutation"; createAdSet: { - __typename?: "AdSet"; id: string; createdAt: any; billingType?: string | null; @@ -93,40 +79,32 @@ export type CreateAdSetMutation = { totalMax: number; perDay: number; state: string; - execution: string; + execution?: string | null; keywords?: Array | null; keywordSimilarity?: number | null; negativeKeywords?: Array | null; bannedKeywords?: Array | null; - segments?: Array<{ - __typename?: "Segment"; - code: string; - name: string; - }> | null; - oses?: Array<{ __typename?: "OS"; code: string; name: string }> | null; + segments?: Array<{ code: string; name: string }> | null; + oses?: Array<{ code: string; name: string }> | null; conversions?: Array<{ - __typename?: "Conversion"; id: string; type: string; urlPattern: string; observationWindow: number; }> | null; ads?: Array<{ - __typename?: "Ad"; id: string; state: string; price: string; priceType: Types.ConfirmationType; creative: { - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -141,9 +119,7 @@ export type UpdateAdSetMutationVariables = Types.Exact<{ }>; export type UpdateAdSetMutation = { - __typename?: "Mutation"; updateAdSet: { - __typename?: "AdSet"; id: string; createdAt: any; billingType?: string | null; @@ -151,40 +127,32 @@ export type UpdateAdSetMutation = { totalMax: number; perDay: number; state: string; - execution: string; + execution?: string | null; keywords?: Array | null; keywordSimilarity?: number | null; negativeKeywords?: Array | null; bannedKeywords?: Array | null; - segments?: Array<{ - __typename?: "Segment"; - code: string; - name: string; - }> | null; - oses?: Array<{ __typename?: "OS"; code: string; name: string }> | null; + segments?: Array<{ code: string; name: string }> | null; + oses?: Array<{ code: string; name: string }> | null; conversions?: Array<{ - __typename?: "Conversion"; id: string; type: string; urlPattern: string; observationWindow: number; }> | null; ads?: Array<{ - __typename?: "Ad"; id: string; state: string; price: string; priceType: Types.ConfirmationType; creative: { - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -194,15 +162,6 @@ export type UpdateAdSetMutation = { }; }; -export type UpdateAdMutationVariables = Types.Exact<{ - updateAdInput: Types.UpdateAdInput; -}>; - -export type UpdateAdMutation = { - __typename?: "Mutation"; - updateCreativeInstanceState: { __typename?: "Ad"; id: string }; -}; - export const AdFragmentDoc = gql` fragment Ad on Ad { id @@ -351,50 +310,3 @@ export type UpdateAdSetMutationOptions = Apollo.BaseMutationOptions< UpdateAdSetMutation, UpdateAdSetMutationVariables >; -export const UpdateAdDocument = gql` - mutation updateAd($updateAdInput: UpdateAdInput!) { - updateCreativeInstanceState(updateAdInput: $updateAdInput) { - id - } - } -`; -export type UpdateAdMutationFn = Apollo.MutationFunction< - UpdateAdMutation, - UpdateAdMutationVariables ->; - -/** - * __useUpdateAdMutation__ - * - * To run a mutation, you first call `useUpdateAdMutation` within a React component and pass it any options that fit your needs. - * When your component renders, `useUpdateAdMutation` returns a tuple that includes: - * - A mutate function that you can call at any time to execute the mutation - * - An object with fields that represent the current status of the mutation's execution - * - * @param baseOptions options that will be passed into the mutation, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options-2; - * - * @example - * const [updateAdMutation, { data, loading, error }] = useUpdateAdMutation({ - * variables: { - * updateAdInput: // value for 'updateAdInput' - * }, - * }); - */ -export function useUpdateAdMutation( - baseOptions?: Apollo.MutationHookOptions< - UpdateAdMutation, - UpdateAdMutationVariables - >, -) { - const options = { ...defaultOptions, ...baseOptions }; - return Apollo.useMutation( - UpdateAdDocument, - options, - ); -} -export type UpdateAdMutationHookResult = ReturnType; -export type UpdateAdMutationResult = Apollo.MutationResult; -export type UpdateAdMutationOptions = Apollo.BaseMutationOptions< - UpdateAdMutation, - UpdateAdMutationVariables ->; diff --git a/src/graphql/ad-set.graphql b/src/graphql/ad-set.graphql index 4a6e6745..08143953 100644 --- a/src/graphql/ad-set.graphql +++ b/src/graphql/ad-set.graphql @@ -51,9 +51,3 @@ mutation updateAdSet($updateAdSetInput: UpdateAdSetInput!) { ...AdSet } } - -mutation updateAd($updateAdInput: UpdateAdInput!) { - updateCreativeInstanceState(updateAdInput: $updateAdInput) { - id - } -} diff --git a/src/graphql/advertiser.generated.tsx b/src/graphql/advertiser.generated.tsx index 82cde162..8e9129df 100644 --- a/src/graphql/advertiser.generated.tsx +++ b/src/graphql/advertiser.generated.tsx @@ -5,7 +5,6 @@ import { CampaignSummaryFragmentDoc } from "./campaign.generated"; import * as Apollo from "@apollo/client"; const defaultOptions = {} as const; export type AdvertiserSummaryFragment = { - __typename?: "Advertiser"; id: string; name: string; state: string; @@ -17,7 +16,6 @@ export type AdvertiserSummaryFragment = { }; export type AdvertiserFragment = { - __typename?: "Advertiser"; referrer?: string | null; phone?: string | null; selfServiceEdit: boolean; @@ -32,7 +30,6 @@ export type AdvertiserFragment = { modifiedAt: any; publicKey?: string | null; mailingAddress: { - __typename?: "Address"; street1: string; street2?: string | null; city: string; @@ -47,12 +44,7 @@ export type AdvertiserQueryVariables = Types.Exact<{ }>; export type AdvertiserQuery = { - __typename?: "Query"; - advertiser?: { - __typename?: "Advertiser"; - id: string; - publicKey?: string | null; - } | null; + advertiser?: { id: string; publicKey?: string | null } | null; }; export type UpdateAdvertiserMutationVariables = Types.Exact<{ @@ -60,23 +52,16 @@ export type UpdateAdvertiserMutationVariables = Types.Exact<{ }>; export type UpdateAdvertiserMutation = { - __typename?: "Mutation"; - updateAdvertiser: { - __typename?: "Advertiser"; - id: string; - publicKey?: string | null; - }; + updateAdvertiser: { id: string; publicKey?: string | null }; }; export type AdvertiserCampaignsFragment = { - __typename?: "Advertiser"; id: string; name: string; selfServiceEdit: boolean; selfServiceCreate: boolean; selfServiceSetPrice: boolean; campaigns: Array<{ - __typename?: "Campaign"; id: string; name: string; state: string; @@ -107,16 +92,13 @@ export type AdvertiserCampaignsQueryVariables = Types.Exact<{ }>; export type AdvertiserCampaignsQuery = { - __typename?: "Query"; advertiserCampaigns?: { - __typename?: "Advertiser"; id: string; name: string; selfServiceEdit: boolean; selfServiceCreate: boolean; selfServiceSetPrice: boolean; campaigns: Array<{ - __typename?: "Campaign"; id: string; name: string; state: string; diff --git a/src/graphql/analytics-overview.generated.tsx b/src/graphql/analytics-overview.generated.tsx index 4fc01ff7..b3745fd8 100644 --- a/src/graphql/analytics-overview.generated.tsx +++ b/src/graphql/analytics-overview.generated.tsx @@ -4,7 +4,6 @@ import { gql } from "@apollo/client"; import * as Apollo from "@apollo/client"; const defaultOptions = {} as const; export type EngagementFragment = { - __typename?: "Engagement"; creativeinstanceid: string; createdat: any; type: string; @@ -26,7 +25,6 @@ export type EngagementFragment = { }; export type CampaignWithEngagementsFragment = { - __typename?: "Campaign"; id: string; name: string; state: string; @@ -39,12 +37,8 @@ export type CampaignWithEngagementsFragment = { endAt: any; pacingIndex?: number | null; format: Types.CampaignFormat; - adSets: Array<{ - __typename?: "AdSet"; - conversions?: Array<{ __typename?: "Conversion"; type: string }> | null; - }>; + adSets: Array<{ conversions?: Array<{ type: string }> | null }>; engagements?: Array<{ - __typename?: "Engagement"; creativeinstanceid: string; createdat: any; type: string; @@ -71,9 +65,7 @@ export type AnalyticOverviewQueryVariables = Types.Exact<{ }>; export type AnalyticOverviewQuery = { - __typename?: "Query"; campaign?: { - __typename?: "Campaign"; id: string; name: string; state: string; @@ -86,12 +78,8 @@ export type AnalyticOverviewQuery = { endAt: any; pacingIndex?: number | null; format: Types.CampaignFormat; - adSets: Array<{ - __typename?: "AdSet"; - conversions?: Array<{ __typename?: "Conversion"; type: string }> | null; - }>; + adSets: Array<{ conversions?: Array<{ type: string }> | null }>; engagements?: Array<{ - __typename?: "Engagement"; creativeinstanceid: string; createdat: any; type: string; @@ -120,9 +108,7 @@ export type EngagementOverviewQueryVariables = Types.Exact<{ }>; export type EngagementOverviewQuery = { - __typename?: "Query"; engagementsOverview?: Array<{ - __typename?: "EngagementOverview"; date: any; click: number; view: number; diff --git a/src/graphql/campaign.generated.tsx b/src/graphql/campaign.generated.tsx index ac8bba69..d0be5d05 100644 --- a/src/graphql/campaign.generated.tsx +++ b/src/graphql/campaign.generated.tsx @@ -5,7 +5,6 @@ import { AdSetFragmentDoc } from "./ad-set.generated"; import * as Apollo from "@apollo/client"; const defaultOptions = {} as const; export type CampaignFragment = { - __typename?: "Campaign"; id: string; name: string; state: string; @@ -30,18 +29,12 @@ export type CampaignFragment = { stripePaymentId?: string | null; hasPaymentIntent?: boolean | null; dayPartings?: Array<{ - __typename?: "DayParting"; dow: string; startMinute: number; endMinute: number; }> | null; - geoTargets?: Array<{ - __typename?: "Geocode"; - code: string; - name: string; - }> | null; + geoTargets?: Array<{ code: string; name: string }> | null; adSets: Array<{ - __typename?: "AdSet"; id: string; createdAt: any; billingType?: string | null; @@ -49,40 +42,32 @@ export type CampaignFragment = { totalMax: number; perDay: number; state: string; - execution: string; + execution?: string | null; keywords?: Array | null; keywordSimilarity?: number | null; negativeKeywords?: Array | null; bannedKeywords?: Array | null; - segments?: Array<{ - __typename?: "Segment"; - code: string; - name: string; - }> | null; - oses?: Array<{ __typename?: "OS"; code: string; name: string }> | null; + segments?: Array<{ code: string; name: string }> | null; + oses?: Array<{ code: string; name: string }> | null; conversions?: Array<{ - __typename?: "Conversion"; id: string; type: string; urlPattern: string; observationWindow: number; }> | null; ads?: Array<{ - __typename?: "Ad"; id: string; state: string; price: string; priceType: Types.ConfirmationType; creative: { - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -90,11 +75,10 @@ export type CampaignFragment = { }; }> | null; }>; - advertiser: { __typename?: "Advertiser"; id: string }; + advertiser: { id: string }; }; export type CampaignSummaryFragment = { - __typename?: "Campaign"; id: string; name: string; state: string; @@ -119,7 +103,6 @@ export type CampaignSummaryFragment = { }; export type CampaignAdsFragment = { - __typename?: "Campaign"; id: string; name: string; state: string; @@ -128,9 +111,8 @@ export type CampaignAdsFragment = { source: Types.CampaignSource; currency: string; format: Types.CampaignFormat; - advertiser: { __typename?: "Advertiser"; id: string }; + advertiser: { id: string }; adSets: Array<{ - __typename?: "AdSet"; id: string; createdAt: any; billingType?: string | null; @@ -138,40 +120,32 @@ export type CampaignAdsFragment = { totalMax: number; perDay: number; state: string; - execution: string; + execution?: string | null; keywords?: Array | null; keywordSimilarity?: number | null; negativeKeywords?: Array | null; bannedKeywords?: Array | null; - segments?: Array<{ - __typename?: "Segment"; - code: string; - name: string; - }> | null; - oses?: Array<{ __typename?: "OS"; code: string; name: string }> | null; + segments?: Array<{ code: string; name: string }> | null; + oses?: Array<{ code: string; name: string }> | null; conversions?: Array<{ - __typename?: "Conversion"; id: string; type: string; urlPattern: string; observationWindow: number; }> | null; ads?: Array<{ - __typename?: "Ad"; id: string; state: string; price: string; priceType: Types.ConfirmationType; creative: { - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -186,9 +160,7 @@ export type LoadCampaignQueryVariables = Types.Exact<{ }>; export type LoadCampaignQuery = { - __typename?: "Query"; campaign?: { - __typename?: "Campaign"; id: string; name: string; state: string; @@ -213,18 +185,12 @@ export type LoadCampaignQuery = { stripePaymentId?: string | null; hasPaymentIntent?: boolean | null; dayPartings?: Array<{ - __typename?: "DayParting"; dow: string; startMinute: number; endMinute: number; }> | null; - geoTargets?: Array<{ - __typename?: "Geocode"; - code: string; - name: string; - }> | null; + geoTargets?: Array<{ code: string; name: string }> | null; adSets: Array<{ - __typename?: "AdSet"; id: string; createdAt: any; billingType?: string | null; @@ -232,40 +198,32 @@ export type LoadCampaignQuery = { totalMax: number; perDay: number; state: string; - execution: string; + execution?: string | null; keywords?: Array | null; keywordSimilarity?: number | null; negativeKeywords?: Array | null; bannedKeywords?: Array | null; - segments?: Array<{ - __typename?: "Segment"; - code: string; - name: string; - }> | null; - oses?: Array<{ __typename?: "OS"; code: string; name: string }> | null; + segments?: Array<{ code: string; name: string }> | null; + oses?: Array<{ code: string; name: string }> | null; conversions?: Array<{ - __typename?: "Conversion"; id: string; type: string; urlPattern: string; observationWindow: number; }> | null; ads?: Array<{ - __typename?: "Ad"; id: string; state: string; price: string; priceType: Types.ConfirmationType; creative: { - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -273,7 +231,7 @@ export type LoadCampaignQuery = { }; }> | null; }>; - advertiser: { __typename?: "Advertiser"; id: string }; + advertiser: { id: string }; } | null; }; @@ -282,9 +240,7 @@ export type LoadCampaignAdsQueryVariables = Types.Exact<{ }>; export type LoadCampaignAdsQuery = { - __typename?: "Query"; campaign?: { - __typename?: "Campaign"; id: string; name: string; state: string; @@ -293,9 +249,8 @@ export type LoadCampaignAdsQuery = { source: Types.CampaignSource; currency: string; format: Types.CampaignFormat; - advertiser: { __typename?: "Advertiser"; id: string }; + advertiser: { id: string }; adSets: Array<{ - __typename?: "AdSet"; id: string; createdAt: any; billingType?: string | null; @@ -303,40 +258,32 @@ export type LoadCampaignAdsQuery = { totalMax: number; perDay: number; state: string; - execution: string; + execution?: string | null; keywords?: Array | null; keywordSimilarity?: number | null; negativeKeywords?: Array | null; bannedKeywords?: Array | null; - segments?: Array<{ - __typename?: "Segment"; - code: string; - name: string; - }> | null; - oses?: Array<{ __typename?: "OS"; code: string; name: string }> | null; + segments?: Array<{ code: string; name: string }> | null; + oses?: Array<{ code: string; name: string }> | null; conversions?: Array<{ - __typename?: "Conversion"; id: string; type: string; urlPattern: string; observationWindow: number; }> | null; ads?: Array<{ - __typename?: "Ad"; id: string; state: string; price: string; priceType: Types.ConfirmationType; creative: { - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -352,12 +299,7 @@ export type CreateCampaignMutationVariables = Types.Exact<{ }>; export type CreateCampaignMutation = { - __typename?: "Mutation"; - createCampaign: { - __typename?: "Campaign"; - id: string; - paymentType: Types.PaymentType; - }; + createCampaign: { id: string; paymentType: Types.PaymentType }; }; export type UpdateCampaignMutationVariables = Types.Exact<{ @@ -365,9 +307,7 @@ export type UpdateCampaignMutationVariables = Types.Exact<{ }>; export type UpdateCampaignMutation = { - __typename?: "Mutation"; updateCampaign: { - __typename?: "Campaign"; id: string; paymentType: Types.PaymentType; stripePaymentId?: string | null; diff --git a/src/graphql/common.generated.tsx b/src/graphql/common.generated.tsx index 49be7de1..216734e0 100644 --- a/src/graphql/common.generated.tsx +++ b/src/graphql/common.generated.tsx @@ -3,42 +3,22 @@ import * as Types from "./types"; import { gql } from "@apollo/client"; import * as Apollo from "@apollo/client"; const defaultOptions = {} as const; -export type GeocodeFragment = { - __typename?: "ActiveGeocodesEntry"; - code: string; - name: string; -}; +export type GeocodeFragment = { code: string; name: string }; -export type SegmentFragment = { - __typename?: "SegmentsEntry"; - code: string; - name: string; -}; +export type SegmentFragment = { code: string; name: string }; export type ActiveGeocodesQueryVariables = Types.Exact<{ [key: string]: never; }>; export type ActiveGeocodesQuery = { - __typename?: "Query"; - activeGeocodes: { - __typename?: "ActiveGeocodesQueryDTO"; - data: Array<{ - __typename?: "ActiveGeocodesEntry"; - code: string; - name: string; - }>; - }; + activeGeocodes: { data: Array<{ code: string; name: string }> }; }; export type SegmentsQueryVariables = Types.Exact<{ [key: string]: never }>; export type SegmentsQuery = { - __typename?: "Query"; - segments: { - __typename?: "SegmentsQueryDTO"; - data: Array<{ __typename?: "SegmentsEntry"; code: string; name: string }>; - }; + segments: { data: Array<{ code: string; name: string }> }; }; export const GeocodeFragmentDoc = gql` diff --git a/src/graphql/creative.generated.tsx b/src/graphql/creative.generated.tsx index 8a4a8126..b67e1f46 100644 --- a/src/graphql/creative.generated.tsx +++ b/src/graphql/creative.generated.tsx @@ -4,15 +4,13 @@ import { gql } from "@apollo/client"; import * as Apollo from "@apollo/client"; const defaultOptions = {} as const; export type CreativeFragment = { - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -24,20 +22,16 @@ export type AdvertiserCreativesQueryVariables = Types.Exact<{ }>; export type AdvertiserCreativesQuery = { - __typename?: "Query"; advertiser?: { - __typename?: "Advertiser"; id: string; creatives: Array<{ - __typename?: "Creative"; id: string; createdAt: any; modifiedAt: any; name: string; state: string; - type: { __typename?: "CreativeType"; code: string }; + type: { code: string }; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -51,12 +45,9 @@ export type CreateNotificationCreativeMutationVariables = Types.Exact<{ }>; export type CreateNotificationCreativeMutation = { - __typename?: "Mutation"; createNotificationCreative: { - __typename?: "Creative"; id: string; payloadNotification?: { - __typename?: "NotificationPayload"; body: string; title: string; targetUrl: string; @@ -69,8 +60,7 @@ export type UpdateNotificationCreativeMutationVariables = Types.Exact<{ }>; export type UpdateNotificationCreativeMutation = { - __typename?: "Mutation"; - updateNotificationCreative: { __typename?: "Creative"; id: string }; + updateNotificationCreative: { id: string }; }; export const CreativeFragmentDoc = gql` diff --git a/src/graphql/types.ts b/src/graphql/types.ts index 810f71d6..1c2e0c05 100644 --- a/src/graphql/types.ts +++ b/src/graphql/types.ts @@ -126,7 +126,7 @@ export type CreateAdSetInput = { campaignId?: InputMaybe; channels?: InputMaybe>; conversions?: InputMaybe>; - execution: Scalars["String"]; + execution?: InputMaybe; keywordSimilarity?: InputMaybe; keywords?: InputMaybe>; name?: InputMaybe; @@ -401,7 +401,7 @@ export type UpdateAdSetInput = { bannedKeywords?: InputMaybe>; billingType?: InputMaybe; campaignId?: InputMaybe; - channels?: InputMaybe>; + channels?: InputMaybe>; conversions?: InputMaybe>; execution?: InputMaybe; id?: InputMaybe; @@ -409,6 +409,7 @@ export type UpdateAdSetInput = { keywords?: InputMaybe>; name?: InputMaybe; negativeKeywords?: InputMaybe>; + optimized?: InputMaybe; oses?: InputMaybe>; perDay?: InputMaybe; segments?: InputMaybe>; @@ -472,17 +473,13 @@ export type UpdateCampaignInput = { type?: InputMaybe; }; -export type UpdateChannelsInput = { - channelId: Scalars["String"]; -}; - export type UpdateConversionsInput = { extractExternalId?: InputMaybe; id?: InputMaybe; - observationWindow: Scalars["Float"]; + observationWindow?: InputMaybe; trailingAsteriskNotRequired?: InputMaybe; - type: Scalars["String"]; - urlPattern: Scalars["String"]; + type?: InputMaybe; + urlPattern?: InputMaybe; }; export type UpdateInPageCreativeInput = { @@ -529,7 +526,6 @@ export type UpdateOSesInput = { export type UpdateSegmentInput = { code?: InputMaybe; name?: InputMaybe; - state?: InputMaybe; }; export type UpdateUserInput = { diff --git a/src/graphql/url.generated.tsx b/src/graphql/url.generated.tsx index 52c4f0db..d395c111 100644 --- a/src/graphql/url.generated.tsx +++ b/src/graphql/url.generated.tsx @@ -8,18 +8,11 @@ export type ValidateTargetUrlQueryVariables = Types.Exact<{ }>; export type ValidateTargetUrlQuery = { - __typename?: "Query"; validateTargetUrl: { - __typename?: "TargetUrlValidation"; isValid: boolean; redirects: Array<{ - __typename?: "Redirect"; url: string; - violations: Array<{ - __typename?: "ValidationDetail"; - summary: string; - detail: string; - }>; + violations: Array<{ summary: string; detail: string }>; }>; }; }; diff --git a/src/graphql/user.generated.tsx b/src/graphql/user.generated.tsx index 6b6cb91c..650f2578 100644 --- a/src/graphql/user.generated.tsx +++ b/src/graphql/user.generated.tsx @@ -4,7 +4,6 @@ import { gql } from "@apollo/client"; import * as Apollo from "@apollo/client"; const defaultOptions = {} as const; export type UserFragment = { - __typename?: "User"; email: string; fullName: string; id: string; @@ -16,14 +15,7 @@ export type LoadUserQueryVariables = Types.Exact<{ }>; export type LoadUserQuery = { - __typename?: "Query"; - user: { - __typename?: "User"; - email: string; - fullName: string; - id: string; - role: string; - }; + user: { email: string; fullName: string; id: string; role: string }; }; export type UpdateUserMutationVariables = Types.Exact<{ @@ -31,14 +23,7 @@ export type UpdateUserMutationVariables = Types.Exact<{ }>; export type UpdateUserMutation = { - __typename?: "Mutation"; - updateUser: { - __typename?: "User"; - email: string; - fullName: string; - id: string; - role: string; - }; + updateUser: { email: string; fullName: string; id: string; role: string }; }; export const UserFragmentDoc = gql` diff --git a/src/state/context.ts b/src/state/context.ts index 902e1e59..0c7e0b58 100644 --- a/src/state/context.ts +++ b/src/state/context.ts @@ -26,3 +26,8 @@ export const getAllDrafts = () => { return campaigns; }; + +export const FilterContext = createContext({ + fromDate: null as Date | null, + setFromDate: (_d: Date | null) => {}, +}); diff --git a/src/user/User.tsx b/src/user/User.tsx index 41ff4d2e..8896321d 100644 --- a/src/user/User.tsx +++ b/src/user/User.tsx @@ -1,4 +1,4 @@ -import { ComponentType, useMemo } from "react"; +import { ComponentType, useMemo, useState } from "react"; import { Redirect, Route, Switch } from "react-router-dom"; import { @@ -19,6 +19,8 @@ import { CampaignView } from "user/views/user/CampaignView"; import { CampaignReportView } from "user/views/user/CampaignReportView"; import { Profile } from "user/views/user/Profile"; import { IAdvertiser } from "auth/context/auth.interface"; +import moment from "moment"; +import { FilterContext } from "state/context"; const buildApolloClient = () => { const httpLink = createHttpLink({ @@ -34,59 +36,70 @@ const buildApolloClient = () => { export function User() { const client = useMemo(() => buildApolloClient(), []); + const [fromDate, setFromDate] = useState( + moment().subtract(6, "month").startOf("day").toDate(), + ); + return ( - - - - - - {/* /adsmanager */} - a.selfServiceCreate} - /> - - a.selfServiceEdit} - /> - - - - {/* /campaigns/:campaignId/analytics - */} - - - - - - - - - {/* default */} - - + + + + + + + {/* /adsmanager */} + a.selfServiceCreate} + /> + + a.selfServiceEdit} + /> + + + + {/* /campaigns/:campaignId/analytics - */} + + + + + + + + + {/* default */} + + + - + ); } diff --git a/src/user/campaignList/CampaignList.tsx b/src/user/campaignList/CampaignList.tsx index d2d4b577..d78f3307 100644 --- a/src/user/campaignList/CampaignList.tsx +++ b/src/user/campaignList/CampaignList.tsx @@ -25,14 +25,12 @@ import { CampaignSummaryFragment } from "graphql/campaign.generated"; interface Props { advertiser?: AdvertiserCampaignsFragment | null; - fromDate: Date | null; selectedCampaigns: string[]; onCampaignSelect: (c: string, insert: boolean) => void; } export function CampaignList({ advertiser, - fromDate, selectedCampaigns, onCampaignSelect, }: Props) { @@ -60,7 +58,6 @@ export function CampaignList({ extendedRenderer: (r) => campaignOnOffState({ ...r, - fromDate, advertiserId: advertiser?.id ?? "", }), sx: { width: "1px" }, diff --git a/src/user/views/adsManager/views/advanced/components/form/EditCampaign.tsx b/src/user/views/adsManager/views/advanced/components/form/EditCampaign.tsx index 632f6333..6bea4466 100644 --- a/src/user/views/adsManager/views/advanced/components/form/EditCampaign.tsx +++ b/src/user/views/adsManager/views/advanced/components/form/EditCampaign.tsx @@ -12,12 +12,16 @@ import { BaseForm } from "./components/BaseForm"; import { useAdvertiser } from "auth/hooks/queries/useAdvertiser"; import { useCreatePaymentSession } from "checkout/hooks/useCreatePaymentSession"; import { ErrorDetail } from "components/Error/ErrorDetail"; +import { refetchAdvertiserCampaignsQuery } from "graphql/advertiser.generated"; +import { useContext } from "react"; +import { FilterContext } from "state/context"; interface Params { campaignId: string; } export function EditCampaign() { + const { fromDate } = useContext(FilterContext); const { advertiser } = useAdvertiser(); const history = useHistory(); const params = useParams(); @@ -45,6 +49,14 @@ export function EditCampaign() { onError() { alert("Unable to Update Campaign."); }, + refetchQueries: [ + { + ...refetchAdvertiserCampaignsQuery({ + id: advertiser.id, + filter: { from: fromDate }, + }), + }, + ], }); if (error) { diff --git a/src/user/views/adsManager/views/advanced/components/form/NewCampaign.tsx b/src/user/views/adsManager/views/advanced/components/form/NewCampaign.tsx index d8d2ba9b..e62136fc 100644 --- a/src/user/views/adsManager/views/advanced/components/form/NewCampaign.tsx +++ b/src/user/views/adsManager/views/advanced/components/form/NewCampaign.tsx @@ -8,11 +8,12 @@ import { useCreateCampaignMutation } from "graphql/campaign.generated"; import { useHistory, useParams } from "react-router-dom"; import { BaseForm } from "./components/BaseForm"; import { PersistFormValues } from "form/PersistFormValues"; -import { DraftContext } from "state/context"; +import { DraftContext, FilterContext } from "state/context"; import { useAdvertiser } from "auth/hooks/queries/useAdvertiser"; import { useCreatePaymentSession } from "checkout/hooks/useCreatePaymentSession"; import { PaymentType } from "graphql/types"; import { useUser } from "auth/hooks/queries/useUser"; +import { refetchAdvertiserCampaignsQuery } from "graphql/advertiser.generated"; interface Params { draftId: string; @@ -20,6 +21,7 @@ interface Params { export function NewCampaign() { const history = useHistory(); + const { fromDate } = useContext(FilterContext); const params = useParams(); const { advertiser } = useAdvertiser(); const { userId } = useUser(); @@ -49,6 +51,14 @@ export function NewCampaign() { onError() { alert("Unable to create Campaign."); }, + refetchQueries: [ + { + ...refetchAdvertiserCampaignsQuery({ + id: advertiser.id, + filter: { from: fromDate }, + }), + }, + ], }); if (loading) { diff --git a/src/user/views/user/CampaignView.tsx b/src/user/views/user/CampaignView.tsx index 2c9f9774..9fea3d5d 100644 --- a/src/user/views/user/CampaignView.tsx +++ b/src/user/views/user/CampaignView.tsx @@ -1,10 +1,9 @@ import { Box, Chip, Skeleton, Stack, Tooltip, Typography } from "@mui/material"; -import { useCallback, useState } from "react"; +import { useCallback, useContext, useState } from "react"; import { useAdvertiserCampaignsQuery } from "graphql/advertiser.generated"; import { CampaignAgeFilter } from "components/Campaigns/CampaignAgeFilter"; import { CampaignList } from "user/campaignList/CampaignList"; import { ErrorDetail } from "components/Error/ErrorDetail"; -import moment from "moment/moment"; import { CardContainer } from "components/Card/CardContainer"; import MiniSideBar from "components/Drawer/MiniSideBar"; import { useLoadCampaignQuery } from "graphql/campaign.generated"; @@ -13,12 +12,11 @@ import { useAdvertiser } from "auth/hooks/queries/useAdvertiser"; import { Link as RouterLink } from "react-router-dom"; import { CloneCampaign } from "components/Campaigns/CloneCampaign"; import EditIcon from "@mui/icons-material/Edit"; +import { FilterContext } from "state/context"; export function CampaignView() { const { advertiser } = useAdvertiser(); - const [fromDateFilter, setFromDateFilter] = useState( - moment().subtract(6, "month").startOf("day").toDate(), - ); + const { fromDate } = useContext(FilterContext); const [selectedCampaigns, setSelectedCampaigns] = useState([]); const advertiserCanAction = advertiser.selfServiceCreate && advertiser.selfServiceEdit; @@ -42,9 +40,11 @@ export function CampaignView() { const { loading, data, error } = useAdvertiserCampaignsQuery({ variables: { id: advertiser.id, - filter: { from: fromDateFilter }, + filter: { from: fromDate }, }, pollInterval: 60_000, + initialFetchPolicy: "cache-and-network", + nextFetchPolicy: "cache-first", }); if (error) { @@ -70,18 +70,11 @@ export function CampaignView() { flexGrow: 1, mr: 2, }} - additionalAction={ - - } + additionalAction={} > {!loading ? ( @@ -110,7 +103,7 @@ function CampaignHeader(props: { selectedCampaigns: string[] }) { data.campaign.source === CampaignSource.SelfServe && data.campaign.format === CampaignFormat.PushNotification && data.campaign.state !== "completed"; - tooltip = isValidCampaign ? null : "Cannot clone or edit this campaign"; + tooltip = isValidCampaign ? null : "Cannot edit this campaign"; } return ( @@ -122,7 +115,9 @@ function CampaignHeader(props: { selectedCampaigns: string[] }) { }