\r\n
\r\n );\r\n};\r\n\r\nBidAdjustmentInternal.propTypes = {\r\n criterionType: PropTypes.string.isRequired,\r\n cid: PropTypes.string.isRequired,\r\n aid: PropTypes.string.isRequired,\r\n campaignId: PropTypes.string.isRequired,\r\n adGroupId: PropTypes.string.isRequired,\r\n criterionLevel: PropTypes.string,\r\n updateValidation: PropTypes.func.isRequired,\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n level: PropTypes.string,\r\n data: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\r\n ranges: PropTypes.arrayOf(PropTypes.string),\r\n readOnly: PropTypes.bool,\r\n parentData: PropTypes.arrayOf(PropTypes.shape({})),\r\n};\r\n\r\nBidAdjustmentInternal.defaultProps = {\r\n criterionLevel: 'CampaignCriterion',\r\n level: 'campaign',\r\n readOnly: false,\r\n parentData: null,\r\n ranges: undefined,\r\n};\r\n\r\nexport const ValidatedBidAdjustment = withCustomValidation(BidAdjustmentInternal);\r\n","import { identity } from 'underscore';\r\nimport { convertToAdModelInResponse } from '@bingads-webui-campaign-react/responsive-ad-editor-utils';\r\n\r\nconst convertFuncs = {\r\n Responsive: convertToAdModelInResponse,\r\n ResponsiveSearch: identity,\r\n};\r\n\r\nexport const viewModelToModelInResponseForAd = (adViewModel = { data: {} }, adType) => {\r\n const { data } = adViewModel;\r\n const convertFunc = convertFuncs[adType] || identity;\r\n return {\r\n ...adViewModel,\r\n data: convertFunc(data),\r\n };\r\n};\r\n","import { has } from 'underscore';\r\n\r\nexport const isBulkWrappedResponse = bulkResult => has(bulkResult, 'entity'); // && has(bulkResult, 'errors');\r\n","import { identity, contains, isEmpty, isEqual } from 'underscore';\r\nimport { mapBulkUpsertErrors } from './map-bulk-upsert-errors';\r\n\r\nexport const ERROR_ENTITY = {\r\n Campaign: 'campaign',\r\n AdGroup: 'adGroup',\r\n Keyword: 'keyword',\r\n ResponsiveAd: 'ResponsiveAd',\r\n ResponsiveSearchAd: 'ResponsiveSearchAd',\r\n DynamicSearchAd: 'DynamicSearchAd',\r\n CampaignConversionGoal: 'campaignConversionGoal',\r\n CampaignDayTimeCriterion: 'campaignDayTimeCriterion',\r\n AdGroupDayTimeCriterion: 'adGroupDayTimeCriterion',\r\n CampaignDeviceOSCriterion: 'campaignDeviceOSCriterion',\r\n AdGroupDeviceOSCriterion: 'adGroupDeviceOSCriterion',\r\n CampaignDisclaimerAdExtension: 'Campaign Disclaimer Ad Extension Error',\r\n CampaignGenderCriterion: 'campaignGenderCriterion',\r\n AdGroupGenderCriterion: 'adGroupGenderCriterion',\r\n CampaignAgeCriterion: 'campaignAgeCriterion',\r\n AdGroupAgeCriterion: 'adGroupAgeCriterion',\r\n CampaignCompanyNameCriterion: 'campaignCompanyNameCriterion',\r\n AdGroupCompanyNameCriterion: 'adGroupCompanyNameCriterion',\r\n CampaignIndustryCriterion: 'campaignIndustryCriterion',\r\n AdGroupIndustryCriterion: 'adGroupIndustryCriterion',\r\n CampaignJobFunctionCriterion: 'campaignJobFunctionCriterion',\r\n AdGroupJobFunctionCriterion: 'adGroupJobFunctionCriterion',\r\n AdGroupDynamicSearchAdTargetError: 'Ad Group Dynamic Search Ad Target Error',\r\n BrandListAssociation: 'brandListAssociation',\r\n CampaignLocation: 'campaignLocation',\r\n CampaignRadius: 'campaignRadius',\r\n CampaignNegativeLocation: 'campaignNegativeLocation',\r\n CampaignLocationIntent: 'campaignLocationIntent',\r\n AdGroupLocation: 'adGroupLocation',\r\n AdGroupRadius: 'adGroupRadius',\r\n AdGroupNegativeLocation: 'adGroupNegativeLocation',\r\n AdGroupLocationIntent: 'adGroupLocationIntent',\r\n};\r\n\r\nexport const serverErrorsCompare = (prev, curr) => !(!isEmpty(curr) && !isEqual(prev, curr));\r\n\r\nconst getBulkUploadEntityType = entitySchema =>\r\n (entitySchema.properties['bulk-upload-type'] || {}).value ||\r\n entitySchema.name;\r\n\r\nexport const getBulkUploadErrorType = entitySchema =>\r\n `${getBulkUploadEntityType(entitySchema)} Error`;\r\n\r\nexport const modelToViewModelForBulkErrors = (errors, bulkUpsertEntityErrorMap, scenario, i18n, activityLogger, errorProcessor = identity) =>\r\n mapBulkUpsertErrors(errors, bulkUpsertEntityErrorMap, errorProcessor, scenario, i18n, activityLogger);\r\n\r\nconst ReferencedEntityInvalidIdErrors = ['CampaignServiceInvalidCampaignId', 'CampaignServiceFutureFeatureCode', 'CampaignServiceInvalidAdGroupId'];\r\nexport const removeReferencedEntityInvalidIdErrors = bulkErrors =>\r\n bulkErrors.filter(({ Error }) => !contains(ReferencedEntityInvalidIdErrors, Error));\r\n\r\nexport const getPanelErrorProps = ({ needsAttention }) => (needsAttention ? {\r\n error: _TL_(\"* Something's wrong\"),\r\n} : {});\r\n","import { identity, result } from 'underscore';\r\nimport { getBulkApiErrors } from '@bingads-webui-campaign/api-errors';\r\n\r\nexport const mapBulkUpsertErrors = (errors, bulkUpsertEntityErrorMap, errorProcessor = identity, scenario, i18n, activityLogger) =>\r\n getBulkApiErrors(errors, scenario, i18n, activityLogger).map((error) => {\r\n const errorType = error.type;\r\n const mappedErrorType = result(bulkUpsertEntityErrorMap, errorType, errorType);\r\n // eslint-disable-next-line no-param-reassign\r\n error.type = mappedErrorType;\r\n return errorProcessor(error);\r\n });\r\n","export const GENERIC_ERROR_MESSAGE_KEY = _TL_(\"We've encountered an error and can't continue. Please contact support for further assistance.\");\r\n\r\nexport const getErrorsPlaceholders = () => ({\r\n systemErrors: [],\r\n serverErrors: [],\r\n});\r\n\r\nexport const CAMPAIGN_NEGATIVE_REFERENCE_ID = -1;\r\nexport const KEYWORDS_SHOW_COUNT = 100;\r\n","import { filter, isEmpty, pick } from 'underscore';\r\n\r\nconst whitelistedSchemaPropertyKeysForModel = [\r\n 'Id',\r\n 'Text',\r\n 'TextPart2',\r\n 'Path1',\r\n 'Path2',\r\n 'FinalUrlSuffix',\r\n 'TrackingUrlTemplate',\r\n 'UrlCustomParameters',\r\n 'Type',\r\n];\r\n\r\nexport const viewModelToModelForDSA = (adViewModel, campaignId, adGroupId) => ({\r\n ...pick(adViewModel, whitelistedSchemaPropertyKeysForModel),\r\n UrlCustomParameters: filter(adViewModel.UrlCustomParameters, ({ Key }) => !isEmpty(Key)),\r\n Campaign: { Id: campaignId },\r\n AdGroup: { Id: adGroupId },\r\n});\r\n\r\nexport const bulkModelToViewModelForDSA = ({\r\n adModel,\r\n errors,\r\n}) => ({\r\n ...pick(adModel, whitelistedSchemaPropertyKeysForModel),\r\n errors,\r\n});\r\n","import { all, extend } from 'underscore';\r\nimport { Campaign, AdGroup, DynamicSearchAd } from '@bingads-webui/campaign-odata-schemas';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport CampaignCacheManager from '@bingads-webui-campaign-legacy/cache-manager';\r\nimport { isBulkWrappedResponse } from '../shared/bulk';\r\nimport { ERROR_ENTITY, getBulkUploadErrorType, modelToViewModelForBulkErrors, removeReferencedEntityInvalidIdErrors } from '../shared/bulk-upsert-errors';\r\nimport { GENERIC_ERROR_MESSAGE_KEY } from '../shared/constants';\r\nimport { viewModelToModelForDSA, bulkModelToViewModelForDSA } from './dynamic-search-ad';\r\n\r\nconst adResource = new (edmCampaign.types.resolve('Model.DynamicSearchAd')).ResourceIdentifier();\r\n\r\nconst createOrUpdateAd = (ad) => {\r\n const createOrUpdateCall = ad && ad.Id ?\r\n adResource.bulkUpdate.bind(adResource) :\r\n adResource.bulkCreate.bind(adResource);\r\n return createOrUpdateCall(ad);\r\n};\r\n\r\nexport const deleteAd = (adId, options) => {\r\n const destroyCall = adResource.bulkDestroy.bind(adResource);\r\n return destroyCall(adId, options);\r\n};\r\n\r\nconst bulkUpsertAdEntityErrorMap = {\r\n [getBulkUploadErrorType(Campaign)]: ERROR_ENTITY.Campaign,\r\n [getBulkUploadErrorType(AdGroup)]: ERROR_ENTITY.AdGroup,\r\n [getBulkUploadErrorType(DynamicSearchAd)]: ERROR_ENTITY.DynamicSearchAd,\r\n};\r\n\r\nconst errorProcessor = error => extend({}, error, {\r\n Property: error.property,\r\n Message: error.message,\r\n Code: error.code,\r\n});\r\n\r\nexport const saveAd = ({\r\n ad: adViewModel,\r\n campaignId,\r\n adGroupId,\r\n}, {\r\n i18n,\r\n scenario,\r\n activityLogger,\r\n}) => {\r\n const adModel = viewModelToModelForDSA(adViewModel, campaignId, adGroupId);\r\n\r\n return createOrUpdateAd(adModel)\r\n // with bulk the result will have shape of:\r\n // - { ...entityData } - in case of success;\r\n // - { entity: { ...entityData }, errors: [(EditorialError|MTError)] } - in case of error(s).\r\n .then((result) => {\r\n const data = bulkModelToViewModelForDSA({\r\n adModel: result,\r\n });\r\n return { data };\r\n }, (bulkOrSystemError) => {\r\n const { entity, errors } = bulkOrSystemError;\r\n\r\n // Ignore errors if the entity was eventually created and all the errors are editorial errors\r\n if (entity && entity.Id && all(errors, error => error.Error === 'CampaignServiceEditorialValidationError')) {\r\n CampaignCacheManager.invalidate('Ad'); // Cache is not automatically invalidated since the API failed\r\n return {\r\n data: bulkModelToViewModelForDSA({\r\n adModel: entity,\r\n }),\r\n editorialErrors: errors,\r\n };\r\n }\r\n\r\n if (isBulkWrappedResponse(bulkOrSystemError)) {\r\n let filteredErrors = errors;\r\n if (entity.Id <= 0) {\r\n filteredErrors = removeReferencedEntityInvalidIdErrors(errors);\r\n }\r\n\r\n const serverErrors = modelToViewModelForBulkErrors(\r\n filteredErrors,\r\n bulkUpsertAdEntityErrorMap,\r\n scenario,\r\n i18n,\r\n activityLogger,\r\n errorProcessor\r\n );\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return {\r\n data: bulkModelToViewModelForDSA({\r\n adModel: entity,\r\n }),\r\n serverErrors,\r\n };\r\n }\r\n\r\n // Activity\r\n // eslint-disable-next-line no-console\r\n console.warn(`Campaign bulk upsert system error: ${bulkOrSystemError.stack || bulkOrSystemError.message || bulkOrSystemError}`);\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return {\r\n data: adViewModel,\r\n systemErrors: [i18n.getString(GENERIC_ERROR_MESSAGE_KEY)],\r\n };\r\n });\r\n};\r\n","import { pick } from 'underscore';\r\nimport { formatRSAObject } from '@bingads-webui-campaign-react/responsive-search-ad-editor';\r\n\r\nconst whitelistedSchemaPropertyKeysForModel = [\r\n 'Id',\r\n 'FinalUrls',\r\n 'MobileFinalUrls',\r\n 'DisplayUrl',\r\n 'Path1',\r\n 'Path2',\r\n 'Headlines',\r\n 'Descriptions',\r\n 'TrackingUrlTemplate',\r\n 'FinalUrlSuffix',\r\n 'UrlCustomParameters',\r\n 'Type',\r\n];\r\n\r\nexport const viewModelToModelForRSA = (adViewModel, campaignId, adGroupId) => ({\r\n ...pick(formatRSAObject(adViewModel), whitelistedSchemaPropertyKeysForModel),\r\n ...adViewModel.Id ? { Id: adViewModel.Id } : {},\r\n Campaign: { Id: campaignId },\r\n AdGroup: { Id: adGroupId },\r\n});\r\n\r\nexport const bulkModelToViewModelForRSA = ({\r\n adModel,\r\n errors,\r\n}) => ({\r\n ...pick(adModel, whitelistedSchemaPropertyKeysForModel),\r\n errors,\r\n});\r\n","import { all, extend } from 'underscore';\r\nimport { Campaign, AdGroup, ResponsiveSearchAd } from '@bingads-webui/campaign-odata-schemas';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport CampaignCacheManager from '@bingads-webui-campaign-legacy/cache-manager';\r\nimport { isBulkWrappedResponse } from '../shared/bulk';\r\nimport { ERROR_ENTITY, getBulkUploadErrorType, modelToViewModelForBulkErrors, removeReferencedEntityInvalidIdErrors } from '../shared/bulk-upsert-errors';\r\nimport { GENERIC_ERROR_MESSAGE_KEY } from '../shared/constants';\r\nimport { viewModelToModelForRSA, bulkModelToViewModelForRSA } from './responsive-search-ad';\r\n\r\nconst adResource = new (edmCampaign.types.resolve('Model.ResponsiveSearchAd')).ResourceIdentifier();\r\n\r\nconst createOrUpdateAd = (ad) => {\r\n const createOrUpdateCall = ad && ad.Id ?\r\n adResource.bulkUpdate.bind(adResource) :\r\n adResource.bulkCreate.bind(adResource);\r\n return createOrUpdateCall(ad);\r\n};\r\n\r\nexport const deleteAd = (adId, options) => {\r\n const destroyCall = adResource.bulkDestroy.bind(adResource);\r\n return destroyCall(adId, options);\r\n};\r\n\r\nconst bulkUpsertAdEntityErrorMap = {\r\n [getBulkUploadErrorType(Campaign)]: ERROR_ENTITY.Campaign,\r\n [getBulkUploadErrorType(AdGroup)]: ERROR_ENTITY.AdGroup,\r\n [getBulkUploadErrorType(ResponsiveSearchAd)]: ERROR_ENTITY.ResponsiveSearchAd,\r\n};\r\n\r\nconst errorProcessor = error => extend({}, error, {\r\n Property: error.property,\r\n Message: error.message,\r\n Code: error.code,\r\n});\r\n\r\nexport const saveAd = ({\r\n ad: adViewModel,\r\n campaignId,\r\n adGroupId,\r\n}, {\r\n i18n,\r\n scenario,\r\n activityLogger,\r\n}) => {\r\n const adModel = viewModelToModelForRSA(adViewModel, campaignId, adGroupId);\r\n\r\n return createOrUpdateAd(adModel)\r\n // with bulk the result will have shape of:\r\n // - { ...entityData } - in case of success;\r\n // - { entity: { ...entityData }, errors: [(EditorialError|MTError)] } - in case of error(s).\r\n .then((result) => {\r\n const data = bulkModelToViewModelForRSA({\r\n adModel: result,\r\n });\r\n return { data };\r\n }, (bulkOrSystemError) => {\r\n const { entity, errors } = bulkOrSystemError;\r\n\r\n // Ignore errors if the entity was eventually created and all the errors are editorial errors\r\n if (entity && entity.Id && all(errors, error => error.Error === 'CampaignServiceEditorialValidationError')) {\r\n CampaignCacheManager.invalidate('Ad'); // Cache is not automatically invalidated since the API failed\r\n return {\r\n data: bulkModelToViewModelForRSA({\r\n adModel: entity,\r\n }),\r\n editorialErrors: errors,\r\n };\r\n }\r\n\r\n if (isBulkWrappedResponse(bulkOrSystemError)) {\r\n let filteredErrors = errors;\r\n if (entity.Id <= 0) {\r\n filteredErrors = removeReferencedEntityInvalidIdErrors(errors);\r\n }\r\n\r\n const serverErrors = modelToViewModelForBulkErrors(\r\n filteredErrors,\r\n bulkUpsertAdEntityErrorMap,\r\n scenario,\r\n i18n,\r\n activityLogger,\r\n errorProcessor\r\n );\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return {\r\n data: bulkModelToViewModelForRSA({\r\n adModel: entity,\r\n }),\r\n serverErrors,\r\n };\r\n }\r\n\r\n // Activity\r\n // eslint-disable-next-line no-console\r\n console.warn(`Campaign bulk upsert system error: ${bulkOrSystemError.stack || bulkOrSystemError.message || bulkOrSystemError}`);\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return {\r\n data: adViewModel,\r\n systemErrors: [i18n.getString(GENERIC_ERROR_MESSAGE_KEY)],\r\n };\r\n });\r\n};\r\n","import { pick } from 'underscore';\r\nimport { processViewModelDataForSaving } from '@bingads-webui-campaign-react/responsive-ad-editor-utils';\r\n\r\nconst whitelistedSchemaPropertyKeysForModel = [\r\n 'Id',\r\n 'FinalUrls',\r\n 'MobileFinalUrls',\r\n 'Headlines',\r\n 'LongHeadlines',\r\n 'Descriptions',\r\n 'BusinessName',\r\n 'CallToAction',\r\n 'CallToActionLanguage',\r\n 'TrackingUrlTemplate',\r\n 'FinalUrlSuffix',\r\n 'UrlCustomParameters',\r\n 'Images',\r\n 'Type',\r\n];\r\n\r\nexport const viewModelToModelForMMA = (adViewModel, campaignId, adGroupId) =>\r\n processViewModelDataForSaving(\r\n pick(adViewModel, whitelistedSchemaPropertyKeysForModel),\r\n campaignId, adGroupId, adViewModel.Id\r\n );\r\n\r\nexport const bulkModelToViewModelForMMA = ({\r\n adModel,\r\n errors,\r\n}) => ({\r\n ...pick(adModel, whitelistedSchemaPropertyKeysForModel),\r\n errors,\r\n});\r\n","import { all, extend } from 'underscore';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport { Campaign, AdGroup, ResponsiveAd } from '@bingads-webui/campaign-odata-schemas';\r\nimport { ImageOData } from '@bingads-webui-campaign/image-odata';\r\nimport { ResponsiveAdRepository } from '@bingads-webui-campaign/responsive-ad-editor';\r\nimport { convertFromBulkResponse } from '@bingads-webui-campaign-react/responsive-ad-editor-utils';\r\nimport CampaignCacheManager from '@bingads-webui-campaign-legacy/cache-manager';\r\nimport config from '@bingads-webui-component-legacy/config/index';\r\nimport { isBulkWrappedResponse } from '../shared/bulk';\r\nimport { ERROR_ENTITY, getBulkUploadErrorType, modelToViewModelForBulkErrors, removeReferencedEntityInvalidIdErrors } from '../shared/bulk-upsert-errors';\r\nimport { GENERIC_ERROR_MESSAGE_KEY } from '../shared/constants';\r\nimport { viewModelToModelForMMA } from './multimedia-ad';\r\n\r\nconst bulkUpsertAdEntityErrorMap = {\r\n [getBulkUploadErrorType(Campaign)]: ERROR_ENTITY.Campaign,\r\n [getBulkUploadErrorType(AdGroup)]: ERROR_ENTITY.AdGroup,\r\n [getBulkUploadErrorType(ResponsiveAd)]: ERROR_ENTITY.ResponsiveAd,\r\n};\r\n\r\nconst adResource = new (edmCampaign.types.resolve('Model.ResponsiveAd')).ResourceIdentifier();\r\n\r\nexport const deleteAd = (adId, options) => {\r\n const destroyCall = adResource.bulkDestroy.bind(adResource);\r\n return destroyCall(adId, options);\r\n};\r\n\r\nexport const saveAd = ({\r\n ad: adViewModel,\r\n campaignId,\r\n adGroupId,\r\n cid,\r\n aid,\r\n}, {\r\n i18n,\r\n scenario,\r\n activityLogger,\r\n}) => {\r\n const adModel = viewModelToModelForMMA(adViewModel, campaignId, adGroupId);\r\n\r\n const responsiveAdRepository = new ResponsiveAdRepository({\r\n viewContext: {\r\n currentCampaign: {\r\n Id: campaignId,\r\n },\r\n currentAdGroup: {\r\n Id: adGroupId,\r\n },\r\n },\r\n isVideo: false,\r\n campaignDomain: '',\r\n });\r\n const oDataConfig = {\r\n odataRootUrl: config.get('CampaignAzureDomain'),\r\n odataToken: config.get('odata.token'),\r\n odataPath: config.get('odata.url') + config.get('odata.path'),\r\n };\r\n const imageOData = new ImageOData(cid, aid, oDataConfig);\r\n\r\n return responsiveAdRepository.processImageAndSaveSearchAdAsync(adModel, imageOData, false)\r\n .then(response => ({ data: convertFromBulkResponse(response) }))\r\n .catch((bulkOrSystemError) => {\r\n const { entity, errors } = bulkOrSystemError;\r\n\r\n if (entity && entity.Id) {\r\n extend(adViewModel, { Id: entity.Id });\r\n\r\n // Ignore errors if the entity was eventually created and all the errors are editorial errors\r\n if (all(errors, error => error.Error === 'CampaignServiceEditorialValidationError')) {\r\n CampaignCacheManager.invalidate('Ad'); // Cache is not automatically invalidated since the API failed\r\n return {\r\n data: adViewModel,\r\n editorialErrors: errors,\r\n };\r\n }\r\n }\r\n\r\n if (isBulkWrappedResponse(bulkOrSystemError)) {\r\n let filteredErrors = errors;\r\n if (entity.Id <= 0) {\r\n filteredErrors = removeReferencedEntityInvalidIdErrors(errors);\r\n }\r\n\r\n const serverErrors = modelToViewModelForBulkErrors(\r\n filteredErrors,\r\n bulkUpsertAdEntityErrorMap,\r\n scenario,\r\n i18n,\r\n activityLogger\r\n );\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return {\r\n data: adViewModel,\r\n serverErrors,\r\n };\r\n }\r\n\r\n // Activity\r\n // eslint-disable-next-line no-console\r\n console.warn(`Campaign bulk upsert system error: ${bulkOrSystemError.stack || bulkOrSystemError.message || bulkOrSystemError}`);\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return {\r\n data: adViewModel,\r\n systemErrors: [i18n.getString(GENERIC_ERROR_MESSAGE_KEY)],\r\n };\r\n });\r\n};\r\n","import { Campaign, AdGroup, ResponsiveAd, ResponsiveSearchAd, DynamicSearchAd } from '@bingads-webui/campaign-odata-schemas';\r\nimport { isBulkWrappedResponse } from '../shared/bulk';\r\nimport { ERROR_ENTITY, getBulkUploadErrorType, modelToViewModelForBulkErrors, removeReferencedEntityInvalidIdErrors } from '../shared/bulk-upsert-errors';\r\nimport { GENERIC_ERROR_MESSAGE_KEY } from '../shared/constants';\r\nimport { saveAd as saveDSA, deleteAd as deleteDSA } from './dynamic-search-ad-bulk';\r\nimport { saveAd as saveRSA, deleteAd as deleteRSA } from './responsive-search-ad-bulk';\r\nimport { saveAd as saveMMA, deleteAd as deleteMMA } from './multimedia-ad-bulk';\r\n\r\nconst bulkUpsertAdEntityErrorMap = {\r\n [getBulkUploadErrorType(Campaign)]: ERROR_ENTITY.Campaign,\r\n [getBulkUploadErrorType(AdGroup)]: ERROR_ENTITY.AdGroup,\r\n [getBulkUploadErrorType(DynamicSearchAd)]: ERROR_ENTITY.DynamicSearchAd,\r\n [getBulkUploadErrorType(ResponsiveAd)]: ERROR_ENTITY.ResponsiveAd,\r\n [getBulkUploadErrorType(ResponsiveSearchAd)]: ERROR_ENTITY.ResponsiveSearchAd,\r\n};\r\n\r\nconst saveAdFuncs = {\r\n DynamicSearch: saveDSA,\r\n ResponsiveSearch: saveRSA,\r\n Responsive: saveMMA,\r\n};\r\n\r\nconst deleteAdFuncs = {\r\n DynamicSearch: deleteDSA,\r\n ResponsiveSearch: deleteRSA,\r\n Responsive: deleteMMA,\r\n};\r\n\r\nexport const saveAd = ({\r\n ad,\r\n adType,\r\n campaignId,\r\n adGroupId,\r\n cid,\r\n aid,\r\n}, options) => {\r\n const saveAdFunc = saveAdFuncs[adType];\r\n if (saveAdFunc) {\r\n return saveAdFunc({\r\n ad,\r\n campaignId,\r\n adGroupId,\r\n cid,\r\n aid,\r\n }, options);\r\n }\r\n return Promise.reject(new Error(`Unsupported ad type: ${adType}`));\r\n};\r\n\r\nexport const deleteAd = ({\r\n adId,\r\n adType,\r\n adGroupId,\r\n}, {\r\n i18n,\r\n scenario,\r\n activityLogger,\r\n}) => {\r\n const deleteAdFunc = deleteAdFuncs[adType];\r\n if (deleteAdFunc) {\r\n return deleteAdFunc(adId, {\r\n parentId: adGroupId,\r\n })\r\n // with bulk the result will have shape of:\r\n // - { ...entityData } - in case of success;\r\n // - { entity: { ...entityData }, errors: [(EditorialError|MTError)] } - in case of error(s).\r\n .then(result => ({\r\n data: result,\r\n }), (bulkOrSystemError) => {\r\n if (isBulkWrappedResponse(bulkOrSystemError)) {\r\n const { entity, errors } = bulkOrSystemError;\r\n\r\n let filteredErrors = errors;\r\n if (entity.Id <= 0) {\r\n filteredErrors = removeReferencedEntityInvalidIdErrors(errors);\r\n }\r\n\r\n const serverErrors = modelToViewModelForBulkErrors(\r\n filteredErrors,\r\n bulkUpsertAdEntityErrorMap,\r\n scenario,\r\n i18n,\r\n activityLogger\r\n );\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n serverErrors,\r\n });\r\n }\r\n\r\n // Activity\r\n // eslint-disable-next-line no-console\r\n console.warn(`Campaign bulk upsert system error: ${bulkOrSystemError.stack || bulkOrSystemError.message || bulkOrSystemError}`);\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return {\r\n systemErrors: [i18n.getString(GENERIC_ERROR_MESSAGE_KEY)],\r\n };\r\n });\r\n }\r\n return Promise.reject(new Error(`Unsupported ad type: ${adType}`));\r\n};\r\n","import { edmCampaign } from '@bingads-webui/edm-campaign';\r\n\r\nexport const loadAds = ({\r\n cid,\r\n aid,\r\n campaignId,\r\n adGroupId,\r\n filter = {},\r\n count = 1,\r\n}) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .AdGroups.$withKey(adGroupId)\r\n .Ads['Default.GridData']\r\n .$makeCall({\r\n query: {\r\n top: count,\r\n count: true,\r\n orderby: { Id: 1 },\r\n filter,\r\n select: [\r\n 'Id',\r\n 'Type',\r\n 'Text',\r\n 'TextPart2',\r\n 'FinalUrls',\r\n 'FinalUrlSuffix',\r\n 'MobileFinalUrls',\r\n 'DisplayUrl',\r\n 'Path1',\r\n 'Path2',\r\n 'TrackingUrlTemplate',\r\n 'UrlCustomParameters',\r\n 'Model.ResponsiveAd/BusinessName',\r\n 'Model.ResponsiveAd/CallToAction',\r\n 'Model.ResponsiveAd/CallToActionLanguage',\r\n 'Model.ResponsiveAd/Headline',\r\n 'Model.ResponsiveAd/LongHeadline',\r\n 'Model.ResponsiveAd/Descriptions',\r\n 'Model.ResponsiveAd/Headlines',\r\n 'Model.ResponsiveAd/Images',\r\n 'Model.ResponsiveAd/ImpressionTrackingUrls',\r\n 'Model.ResponsiveAd/LandscapeImageMediaId',\r\n 'Model.ResponsiveAd/LandscapeImageMediaUrl',\r\n 'Model.ResponsiveAd/LandscapeLogoMediaId',\r\n 'Model.ResponsiveAd/LandscapeLogoMediaUrl',\r\n 'Model.ResponsiveAd/LongHeadlines',\r\n 'Model.ResponsiveAd/SquareImageMediaId',\r\n 'Model.ResponsiveAd/SquareImageMediaUrl',\r\n 'Model.ResponsiveAd/SquareLogoMediaId',\r\n 'Model.ResponsiveAd/SquareLogoMediaUrl',\r\n 'Model.ResponsiveAd/VerifiedTrackingSettings',\r\n 'Model.ResponsiveSearchAd/Descriptions',\r\n 'Model.ResponsiveSearchAd/Headlines',\r\n ],\r\n },\r\n payload: {\r\n gridDataParameters: {},\r\n },\r\n })\r\n .toPromise()\r\n .then((response) => {\r\n const { value } = response;\r\n return value;\r\n });\r\n","import { chain, contains, pluck } from 'underscore';\r\nimport { convertToMTFormat, Scopes } from '@bingads-webui-campaign-react/goal-selector';\r\n\r\nexport const viewModelToBulkModelForConversionGoals = (campaignViewModel, campaignId) => {\r\n const { conversionGoals } = campaignViewModel;\r\n return convertToMTFormat(\r\n campaignId,\r\n conversionGoals.goalScopeSelection,\r\n conversionGoals.originalConversionGoals,\r\n conversionGoals.goalSelection,\r\n true\r\n );\r\n};\r\n\r\nexport const bulkModelToViewModelForConversionGoals = ({\r\n campaignModel,\r\n originalCampaignModel,\r\n errors = [],\r\n}) => {\r\n const conversionGoalsBulkModel = campaignModel.CampaignConversionGoalAssociations;\r\n const errorKey = 'Client Id';\r\n const originalGoalSelection =\r\n chain(conversionGoalsBulkModel)\r\n .filter(goal => !contains(pluck(errors, errorKey), goal[errorKey]))\r\n .filter(goal => goal.Action === 'Add')\r\n .map(goal => ({\r\n Id: goal.GoalId,\r\n }))\r\n .value();\r\n return {\r\n conversionGoals: {\r\n ...originalCampaignModel.conversionGoals,\r\n originalConversionGoals: originalGoalSelection,\r\n },\r\n };\r\n};\r\n\r\nexport const modelToViewModelForConversionGoals = (campaignModel) => {\r\n const hasCampaignLevelGoals = campaignModel.CampaignConversionGoal && campaignModel.CampaignConversionGoal.Goals\r\n && campaignModel.CampaignConversionGoal.Goals.length > 0;\r\n return {\r\n conversionGoals: {\r\n originalConversionGoals: campaignModel.CampaignConversionGoal.Goals,\r\n goalSelection: campaignModel.CampaignConversionGoal.Goals,\r\n goalScopeSelection: hasCampaignLevelGoals ?\r\n Scopes.CAMPAIGN : Scopes.ACCOUNT,\r\n },\r\n };\r\n};\r\n","import { map } from 'underscore';\r\n\r\nexport const parseDateFromAPIFormat = (i18n, date) => {\r\n if (date == null) {\r\n return null;\r\n }\r\n if (typeof date === 'string') {\r\n const dateFromMdyyyyFormat = i18n.parseDate(date.substring(0, 10), { raw: 'M/d/yyyy' });\r\n const dateFromyyyyMdFormat = i18n.parseDate(date.substring(0, 10), { raw: 'yyyy-M-d' });\r\n return dateFromMdyyyyFormat || dateFromyyyyMdFormat;\r\n }\r\n return date;\r\n};\r\n\r\nexport const formatDateToAPIFormat = (i18n, date) => {\r\n if (date == null) {\r\n return '';\r\n }\r\n\r\n if (typeof date === 'string') {\r\n return date;\r\n }\r\n return i18n.formatDate(date, {\r\n raw: 'M/d/yyyy',\r\n });\r\n};\r\n\r\nconst EntityNegativeReferenceId = -111;\r\n\r\nexport const getTargetCriterion = ({\r\n targets,\r\n type,\r\n propKey,\r\n adGroupViewModel,\r\n campaignViewModel,\r\n bidAdjustment,\r\n overrideType = undefined,\r\n level = 'campaign',\r\n}) => targets.map((target) => {\r\n let BidAdjustment = bidAdjustment;\r\n let propValue = target.criterion;\r\n\r\n if (typeof (target.criterion) === 'object') {\r\n propValue = target.criterion.Target;\r\n\r\n if (bidAdjustment === undefined) {\r\n const { BidAdjustment: bid } = target.criterion;\r\n BidAdjustment = bid;\r\n }\r\n }\r\n\r\n const criterion = {\r\n Type: overrideType || type,\r\n BidAdjustment,\r\n [`${overrideType || type}Criterion`]: {\r\n [propKey]: propValue,\r\n },\r\n };\r\n\r\n if (level === 'campaign') {\r\n return {\r\n Id: target.Id,\r\n Status: target.status ? target.status : 'Active',\r\n Criterion: criterion,\r\n CriterionType: type,\r\n Campaign: {\r\n Id: campaignViewModel.Id || EntityNegativeReferenceId,\r\n },\r\n };\r\n }\r\n\r\n return {\r\n Id: target.Id,\r\n Status: target.status ? target.status : 'Active',\r\n Criterion: criterion,\r\n CriterionType: type,\r\n AdGroup: {\r\n Id: adGroupViewModel.Id || EntityNegativeReferenceId,\r\n },\r\n // CampaignName: campaignViewModel.Name,\r\n };\r\n});\r\n\r\nexport const flattenTargetCriterion = (targetsWithBidAdjustment, type) => map(targetsWithBidAdjustment, (target) => {\r\n const {\r\n Id,\r\n Criterion: {\r\n BidAdjustment,\r\n [`${type}Criterion`]: {\r\n Target,\r\n } = {},\r\n } = {},\r\n } = target;\r\n\r\n return {\r\n Id,\r\n BidAdjustment,\r\n criterion: Target,\r\n };\r\n});\r\n\r\nexport const hydrateCriterionWithBidAndId = (criterionType, initialTargetList, adddedCriterionList, targetWithBidAdjustmentList = []) => {\r\n for (let i = 0; i < adddedCriterionList.length; i += 1) {\r\n const criterion = adddedCriterionList[i];\r\n\r\n // add bid adjustments to modified criterion\r\n const matchingTargetWithBid = targetWithBidAdjustmentList.find(criterionWithBidAdjustment =>\r\n criterionWithBidAdjustment.Criterion[`${criterionType}Criterion`].Target === criterion.Criterion[`${criterionType}Criterion`].Target);\r\n if (matchingTargetWithBid) {\r\n criterion.Criterion.BidAdjustment = matchingTargetWithBid.Criterion.BidAdjustment;\r\n }\r\n\r\n // add id to update existing criterion in MT\r\n const originalCrition = initialTargetList.find(initialTarget => (initialTarget.criterion || initialTarget.Target) === criterion.Criterion[`${criterionType}Criterion`].Target);\r\n if (originalCrition) {\r\n criterion.Id = originalCrition.Id;\r\n }\r\n }\r\n};\r\n","/* eslint-disable no-param-reassign */\r\nimport _ from 'underscore';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport { locationTargetsOptionKeys } from '@bingads-webui-campaign-react/wizard-shared-components';\r\nimport {\r\n getBundleCountriesAndBundleLocationCriterions,\r\n convertLocationStateToLocationSchemaCampaign,\r\n shouldSelectBundleOption,\r\n getLocationIntent,\r\n parseLocationTargets,\r\n} from '@bingads-webui-campaign/hotel-common-targets';\r\nimport * as languageBundle from '@bingads-webui-campaign-legacy/location-targets/util/languageBundle';\r\nimport { minuteMap } from '@bingads-webui-campaign/ad-schedule';\r\nimport { cloneDeep } from '@bingads-webui-universal/primitive-utilities';\r\nimport { getTargetCriterion, hydrateCriterionWithBidAndId } from './utils';\r\n\r\nconst campaignCriterionTypeName = 'Model.CampaignCriterion';\r\n\r\nexport const LOCATION_CRITERION_TYPE = {\r\n LOCATION: 'Location',\r\n RADIUS: 'Radius',\r\n};\r\n\r\nexport const readCampaignCriterions = (cid, aid, campaignId, type) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .CampaignCriterions\r\n .$cast(campaignCriterionTypeName)\r\n .get({\r\n filter: {\r\n where: type,\r\n },\r\n })\r\n .toPromise();\r\n\r\nexport const readLocationCriterions = (cid, aid, campaignId) =>\r\n readCampaignCriterions(\r\n cid, aid, campaignId,\r\n \"isof(Criterion,'Model.LocationCriterion') or isof(Criterion,'Model.RadiusCriterion') or isof(Criterion,'Model.LocationIntentCriterion')\"\r\n );\r\n\r\nexport const loadBundleCountries = ({\r\n cid,\r\n aid,\r\n serverContext,\r\n language: selectedLanguages,\r\n}) => {\r\n const lcid = serverContext ? serverContext.CurrentUser.LocaleID : '1033';\r\n const market = serverContext ? serverContext.CurrentUser.Market : 'US';\r\n const language = selectedLanguages || 'All';\r\n\r\n return getBundleCountriesAndBundleLocationCriterions(cid, aid, lcid, language, market);\r\n};\r\n\r\nexport const isBundledCountriesFound = ({\r\n languages,\r\n market,\r\n}) => {\r\n const bundleCountries = languageBundle.getBundle(languages, market);\r\n return bundleCountries && bundleCountries.length > 0;\r\n};\r\n\r\nexport const viewModelToBulkModelForLocationTargets = (campaignViewModel, bundleLocationCriterions) => {\r\n const bulkUpsertModel = convertLocationStateToLocationSchemaCampaign(\r\n campaignViewModel.locationTargets,\r\n bundleLocationCriterions,\r\n {\r\n ...campaignViewModel,\r\n bidStrategy: {\r\n option: '',\r\n },\r\n name: {\r\n value: campaignViewModel.Name,\r\n },\r\n }\r\n );\r\n return bulkUpsertModel;\r\n};\r\n\r\nexport const bulkModelToViewModelForLocationTargets = ({\r\n locationTargetsModel, bundleCountries,\r\n}) => {\r\n const locations = locationTargetsModel\r\n .filter(criterion => criterion.Criterion.Type === LOCATION_CRITERION_TYPE.RADIUS || criterion.Criterion.Type === LOCATION_CRITERION_TYPE.LOCATION);\r\n const intent = locationTargetsModel.find(criterion => criterion.Criterion.Type === 'LocationIntentCriterion');\r\n const intentId = intent ? intent.Id : null;\r\n const intentOption = intent ? getLocationIntent(intent.Criterion.LocationIntentCriterion.IntentOption) : null;\r\n let targetOption = locations.length ? locationTargetsOptionKeys.specific : locationTargetsOptionKeys.everywhere;\r\n targetOption = shouldSelectBundleOption(bundleCountries, locations) ? locationTargetsOptionKeys.bundleOrDefaultMarket : targetOption;\r\n return {\r\n locationTargets: {\r\n currentLevelSettings: {\r\n initLocations: locations,\r\n currentLocations: locations,\r\n targetOption,\r\n intentId,\r\n ...intentOption,\r\n },\r\n bidMode: false,\r\n useParentLevel: locations.length === 0,\r\n },\r\n };\r\n};\r\n\r\nexport const modelToViewModelForLocationTargets = ({\r\n model, bundleCountries, campaignId,\r\n}) => {\r\n const {\r\n locations,\r\n intentId,\r\n intentOption,\r\n } = parseLocationTargets(model, 'campaign', campaignId);\r\n let targetOption = locations.length ? locationTargetsOptionKeys.specific : locationTargetsOptionKeys.everywhere;\r\n targetOption = shouldSelectBundleOption(bundleCountries, locations) ? locationTargetsOptionKeys.bundleOrDefaultMarket : targetOption;\r\n return {\r\n locationTargets: {\r\n currentLevelSettings: {\r\n initLocations: locations,\r\n currentLocations: locations,\r\n targetOption,\r\n intentId,\r\n ...intentOption,\r\n },\r\n bidMode: false,\r\n useParentLevel: locations.length === 0,\r\n },\r\n };\r\n};\r\n\r\nexport const readScheduleCriterions = (cid, aid, campaignId) =>\r\n readCampaignCriterions(\r\n cid, aid, campaignId,\r\n \"isof(Criterion,'Model.DayTimeCriterion')\"\r\n );\r\n\r\nexport const viewModelToBulkModelForSchedule = (adSchedulesBulkUpsert, campaignModel) => {\r\n _.each(adSchedulesBulkUpsert, (criterion) => {\r\n criterion.Status = _.isEmpty(criterion.Status) ? 'Active' : criterion.Status;\r\n criterion.Campaign = {\r\n Id: campaignModel.Id,\r\n };\r\n });\r\n return adSchedulesBulkUpsert;\r\n};\r\n\r\nexport const modelToViewModelForDayTimeTargets = (criterions) => {\r\n const schedulingRows = [];\r\n\r\n _.chain(criterions).each((criterion) => {\r\n schedulingRows.push({\r\n Id: Number(criterion.Id),\r\n Day: criterion.Criterion.Day,\r\n StartHour: criterion.Criterion.FromHour,\r\n StartMinute: criterion.Criterion.FromMinute,\r\n EndHour: criterion.Criterion.ToHour,\r\n EndMinute: criterion.Criterion.ToMinute,\r\n BidAdjustmentType: criterion.CriterionBid.Multiplier < 0 ? -1 : 1,\r\n BidAdjustmentAmount: window.Math.abs(criterion.CriterionBid.Multiplier),\r\n });\r\n })\r\n .value();\r\n\r\n return schedulingRows;\r\n};\r\n\r\nexport const bulkModelToViewModelForDayTimeTargets = (criterions, originalCriterions) => {\r\n const deletedIds = _.chain(criterions).where({\r\n CriterionType: 'DayTime',\r\n Status: 'Deleted',\r\n }).map(criterion => criterion.Id).value();\r\n\r\n let added = _.chain(criterions)\r\n .filter(criterion => criterion.CriterionType === 'DayTime' && criterion.Status !== 'Deleted')\r\n .map(criterion => ({\r\n Id: Number(criterion.Id),\r\n Day: criterion.Criterion.DayTimeCriterion.Day,\r\n StartHour: criterion.Criterion.DayTimeCriterion.FromHour,\r\n StartMinute: minuteMap[criterion.Criterion.DayTimeCriterion.FromMinute],\r\n EndHour: criterion.Criterion.DayTimeCriterion.ToHour,\r\n EndMinute: minuteMap[criterion.Criterion.DayTimeCriterion.ToMinute],\r\n BidAdjustmentType: criterion.Criterion.BidAdjustment < 0 ? -1 : 1,\r\n BidAdjustmentAmount: window.Math.abs(criterion.Criterion.BidAdjustment),\r\n }))\r\n .value();\r\n\r\n added = _.filter(added, range => !_.find(originalCriterions, r => _.isMatch(r, range)));\r\n\r\n const dayTimeRanges = _.filter(originalCriterions.concat(added), range => _.indexOf(deletedIds, range.Id.toString()) === -1);\r\n\r\n return dayTimeRanges;\r\n};\r\n\r\nexport const readTargetCriterion = (cid, aid, campaignId) =>\r\n readCampaignCriterions(\r\n cid, aid, campaignId,\r\n \"isof(Criterion,'Model.AgeCriterion') or isof(Criterion,'Model.GenderCriterion') or isof(Criterion,'Model.DeviceCriterion') or isof(Criterion,'Model.CompanyNameCriterion') or isof(Criterion,'Model.IndustryCriterion') or isof(Criterion,'Model.JobFunctionCriterion')\"\r\n );\r\n\r\nexport const deviceName = ['Tablets', 'Computers', 'Smartphones'];\r\n\r\nexport const compareDevice = (Targets, initialTargets) => {\r\n if (Targets.length !== deviceName.length) {\r\n return false;\r\n }\r\n let noChanged = true;\r\n deviceName.forEach((name) => {\r\n const currentDevice = Targets.filter(target => target.Criterion.DeviceCriterion.DeviceName === name);\r\n const initialDevice = initialTargets.filter(target => target.Criterion.DeviceCriterion.DeviceName === name);\r\n if (!currentDevice || !initialDevice || currentDevice.length !== 1 || initialDevice.length !== 1 || currentDevice[0].Criterion.BidAdjustment !== initialDevice[0].Criterion.BidAdjustment) {\r\n noChanged = false;\r\n }\r\n });\r\n return noChanged;\r\n};\r\n\r\nexport const viewModelToBulkModelForDeviceTargets = ({ campaignViewModel }) => {\r\n const deviceTargets = campaignViewModel.Device || [];\r\n const initialDevice = campaignViewModel.initialDevice || [];\r\n if (compareDevice(deviceTargets, initialDevice)) {\r\n return [];\r\n }\r\n const addedDevices = [];\r\n // eslint-disable-next-line array-callback-return\r\n deviceTargets.map((target) => {\r\n addedDevices.push({\r\n Criterion: _.extend(target.Status === 'Deleted' ? { BidAdjustment: 0 } : {}, target.Criterion),\r\n Id: target.Id,\r\n Status: target.Status || 'Active',\r\n CriterionType: target.Criterion.Type,\r\n Campaign: {\r\n Id: campaignViewModel.Id,\r\n },\r\n });\r\n });\r\n return addedDevices;\r\n};\r\n\r\nexport const modelToViewModelForDeviceTargets = ({ model, campaignId }) => {\r\n let deviceTargets = [];\r\n let initialDevice = [];\r\n if (model && !_.isEmpty(model)) {\r\n deviceTargets = model.map(target => ({\r\n Id: target.Id,\r\n Status: target.Status || 'Active',\r\n Criterion: _.extend(target.Criterion, { BidAdjustment: target.CriterionBid.Multiplier, DeviceCriterion: { DeviceName: target.Criterion.DeviceName } }),\r\n CriterionType: 'Device',\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n }));\r\n } else {\r\n deviceTargets = deviceName.map(name => ({\r\n Status: 'Active',\r\n Criterion: {\r\n '@odata.type': '#Model.DeviceCriterion',\r\n Type: 'Device',\r\n Name: null,\r\n OSName: null,\r\n DeviceCriterion: { DeviceName: name },\r\n BidAdjustment: 0,\r\n },\r\n CriterionType: 'Device',\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n }));\r\n }\r\n initialDevice = cloneDeep(deviceTargets);\r\n return {\r\n Device: deviceTargets,\r\n initialDevice,\r\n };\r\n};\r\n\r\nexport const GenderName = ['Male', 'Female'];\r\n\r\nexport const modelToViewModelForGenderTargets = ({ model, campaignId }) => {\r\n let genderTargets = [];\r\n let initialGender = [];\r\n if (model && !_.isEmpty(model)) {\r\n genderTargets = model.map(target => ({\r\n Id: target.Id,\r\n Status: target.Status || 'Active',\r\n Criterion: _.extend(target.Criterion, { BidAdjustment: target.CriterionBid.Multiplier, GenderCriterion: { Target: target.Criterion.GenderType } }),\r\n CriterionType: 'Gender',\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n }));\r\n } else {\r\n genderTargets = GenderName.map(name => ({\r\n Status: 'Active',\r\n Criterion: {\r\n '@odata.type': '#Model.GenderCriterion',\r\n Type: 'Gender',\r\n Name: null,\r\n OSName: null,\r\n GenderCriterion: { Target: name },\r\n BidAdjustment: 0,\r\n },\r\n CriterionType: 'Gender',\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n }));\r\n }\r\n initialGender = cloneDeep(genderTargets);\r\n return {\r\n Gender: genderTargets,\r\n initialGender,\r\n };\r\n};\r\n\r\nconst compareGender = (Targets, initialTargets) => {\r\n let changed = false;\r\n GenderName.forEach((name) => {\r\n const currentTarget = Targets.find(target => target.Criterion.GenderCriterion.Target === name);\r\n const initialTarget = initialTargets.find(target => target.Criterion.GenderCriterion.Target === name);\r\n if (initialTarget && currentTarget && currentTarget.Criterion.BidAdjustment !== initialTarget.Criterion.BidAdjustment) {\r\n changed = true;\r\n }\r\n });\r\n return changed;\r\n};\r\n\r\nexport const viewModelToBulkModelForGenderTargets = ({ campaignViewModel }) => {\r\n const genderTargets = campaignViewModel.Gender || [];\r\n const initialGender = campaignViewModel.initialGender || [];\r\n const addedGender = [];\r\n if (compareGender(genderTargets, initialGender)) {\r\n genderTargets.forEach((target) => {\r\n addedGender.push({\r\n Criterion: target.Criterion,\r\n Id: target.Id,\r\n Status: target.Status || 'Active',\r\n CriterionType: target.Criterion.Type,\r\n Campaign: {\r\n Id: campaignViewModel.Id,\r\n },\r\n });\r\n });\r\n }\r\n return addedGender;\r\n};\r\n\r\nexport const AgeName = ['EighteenToTwentyFive', 'TwentyFiveToThirtyFive', 'ThirtyFiveToFifty', 'FiftyToSixtyFive', 'SixtyFiveAndAbove'];\r\n\r\nexport const modelToViewModelForAgeTargets = ({ model, campaignId }) => {\r\n let initialAge = [];\r\n const ageTargets = AgeName.map((name) => {\r\n const targetItem = model && model.find(target => target.Criterion.AgeRange === name);\r\n if (targetItem) {\r\n return {\r\n Id: targetItem.Id,\r\n Status: targetItem.Status || 'Active',\r\n Criterion: _.extend(targetItem.Criterion, { BidAdjustment: targetItem.CriterionBid.Multiplier, AgeCriterion: { Target: targetItem.Criterion.AgeRange } }),\r\n CriterionType: 'Age',\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n };\r\n }\r\n return {\r\n Status: 'Active',\r\n Criterion: {\r\n '@odata.type': '#Model.AgeCriterion',\r\n Type: 'Age',\r\n AgeCriterion: { Target: name },\r\n BidAdjustment: 0,\r\n },\r\n CriterionType: 'Age',\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n };\r\n });\r\n\r\n initialAge = cloneDeep(ageTargets);\r\n return {\r\n Age: ageTargets,\r\n initialAge,\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForAgeTargets = ({ campaignViewModel }) => {\r\n const ageTargets = campaignViewModel.Age || [];\r\n const initialAge = campaignViewModel.initialAge || [];\r\n const addedAge = [];\r\n ageTargets.forEach((target) => {\r\n const initialTarget = initialAge.find(age => age.Criterion.AgeCriterion.Target === target.Criterion.AgeCriterion.Target);\r\n if (initialTarget && target.Criterion.BidAdjustment !== initialTarget.Criterion.BidAdjustment) {\r\n addedAge.push({\r\n Criterion: target.Criterion,\r\n Id: target.Id,\r\n Status: target.Status || 'Active',\r\n CriterionType: target.Criterion.Type,\r\n Campaign: {\r\n Id: campaignViewModel.Id,\r\n },\r\n });\r\n }\r\n });\r\n\r\n return addedAge;\r\n};\r\n\r\nexport const modelToViewModelForCompanyNameTargets = ({ model }) => {\r\n let companyNameTargets = [];\r\n let initialCompanyNameTargets = [];\r\n if (model && !_.isEmpty(model)) {\r\n companyNameTargets = model.map(target => ({\r\n Id: target.Id,\r\n Target: target.Criterion.ProfileId,\r\n Size: target.Criterion.Size,\r\n Industry: target.Criterion.Industry,\r\n Name: target.Criterion.CompanyName,\r\n BidAdjustment: target.CriterionBid.Multiplier,\r\n }));\r\n }\r\n initialCompanyNameTargets = cloneDeep(companyNameTargets);\r\n return {\r\n companyNameTargets,\r\n initialCompanyNameTargets,\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForCompanyNameTargets = ({ campaignViewModel }) => {\r\n const companyNameTargets = campaignViewModel.companyNameTargets || [];\r\n const initialCompanyNameTargets = campaignViewModel.initialCompanyNameTargets || [];\r\n\r\n const addedCompanyNameTargets = companyNameTargets.filter(target => initialCompanyNameTargets.find(initialTarget =>\r\n initialTarget.Target === target.Target && initialTarget.BidAdjustment === target.BidAdjustment) === undefined);\r\n const removedCompanyNameTargets = initialCompanyNameTargets.filter(initialTarget => companyNameTargets.find(target =>\r\n initialTarget.Target === target.Target) === undefined).map(target => ({ ...target, criterion: target.Target, status: 'Deleted' }));\r\n\r\n const addedCompanyNameCriterion = getTargetCriterion({\r\n targets: addedCompanyNameTargets.map(({ Id, ...criterion }) => ({ Id, criterion })), type: 'CompanyName', propKey: 'Target', campaignViewModel,\r\n });\r\n const removedCompanyNameCriterion = getTargetCriterion({\r\n targets: removedCompanyNameTargets, type: 'CompanyName', propKey: 'Target', campaignViewModel,\r\n });\r\n\r\n return [\r\n ...addedCompanyNameCriterion,\r\n ...removedCompanyNameCriterion,\r\n ];\r\n};\r\n\r\nexport const modelToViewModelForIndustryTargets = ({ model }) => {\r\n let industryTargets = [];\r\n let initialIndustry = [];\r\n if (model && !_.isEmpty(model)) {\r\n industryTargets = model.map(target => ({\r\n Id: target.Id,\r\n BidAdjustment: target.CriterionBid.Multiplier,\r\n criterion: target.Criterion.ProfileId,\r\n }));\r\n }\r\n initialIndustry = cloneDeep(industryTargets);\r\n return {\r\n industry: industryTargets.map(target => target.criterion),\r\n initialIndustry,\r\n initialIndustryTargets: initialIndustry,\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForIndustryTargets = ({ campaignViewModel }) => {\r\n const industryTargets = campaignViewModel.industry || [];\r\n const initialIndustryTargets = campaignViewModel.initialIndustry || [];\r\n\r\n const { industryTargetsBidAdjustment } = campaignViewModel;\r\n const isIndustryTargetBidAdjustmentUpdated = ({ criterion, BidAdjustment }) => industryTargetsBidAdjustment.find(targetWithBid =>\r\n _.get(targetWithBid, 'Criterion.IndustryCriterion.Target') === criterion && _.get(targetWithBid, 'Criterion.BidAdjustment') === BidAdjustment);\r\n\r\n const addedIndustryTargets = industryTargets.filter(target => initialIndustryTargets.find(initialTarget =>\r\n initialTarget.criterion === target && (!industryTargetsBidAdjustment || isIndustryTargetBidAdjustmentUpdated(initialTarget))) === undefined);\r\n const removedIndustryTargets = initialIndustryTargets.filter(initialTarget => industryTargets.find(target =>\r\n initialTarget.criterion === target) === undefined).map(target => ({ ...target, status: 'Deleted' }));\r\n\r\n const addedIndustryCriterion = getTargetCriterion({\r\n targets: addedIndustryTargets.map(criterion => ({ criterion })), type: 'Industry', propKey: 'Target', campaignViewModel,\r\n });\r\n const removedIndustryCriterion = getTargetCriterion({\r\n targets: removedIndustryTargets, type: 'Industry', propKey: 'Target', campaignViewModel,\r\n });\r\n\r\n if (industryTargetsBidAdjustment && industryTargetsBidAdjustment.length > 0) {\r\n hydrateCriterionWithBidAndId('Industry', initialIndustryTargets, addedIndustryCriterion, industryTargetsBidAdjustment);\r\n }\r\n\r\n return [\r\n ...addedIndustryCriterion,\r\n ...removedIndustryCriterion,\r\n ];\r\n};\r\n\r\nexport const modelToViewModelForJobFunctionTargets = ({ model }) => {\r\n let jobFunctionTargets = [];\r\n let initialJobTargets = [];\r\n if (model && !_.isEmpty(model)) {\r\n jobFunctionTargets = model.map(target => ({\r\n Id: target.Id,\r\n BidAdjustment: target.CriterionBid.Multiplier,\r\n criterion: target.Criterion.ProfileId,\r\n }));\r\n }\r\n initialJobTargets = cloneDeep(jobFunctionTargets);\r\n return {\r\n jobTargets: jobFunctionTargets.map(target => target.criterion),\r\n initialJobTargets,\r\n initialJobFunctionTargets: initialJobTargets,\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForJobFunctionTargets = ({ campaignViewModel }) => {\r\n const jobTargets = campaignViewModel.jobTargets || [];\r\n const initialJobTargets = campaignViewModel.initialJobTargets || [];\r\n\r\n const { jobTargetBidAdjustments } = campaignViewModel;\r\n const isJobTargetBidAdjustmentUpdated = ({ criterion, BidAdjustment }) => jobTargetBidAdjustments.find(targetWithBid =>\r\n _.get(targetWithBid, 'Criterion.JobFunctionCriterion.Target') === criterion && _.get(targetWithBid, 'Criterion.BidAdjustment') === BidAdjustment);\r\n\r\n const addedJobTargets = jobTargets.filter(target => initialJobTargets.find(initialTarget =>\r\n initialTarget.criterion === target && (!jobTargetBidAdjustments || isJobTargetBidAdjustmentUpdated(initialTarget))) === undefined);\r\n const removedJobTargets = initialJobTargets.filter(initialTarget => jobTargets.find(target =>\r\n initialTarget.criterion === target) === undefined).map(target => ({ ...target, status: 'Deleted' }));\r\n\r\n const addedJobCriterion = getTargetCriterion({\r\n targets: addedJobTargets.map(criterion => ({ criterion })), type: 'JobFunction', propKey: 'Target', campaignViewModel,\r\n });\r\n const removedJobCriterion = getTargetCriterion({\r\n targets: removedJobTargets, type: 'JobFunction', propKey: 'Target', campaignViewModel,\r\n });\r\n\r\n if (jobTargetBidAdjustments && jobTargetBidAdjustments.length > 0) {\r\n hydrateCriterionWithBidAndId('JobFunction', initialJobTargets, addedJobCriterion, jobTargetBidAdjustments);\r\n }\r\n\r\n return [\r\n ...addedJobCriterion,\r\n ...removedJobCriterion,\r\n ];\r\n};\r\n","import { each, isEmpty, map, omit, pluck } from 'underscore';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport { notificationApi } from '@bingads-webui-campaign/notification-center';\r\nimport { Repository } from '@bingads-webui-campaign-legacy/adextension-image/service/repository';\r\nimport summaryDataContextManager from '@bingads-webui-static-legacy/summary/SummaryDataContextManager';\r\n\r\nexport const modelToViewModelForDisclaimer = ({\r\n disclaimerAssociations,\r\n}) => {\r\n let selectedDisclaimer = null;\r\n if (disclaimerAssociations && disclaimerAssociations.length > 0) {\r\n const adExtension = disclaimerAssociations[0].AdExtension;\r\n selectedDisclaimer = {\r\n Id: adExtension.Id,\r\n Name: adExtension.Name,\r\n };\r\n }\r\n\r\n return {\r\n disclaimer: {\r\n originalSelectedDisclaimer: selectedDisclaimer,\r\n selectedDisclaimer,\r\n },\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForDisclaimer = (campaignViewModel) => {\r\n let adExtensionAssociations = null;\r\n\r\n if (campaignViewModel && campaignViewModel.disclaimer && campaignViewModel.disclaimer.adExtensionAssociations) {\r\n adExtensionAssociations = campaignViewModel.disclaimer.adExtensionAssociations.map(adExtensionAssociation => ({\r\n ...omit(adExtensionAssociation, ['Client Id', 'Name', 'CampaignName']),\r\n Campaign: {\r\n Id: campaignViewModel.Id,\r\n },\r\n }));\r\n\r\n return { AdExtensionAssociations: adExtensionAssociations };\r\n }\r\n\r\n return null;\r\n};\r\n\r\nexport const bulkModelToViewModelForDisclaimer = ({\r\n campaignModel,\r\n originalCampaignModel,\r\n}) => {\r\n if (campaignModel.AdExtensionAssociations && campaignModel.AdExtensionAssociations.length > 0) {\r\n const activeAssociations = campaignModel.AdExtensionAssociations.filter(association => association.Status === 'Active');\r\n if (activeAssociations && activeAssociations.length > 0) {\r\n const selectedDisclaimer = activeAssociations[0];\r\n const originalSelectedDisclaimer = originalCampaignModel.disclaimer.selectedDisclaimer;\r\n if (selectedDisclaimer.Id === originalSelectedDisclaimer.Id) {\r\n return {\r\n disclaimer: {\r\n selectedDisclaimer: {\r\n Id: originalSelectedDisclaimer.Id,\r\n Name: originalSelectedDisclaimer.Name,\r\n },\r\n adExtensionAssociations: campaignModel.AdExtensionAssociations,\r\n },\r\n };\r\n }\r\n }\r\n }\r\n\r\n return {\r\n disclaimer: null,\r\n };\r\n};\r\n\r\n// the magic date is for bidata, but useless for this request\r\nconst magicDate = '2024-10-10';\r\n\r\nexport const loadDisclaimerAssociations = ({ cid, aid, campaignId }) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .AdExtensionAssociations\r\n .get({\r\n filter: {\r\n where: 'AdExtension/Status eq Enum.AdExtensionStatus\\'Active\\'',\r\n },\r\n $count: true,\r\n $top: 1,\r\n $expand: 'AdExtension',\r\n adExtensionType: 'DisclaimerAdExtension',\r\n startdate: magicDate,\r\n enddate: magicDate,\r\n // disable cache to ensure data refreshed\r\n cache: Date.now(),\r\n })\r\n .toPromise();\r\n\r\nconst imageExtensionsRepository = new Repository({\r\n schema: window.globalLegacySchema.get('ImageAdExtension'),\r\n afterChangeComitted: () => {\r\n summaryDataContextManager.updateContext(['AdGroupAdExtensionsGrid']);\r\n },\r\n});\r\nimageExtensionsRepository.association.createRequestFactory('adgroup');\r\n\r\nexport const saveImageExtensions = ({\r\n campaignId,\r\n adGroupId,\r\n // adId,\r\n imageExtensionChanges,\r\n}, {\r\n i18n,\r\n // activityLogger,\r\n // scenario,\r\n // perfMarker,\r\n}) => {\r\n // logActivity('Check image extensions');\r\n\r\n const defaultParams = {\r\n where: {\r\n campaignId: Number(campaignId),\r\n adGroupId: Number(adGroupId),\r\n },\r\n };\r\n\r\n if (isEmpty(imageExtensionChanges) ||\r\n (isEmpty(imageExtensionChanges.added) &&\r\n isEmpty(imageExtensionChanges.removed) &&\r\n isEmpty(imageExtensionChanges.updated))) {\r\n return Promise.resolve(true);\r\n }\r\n\r\n // const saveImgsExtPerfMarker = perfMarker.createChild('Process_ImageExtensions_Success');\r\n // saveImgsExtPerfMarker.willInit();\r\n\r\n const createImageExtensionsPromise = map(imageExtensionChanges.added, ext => imageExtensionsRepository.extension.create(ext));\r\n\r\n return Promise.all(createImageExtensionsPromise)\r\n .then((newExtensions) => {\r\n const newExtensionIds = pluck(newExtensions, 'Id');\r\n\r\n each(imageExtensionChanges.added, (item, index) => {\r\n // eslint-disable-next-line no-param-reassign\r\n item.Id = newExtensionIds[index];\r\n });\r\n\r\n let deletePromise = Promise.resolve(true);\r\n if (!isEmpty(imageExtensionChanges.removed)) {\r\n deletePromise = imageExtensionsRepository.association.destroyAll({\r\n where: {\r\n id: { in: pluck(imageExtensionChanges.removed, 'Id') },\r\n ...defaultParams.where,\r\n },\r\n });\r\n }\r\n\r\n return deletePromise\r\n .then(() => {\r\n const params = {\r\n where: {\r\n id: { in: newExtensionIds },\r\n ...defaultParams.where,\r\n },\r\n };\r\n\r\n const updatePromise = map(imageExtensionChanges.updated, ext => imageExtensionsRepository.extension.update(ext));\r\n return Promise.all(updatePromise).then(() => imageExtensionsRepository.association.updateAll(null, params));\r\n });\r\n })\r\n .then(() => {\r\n // logActivity('Updated image extension successfully');\r\n })\r\n .catch(() => {\r\n // do nothing, so that this is non-blocking\r\n // logActivity(`Updated image extension with failures, err: ${JSON.stringify(error)}`);\r\n\r\n const pageName = `${i18n.getString(_TL_('Ads & extensions'))}`;\r\n\r\n notificationApi.showWarning(i18n.getString(\r\n _TL_('There were errors when processing your image extension updates. To ensure that all changes are up to date or to manually create a new image extension, review your image extensions in the {{page}} page.'),\r\n {\r\n page: pageName,\r\n }\r\n ));\r\n\r\n return Promise.resolve(true);\r\n })\r\n .finally(() => {\r\n // saveImgsExtPerfMarker.done();\r\n // logImageExtensionUpdates({\r\n // adId,\r\n // currentItems: imageExtensionChanges.current,\r\n // createdExtModels: imageExtensionChanges.added,\r\n // removedExtModels: imageExtensionChanges.removed,\r\n // updatedExtModels: imageExtensionChanges.updated,\r\n // scope: defaultParams.where,\r\n // });\r\n });\r\n};\r\n\r\nexport const loadExtensionsAssociations = ({\r\n cid,\r\n aid,\r\n campaignId,\r\n adExtensionTypes = [],\r\n top = 1000, // get all, 20 max for each type\r\n}) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .AdExtensionAssociations['Default.GridData']\r\n .$makeCall({\r\n query: {\r\n top,\r\n filter: { where: \"(AdExtension/Status eq Enum.AdExtensionStatus'Active')\" },\r\n select: ['AdExtension'],\r\n },\r\n payload: {\r\n gridDataParameters: {\r\n DateRange: {\r\n // Just want to get extension data and don't care BI data, so pass dummy date ranges.\r\n StartDate: magicDate,\r\n EndDate: magicDate,\r\n },\r\n },\r\n associationType: 'Campaign',\r\n adExtensionTypes,\r\n },\r\n })\r\n .toPromise();\r\n","import { find, isNumber } from 'underscore';\r\nimport { ScopeLevel } from '@bingads-webui-campaign-react/constants';\r\n\r\nexport const dropdownValue = {\r\n Increase: 'Increase by',\r\n Decrease: 'Decrease by',\r\n};\r\n\r\nexport const modelToViewModelForBidAdjustment = (data, disableDecrease) => ({\r\n bidAdjustmentDropdown: disableDecrease || data >= 0 ? dropdownValue.Increase : dropdownValue.Decrease,\r\n bidAdjustmentInput: disableDecrease ? data : Math.abs(data),\r\n});\r\n\r\nconst parseBidAdjustmentValue = (data, i18n) => (isNumber(data) ? data : i18n.parseDecimal(data));\r\n\r\nexport const viewModelToModelForBidAdjustment = (data, i18n) => (data.bidAdjustmentDropdown === dropdownValue.Increase ? parseBidAdjustmentValue(data.bidAdjustmentInput, i18n) : -parseBidAdjustmentValue(data.bidAdjustmentInput, i18n));\r\n\r\nexport const modelToViewModelForMultiMediaBidAdjustment = (level, campaignLevelValue, adgroupLevelData) => ({\r\n multimediaAds: {\r\n currentLevelData: level === ScopeLevel.AdGroup ? modelToViewModelForBidAdjustment(adgroupLevelData, true) : modelToViewModelForBidAdjustment(campaignLevelValue, true),\r\n parentLevelData: level === ScopeLevel.AdGroup ? modelToViewModelForBidAdjustment(campaignLevelValue, true) : undefined,\r\n useParentLevel: level === ScopeLevel.AdGroup && !adgroupLevelData,\r\n },\r\n});\r\n\r\nexport const modelToViewModelForAutomatedCallToActionOptOut = (data) => {\r\n const campaignSettings = data.CampaignSettings;\r\n const callToActionSetting = campaignSettings && find(campaignSettings, setting => setting['@odata.type'] === '#Model.CallToActionSetting');\r\n return {\r\n AutomatedCallToActionOptOut: callToActionSetting && callToActionSetting.AutomatedCallToActionOptOut,\r\n };\r\n};\r\n\r\nexport const viewModelToModelForMultiMediaAdBidAdjustment = (level, viewmodel, i18n) => {\r\n if (!viewmodel.multimediaAds) {\r\n return {};\r\n }\r\n\r\n const { currentLevelData, useParentLevel } = viewmodel.multimediaAds;\r\n return { MultimediaAdBidAdjustment: level === ScopeLevel.AdGroup && useParentLevel ? null : viewModelToModelForBidAdjustment(currentLevelData, i18n) };\r\n};\r\n","import { result, findWhere, without } from 'underscore';\r\n\r\nexport const getDsaDefaultWebsiteLanguage = (permissions) => {\r\n const isDomesticSimplifiedChineseEnabled = result(permissions, 'IsDomesticSimplifiedChineseEnabled');\r\n const defaultLanguage = isDomesticSimplifiedChineseEnabled ? 'SimplifiedChinese' : 'English';\r\n return defaultLanguage;\r\n};\r\n\r\nexport const getDSAWebsiteLanguages = (permissions) => {\r\n const DSAEnableInFrenchGerman = result(permissions, 'IsDynamicSearchAdsV1EnabledInFRAndDE');\r\n const IsEnabledForDSAInCHandNLandITandESandSE = result(permissions, 'IsEnabledForDSAInCHandNLandITandESandSE');\r\n const IsSimplifiedChineseLanguageEnabledInMultipleLanguage = result(permissions, 'IsSimplifiedChineseLanguageEnabledInMultipleLanguage');\r\n const IsDomesticSimplifiedChineseEnabled = result(permissions, 'IsDomesticSimplifiedChineseEnabled');\r\n\r\n let languages = [\r\n 'English',\r\n 'Polish',\r\n 'Portuguese',\r\n 'Czech',\r\n 'Romanian',\r\n 'Hungarian',\r\n 'Greek',\r\n 'Slovak',\r\n 'Bulgarian',\r\n 'Croatian',\r\n 'Lithuanian',\r\n 'Slovenian',\r\n 'Estonian',\r\n 'Latvian',\r\n 'Maltese',\r\n 'Danish',\r\n 'Finnish',\r\n 'Norwegian',\r\n 'Turkish',\r\n 'Serbian',\r\n 'Bosnian',\r\n 'Albanian',\r\n 'Macedonian',\r\n 'Icelandic',\r\n 'Japanese',\r\n 'Hebrew',\r\n 'Arabic',\r\n 'Russian',\r\n 'TraditionalChinese',\r\n 'Hindi',\r\n 'Malay',\r\n 'Thai',\r\n 'Indonesian',\r\n 'Tagalog',\r\n 'Vietnamese',\r\n ];\r\n\r\n if (DSAEnableInFrenchGerman) {\r\n languages = languages.concat(['French', 'German']);\r\n }\r\n\r\n if (IsEnabledForDSAInCHandNLandITandESandSE) {\r\n languages = languages.concat(['Spanish', 'Italian', 'Dutch', 'Swedish']);\r\n }\r\n\r\n if (IsSimplifiedChineseLanguageEnabledInMultipleLanguage) {\r\n languages = languages.concat(['SimplifiedChinese']);\r\n }\r\n\r\n if (IsDomesticSimplifiedChineseEnabled) {\r\n languages = ['SimplifiedChinese'];\r\n }\r\n\r\n if (!(IsSimplifiedChineseLanguageEnabledInMultipleLanguage || IsDomesticSimplifiedChineseEnabled)) {\r\n languages = without(languages, 'SimplifiedChinese');\r\n }\r\n\r\n return languages;\r\n};\r\n\r\nexport const targetingSourceOptions = {\r\n SystemIndex: 'SystemIndex',\r\n AdvertiserSuppliedUrls: 'AdvertiserSuppliedUrls',\r\n All: 'All',\r\n};\r\n\r\nexport const targetingSourceOptionStrings = {\r\n [targetingSourceOptions.SystemIndex]: _TL_('Use Bing\\'s index of my website'),\r\n [targetingSourceOptions.AdvertiserSuppliedUrls]: _TL_('Use URLs from my page feed only'),\r\n [targetingSourceOptions.All]: _TL_('Use URLs from both Bing\\'s index of my website and my page feed'),\r\n};\r\n\r\nexport const defaultTargetingSource = targetingSourceOptions.SystemIndex;\r\n\r\nexport const dsaDefaultTextEnabled = true;\r\n\r\nexport const dsaTargetOptions = {\r\n Category: 'Category',\r\n All: 'All',\r\n 'Specific-ExactUrl': 'Specific-ExactUrl',\r\n 'Specific-Rules': 'Specific-Rules',\r\n CustomLabel: 'CustomLabel',\r\n};\r\n\r\nexport const dsaTargetOptionStrings = {\r\n [dsaTargetOptions.Category]: _TL_('Target categories of webpages'),\r\n [dsaTargetOptions.All]: _TL_('Target all webpages'),\r\n [dsaTargetOptions.Specific]: _TL_('Target specific webpages'),\r\n [dsaTargetOptions.CustomLabel]: _TL_('Target custom labels from your page feed(s)'),\r\n};\r\n\r\nconst getDefaultDsaSettingsForCampaign = ({ permissions }) => {\r\n const dsaDefaultWebsiteLanguage = getDsaDefaultWebsiteLanguage(permissions);\r\n\r\n const defaultSearchDynamic = {\r\n selectedWebsiteLanguage: dsaDefaultWebsiteLanguage,\r\n selectedTargetingSource: defaultTargetingSource,\r\n dynamicTextEnabled: dsaDefaultTextEnabled,\r\n websites: [],\r\n };\r\n\r\n return defaultSearchDynamic;\r\n};\r\n\r\nexport const modelToViewModelForDsaSettings = ({ campaignModel, permissions }) => {\r\n const dsaSettings = findWhere(campaignModel.CampaignSettings, { '@odata.type': '#Model.DynamicSearchAdsSetting' });\r\n\r\n const hasDsaSettings = dsaSettings ? !!dsaSettings.DomainName : false;\r\n\r\n const viewModel = hasDsaSettings ? {\r\n selectedWebsiteLanguage: dsaSettings.Language,\r\n selectedTargetingSource: dsaSettings.Source,\r\n dynamicTextEnabled: dsaSettings.DynamicDescriptionEnabled,\r\n websites: [dsaSettings.DomainName],\r\n } : getDefaultDsaSettingsForCampaign({ permissions });\r\n\r\n return {\r\n hasDsaSettings,\r\n disableDsaSettings: hasDsaSettings,\r\n ...viewModel,\r\n };\r\n};\r\n\r\nexport const bulkModelToViewModelForDsaSettings = ({ campaignModel, permissions }) => {\r\n const hasDsaSettings = !!campaignModel.DomainName;\r\n\r\n const viewModel = hasDsaSettings ? {\r\n selectedWebsiteLanguage: campaignModel.LanguageCode,\r\n selectedTargetingSource: campaignModel.Source,\r\n dynamicTextEnabled: campaignModel.DynamicDescriptionEnabled,\r\n websites: [campaignModel.DomainName],\r\n } : getDefaultDsaSettingsForCampaign({ permissions });\r\n\r\n return {\r\n hasDsaSettings,\r\n disableDsaSettings: hasDsaSettings,\r\n ...viewModel,\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForDsaSettings = ({ campaignViewModel, permissions = {} }) => {\r\n const dsaSettings = {\r\n DomainName: campaignViewModel.websites.join(),\r\n ...(result(permissions.dynamic, 'DSADynamicDescriptionPhase1') && { DynamicDescriptionEnabled: campaignViewModel.dynamicTextEnabled }),\r\n LanguageCode: campaignViewModel.selectedWebsiteLanguage,\r\n Source: campaignViewModel.selectedTargetingSource,\r\n // Page feeds\r\n PageFeedIds: campaignViewModel.selectedTargetingSource !== targetingSourceOptions.SystemIndex ? campaignViewModel.pageFeeds.map(feed => feed.key) : [],\r\n };\r\n\r\n return dsaSettings;\r\n};\r\n","import { findWhere, isEmpty } from 'underscore';\r\nimport { bidStratetyTypeValue } from '@bingads-webui-campaign-react/constants';\r\n\r\nimport { CAMPAIGN_NEGATIVE_REFERENCE_ID } from '../shared/constants';\r\n\r\nexport const viewModelToModelForPredictiveMatching = (campaignViewModel, permissions) => {\r\n const model = {};\r\n\r\n // Predictive Matching\r\n const predictiveTargetingSetting = findWhere(campaignViewModel.CampaignSettings, { '@odata.type': '#Model.PredictiveTargetingSetting' });\r\n const autoTargetingDefault = (predictiveTargetingSetting && predictiveTargetingSetting.PredictiveTargetingEnabled) || false;\r\n const supportedBiddingStrategiesForPredictiveMatching = [\r\n bidStratetyTypeValue.targetCpa,\r\n bidStratetyTypeValue.targetRoas,\r\n bidStratetyTypeValue.maximizeConversions,\r\n ];\r\n const autoTargetingEnabled = supportedBiddingStrategiesForPredictiveMatching.includes(campaignViewModel.BiddingScheme.Type) && (campaignViewModel.isPredictiveMatchingChecked === undefined ? campaignViewModel.AutoTargetingEnabled : campaignViewModel.isPredictiveMatchingChecked);\r\n\r\n // Only sent when predictiveTargetingEnabled change\r\n if (!!autoTargetingEnabled !== autoTargetingDefault) {\r\n model.AutoTargetingEnabled = autoTargetingEnabled || false;\r\n }\r\n\r\n // Brand Protections\r\n if (autoTargetingEnabled && campaignViewModel.brandProtections) {\r\n if (!isEmpty(campaignViewModel.brandProtections.deletedBrandListIds)) {\r\n model.BrandListsAssociations = [\r\n ...model.BrandListsAssociations || [],\r\n ...campaignViewModel.brandProtections.deletedBrandListIds.map(brandListId => ({\r\n Id: brandListId, SharedEntityId: brandListId, EntityId: campaignViewModel.Id || CAMPAIGN_NEGATIVE_REFERENCE_ID, Status: 'Deleted',\r\n })),\r\n ];\r\n }\r\n if (!isEmpty(campaignViewModel.brandProtections.addedBrandListIds)) {\r\n model.BrandListsAssociations = [\r\n ...model.BrandListsAssociations || [],\r\n ...campaignViewModel.brandProtections.addedBrandListIds.map(brandListId => ({\r\n Id: brandListId, SharedEntityId: brandListId, EntityId: campaignViewModel.Id || CAMPAIGN_NEGATIVE_REFERENCE_ID, Status: 'Active',\r\n })),\r\n ];\r\n }\r\n }\r\n\r\n if (model.AutoTargetingEnabled && permissions && !(permissions.dynamic && permissions.dynamic.PredictiveMatching)) {\r\n model.AutoTargetingEnabled = false;\r\n }\r\n\r\n return model;\r\n};\r\n","import { findWhere, pick, extend, isEmpty } from 'underscore';\r\nimport { ScopeLevel } from '@bingads-webui-campaign-react/constants';\r\n\r\nimport { bulkModelToViewModelForConversionGoals, modelToViewModelForConversionGoals } from './campaign-conversion';\r\nimport {\r\n bulkModelToViewModelForLocationTargets,\r\n modelToViewModelForLocationTargets,\r\n modelToViewModelForDayTimeTargets,\r\n bulkModelToViewModelForDayTimeTargets,\r\n modelToViewModelForDeviceTargets,\r\n modelToViewModelForGenderTargets,\r\n modelToViewModelForAgeTargets,\r\n modelToViewModelForCompanyNameTargets,\r\n modelToViewModelForIndustryTargets,\r\n modelToViewModelForJobFunctionTargets,\r\n} from './campaign-criterion';\r\nimport { bulkModelToViewModelForDisclaimer, modelToViewModelForDisclaimer } from './ad-extension';\r\nimport { modelToViewModelForMultiMediaBidAdjustment, modelToViewModelForAutomatedCallToActionOptOut, viewModelToModelForMultiMediaAdBidAdjustment } from './adjustment';\r\nimport { modelToViewModelForDsaSettings, bulkModelToViewModelForDsaSettings } from './dsa-settings';\r\nimport { viewModelToModelForPredictiveMatching } from './predictive-matching';\r\n\r\nconst whitelistedSchemaPropertyKeysForModel = [\r\n 'Id', 'Name', 'Status', 'BiddingScheme', 'Budget', 'Languages', 'AdGroups', 'AutoGeneratedAssetsEnabled', 'AdScheduleUseSearcherTimeZone', 'DisclaimerAdsEnabled', 'AdExtensionAssociations', 'DomainName', 'LanguageCode', 'Source', 'DynamicDescriptionEnabled', 'TrackingUrlTemplate', 'FinalUrlSuffix', 'UrlCustomParameters', 'PageFeedIds', 'AutoTargetingEnabled',\r\n];\r\n\r\nconst editSpecialProperty = [\r\n 'MultiMediaAdBidAdjustment', 'AutomatedCallToActionOptOut', 'CampaignSettings', 'BidStrategyName', 'ExperimentId',\r\n];\r\n\r\nconst whitelistedSchemaPropertyKeysForModelEdit = whitelistedSchemaPropertyKeysForModel.concat(editSpecialProperty);\r\n\r\nconst whitelistedSchemaPropertyKeys = whitelistedSchemaPropertyKeysForModel.concat(['CampaignConversionGoal']);\r\nconst whitelistedSchemaPropertyKeysEdit = whitelistedSchemaPropertyKeys.concat([...editSpecialProperty, 'ImportProperties']);\r\n\r\nconst viewModelToModelForUrlCustomParameters = urlCustomParametersViewModel =>\r\n urlCustomParametersViewModel.filter(({ Key }) => Key);\r\n\r\nexport const viewModelToModelForCampaign = (campaignViewModel, isEdit, i18n, permissions) => {\r\n let model = {\r\n ...pick(campaignViewModel, isEdit ? whitelistedSchemaPropertyKeysForModelEdit : whitelistedSchemaPropertyKeysForModel),\r\n };\r\n\r\n if (isEdit) {\r\n if (!permissions.IsDomesticSimplifiedChineseEnabled || (permissions.IsDomesticSimplifiedChineseEnabled && permissions.dynamic.MMAForCN)) {\r\n model = extend(model, viewModelToModelForMultiMediaAdBidAdjustment(ScopeLevel.Campaign, campaignViewModel, i18n));\r\n } else {\r\n delete model.MultimediaAdBidAdjustment;\r\n delete model.MultiMediaAdBidAdjustment;\r\n }\r\n\r\n if (campaignViewModel.BiddingScheme) {\r\n model = extend(model, viewModelToModelForPredictiveMatching(campaignViewModel, permissions));\r\n }\r\n\r\n if (campaignViewModel.Budget) {\r\n model.BudgetId = campaignViewModel.Budget.Id;\r\n }\r\n\r\n if (campaignViewModel.UrlCustomParameters) {\r\n model.UrlCustomParameters = viewModelToModelForUrlCustomParameters(campaignViewModel.UrlCustomParameters);\r\n }\r\n }\r\n return model;\r\n};\r\n\r\nexport const bulkModelToViewModelForCampaign = ({\r\n campaignModel,\r\n originalCampaignModel,\r\n bundleCountries,\r\n errors,\r\n isEdit,\r\n permissions,\r\n}) => {\r\n let data = {\r\n ...pick(campaignModel, whitelistedSchemaPropertyKeysForModel),\r\n };\r\n data = extend(data, bulkModelToViewModelForLocationTargets({\r\n locationTargetsModel: campaignModel.CampaignCriterions,\r\n bundleCountries,\r\n }));\r\n data = extend(data, bulkModelToViewModelForConversionGoals({\r\n campaignModel,\r\n originalCampaignModel,\r\n errors,\r\n }));\r\n data = extend(data, bulkModelToViewModelForDisclaimer({\r\n campaignModel,\r\n originalCampaignModel,\r\n }));\r\n\r\n if (isEdit) {\r\n data.multimediaAds = originalCampaignModel.multimediaAds;\r\n data.AutomatedCallToActionOptOut = originalCampaignModel.multimediaAds;\r\n data.Device = originalCampaignModel.Device;\r\n data.initialDevice = originalCampaignModel.initialDevice;\r\n data.Gender = originalCampaignModel.Gender;\r\n data.initialGender = originalCampaignModel.initialGender;\r\n data.Age = originalCampaignModel.Age;\r\n data.initialAge = originalCampaignModel.initialAge;\r\n data.companyNameTargets = originalCampaignModel.companyNameTargets;\r\n data.initialCompanyNameTargets = originalCampaignModel.initialCompanyNameTargets;\r\n data.industry = originalCampaignModel.industry;\r\n data.initialIndustry = originalCampaignModel.initialIndustry;\r\n data.initialIndustryTargets = originalCampaignModel.initialIndustryTargets;\r\n data.jobTargets = originalCampaignModel.jobTargets;\r\n data.initialJobTargets = originalCampaignModel.initialJobTargets;\r\n data.initialJobFunctionTargets = originalCampaignModel.initialJobFunctionTargets;\r\n\r\n if (campaignModel.CampaignCriterions) {\r\n data.dayTimeRanges = bulkModelToViewModelForDayTimeTargets(campaignModel.CampaignCriterions, originalCampaignModel.dayTimeRanges || []);\r\n data.adSchedulesBulkUpsert = [];\r\n }\r\n\r\n if (campaignModel.BidStrategyName) {\r\n data.Portofolio = campaignModel.BiddingScheme;\r\n }\r\n\r\n data = extend(data, bulkModelToViewModelForDsaSettings({\r\n campaignModel,\r\n permissions,\r\n }));\r\n }\r\n return data;\r\n};\r\n\r\nexport const modelToViewModelForCampaign = ({\r\n campaignModel,\r\n locationCriterionsModel,\r\n bundleCountries,\r\n disclaimerAssociations,\r\n scheduleCriterionModel,\r\n targetCriterionModel,\r\n pageFeeds,\r\n isEdit,\r\n permissions,\r\n}) => {\r\n let viewModel = {\r\n ...pick(campaignModel, isEdit ? whitelistedSchemaPropertyKeysEdit : whitelistedSchemaPropertyKeys),\r\n };\r\n\r\n if (campaignModel.Status === 'UserPaused') {\r\n viewModel.Status = 'Paused';\r\n }\r\n\r\n if (locationCriterionsModel) {\r\n viewModel = extend(viewModel, modelToViewModelForLocationTargets({\r\n model: locationCriterionsModel,\r\n bundleCountries,\r\n campaignId: campaignModel.Id,\r\n }));\r\n }\r\n\r\n viewModel = extend(viewModel, modelToViewModelForDisclaimer({\r\n disclaimerAssociations,\r\n }));\r\n\r\n if (scheduleCriterionModel && !isEmpty(scheduleCriterionModel)) {\r\n viewModel.dayTimeRanges = modelToViewModelForDayTimeTargets(scheduleCriterionModel);\r\n }\r\n\r\n if (campaignModel.CampaignSettings) {\r\n const disclaimerSetting = findWhere(campaignModel.CampaignSettings, { '@odata.type': '#Model.DisclaimerSetting' });\r\n viewModel.DisclaimerAdsEnabled = (disclaimerSetting && disclaimerSetting.DisclaimerAdsEnabled) || false;\r\n\r\n const rsaSetting = findWhere(campaignModel.CampaignSettings, { '@odata.type': '#Model.ResponsiveSearchAdsSetting' });\r\n viewModel.AutoGeneratedAssetsEnabled = (rsaSetting && rsaSetting.AutoGeneratedAssetsEnabled) || false;\r\n\r\n const predictiveTargetingSetting = findWhere(campaignModel.CampaignSettings, { '@odata.type': '#Model.PredictiveTargetingSetting' });\r\n viewModel.AutoTargetingEnabled = (predictiveTargetingSetting && predictiveTargetingSetting.PredictiveTargetingEnabled) || false;\r\n }\r\n\r\n viewModel = extend(viewModel, modelToViewModelForConversionGoals(campaignModel));\r\n if (isEdit) {\r\n viewModel = extend(viewModel, modelToViewModelForMultiMediaBidAdjustment(ScopeLevel.Campaign, campaignModel.MultiMediaAdBidAdjustment));\r\n viewModel = extend(viewModel, modelToViewModelForAutomatedCallToActionOptOut(campaignModel));\r\n\r\n viewModel = extend(viewModel, modelToViewModelForDeviceTargets({\r\n model: targetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.DeviceCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n viewModel = extend(viewModel, modelToViewModelForDsaSettings({\r\n campaignModel,\r\n permissions,\r\n }));\r\n\r\n viewModel = extend(viewModel, { pageFeeds });\r\n\r\n viewModel = extend(viewModel, modelToViewModelForGenderTargets({\r\n model: targetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.GenderCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n viewModel = extend(viewModel, modelToViewModelForAgeTargets({\r\n model: targetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.AgeCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n viewModel = extend(viewModel, modelToViewModelForCompanyNameTargets({\r\n model: targetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.CompanyNameCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n viewModel = extend(viewModel, modelToViewModelForIndustryTargets({\r\n model: targetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.IndustryCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n viewModel = extend(viewModel, modelToViewModelForJobFunctionTargets({\r\n model: targetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.JobFunctionCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n if (viewModel.BidStrategyName) {\r\n viewModel.Portofolio = viewModel.BiddingScheme;\r\n }\r\n }\r\n return viewModel;\r\n};\r\n","import { Campaign, BrandListAssociation } from '@bingads-webui/campaign-odata-schemas';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\n\r\nimport { bulkModelToViewModelForCampaign, viewModelToModelForCampaign } from './campaign';\r\nimport { viewModelToBulkModelForConversionGoals } from './campaign-conversion';\r\nimport {\r\n viewModelToBulkModelForLocationTargets,\r\n viewModelToBulkModelForSchedule,\r\n viewModelToBulkModelForDeviceTargets,\r\n viewModelToBulkModelForGenderTargets,\r\n viewModelToBulkModelForAgeTargets,\r\n viewModelToBulkModelForCompanyNameTargets,\r\n viewModelToBulkModelForIndustryTargets,\r\n viewModelToBulkModelForJobFunctionTargets,\r\n} from './campaign-criterion';\r\nimport { isBulkWrappedResponse } from '../shared/bulk';\r\nimport { ERROR_ENTITY, getBulkUploadErrorType, modelToViewModelForBulkErrors, removeReferencedEntityInvalidIdErrors } from '../shared/bulk-upsert-errors';\r\nimport { GENERIC_ERROR_MESSAGE_KEY, getErrorsPlaceholders } from '../shared/constants';\r\nimport { viewModelToBulkModelForDisclaimer } from './ad-extension';\r\nimport { viewModelToBulkModelForDsaSettings } from './dsa-settings';\r\n\r\nconst campaignEDM = edmCampaign.types.resolve('Model.Campaign');\r\nconst campaignResource = new campaignEDM.ResourceIdentifier();\r\n\r\nexport const createOrUpdateCampaign = (data) => {\r\n const createOrUpdateCall = data && data.Id ?\r\n campaignResource.bulkUpdate.bind(campaignResource) :\r\n campaignResource.bulkCreate.bind(campaignResource);\r\n return createOrUpdateCall(data);\r\n};\r\n\r\nconst bulkUpsertCampaignSettingsEntityErrorMap = {\r\n [getBulkUploadErrorType(Campaign)]: ERROR_ENTITY.Campaign,\r\n 'Campaign Conversion Goal Error': ERROR_ENTITY.CampaignConversionGoal,\r\n 'Campaign Day Time Criterion Error': ERROR_ENTITY.CampaignDayTimeCriterion,\r\n 'Campaign DeviceOS Criterion Error': ERROR_ENTITY.CampaignDeviceOSCriterion,\r\n 'Campaign Gender Criterion Error': ERROR_ENTITY.CampaignGenderCriterion,\r\n [getBulkUploadErrorType(BrandListAssociation)]: ERROR_ENTITY.BrandListAssociation,\r\n 'Campaign Location Criterion Error': ERROR_ENTITY.CampaignLocation,\r\n 'Campaign Radius Criterion Error': ERROR_ENTITY.CampaignRadius,\r\n 'Campaign Negative Location Criterion Error': ERROR_ENTITY.CampaignNegativeLocation,\r\n 'Campaign Location Intent Criterion Error': ERROR_ENTITY.CampaignLocationIntent,\r\n 'Campaign Company Name Criterion Error': ERROR_ENTITY.CampaignCompanyNameCriterion,\r\n 'Campaign Industry Criterion Error': ERROR_ENTITY.CampaignIndustryCriterion,\r\n 'Campaign Job Function Criterion Error': ERROR_ENTITY.CampaignJobFunctionCriterion,\r\n};\r\n\r\nexport const saveCampaign = ({\r\n campaign: campaignViewModel,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n isEdit,\r\n permissions,\r\n}, {\r\n scenario,\r\n i18n,\r\n activityLogger,\r\n}) => {\r\n const campaignModel = viewModelToModelForCampaign(campaignViewModel, isEdit, i18n, permissions);\r\n const locationTargetsModel = bundleLocationCriterions ? viewModelToBulkModelForLocationTargets(campaignViewModel, bundleLocationCriterions) : [];\r\n const conversionGoalsAssociations = campaignViewModel && campaignViewModel.conversionGoals ? {\r\n CampaignConversionGoalAssociations: viewModelToBulkModelForConversionGoals(campaignViewModel, campaignViewModel.Id),\r\n } : {};\r\n const adExtensionAssociations = viewModelToBulkModelForDisclaimer(campaignViewModel);\r\n const scheduleModel = campaignViewModel.adSchedulesBulkUpsert ? viewModelToBulkModelForSchedule(campaignViewModel.adSchedulesBulkUpsert, campaignModel) : [];\r\n const deviceModel = campaignViewModel.Device ? viewModelToBulkModelForDeviceTargets({ campaignViewModel }) : [];\r\n const dsaSettings = campaignViewModel.hasDsaSettings ? viewModelToBulkModelForDsaSettings({ campaignViewModel, permissions }) : {};\r\n const genderModel = campaignViewModel.Gender ? viewModelToBulkModelForGenderTargets({ campaignViewModel }) : [];\r\n const ageModel = campaignViewModel.Age ? viewModelToBulkModelForAgeTargets({ campaignViewModel }) : [];\r\n const companyNameModel = campaignViewModel.companyNameTargets ? viewModelToBulkModelForCompanyNameTargets({ campaignViewModel }) : [];\r\n const industryModel = campaignViewModel.industry ? viewModelToBulkModelForIndustryTargets({ campaignViewModel }) : [];\r\n const jobFunctionModel = campaignViewModel.jobTargets ? viewModelToBulkModelForJobFunctionTargets({ campaignViewModel }) : [];\r\n const modelToSave = {\r\n ...campaignModel,\r\n ...conversionGoalsAssociations,\r\n ...adExtensionAssociations,\r\n ...dsaSettings,\r\n CampaignCriterions: [\r\n ...locationTargetsModel,\r\n ...scheduleModel,\r\n ...deviceModel,\r\n ...genderModel,\r\n ...ageModel,\r\n ...companyNameModel,\r\n ...industryModel,\r\n ...jobFunctionModel,\r\n ],\r\n };\r\n\r\n return createOrUpdateCampaign(modelToSave)\r\n // with bulk the result will have shape of:\r\n // - { ...entityData } - in case of success;\r\n // - { entity: { ...entityData }, errors: [(EditorialError|MTError)] } - in case of error(s).\r\n .then((result) => {\r\n const data = {\r\n campaign: bulkModelToViewModelForCampaign({\r\n campaignModel: result,\r\n originalCampaignModel: campaignViewModel,\r\n bundleCountries,\r\n permissions,\r\n }),\r\n ...getErrorsPlaceholders(),\r\n };\r\n return data;\r\n }, (bulkOrSystemError) => {\r\n if (isBulkWrappedResponse(bulkOrSystemError)) {\r\n const { entity, errors } = bulkOrSystemError;\r\n const campaign = entity ?\r\n bulkModelToViewModelForCampaign({\r\n campaignModel: entity,\r\n originalCampaignModel: campaignViewModel,\r\n bundleCountries,\r\n errors,\r\n isEdit,\r\n permissions,\r\n }) :\r\n campaignViewModel;\r\n\r\n let filteredErrors = errors;\r\n if (campaign.Id <= 0) {\r\n filteredErrors = removeReferencedEntityInvalidIdErrors(errors);\r\n }\r\n\r\n const serverErrors = modelToViewModelForBulkErrors(\r\n filteredErrors,\r\n bulkUpsertCampaignSettingsEntityErrorMap,\r\n scenario,\r\n i18n,\r\n activityLogger\r\n );\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n campaign,\r\n serverErrors,\r\n });\r\n }\r\n\r\n // Activity\r\n // eslint-disable-next-line no-console\r\n console.warn(`Campaign bulk upsert system error: ${bulkOrSystemError.stack || bulkOrSystemError.message || bulkOrSystemError}`);\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n campaign: campaignViewModel,\r\n systemErrors: [i18n.getString(GENERIC_ERROR_MESSAGE_KEY)],\r\n });\r\n });\r\n};\r\n","import { edmCampaign } from '@bingads-webui/edm-campaign';\r\n\r\n\r\nconst readCampaign = (cid, aid, campaignId) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .get({\r\n select: ['Budget', 'CampaignConversionGoal/Goals'],\r\n })\r\n .toPromise();\r\n\r\nexport const loadCampaign = (cid, aid, campaignId) =>\r\n readCampaign(cid, aid, campaignId);\r\n","import { pick } from 'underscore';\r\n\r\nconst whitelistedSchemaPropertyKeysForModel = [\r\n 'ParentId', 'Id', 'Name', 'Status', 'AdGroupType', 'Language',\r\n];\r\n\r\nexport const viewModelToModelForAdGroup = adGroupViewModel => ({\r\n ...pick(adGroupViewModel, whitelistedSchemaPropertyKeysForModel),\r\n});\r\n\r\nexport const bulkModelToViewModelForAdGroup = ({\r\n adGroupModel,\r\n originalAdGroupModel,\r\n}) => {\r\n const data = {\r\n ...originalAdGroupModel,\r\n ...pick(adGroupModel, whitelistedSchemaPropertyKeysForModel),\r\n };\r\n\r\n return data;\r\n};\r\n\r\nexport const modelToViewModelForAdGroup = (adGroupModel) => {\r\n const viewModel = {\r\n ...pick(adGroupModel, whitelistedSchemaPropertyKeysForModel),\r\n };\r\n\r\n return viewModel;\r\n};\r\n","import { pick, without } from 'underscore';\r\nimport { formatDateToAPIFormat, parseDateFromAPIFormat } from './utils';\r\n\r\nconst whitelistedSchemaPropertyKeysForModel = [\r\n 'Id', 'Status', 'Medium', 'AdDistribution', 'SearchBid', 'StartDate', 'EndDate',\r\n];\r\n\r\nexport const viewModelToModelForAdGroupBudget = (adGroupViewModel, campaignId, i18n) => {\r\n const data = {\r\n ...pick(adGroupViewModel, without(whitelistedSchemaPropertyKeysForModel, 'Status')),\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n };\r\n data.StartDate = formatDateToAPIFormat(i18n, data.StartDate);\r\n data.EndDate = data.EndDate ? formatDateToAPIFormat(i18n, data.EndDate) : '1/1/3000';\r\n\r\n return data;\r\n};\r\n\r\nexport const bulkModelToViewModelForAdGroupBudget = ({\r\n adGroupModel,\r\n i18n,\r\n}) => {\r\n const data = {\r\n ...pick(adGroupModel, whitelistedSchemaPropertyKeysForModel),\r\n };\r\n data.StartDate = parseDateFromAPIFormat(i18n, adGroupModel.StartDate);\r\n data.EndDate = parseDateFromAPIFormat(i18n, adGroupModel.EndDate);\r\n\r\n return data;\r\n};\r\n\r\nexport const modelToViewModelForAdGroupBudget = (adGroupModel, i18n) => {\r\n const viewModel = {\r\n ...pick(adGroupModel, whitelistedSchemaPropertyKeysForModel),\r\n };\r\n\r\n viewModel.StartDate = parseDateFromAPIFormat(i18n, adGroupModel.StartDate);\r\n viewModel.EndDate = parseDateFromAPIFormat(i18n, adGroupModel.EndDate);\r\n\r\n return viewModel;\r\n};\r\n","import { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport { modelToViewModelForAdGroup } from './ad-group';\r\nimport { modelToViewModelForAdGroupBudget } from './ad-group-for-budget';\r\n\r\nexport const readAdGroup = (cid, aid, campaignId, adGroupId) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .AdGroups.$withKey(adGroupId)\r\n .get()\r\n .toPromise();\r\n\r\nexport const loadAdGroup = (cid, aid, campaignId, adGroupId) =>\r\n readAdGroup(cid, aid, campaignId, adGroupId)\r\n .then((result) => {\r\n const data = modelToViewModelForAdGroup(result);\r\n\r\n return data;\r\n });\r\n\r\nexport const loadAdGroupForBudget = (cid, aid, campaignId, adGroupId, i18n) =>\r\n readAdGroup(cid, aid, campaignId, adGroupId)\r\n .then((result) => {\r\n const data = modelToViewModelForAdGroupBudget(result, i18n);\r\n\r\n return data;\r\n });\r\n","import { edmCampaign } from '@bingads-webui/edm-campaign';\r\n\r\n// the magic date is for bidata, but useless for this request\r\nconst magicDate = '9/30/2015';\r\n\r\nexport const loadKeywords = (cid, aid, campaignId, adGroupId, top) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .AdGroups.$withKey(adGroupId)\r\n .Keywords.get({\r\n $top: top,\r\n $count: true,\r\n startDate: magicDate,\r\n endDate: magicDate,\r\n }).toPromise();\r\n","import { findWhere, pick, extend } from 'underscore';\r\nimport {\r\n bulkModelToViewModelForDayTimeTargets,\r\n modelToViewModelForDayTimeTargets,\r\n} from './campaign-criterion';\r\nimport { viewModelToModelForPredictiveMatching } from './predictive-matching';\r\n\r\nconst whitelistedSchemaPropertyKeysForModel = [\r\n 'Id', 'Name', 'Budget', 'BiddingScheme', 'AdScheduleUseSearcherTimeZone', 'BidStrategyName', 'AutoTargetingEnabled',\r\n];\r\n\r\nexport const viewModelToModelForBudget = (campaignViewModel) => {\r\n let viewModel = { ...pick(campaignViewModel, whitelistedSchemaPropertyKeysForModel) };\r\n\r\n if (campaignViewModel.BiddingScheme) {\r\n viewModel = extend(viewModel, viewModelToModelForPredictiveMatching(campaignViewModel));\r\n }\r\n\r\n if (campaignViewModel.Budget) {\r\n viewModel.BudgetId = campaignViewModel.Budget.Id;\r\n }\r\n return viewModel;\r\n};\r\n\r\nexport const bulkModelToViewModelForBudget = ({\r\n campaignModel,\r\n originalCampaignModel,\r\n}) => {\r\n const data = {\r\n ...pick(campaignModel, whitelistedSchemaPropertyKeysForModel),\r\n };\r\n\r\n if (campaignModel.CampaignCriterions) {\r\n data.dayTimeRanges = bulkModelToViewModelForDayTimeTargets(campaignModel.CampaignCriterions, originalCampaignModel.dayTimeRanges || []);\r\n data.adSchedulesBulkUpsert = [];\r\n }\r\n return data;\r\n};\r\n\r\nexport const modelToViewModelForBudget = ({\r\n campaignModel,\r\n scheduleCriterionModel,\r\n}) => {\r\n const viewModel = {\r\n ...pick(campaignModel, whitelistedSchemaPropertyKeysForModel),\r\n };\r\n\r\n viewModel.dayTimeRanges = scheduleCriterionModel ? modelToViewModelForDayTimeTargets(scheduleCriterionModel) : [];\r\n viewModel.CampaignSettings = campaignModel.CampaignSettings;\r\n\r\n if (campaignModel.CampaignSettings) {\r\n const predictiveTargetingSetting = findWhere(campaignModel.CampaignSettings, { '@odata.type': '#Model.PredictiveTargetingSetting' });\r\n viewModel.BiddingScheme = extend({ AutoTargetingEnabled: (predictiveTargetingSetting && predictiveTargetingSetting.PredictiveTargetingEnabled) || false }, viewModel.BiddingScheme);\r\n viewModel.AutoTargetingEnabled = (predictiveTargetingSetting && predictiveTargetingSetting.PredictiveTargetingEnabled) || false;\r\n }\r\n\r\n viewModel.TimeZone = campaignModel.TimeZone;\r\n\r\n return viewModel;\r\n};\r\n","import { Campaign, AdGroup, BrandListAssociation } from '@bingads-webui/campaign-odata-schemas';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport { bulkModelToViewModelForBudget, viewModelToModelForBudget } from './budget';\r\nimport { viewModelToBulkModelForSchedule } from './campaign-criterion';\r\nimport { viewModelToModelForAdGroupBudget, bulkModelToViewModelForAdGroupBudget } from './ad-group-for-budget';\r\nimport { isBulkWrappedResponse } from '../shared/bulk';\r\nimport { ERROR_ENTITY, getBulkUploadErrorType, modelToViewModelForBulkErrors, removeReferencedEntityInvalidIdErrors } from '../shared/bulk-upsert-errors';\r\nimport { GENERIC_ERROR_MESSAGE_KEY, getErrorsPlaceholders } from '../shared/constants';\r\n\r\nconst campaignEDM = edmCampaign.types.resolve('Model.Campaign');\r\nconst campaignResource = new campaignEDM.ResourceIdentifier();\r\n\r\nconst createOrUpdateCampaign = (data) => {\r\n const createOrUpdateCall = data && data.Id ?\r\n campaignResource.bulkUpdate.bind(campaignResource) :\r\n campaignResource.bulkCreate.bind(campaignResource);\r\n return createOrUpdateCall(data);\r\n};\r\n\r\nconst bulkUpsertEntityErrorMap = {\r\n [getBulkUploadErrorType(Campaign)]: ERROR_ENTITY.Campaign,\r\n [getBulkUploadErrorType(AdGroup)]: ERROR_ENTITY.AdGroup,\r\n 'Campaign Day Time Criterion Error': ERROR_ENTITY.CampaignDayTimeCriterion,\r\n [getBulkUploadErrorType(BrandListAssociation)]: ERROR_ENTITY.BrandListAssociation,\r\n};\r\n\r\nexport const saveBudget = ({\r\n campaign: campaignViewModel,\r\n adGroup: adGroupViewModel,\r\n}, {\r\n scenario,\r\n i18n,\r\n activityLogger,\r\n}) => {\r\n const campaignModel = viewModelToModelForBudget(campaignViewModel);\r\n const adgorupModel = viewModelToModelForAdGroupBudget(adGroupViewModel, campaignViewModel.Id, i18n);\r\n const scheduleModel = campaignViewModel.adSchedulesBulkUpsert ? viewModelToBulkModelForSchedule(campaignViewModel.adSchedulesBulkUpsert, campaignModel) : [];\r\n\r\n const modelToSave = {\r\n ...campaignModel,\r\n CampaignCriterions: [\r\n ...scheduleModel,\r\n ],\r\n AdGroups: [adgorupModel],\r\n };\r\n\r\n return createOrUpdateCampaign(modelToSave)\r\n // with bulk the result will have shape of:\r\n // - { ...entityData } - in case of success;\r\n // - { entity: { ...entityData }, errors: [(EditorialError|MTError)] } - in case of error(s).\r\n .then((result) => {\r\n const data = {\r\n campaign: bulkModelToViewModelForBudget({\r\n campaignModel: result,\r\n originalCampaignModel: campaignViewModel,\r\n }),\r\n adGroup: bulkModelToViewModelForAdGroupBudget({\r\n adGroupModel: result && result.AdGroups && result.AdGroups[0],\r\n i18n,\r\n }),\r\n ...getErrorsPlaceholders(),\r\n };\r\n\r\n return data;\r\n }, (bulkOrSystemError) => {\r\n if (isBulkWrappedResponse(bulkOrSystemError)) {\r\n const { entity, errors } = bulkOrSystemError;\r\n const campaign = entity ?\r\n bulkModelToViewModelForBudget({\r\n campaignModel: entity,\r\n originalCampaignModel: campaignViewModel,\r\n }) :\r\n campaignViewModel;\r\n\r\n let filteredErrors = errors;\r\n if (campaign.Id <= 0) {\r\n filteredErrors = removeReferencedEntityInvalidIdErrors(errors);\r\n }\r\n\r\n const serverErrors = modelToViewModelForBulkErrors(\r\n filteredErrors,\r\n bulkUpsertEntityErrorMap,\r\n scenario,\r\n i18n,\r\n activityLogger\r\n );\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n campaign,\r\n adGroup: entity && entity.AdGroups ? bulkModelToViewModelForAdGroupBudget({\r\n adGroupModel: entity.AdGroups[0],\r\n i18n,\r\n }) : adGroupViewModel,\r\n serverErrors,\r\n });\r\n }\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n campaign: campaignViewModel,\r\n adGroup: adGroupViewModel,\r\n systemErrors: [i18n.getString(GENERIC_ERROR_MESSAGE_KEY)],\r\n });\r\n });\r\n};\r\n","import { Campaign, AdGroup, Keyword } from '@bingads-webui/campaign-odata-schemas';\r\nimport { filter, isUndefined, isEmpty, each, isArray, where, contains, map } from 'underscore';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport { getODataErrors } from '@bingads-webui-campaign/api-errors';\r\n\r\nimport { isBulkWrappedResponse } from '../shared/bulk';\r\nimport {\r\n ERROR_ENTITY,\r\n getBulkUploadErrorType,\r\n modelToViewModelForBulkErrors,\r\n removeReferencedEntityInvalidIdErrors,\r\n} from '../shared/bulk-upsert-errors';\r\nimport { GENERIC_ERROR_MESSAGE_KEY } from '../shared/constants';\r\n\r\nconst notEnoughText = '20000';\r\nconst tooMuchText = '20001';\r\nconst adGroupEDM = edmCampaign.types.resolve('Model.AdGroup');\r\nconst adGroupResource = new adGroupEDM.ResourceIdentifier();\r\n\r\nconst bulkUpsertEntityErrorMap = {\r\n [getBulkUploadErrorType(Campaign)]: ERROR_ENTITY.Campaign,\r\n [getBulkUploadErrorType(AdGroup)]: ERROR_ENTITY.AdGroup,\r\n [getBulkUploadErrorType(Keyword)]: ERROR_ENTITY.Keyword,\r\n};\r\n\r\nexport const getKeyFromKeyword = (keyword) => {\r\n switch (keyword.MatchType) {\r\n case 'Broad': return keyword.Text;\r\n case 'Phrase': return `\"${keyword.Text}\"`;\r\n case 'Exact': return `[${keyword.Text}]`;\r\n default: return keyword.Text;\r\n }\r\n};\r\n\r\nconst handleBulkApiError = (error, entity) => {\r\n const clientIdToKeywordMap = {};\r\n if (!isEmpty(entity)) {\r\n const filteredKeywords = filter(entity.Keywords, keyword => isUndefined(keyword.Id));\r\n each(filteredKeywords, (keyword) => {\r\n clientIdToKeywordMap[keyword['Client Id']] = keyword;\r\n });\r\n }\r\n\r\n const globalLegacyI18n = window.globalLegacyI18n.get('component/i18n/loader!campaignui/campaign-creation-advanced');\r\n const s$TextAd = window.globalLegacySchema.get('TextAd');\r\n const getNameAndLengthForProperty = property => ({\r\n name: globalLegacyI18n.get(`ColumnName_${property}`),\r\n length: s$TextAd.properties[property].maxLength,\r\n });\r\n const escapeHtml = text => (text.replace(//g, '>'));\r\n\r\n if (error && error.clientId && !isUndefined(clientIdToKeywordMap[error.clientId])) {\r\n const errorFromAd = contains(['Title', 'Text', 'DestinationUrl'], error.property);\r\n let errorMessage = error.message;\r\n\r\n if (errorFromAd && error.code === tooMuchText && error.message.indexOf('{0}') > -1 && error.message.indexOf('{1}') > -1) {\r\n const pairs = getNameAndLengthForProperty(error.property);\r\n errorMessage = error.message.replace('{0}', pairs.name).replace('{1}', pairs.length);\r\n }\r\n if (errorFromAd && error.code === notEnoughText && error.message.indexOf('{0}') > -1) {\r\n errorMessage = error.message.replace('{0}', getNameAndLengthForProperty(error.property).name);\r\n }\r\n\r\n errorMessage = globalLegacyI18n.getString('Keywords_And_Errors_seperator', escapeHtml(getKeyFromKeyword(clientIdToKeywordMap[error.clientId])), errorMessage);\r\n\r\n if (errorMessage.indexOf(' handleBulkApiError(error, entity);\r\n\r\n const serverErrors = modelToViewModelForBulkErrors(\r\n errorList,\r\n bulkUpsertEntityErrorMap,\r\n scenario,\r\n i18n,\r\n activityLogger,\r\n errorProcessor\r\n );\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n serverErrors,\r\n entity,\r\n });\r\n }\r\n\r\n // Activity\r\n // eslint-disable-next-line no-console\r\n console.warn(`AdGroup bulk upsert system error: ${bulkOrSystemError.stack || bulkOrSystemError.message || bulkOrSystemError}`);\r\n\r\n if (bulkOrSystemError.status === 400) {\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n systemErrors: map(getODataErrors(bulkOrSystemError.errors, i18n), error => error.message),\r\n });\r\n }\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n systemErrors: [i18n.getString(GENERIC_ERROR_MESSAGE_KEY)],\r\n });\r\n }\r\n};\r\n","import _ from 'underscore';\r\nimport { cloneDeep } from '@bingads-webui-universal/primitive-utilities';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport { shouldSelectBundleOption, parseLocationTargets, getLocationIntent, convertLocationStateToLocationSchemaCampaign } from '@bingads-webui-campaign/hotel-common-targets';\r\nimport { locationTargetsOptionKeys } from '@bingads-webui-campaign-react/wizard-shared-components';\r\nimport {\r\n targetOptions,\r\n} from '@bingads-webui-campaign-react/search-campaign-wizard-controls';\r\nimport { getTargetCriterion, hydrateCriterionWithBidAndId } from './utils';\r\n\r\nconst adGroupCriterionTypeName = 'Model.AdGroupCriterion';\r\n\r\nexport const readAdGroupCriterions = (cid, aid, campaignId, adGroupId, type) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .AdGroups.$withKey(adGroupId)\r\n .AdGroupCriterions\r\n .$cast(adGroupCriterionTypeName)\r\n .get({\r\n filter: {\r\n where: type,\r\n },\r\n })\r\n .toPromise();\r\n\r\nexport const readAdGroupLocationCriterions = (cid, aid, campaignId, adGroupId) =>\r\n readAdGroupCriterions(\r\n cid,\r\n aid,\r\n campaignId,\r\n adGroupId,\r\n \"isof(Criterion,'Model.LocationCriterion') or isof(Criterion,'Model.RadiusCriterion') or isof(Criterion,'Model.LocationIntentCriterion')\"\r\n );\r\n\r\nexport const modelToViewModelForAdgroupLocationTargets = ({\r\n model, campaignLocationModel, bundleCountries, adGroupId, campaignId,\r\n}) => {\r\n const {\r\n locations,\r\n intentId,\r\n intentOption,\r\n } = parseLocationTargets(model, 'adGroup', adGroupId);\r\n\r\n // bundleCountries is based on campaign language settings because\r\n // 1. bundle is not used in ad group level location setting\r\n // 2. bundle is only used to compute TargetOption in viewmodel, currently only used for logging\r\n // if any further use, please take care of the bundleCountries, determine to use bundleCountries based on campaign language settings or ad group language settings\r\n const targetOption = locations.length ? targetOptions.specific : targetOptions.everywhere;\r\n // targetOption = shouldSelectBundleOption(bundleCountries, locations) ? targetOptions.bundle : targetOption;\r\n\r\n let parentLevelSettings;\r\n\r\n if (campaignLocationModel) {\r\n const {\r\n locations: campaignLocations,\r\n intentId: campaignIntentId,\r\n intentOption: campaignIntentOption,\r\n } = parseLocationTargets(campaignLocationModel, 'campaign', campaignId);\r\n\r\n let campaignTargetOption = campaignLocations.length ? targetOptions.specific : targetOptions.everywhere;\r\n campaignTargetOption = shouldSelectBundleOption(bundleCountries, campaignLocations) ? targetOptions.bundle : campaignTargetOption;\r\n\r\n parentLevelSettings = {\r\n initLocations: campaignLocations,\r\n currentLocations: campaignLocations,\r\n targetOption: campaignTargetOption,\r\n intentId: campaignIntentId,\r\n ...campaignIntentOption,\r\n };\r\n }\r\n\r\n return {\r\n locationTargets: {\r\n currentLevelSettings: {\r\n initLocations: locations,\r\n currentLocations: locations,\r\n targetOption,\r\n intentId,\r\n ...intentOption,\r\n },\r\n parentLevelSettings,\r\n bidMode: false,\r\n useParentLevel: locations.length === 0,\r\n },\r\n };\r\n};\r\n\r\nexport const readAdGroupScheduleCriterions = (cid, aid, campaignId, adGroupId) =>\r\n readAdGroupCriterions(\r\n cid, aid, campaignId, adGroupId,\r\n \"isof(Criterion,'Model.DayTimeCriterion')\"\r\n );\r\n\r\nexport const viewModelToBulkModelForAdGroupSchedule = (adGroupViewModel, campaign) => {\r\n if (_.isEmpty(adGroupViewModel.dayTimeRanges) && adGroupViewModel.adSchedulesBulkUpsert.every(schedule => schedule.Status === 'Deleted')) {\r\n return [];\r\n }\r\n const targets = adGroupViewModel.adSchedulesBulkUpsert || [];\r\n return targets.map((criterion) => {\r\n const Status = _.isEmpty(criterion) ? 'Active' : criterion.Status;\r\n if (adGroupViewModel.Id) {\r\n return {\r\n ...criterion,\r\n Status,\r\n AdGroup: {\r\n Id: adGroupViewModel.Id,\r\n },\r\n };\r\n }\r\n return {\r\n ...criterion,\r\n Status,\r\n AdGroupName: adGroupViewModel.Name,\r\n CampaignName: campaign.Name,\r\n };\r\n });\r\n};\r\n\r\nexport const readAdGroupTargetCriterion = (cid, aid, campaignId, adGroupId) =>\r\n readAdGroupCriterions(\r\n cid, aid, campaignId, adGroupId,\r\n \"isof(Criterion,'Model.AgeCriterion') or isof(Criterion,'Model.GenderCriterion') or isof(Criterion,'Model.DeviceCriterion') or isof(Criterion,'Model.CompanyNameCriterion') or isof(Criterion,'Model.IndustryCriterion') or isof(Criterion,'Model.JobFunctionCriterion')\"\r\n );\r\n\r\nexport const AdGroupAgeName = ['EighteenToTwentyFive', 'TwentyFiveToThirtyFive', 'ThirtyFiveToFifty', 'FiftyToSixtyFive', 'SixtyFiveAndAbove', 'Unknown'];\r\n\r\nexport const modelToViewModelForAdGroupAgeTargets = ({ model, campaignId, adGroupId }) => {\r\n let initialAge = [];\r\n const ageTargets = AdGroupAgeName.map((name) => {\r\n const targetItem = model && model.find(target => target.Criterion.AgeRange === name);\r\n if (targetItem) {\r\n const isExcluded = targetItem['@odata.type'] === '#Model.NegativeAdGroupCriterion';\r\n return {\r\n Id: targetItem.Id,\r\n Status: targetItem.Status || 'Active',\r\n Criterion: _.extend(targetItem.Criterion, {\r\n AgeCriterion: { Target: targetItem.Criterion.AgeRange },\r\n ...isExcluded ? {} : { BidAdjustment: targetItem.CriterionBid?.Multiplier },\r\n }),\r\n CriterionType: isExcluded ? 'NegativeAge' : 'Age',\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n AdGroup: {\r\n Id: adGroupId,\r\n },\r\n };\r\n }\r\n return {\r\n Status: 'Active',\r\n Criterion: {\r\n '@odata.type': '#Model.AgeCriterion',\r\n Type: 'Age',\r\n AgeCriterion: { Target: name },\r\n BidAdjustment: 0,\r\n },\r\n CriterionType: 'Age',\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n AdGroup: {\r\n Id: adGroupId,\r\n },\r\n };\r\n });\r\n\r\n const ageRanges = ageTargets.filter(target => target.CriterionType === 'Age')\r\n .map(target => target.Criterion.AgeCriterion.Target);\r\n\r\n initialAge = cloneDeep(ageTargets);\r\n return {\r\n Age: ageTargets,\r\n initialAge,\r\n ageRanges,\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForAdGroupDeviceTargets = ({ adGroupViewModel }) => {\r\n const deviceTargets = adGroupViewModel.Device || [];\r\n const initialDevice = adGroupViewModel.initialDevice || [];\r\n const addedDevices = [];\r\n if (adGroupViewModel.currentSelectedDeviceLevel === 'campaign') {\r\n if (_.isEmpty(initialDevice)) {\r\n return [];\r\n }\r\n initialDevice.forEach((target) => {\r\n if (target.Id) {\r\n addedDevices.push({\r\n Criterion: _.extend({ BidAdjustment: 0 }, target.Criterion),\r\n Id: target.Id,\r\n Status: 'Deleted',\r\n CriterionType: target.Criterion.Type,\r\n AdGroup: {\r\n Id: adGroupViewModel.Id,\r\n },\r\n AdGroupId: adGroupViewModel.Id,\r\n });\r\n }\r\n });\r\n return addedDevices;\r\n }\r\n deviceTargets.forEach((target) => {\r\n addedDevices.push({\r\n Criterion: _.extend(target.Status === 'Deleted' ? { BidAdjustment: 0 } : {}, target.Criterion),\r\n Id: target.Id > 0 ? target.Id : null,\r\n Status: target.Status || 'Active',\r\n CriterionType: target.Criterion.Type,\r\n AdGroup: {\r\n Id: adGroupViewModel.Id,\r\n },\r\n AdGroupId: adGroupViewModel.Id,\r\n });\r\n });\r\n return addedDevices;\r\n};\r\n\r\nexport const bulkModelToViewModelForAdGroupDeviceTargets = (targetsModel, update) => targetsModel.map((target) => {\r\n const newTarget = update.filter(t => t.Criterion.DeviceCriterion.DeviceName === target.Criterion.DeviceCriterion.DeviceName);\r\n if (newTarget.length > 0) {\r\n // eslint-disable-next-line no-param-reassign\r\n target.Criterion.Id = newTarget[0].Criterion.Id;\r\n }\r\n return target;\r\n});\r\n\r\nexport const viewModelToBulkModelForAdGroupGenderTargets = ({ adGroupViewModel }) => {\r\n const genderTargets = adGroupViewModel.Gender || [];\r\n const initialGender = adGroupViewModel.initialGender || [];\r\n const addedGenders = [];\r\n if (adGroupViewModel.currentSelectedGenderLevel === 'campaign') {\r\n if (_.isEmpty(initialGender)) {\r\n return [];\r\n }\r\n initialGender.forEach((target) => {\r\n if (target.Id) {\r\n addedGenders.push({\r\n Criterion: _.extend({ BidAdjustment: 0 }, target.Criterion),\r\n Id: target.Id,\r\n Status: 'Deleted',\r\n CriterionType: target.Criterion.Type,\r\n AdGroup: {\r\n Id: adGroupViewModel.Id,\r\n },\r\n AdGroupId: adGroupViewModel.Id,\r\n });\r\n }\r\n });\r\n return addedGenders;\r\n }\r\n genderTargets.forEach((target) => {\r\n addedGenders.push({\r\n Criterion: _.extend(target.Status === 'Deleted' ? { BidAdjustment: 0 } : {}, target.Criterion),\r\n Id: target.Id > 0 ? target.Id : null,\r\n Status: target.Status || 'Active',\r\n CriterionType: target.Criterion.Type,\r\n AdGroup: {\r\n Id: adGroupViewModel.Id,\r\n },\r\n AdGroupId: adGroupViewModel.Id,\r\n });\r\n });\r\n return addedGenders;\r\n};\r\n\r\nexport const bulkModelToViewModelForAdGroupGenderTargets = (targetsModel, update) => targetsModel.map((target) => {\r\n const newTarget = update.filter(t => t.Criterion.GenderCriterion.Target === target.Criterion.GenderCriterion.Target);\r\n if (newTarget.length > 0) {\r\n // eslint-disable-next-line no-param-reassign\r\n target.Criterion.Id = newTarget[0].Criterion.Id;\r\n }\r\n return target;\r\n});\r\n\r\nexport const viewModelToBulkModelForAdGroupAgeTargets = ({ adGroupViewModel }) => {\r\n const ageTargets = adGroupViewModel.Age || [];\r\n const initialAge = adGroupViewModel.initialAge || [];\r\n const addedAges = [];\r\n if (adGroupViewModel.currentSelectedAgeLevel === 'campaign') {\r\n if (_.isEmpty(initialAge)) {\r\n return [];\r\n }\r\n initialAge.forEach((target) => {\r\n if (target.Id) {\r\n addedAges.push({\r\n Criterion: _.extend(target.Criterion, { BidAdjustment: 0 }),\r\n Id: target.Id,\r\n Status: 'Deleted',\r\n CriterionType: target.CriterionType,\r\n AdGroup: {\r\n Id: adGroupViewModel.Id,\r\n },\r\n AdGroupId: adGroupViewModel.Id,\r\n });\r\n }\r\n });\r\n return addedAges;\r\n }\r\n ageTargets.forEach((target) => {\r\n const initialTarget = initialAge.find(age => age.CriterionType === target.CriterionType && age.Criterion.AgeCriterion.Target === target.Criterion.AgeCriterion.Target);\r\n if (!initialTarget || !(target.Id > 0) || target.Criterion.BidAdjustment !== initialTarget.Criterion.BidAdjustment) {\r\n addedAges.push({\r\n Criterion: target.Criterion,\r\n Id: initialTarget && target.Id > 0 ? target.Id : null,\r\n Status: target.Status || 'Active',\r\n CriterionType: target.CriterionType,\r\n AdGroup: {\r\n Id: adGroupViewModel.Id,\r\n },\r\n AdGroupId: adGroupViewModel.Id,\r\n });\r\n }\r\n });\r\n const removedAges = initialAge.filter(initialTarget => initialTarget.Id > 0 && ageTargets.find(age => age.CriterionType === initialTarget.CriterionType && age.Criterion.AgeCriterion.Target === initialTarget.Criterion.AgeCriterion.Target) === undefined)\r\n .map(target => ({\r\n Criterion: _.extend(target.Criterion, { BidAdjustment: 0 }),\r\n Id: target.Id,\r\n Status: 'Deleted',\r\n CriterionType: target.CriterionType,\r\n AdGroup: {\r\n Id: adGroupViewModel.Id,\r\n },\r\n AdGroupId: adGroupViewModel.Id,\r\n }));\r\n return [...addedAges, ...removedAges];\r\n};\r\n\r\nexport const bulkModelToViewModelForAdGroupAgeTargets = (targetsModel, update) => targetsModel.map((target) => {\r\n const newTarget = update.filter(t => t.Criterion.AgeCriterion.Target === target.Criterion.AgeCriterion.Target);\r\n if (newTarget.length > 0) {\r\n // eslint-disable-next-line no-param-reassign\r\n target.Criterion.Id = newTarget[0].Criterion.Id;\r\n }\r\n return target;\r\n});\r\n\r\nexport const updateAdGroupAgeTargets = (targetsModel, ageRanges) => targetsModel.map((target) => {\r\n const isExcluded = ageRanges.find(ageRange => ageRange === target.Criterion.AgeCriterion.Target) === undefined;\r\n if (isExcluded) {\r\n if (target.CriterionType === 'Age') {\r\n return {\r\n ...target,\r\n Criterion: {\r\n ...target.Criterion,\r\n BidAdjustment: undefined,\r\n },\r\n CriterionType: 'NegativeAge',\r\n };\r\n }\r\n } else if (target.CriterionType === 'NegativeAge') {\r\n return {\r\n ...target,\r\n Criterion: {\r\n ...target.Criterion,\r\n BidAdjustment: 0,\r\n },\r\n CriterionType: 'Age',\r\n };\r\n }\r\n return target;\r\n});\r\n\r\nexport const modelToViewModelForAdGroupCompanyNameTargets = ({ model, campaignViewModel, currentLevel }) => {\r\n let companyNameTargets = [];\r\n let initialCompanyNameTargets = [];\r\n if (model && !_.isEmpty(model)) {\r\n companyNameTargets = model.map(target => ({\r\n Id: target.Id,\r\n Target: target.Criterion.ProfileId,\r\n Size: target.Criterion.Size,\r\n Industry: target.Criterion.Industry,\r\n Name: target.Criterion.CompanyName,\r\n BidAdjustment: target.CriterionBid.Multiplier,\r\n }));\r\n }\r\n initialCompanyNameTargets = cloneDeep(companyNameTargets);\r\n return {\r\n companyNameTargets: currentLevel === 'campaign' ? campaignViewModel.companyNameTargets : companyNameTargets,\r\n initialCompanyNameTargets,\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForAdGroupCompanyNameTargets = ({ adGroupViewModel, campaignViewModel }) => {\r\n const companyNameTargets = adGroupViewModel.companyNameTargets || [];\r\n const initialCompanyNameTargets = adGroupViewModel.initialCompanyNameTargets || [];\r\n\r\n let addedCompanyNameTargets = [];\r\n let removedCompanyNameTargets = [];\r\n\r\n if (adGroupViewModel.currentSelectedCompanyNameLevel === 'campaign') {\r\n if (_.isEmpty(initialCompanyNameTargets)) {\r\n return [];\r\n }\r\n removedCompanyNameTargets = initialCompanyNameTargets.map(target => ({ ...target, criterion: target.Target, status: 'Deleted' }));\r\n } else {\r\n addedCompanyNameTargets = companyNameTargets.filter(target => initialCompanyNameTargets.find(initialTarget =>\r\n initialTarget.Target === target.Target && initialTarget.BidAdjustment === target.BidAdjustment) === undefined);\r\n removedCompanyNameTargets = initialCompanyNameTargets.filter(initialTarget => companyNameTargets.find(target =>\r\n initialTarget.Target === target.Target) === undefined).map(target => ({ ...target, criterion: target.Target, status: 'Deleted' }));\r\n }\r\n\r\n const addedCompanyNameCriterion = getTargetCriterion({\r\n targets: addedCompanyNameTargets.map(({ Id, ...criterion }) => ({ Id, criterion })), type: 'CompanyName', propKey: 'Target', level: 'adgroup', adGroupViewModel, campaignViewModel,\r\n });\r\n const removedCompanyNameCriterion = getTargetCriterion({\r\n targets: removedCompanyNameTargets, type: 'CompanyName', propKey: 'Target', level: 'adgroup', adGroupViewModel, campaignViewModel,\r\n });\r\n\r\n if (addedCompanyNameCriterion && addedCompanyNameCriterion.length > 0) {\r\n hydrateCriterionWithBidAndId('CompanyName', initialCompanyNameTargets, addedCompanyNameCriterion);\r\n }\r\n\r\n return [\r\n ...addedCompanyNameCriterion,\r\n ...removedCompanyNameCriterion,\r\n ];\r\n};\r\n\r\nexport const modelToViewModelForAdGroupIndustryTargets = ({ model, campaignViewModel, currentLevel }) => {\r\n let industryTargets = [];\r\n let initialIndustry = [];\r\n if (model && !_.isEmpty(model)) {\r\n industryTargets = model.map(target => ({\r\n Id: target.Id,\r\n BidAdjustment: target.CriterionBid.Multiplier,\r\n criterion: target.Criterion.ProfileId,\r\n }));\r\n }\r\n initialIndustry = cloneDeep(industryTargets);\r\n return {\r\n industry: currentLevel === 'campaign' ? campaignViewModel.industry : industryTargets.map(target => target.criterion),\r\n initialIndustryTargets: currentLevel === 'campaign' ? campaignViewModel.initialIndustryTargets : initialIndustry,\r\n initialIndustry,\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForAdGroupIndustryTargets = ({ adGroupViewModel, campaignViewModel }) => {\r\n const industryTargets = adGroupViewModel.industry || [];\r\n const initialIndustryTargets = adGroupViewModel.initialIndustry || [];\r\n const { industryTargetsBidAdjustment } = adGroupViewModel;\r\n\r\n let addedIndustryTargets = [];\r\n let removedIndustryTargets = [];\r\n\r\n if (adGroupViewModel.currentSelectedIndustryLevel === 'campaign') {\r\n if (_.isEmpty(initialIndustryTargets)) {\r\n return [];\r\n }\r\n removedIndustryTargets = initialIndustryTargets.map(target => ({ ...target, status: 'Deleted' }));\r\n } else {\r\n const isIndustryTargetBidAdjustmentUpdated = ({ criterion, BidAdjustment }) => industryTargetsBidAdjustment.find(targetWithBid =>\r\n _.get(targetWithBid, 'Criterion.IndustryCriterion.Target') === criterion && _.get(targetWithBid, 'Criterion.BidAdjustment') === BidAdjustment);\r\n\r\n addedIndustryTargets = industryTargets.filter(target => initialIndustryTargets.find(initialTarget =>\r\n initialTarget.criterion === target && (!industryTargetsBidAdjustment || isIndustryTargetBidAdjustmentUpdated(initialTarget))) === undefined);\r\n removedIndustryTargets = initialIndustryTargets.filter(initialTarget => industryTargets.find(target =>\r\n initialTarget.criterion === target) === undefined).map(target => ({ ...target, status: 'Deleted' }));\r\n }\r\n\r\n const addedIndustryCriterion = getTargetCriterion({\r\n targets: addedIndustryTargets.map(criterion => ({ criterion })), type: 'Industry', propKey: 'Target', level: 'adgroup', adGroupViewModel, campaignViewModel,\r\n });\r\n const removedIndustryCriterion = getTargetCriterion({\r\n targets: removedIndustryTargets, type: 'Industry', propKey: 'Target', level: 'adgroup', adGroupViewModel, campaignViewModel,\r\n });\r\n\r\n if (industryTargetsBidAdjustment && industryTargetsBidAdjustment.length > 0) {\r\n hydrateCriterionWithBidAndId('Industry', initialIndustryTargets, addedIndustryCriterion, industryTargetsBidAdjustment);\r\n }\r\n\r\n return [\r\n ...addedIndustryCriterion,\r\n ...removedIndustryCriterion,\r\n ];\r\n};\r\n\r\nexport const modelToViewModelForAdGroupJobFunctionTargets = ({ model, campaignViewModel, currentLevel }) => {\r\n let jobFunctionTargets = [];\r\n let initialJobTargets = [];\r\n if (model && !_.isEmpty(model)) {\r\n jobFunctionTargets = model.map(target => ({\r\n Id: target.Id,\r\n BidAdjustment: target.CriterionBid.Multiplier,\r\n criterion: target.Criterion.ProfileId,\r\n }));\r\n }\r\n initialJobTargets = cloneDeep(jobFunctionTargets);\r\n return {\r\n jobTargets: currentLevel === 'campaign' ? campaignViewModel.jobTargets : jobFunctionTargets.map(target => target.criterion),\r\n initialJobFunctionTargets: currentLevel === 'campaign' ? campaignViewModel.initialJobFunctionTargets : initialJobTargets,\r\n initialJobTargets,\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForAdGroupJobFunctionTargets = ({ adGroupViewModel, campaignViewModel }) => {\r\n const jobTargets = adGroupViewModel.jobTargets || [];\r\n const initialJobTargets = adGroupViewModel.initialJobTargets || [];\r\n const { jobTargetBidAdjustments } = adGroupViewModel;\r\n\r\n let addedJobTargets = [];\r\n let removedJobTargets = [];\r\n\r\n if (adGroupViewModel.currentSelectedJobFunctionLevel === 'campaign') {\r\n if (_.isEmpty(initialJobTargets)) {\r\n return [];\r\n }\r\n removedJobTargets = initialJobTargets.map(target => ({ ...target, status: 'Deleted' }));\r\n } else {\r\n const isJobTargetBidAdjustmentUpdated = ({ criterion, BidAdjustment }) => jobTargetBidAdjustments.find(targetWithBid =>\r\n _.get(targetWithBid, 'Criterion.JobFunctionCriterion.Target') === criterion && _.get(targetWithBid, 'Criterion.BidAdjustment') === BidAdjustment);\r\n\r\n addedJobTargets = jobTargets.filter(target => initialJobTargets.find(initialTarget =>\r\n initialTarget.criterion === target && (!jobTargetBidAdjustments || isJobTargetBidAdjustmentUpdated(initialTarget))) === undefined);\r\n removedJobTargets = initialJobTargets.filter(initialTarget => jobTargets.find(target =>\r\n initialTarget.criterion === target) === undefined).map(target => ({ ...target, status: 'Deleted' }));\r\n }\r\n\r\n const addedJobCriterion = getTargetCriterion({\r\n targets: addedJobTargets.map(criterion => ({ criterion })), type: 'JobFunction', propKey: 'Target', level: 'adgroup', adGroupViewModel, campaignViewModel,\r\n });\r\n const removedJobCriterion = getTargetCriterion({\r\n targets: removedJobTargets, type: 'JobFunction', propKey: 'Target', level: 'adgroup', adGroupViewModel, campaignViewModel,\r\n });\r\n\r\n if (jobTargetBidAdjustments && jobTargetBidAdjustments.length > 0) {\r\n hydrateCriterionWithBidAndId('JobFunction', initialJobTargets, addedJobCriterion, jobTargetBidAdjustments);\r\n }\r\n\r\n return [\r\n ...addedJobCriterion,\r\n ...removedJobCriterion,\r\n ];\r\n};\r\n\r\nexport const modelToViewModelForAdGroupLocationTargets = ({\r\n model, campaignLocationModel, bundleCountries, adGroupId, campaignId,\r\n}) => {\r\n const {\r\n locations,\r\n intentId,\r\n intentOption,\r\n } = parseLocationTargets(model, 'adGroup', adGroupId);\r\n\r\n let targetOption = locations.length ? locationTargetsOptionKeys.specific : locationTargetsOptionKeys.everywhere;\r\n targetOption = shouldSelectBundleOption(bundleCountries, locations) ? locationTargetsOptionKeys.bundleOrDefaultMarket : targetOption;\r\n\r\n let parentLevelSettings;\r\n\r\n if (campaignLocationModel) {\r\n const {\r\n locations: campaignLocations,\r\n intentId: campaignIntentId,\r\n intentOption: campaignIntentOption,\r\n } = parseLocationTargets(campaignLocationModel, 'campaign', campaignId);\r\n\r\n let campaignTargetOption = locations.length ? locationTargetsOptionKeys.specific : locationTargetsOptionKeys.everywhere;\r\n campaignTargetOption = shouldSelectBundleOption(bundleCountries, locations) ? locationTargetsOptionKeys.bundleOrDefaultMarket : targetOption;\r\n\r\n parentLevelSettings = {\r\n initLocations: campaignLocations,\r\n currentLocations: campaignLocations,\r\n targetOption: campaignTargetOption,\r\n intentId: campaignIntentId,\r\n ...campaignIntentOption,\r\n };\r\n }\r\n\r\n return {\r\n locationTargets: {\r\n currentLevelSettings: {\r\n initLocations: locations,\r\n currentLocations: locations,\r\n targetOption,\r\n intentId,\r\n ...intentOption,\r\n },\r\n parentLevelSettings,\r\n bidMode: true,\r\n useParentLevel: locations.length === 0,\r\n },\r\n };\r\n};\r\n\r\nexport const viewModelToBulkModelForAdGroupLocationTargets = (bundleLocationCriterions, adGroupViewModel, campaignViewModel) => {\r\n if (!adGroupViewModel.locationTargets) {\r\n return [];\r\n }\r\n const bulkUpsertModel = convertLocationStateToLocationSchemaCampaign(\r\n adGroupViewModel.locationTargets,\r\n bundleLocationCriterions,\r\n {\r\n bidStrategy: {\r\n option: '',\r\n },\r\n ...campaignViewModel,\r\n },\r\n {\r\n ...adGroupViewModel,\r\n name: {\r\n value: adGroupViewModel.Name,\r\n },\r\n }\r\n );\r\n return bulkUpsertModel;\r\n};\r\n\r\nexport const bulkModelToViewModelForAdGroupLocationTargets = (locationTargetsModel, bundleCountries, originaladGroupModel) => {\r\n const locations = locationTargetsModel\r\n .filter(criterion => criterion.Criterion.Type === 'Location' || criterion.Criterion.Type === 'Radius');\r\n const intent = locationTargetsModel.find(criterion => criterion.Criterion.Type === 'LocationIntentCriterion');\r\n const intentId = intent ? intent.Id : null;\r\n const intentOption = intent ? getLocationIntent(intent.Criterion.LocationIntentCriterion.IntentOption) : null;\r\n let targetOption = locations.length ? locationTargetsOptionKeys.specific : locationTargetsOptionKeys.everywhere;\r\n targetOption = shouldSelectBundleOption(bundleCountries, locations) ? locationTargetsOptionKeys.bundleOrDefaultMarket : targetOption;\r\n const parentLevelSettings = originaladGroupModel.locationTargets && originaladGroupModel.locationTargets.parentLevelSettings;\r\n return {\r\n locationTargets: {\r\n currentLevelSettings: {\r\n initLocations: locations,\r\n currentLocations: locations,\r\n targetOption,\r\n intentId,\r\n ...intentOption,\r\n },\r\n parentLevelSettings,\r\n bidMode: true,\r\n useParentLevel: locations.length === 0,\r\n },\r\n };\r\n};\r\n","import { map, pick, reduce, isEmpty, filter, each, isString, difference, pluck, keys } from 'underscore';\r\nimport { cloneDeep } from '@bingads-webui-universal/primitive-utilities';\r\nimport { defaultBid } from '@bingads-webui-campaign-legacy/budget/shared/defaultBid';\r\n\r\n// TODO define the type of dsaTargets here\r\nexport const DSA_TARGET_TYPES = {\r\n categoryTargets: 'categoryTargets',\r\n allTargets: 'allTargets',\r\n specificTargets: 'specificTargets',\r\n customLabelTargets: 'customLabelTargets',\r\n};\r\n\r\nexport const DSA_TARGET_SUB_TYPES = {\r\n exactUrls: 'exactUrls',\r\n rules: 'rules',\r\n};\r\n\r\nexport const DSA_TARGET_OPERAND_TYPES = {\r\n Url: 'Url',\r\n Category: 'Category',\r\n PageTitle: 'PageTitle',\r\n PageContent: 'PageContent',\r\n CustomLabel: 'CustomLabel',\r\n};\r\n\r\nexport const DSA_TARGET_OPERAND_TYPE_STRINGS = {\r\n [DSA_TARGET_OPERAND_TYPES.Url]: _TL_('URL'),\r\n [DSA_TARGET_OPERAND_TYPES.Category]: _TL_('Category'),\r\n [DSA_TARGET_OPERAND_TYPES.PageTitle]: _TL_('Page title'),\r\n [DSA_TARGET_OPERAND_TYPES.PageContent]: _TL_('Page content'),\r\n [DSA_TARGET_OPERAND_TYPES.CustomLabel]: _TL_('Custom label'),\r\n};\r\n\r\nexport const DSA_TARGET_OPERATOR_TYPES = {\r\n Contains: 'Contains',\r\n Equals: 'Equals',\r\n};\r\n\r\nexport const DSA_TARGET_OPERATOR_TYPE_STRINGS = {\r\n [DSA_TARGET_OPERATOR_TYPES.Contains]: _TL_('Contains'),\r\n [DSA_TARGET_OPERATOR_TYPES.Equals]: _TL_('Equals'),\r\n};\r\n\r\nexport const DSA_SPECIFIC_TARGET_OPERATOR_MAP = {\r\n [DSA_TARGET_OPERAND_TYPES.Url]: 'Contains',\r\n [DSA_TARGET_OPERAND_TYPES.PageTitle]: 'Contains',\r\n [DSA_TARGET_OPERAND_TYPES.PageContent]: 'Contains',\r\n [DSA_TARGET_OPERAND_TYPES.Category]: 'Equals',\r\n [DSA_TARGET_OPERAND_TYPES.CustomLabel]: 'Equals',\r\n};\r\n\r\nconst formatConditions = conditions => map(conditions, condition => pick(condition, 'Operand', 'Operator', 'ArgumentOperand'));\r\n\r\nconst convertItemsToDsaTarget = (items, savedItems, type, campaignName, adGroupName) => {\r\n const itemsToSave = [];\r\n\r\n each(items, (item) => {\r\n const ItemSaved = savedItems[item.key];\r\n\r\n if (!ItemSaved || ItemSaved.Bid !== item.Bid) {\r\n let newItem = cloneDeep(item);\r\n if (ItemSaved) {\r\n newItem = { ...newItem, conditions: [] };\r\n newItem.Id = ItemSaved.Id;\r\n }\r\n itemsToSave.push(newItem);\r\n }\r\n });\r\n\r\n const keyOfItemsToDelete = difference(keys(savedItems), pluck(items, 'key'));\r\n\r\n each(keyOfItemsToDelete, (key) => {\r\n const ItemSaved = savedItems[key];\r\n\r\n ItemSaved.Status = 'Deleted';\r\n ItemSaved.conditions = [];\r\n itemsToSave.push(ItemSaved);\r\n });\r\n\r\n const dsaTarget = map(itemsToSave, (item) => {\r\n const res = {\r\n AdGroupName: adGroupName,\r\n CampaignName: campaignName,\r\n Bid: item.Bid || defaultBid(),\r\n Criterion: {\r\n Type: 'Webpage',\r\n WebPage: {\r\n Parameter: {\r\n Conditions: type === DSA_TARGET_TYPES.allTargets ? [] : filter(formatConditions(item.conditions), con => !isEmpty(con)),\r\n },\r\n },\r\n },\r\n };\r\n\r\n const itemStatus = item.Status ? { Status: item.Status } : {};\r\n const itemId = item.Id ? { Id: item.Id } : {};\r\n // if (type === 'specificpage' || type === 'exacturls') {\r\n // res.serializedConditions = JSON.stringify('conditionsWithOperator');\r\n // } else {\r\n // res.serializedConditions = '';\r\n // }\r\n\r\n return {\r\n ...res,\r\n ...itemStatus,\r\n ...itemId,\r\n };\r\n });\r\n\r\n return dsaTarget;\r\n};\r\n\r\nexport const viewModelToBulkModelForDsaTarget = ({ dsaViewModel, campaignName, adGroupName }) => {\r\n const dsaTargets = reduce(dsaViewModel, (acc, value, key) => {\r\n const items = key === DSA_TARGET_TYPES.specificTargets ? [...value.exactUrls.items, ...value.rules.items] : value.items;\r\n const savedItems = key === DSA_TARGET_TYPES.specificTargets ? { ...value.exactUrls.savedItems, ...value.rules.savedItems } : value.savedItems;\r\n const selectedItems = !value.disabled && value.selected ? items : [];\r\n return ([\r\n ...acc,\r\n ...convertItemsToDsaTarget(selectedItems, savedItems, key, campaignName, adGroupName),\r\n ]);\r\n }, []);\r\n\r\n return dsaTargets;\r\n};\r\n\r\nconst dsaTargetsMapper = (conditions) => {\r\n if (conditions.length === 0) {\r\n return { dsaType: DSA_TARGET_TYPES.allTargets, viewConditions: [] };\r\n }\r\n if (conditions.length > 1) {\r\n return { dsaType: DSA_TARGET_TYPES.specificTargets, dsaSubtype: DSA_TARGET_SUB_TYPES.rules, viewConditions: [...conditions] };\r\n }\r\n\r\n const { Operand, Operator } = conditions[0];\r\n if (Operand === DSA_TARGET_OPERAND_TYPES.CustomLabel) {\r\n return { dsaType: DSA_TARGET_TYPES.customLabelTargets, viewConditions: [{ ...conditions[0] }] };\r\n }\r\n if (Operand === DSA_TARGET_OPERAND_TYPES.Url && Operator === DSA_TARGET_OPERATOR_TYPES.Equals) {\r\n return { dsaType: DSA_TARGET_TYPES.specificTargets, dsaSubtype: DSA_TARGET_SUB_TYPES.exactUrls, viewConditions: [{ ...conditions[0] }] };\r\n }\r\n if (Operand === DSA_TARGET_OPERAND_TYPES.Category) {\r\n return { dsaType: DSA_TARGET_TYPES.categoryTargets, viewConditions: [{ ...conditions[0] }] };\r\n }\r\n return { dsaType: DSA_TARGET_TYPES.specificTargets, dsaSubtype: DSA_TARGET_SUB_TYPES.rules, viewConditions: [...conditions] };\r\n};\r\n\r\nconst defaultDsaTarget = {\r\n [DSA_TARGET_TYPES.categoryTargets]: {\r\n disabled: false,\r\n selected: false,\r\n items: [],\r\n savedItems: {},\r\n },\r\n [DSA_TARGET_TYPES.allTargets]: {\r\n disabled: false,\r\n selected: false,\r\n items: [],\r\n savedItems: {},\r\n },\r\n [DSA_TARGET_TYPES.specificTargets]: {\r\n disabled: false,\r\n selected: false,\r\n [DSA_TARGET_SUB_TYPES.exactUrls]: {\r\n items: [],\r\n savedItems: {},\r\n },\r\n [DSA_TARGET_SUB_TYPES.rules]: {\r\n items: [],\r\n savedItems: {},\r\n },\r\n },\r\n [DSA_TARGET_TYPES.customLabelTargets]: {\r\n disabled: false,\r\n selected: false,\r\n items: [],\r\n savedItems: {},\r\n },\r\n};\r\n\r\nexport const bulkModelToViewModelForDsaTarget = (dsaBulkModel, originaladGroupModel) => {\r\n const res = {\r\n [DSA_TARGET_TYPES.categoryTargets]: {\r\n disabled: originaladGroupModel.DsaTargets[DSA_TARGET_TYPES.categoryTargets].disabled,\r\n selected: false,\r\n items: [],\r\n savedItems: {},\r\n },\r\n [DSA_TARGET_TYPES.allTargets]: {\r\n disabled: originaladGroupModel.DsaTargets[DSA_TARGET_TYPES.allTargets].disabled,\r\n selected: false,\r\n items: [],\r\n savedItems: {},\r\n },\r\n [DSA_TARGET_TYPES.specificTargets]: {\r\n disabled: originaladGroupModel.DsaTargets[DSA_TARGET_TYPES.specificTargets].disabled,\r\n selected: false,\r\n [DSA_TARGET_SUB_TYPES.exactUrls]: {\r\n items: [],\r\n savedItems: {},\r\n },\r\n [DSA_TARGET_SUB_TYPES.rules]: {\r\n items: [],\r\n savedItems: {},\r\n },\r\n },\r\n [DSA_TARGET_TYPES.customLabelTargets]: {\r\n disabled: originaladGroupModel.DsaTargets[DSA_TARGET_TYPES.customLabelTargets].disabled,\r\n selected: false,\r\n items: [],\r\n savedItems: {},\r\n },\r\n };\r\n\r\n each(dsaBulkModel, (bulkItem) => {\r\n const {\r\n Bid, 'Client Id': ClientId, Id, Criterion: { WebPage: { Parameter: { Conditions } } },\r\n } = bulkItem;\r\n const { dsaType, dsaSubtype, viewConditions } = dsaTargetsMapper(Conditions);\r\n if (dsaSubtype) {\r\n res[dsaType][dsaSubtype].items.push({\r\n Bid, conditions: viewConditions, 'Client Id': ClientId, Id, isValid: true, isBidValid: true, isConditionValid: true,\r\n });\r\n } else {\r\n res[dsaType].items.push({\r\n Bid, conditions: viewConditions, 'Client Id': ClientId, Id, isValid: true, isBidValid: true, isConditionValid: true,\r\n });\r\n }\r\n res[dsaType].selected = true;\r\n });\r\n\r\n return res;\r\n};\r\n\r\nexport const bulkModelToViewModelForDsaTargetUnderDsaEntity = (dsaBulkModel) => {\r\n const res = cloneDeep(defaultDsaTarget);\r\n\r\n each(dsaBulkModel, (bulkItem) => {\r\n const { CriterionBid: { Bid: { Amount } }, Criterion: { Parameter: { Conditions } } } = bulkItem;\r\n const { dsaType, dsaSubtype, viewConditions } = dsaTargetsMapper(Conditions);\r\n if (dsaSubtype) {\r\n res[dsaType][dsaSubtype].items.push({ Bid: Amount, conditions: viewConditions });\r\n } else {\r\n res[dsaType].items.push({ Bid: Amount, conditions: viewConditions });\r\n }\r\n res[dsaType].selected = true;\r\n });\r\n\r\n return res;\r\n};\r\n\r\nconst checkArgumentOperandFormat = (argumentOperand) => {\r\n if (!isString(argumentOperand)) {\r\n return argumentOperand;\r\n }\r\n let hasComma = false;\r\n let hasDoubleQuote = false;\r\n let resultArgumentOperand = argumentOperand;\r\n\r\n if (argumentOperand.includes(',')) {\r\n hasComma = true;\r\n }\r\n if (argumentOperand.includes('\"')) {\r\n hasDoubleQuote = true;\r\n }\r\n if (hasDoubleQuote) {\r\n resultArgumentOperand = resultArgumentOperand.replaceAll('\"', '\"\"');\r\n }\r\n if (hasDoubleQuote || hasComma) {\r\n resultArgumentOperand = `\"${resultArgumentOperand}\"`;\r\n }\r\n return resultArgumentOperand;\r\n};\r\n\r\nexport const generateKeyAndFormateDsaTarget = (conditions) => {\r\n const conditionsWithoutDisplayValue = [];\r\n\r\n each(conditions, (condition) => {\r\n const formattedCondition = {\r\n ...condition,\r\n ArgumentOperand: checkArgumentOperandFormat(condition.ArgumentOperand),\r\n };\r\n conditionsWithoutDisplayValue.push(pick(formattedCondition, 'ArgumentOperand', 'Operand', 'Operator'));\r\n });\r\n\r\n const key = JSON.stringify(conditionsWithoutDisplayValue);\r\n\r\n return {\r\n isValid: true,\r\n key,\r\n conditions,\r\n };\r\n};\r\n\r\nexport const getNestedValue = (obj, path) => path.split('.').reduce((acc, key) => acc && acc[key], obj);\r\n\r\nexport const insertErrorsByClientIdAndGenerateKey = (data, paths, errors) => {\r\n const errorClientIdMap = {};\r\n\r\n errors.forEach((error) => {\r\n const { clientId, message } = error;\r\n errorClientIdMap[clientId] = message;\r\n });\r\n\r\n paths.forEach((path) => {\r\n const value = getNestedValue(data, path);\r\n\r\n const savedItems = {};\r\n\r\n if (value && value.items) {\r\n value.items.forEach((item) => {\r\n const newConditions = generateKeyAndFormateDsaTarget(item.conditions);\r\n if (errorClientIdMap[item['Client Id']]) {\r\n const newItem = { ...item, errors: item.errors || [] };\r\n Object.assign(item, newItem);\r\n item.errors.push({ message: errorClientIdMap[item['Client Id']] });\r\n } else {\r\n savedItems[newConditions.key] = item;\r\n }\r\n Object.assign(item, newConditions);\r\n });\r\n }\r\n Object.assign(value, { savedItems });\r\n });\r\n};\r\n","import { pick, without, extend, isEmpty } from 'underscore';\r\nimport { ScopeLevel } from '@bingads-webui-campaign-react/constants';\r\nimport {\r\n modelToViewModelForAdGroupAgeTargets,\r\n modelToViewModelForAdGroupCompanyNameTargets,\r\n modelToViewModelForAdGroupIndustryTargets,\r\n modelToViewModelForAdGroupJobFunctionTargets,\r\n modelToViewModelForAdGroupLocationTargets,\r\n bulkModelToViewModelForAdGroupLocationTargets,\r\n bulkModelToViewModelForAdGroupAgeTargets,\r\n bulkModelToViewModelForAdGroupGenderTargets,\r\n bulkModelToViewModelForAdGroupDeviceTargets,\r\n} from './adgroup-criterion';\r\nimport {\r\n modelToViewModelForDayTimeTargets,\r\n bulkModelToViewModelForDayTimeTargets,\r\n modelToViewModelForDeviceTargets,\r\n modelToViewModelForGenderTargets,\r\n modelToViewModelForAgeTargets,\r\n modelToViewModelForCompanyNameTargets,\r\n modelToViewModelForIndustryTargets,\r\n modelToViewModelForJobFunctionTargets,\r\n} from './campaign-criterion';\r\nimport { bulkModelToViewModelForDsaTarget } from './dsa-target';\r\nimport { parseDateFromAPIFormat, formatDateToAPIFormat } from './utils';\r\nimport { modelToViewModelForMultiMediaBidAdjustment, viewModelToModelForMultiMediaAdBidAdjustment } from './adjustment';\r\nimport { modelToViewModelForAdRotation } from './ad-rotation';\r\n\r\nconst whitelistedSchemaPropertyKeysForCampaignModel = [\r\n 'Id', 'BiddingScheme', 'AdScheduleUseSearcherTimeZone', 'TimeZone', 'MultiMediaAdBidAdjustment', 'Languages',\r\n];\r\n\r\nconst whitelistedSchemaPropertyKeysForAdGroupModel = [\r\n 'Id', 'Name', 'Status', 'AdGroupType', 'Language', 'StartDate', 'EndDate', 'SearchBid', 'Medium', 'AdDistribution', 'AdRotation', 'AdGroupType', 'AdScheduleUseSearcherTimeZone', 'MultiMediaAdBidAdjustment', 'BiddingScheme', 'TrackingUrlTemplate', 'FinalUrlSuffix', 'UrlCustomParameters',\r\n];\r\n\r\nconst viewModelToModelForUrlCustomParameters = urlCustomParametersViewModel =>\r\n urlCustomParametersViewModel.filter(({ Key }) => Key);\r\n\r\nexport const modelToViewModelForAdGroupSetting = ({\r\n adGroupModel, campaignModel, campaignScheduleCriterionModel, adGroupScheduleCriterionModel, campaignTargetCriterionModel, adGroupTargetCriterionModel, bundleCountries, adGroupLocationTargets, campaignLocationTargets, i18n,\r\n}) => {\r\n let campaignViewModel = {\r\n ...pick(campaignModel, whitelistedSchemaPropertyKeysForCampaignModel),\r\n };\r\n\r\n let adGroupViewModel = {\r\n ...pick(adGroupModel, whitelistedSchemaPropertyKeysForAdGroupModel),\r\n };\r\n\r\n adGroupViewModel.currentSelectedDeviceLevel = !isEmpty(adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.DeviceCriterion')) ? 'adgroup' : 'campaign';\r\n\r\n adGroupViewModel.currentSelectedGenderLevel = !isEmpty(adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.GenderCriterion')) ? 'adgroup' : 'campaign';\r\n\r\n adGroupViewModel.currentSelectedAgeLevel = !isEmpty(adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.AgeCriterion')) ? 'adgroup' : 'campaign';\r\n\r\n adGroupViewModel.currentSelectedCompanyNameLevel = !isEmpty(adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.CompanyNameCriterion')) ? 'adgroup' : 'campaign';\r\n\r\n adGroupViewModel.currentSelectedIndustryLevel = !isEmpty(adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.IndustryCriterion')) ? 'adgroup' : 'campaign';\r\n\r\n adGroupViewModel.currentSelectedJobFunctionLevel = !isEmpty(adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.JobFunctionCriterion')) ? 'adgroup' : 'campaign';\r\n\r\n campaignViewModel = extend(campaignViewModel, modelToViewModelForDeviceTargets({\r\n model: campaignTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.DeviceCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n campaignViewModel = extend(campaignViewModel, modelToViewModelForGenderTargets({\r\n model: campaignTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.GenderCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n campaignViewModel = extend(campaignViewModel, modelToViewModelForAgeTargets({\r\n model: campaignTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.AgeCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n campaignViewModel = extend(campaignViewModel, modelToViewModelForCompanyNameTargets({\r\n model: campaignTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.CompanyNameCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n campaignViewModel = extend(campaignViewModel, modelToViewModelForIndustryTargets({\r\n model: campaignTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.IndustryCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n campaignViewModel = extend(campaignViewModel, modelToViewModelForJobFunctionTargets({\r\n model: campaignTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.JobFunctionCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n campaignViewModel.dayTimeRanges = campaignScheduleCriterionModel ? modelToViewModelForDayTimeTargets(campaignScheduleCriterionModel) : [];\r\n adGroupViewModel.dayTimeRanges = adGroupScheduleCriterionModel ? modelToViewModelForDayTimeTargets(adGroupScheduleCriterionModel) : [];\r\n\r\n adGroupViewModel.StartDate = parseDateFromAPIFormat(i18n, adGroupModel.StartDate);\r\n adGroupViewModel.EndDate = parseDateFromAPIFormat(i18n, adGroupModel.EndDate);\r\n\r\n adGroupViewModel = extend(adGroupViewModel, modelToViewModelForAdGroupLocationTargets({\r\n model: adGroupLocationTargets,\r\n campaignLocationModel: campaignLocationTargets,\r\n bundleCountries,\r\n adGroupId: adGroupViewModel.Id,\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n adGroupViewModel = extend(adGroupViewModel, modelToViewModelForMultiMediaBidAdjustment(ScopeLevel.AdGroup, campaignModel.MultiMediaAdBidAdjustment, adGroupViewModel.MultiMediaAdBidAdjustment));\r\n\r\n adGroupViewModel = extend(adGroupViewModel, modelToViewModelForDeviceTargets({\r\n model: adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.DeviceCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n adGroupViewModel = extend(adGroupViewModel, modelToViewModelForGenderTargets({\r\n model: adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.GenderCriterion'),\r\n campaignId: campaignModel.Id,\r\n }));\r\n\r\n adGroupViewModel = extend(adGroupViewModel, modelToViewModelForAdGroupAgeTargets({\r\n model: adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.AgeCriterion'),\r\n campaignId: campaignModel.Id,\r\n adGroupId: adGroupViewModel.Id,\r\n }));\r\n\r\n adGroupViewModel = extend(adGroupViewModel, modelToViewModelForAdGroupCompanyNameTargets({\r\n model: adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.CompanyNameCriterion'),\r\n campaignViewModel,\r\n currentLevel: adGroupViewModel.currentSelectedIndustryLevel,\r\n }));\r\n\r\n adGroupViewModel = extend(adGroupViewModel, modelToViewModelForAdGroupIndustryTargets({\r\n model: adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.IndustryCriterion'),\r\n campaignViewModel,\r\n currentLevel: adGroupViewModel.currentSelectedIndustryLevel,\r\n }));\r\n\r\n adGroupViewModel = extend(adGroupViewModel, modelToViewModelForAdGroupJobFunctionTargets({\r\n model: adGroupTargetCriterionModel.filter(target => target.Criterion['@odata.type'] === '#Model.JobFunctionCriterion'),\r\n campaignViewModel,\r\n currentLevel: adGroupViewModel.currentSelectedJobFunctionLevel,\r\n }));\r\n\r\n adGroupViewModel = extend(adGroupViewModel, modelToViewModelForAdRotation(adGroupViewModel));\r\n\r\n return { campaignViewModel, adGroupViewModel };\r\n};\r\n\r\nexport const viewModelToModelForAdGroupSetting = (adGroupViewModel, campaignId, i18n, permissions) => {\r\n let data = {\r\n ...pick(adGroupViewModel, without(whitelistedSchemaPropertyKeysForAdGroupModel, 'Status', 'BiddingScheme')),\r\n Campaign: {\r\n Id: campaignId,\r\n },\r\n };\r\n\r\n if (!permissions.IsDomesticSimplifiedChineseEnabled || (permissions.IsDomesticSimplifiedChineseEnabled && permissions.dynamic.MMAForCN)) {\r\n data = extend(data, viewModelToModelForMultiMediaAdBidAdjustment(ScopeLevel.AdGroup, adGroupViewModel, i18n));\r\n } else {\r\n delete data.MultimediaAdBidAdjustment;\r\n delete data.MultiMediaAdBidAdjustment;\r\n if (data.Language === null) {\r\n delete data.Language;\r\n }\r\n }\r\n\r\n if (adGroupViewModel.Status === 'Active') {\r\n data.Status = 'Active';\r\n }\r\n data.StartDate = formatDateToAPIFormat(i18n, data.StartDate);\r\n data.EndDate = data.EndDate ? formatDateToAPIFormat(i18n, data.EndDate) : '1/1/3000';\r\n\r\n if (adGroupViewModel.UrlCustomParameters) {\r\n data.UrlCustomParameters = viewModelToModelForUrlCustomParameters(adGroupViewModel.UrlCustomParameters);\r\n }\r\n\r\n return data;\r\n};\r\n\r\nexport const bulkModelToViewModelForAdGroupSetting = ({\r\n adGroupModel,\r\n originaladGroupModel,\r\n campaignModel,\r\n bundleCountries,\r\n i18n,\r\n}) => {\r\n let data = {\r\n ...pick(adGroupModel, whitelistedSchemaPropertyKeysForAdGroupModel),\r\n };\r\n data.StartDate = parseDateFromAPIFormat(i18n, adGroupModel.StartDate);\r\n data.EndDate = parseDateFromAPIFormat(i18n, adGroupModel.EndDate);\r\n\r\n if (adGroupModel.AdGroupCriterions && !isEmpty(adGroupModel.AdGroupCriterions)) {\r\n data.dayTimeRanges = bulkModelToViewModelForDayTimeTargets(adGroupModel.AdGroupCriterions, originaladGroupModel.dayTimeRanges || []);\r\n data.adSchedulesBulkUpsert = [];\r\n }\r\n\r\n data.Device = originaladGroupModel.Device && bulkModelToViewModelForAdGroupDeviceTargets(originaladGroupModel.Device, adGroupModel.AdGroupCriterions.filter(target => target.Criterion['@odata.type'] === '#Model.DeviceCriterion'));\r\n data.initialDevice = originaladGroupModel.initialDevice;\r\n data.currentSelectedDeviceLevel = originaladGroupModel.currentSelectedDeviceLevel;\r\n\r\n data.Gender = originaladGroupModel.Gender && bulkModelToViewModelForAdGroupGenderTargets(originaladGroupModel.Gender, adGroupModel.AdGroupCriterions.filter(target => target.Criterion['@odata.type'] === '#Model.GenderCriterion'));\r\n data.initialGender = originaladGroupModel.initialGender;\r\n data.currentSelectedGenderLevel = originaladGroupModel.currentSelectedGenderLevel;\r\n\r\n data.Age = originaladGroupModel.Age && bulkModelToViewModelForAdGroupAgeTargets(originaladGroupModel.Age, adGroupModel.AdGroupCriterions.filter(target => target.Criterion['@odata.type'] === '#Model.AgeCriterion'));\r\n data.initialAge = originaladGroupModel.initialAge;\r\n data.currentSelectedAgeLevel = originaladGroupModel.currentSelectedAgeLevel;\r\n\r\n data.companyNameTargets = originaladGroupModel.currentSelectedIndustryLevel === 'campaign' ? campaignModel.companyNameTargets : originaladGroupModel.companyNameTargets;\r\n data.initialCompanyNameTargets = originaladGroupModel.initialCompanyNameTargets;\r\n data.currentSelectedCompanyNameLevel = originaladGroupModel.currentSelectedCompanyNameLevel;\r\n\r\n data.industry = originaladGroupModel.currentSelectedIndustryLevel === 'campaign' ? campaignModel.industry : originaladGroupModel.industry;\r\n data.initialIndustryTargets = originaladGroupModel.currentSelectedIndustryLevel === 'campaign' ? campaignModel.initialIndustryTargets : originaladGroupModel.initialIndustryTargets;\r\n data.initialIndustry = originaladGroupModel.initialIndustry;\r\n data.currentSelectedIndustryLevel = originaladGroupModel.currentSelectedIndustryLevel;\r\n\r\n data.jobTargets = originaladGroupModel.currentSelectedIndustryLevel === 'campaign' ? campaignModel.jobTargets : originaladGroupModel.jobTargets;\r\n data.initialJobFunctionTargets = originaladGroupModel.currentSelectedIndustryLevel === 'campaign' ? campaignModel.initialJobFunctionTargets : originaladGroupModel.initialJobFunctionTargets;\r\n data.initialJobTargets = originaladGroupModel.initialJobTargets;\r\n data.currentSelectedJobFunctionLevel = originaladGroupModel.currentSelectedJobFunctionLevel;\r\n\r\n data = extend(data, modelToViewModelForMultiMediaBidAdjustment(ScopeLevel.AdGroup, campaignModel.MultiMediaAdBidAdjustment, adGroupModel.MultimediaAdBidAdjustment));\r\n\r\n if (adGroupModel.AdGroupCriterions && !isEmpty(adGroupModel.AdGroupCriterions)) {\r\n data = extend(data, bulkModelToViewModelForAdGroupLocationTargets(adGroupModel.AdGroupCriterions, bundleCountries, originaladGroupModel));\r\n }\r\n if (adGroupModel.DsaTargets) {\r\n data.DsaTargets = bulkModelToViewModelForDsaTarget(adGroupModel.DsaTargets, originaladGroupModel);\r\n }\r\n\r\n return data;\r\n};\r\n","import _ from 'underscore';\r\n\r\nexport const modelToViewModelForAdRotation = data => ({\r\n AdRotation: _.get(data, ['AdRotation', 'RotationType']),\r\n});\r\n","import { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport { bulkModelToViewModelForDsaTargetUnderDsaEntity } from './dsa-target';\r\n\r\nexport const readDsaTargets = (cid, aid, campaignId, adGroupId) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .AdGroups.$withKey(adGroupId)\r\n .DsaTargets\r\n .get({\r\n top: 200,\r\n // Just want to get campaign upgrade status, don't care BI data, so pass dummy date ranges.\r\n StartDate: '2024-11-14',\r\n EndDate: '2024-11-14',\r\n })\r\n .toPromise();\r\n\r\nexport const loadDsaTargets = (cid, aid, campaignId, adGroupId) =>\r\n readDsaTargets(cid, aid, campaignId, adGroupId)\r\n .then((result) => {\r\n const data = bulkModelToViewModelForDsaTargetUnderDsaEntity(result && result.value);\r\n\r\n return data;\r\n });\r\n","import { AdGroup } from '@bingads-webui/campaign-odata-schemas';\r\nimport { edmCampaign } from '@bingads-webui/edm-campaign';\r\nimport { viewModelToModelForAdGroupSetting, bulkModelToViewModelForAdGroupSetting } from './ad-group-setting';\r\nimport {\r\n viewModelToBulkModelForAdGroupSchedule,\r\n viewModelToBulkModelForAdGroupDeviceTargets,\r\n viewModelToBulkModelForAdGroupGenderTargets,\r\n viewModelToBulkModelForAdGroupAgeTargets,\r\n viewModelToBulkModelForAdGroupLocationTargets,\r\n viewModelToBulkModelForAdGroupCompanyNameTargets,\r\n viewModelToBulkModelForAdGroupIndustryTargets,\r\n viewModelToBulkModelForAdGroupJobFunctionTargets,\r\n} from './adgroup-criterion';\r\nimport { isBulkWrappedResponse } from '../shared/bulk';\r\nimport { ERROR_ENTITY, getBulkUploadErrorType, modelToViewModelForBulkErrors } from '../shared/bulk-upsert-errors';\r\nimport { GENERIC_ERROR_MESSAGE_KEY, getErrorsPlaceholders } from '../shared/constants';\r\nimport { viewModelToBulkModelForDsaTarget } from './dsa-target';\r\n\r\n\r\nconst adGroupEDM = edmCampaign.types.resolve('Model.AdGroup');\r\nconst adGroupResource = new adGroupEDM.ResourceIdentifier();\r\n\r\nconst createOrUpdateAdGroup = (data) => {\r\n const createOrUpdateCall = data && data.Id ?\r\n adGroupResource.bulkUpdate.bind(adGroupResource) :\r\n adGroupResource.bulkCreate.bind(adGroupResource);\r\n return createOrUpdateCall(data);\r\n};\r\n\r\nconst bulkUpsertEntityErrorMap = {\r\n [getBulkUploadErrorType(AdGroup)]: ERROR_ENTITY.AdGroup,\r\n 'AdGroup Day Time Criterion Error': ERROR_ENTITY.AdGroupDayTimeCriterion,\r\n 'AdGroup DeviceOS Criterion Error': ERROR_ENTITY.AdGroupDeviceOSCriterion,\r\n 'AdGroup Gender Criterion Error': ERROR_ENTITY.AdGroupGenderCriterion,\r\n 'AdGroup Age Criterion Error': ERROR_ENTITY.AdGroupAgeCriterion,\r\n 'AdGroup Location Criterion Error': ERROR_ENTITY.AdGroupLocation,\r\n 'AdGroup Radius Criterion Error': ERROR_ENTITY.AdGroupRadius,\r\n 'AdGroup Negative Location Criterion Error': ERROR_ENTITY.AdGroupNegativeLocation,\r\n 'AdGroup Location Intent Criterion Error': ERROR_ENTITY.AdGroupLocationIntent,\r\n 'AdGroup Company Name Criterion Error': ERROR_ENTITY.AdGroupCompanyNameCriterion,\r\n 'AdGroup Industry Criterion Error': ERROR_ENTITY.AdGroupIndustryCriterion,\r\n 'AdGroup Job Function Criterion Error': ERROR_ENTITY.AdGroupJobFunctionCriterion,\r\n};\r\n\r\nexport const saveAdGroup = ({\r\n adGroup: adGroupViewModel,\r\n campaign,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n}, {\r\n permissions,\r\n scenario,\r\n i18n,\r\n activityLogger,\r\n}) => {\r\n const adGroupModel = viewModelToModelForAdGroupSetting(adGroupViewModel, campaign.Id, i18n, permissions);\r\n const scheduleModel = adGroupViewModel.adSchedulesBulkUpsert ? viewModelToBulkModelForAdGroupSchedule(adGroupViewModel, campaign) : [];\r\n const deviceModel = adGroupViewModel.Device ? viewModelToBulkModelForAdGroupDeviceTargets({ adGroupViewModel }) : [];\r\n const genderModel = adGroupViewModel.Gender ? viewModelToBulkModelForAdGroupGenderTargets({ adGroupViewModel }) : [];\r\n const ageModel = adGroupViewModel.Age ? viewModelToBulkModelForAdGroupAgeTargets({ adGroupViewModel }) : [];\r\n const locationTargetsModel = bundleLocationCriterions ? viewModelToBulkModelForAdGroupLocationTargets(bundleLocationCriterions, adGroupViewModel, campaign) : [];\r\n const companyNameModel = adGroupViewModel.companyNameTargets ? viewModelToBulkModelForAdGroupCompanyNameTargets({ adGroupViewModel }) : [];\r\n const industryModel = adGroupViewModel.industry ? viewModelToBulkModelForAdGroupIndustryTargets({ adGroupViewModel }) : [];\r\n const jobFunctionModel = adGroupViewModel.jobTargets ? viewModelToBulkModelForAdGroupJobFunctionTargets({ adGroupViewModel }) : [];\r\n const dsaTargetsModel = adGroupViewModel.allowEditDynamicAdTarget && adGroupViewModel.DsaTargets ? {\r\n DsaTargets: viewModelToBulkModelForDsaTarget({\r\n dsaViewModel: adGroupViewModel.DsaTargets,\r\n campaignName: campaign.Name,\r\n adGroupName: adGroupViewModel.Name,\r\n }),\r\n } : {};\r\n\r\n const modelToSave = {\r\n ...adGroupModel,\r\n AdGroupCriterions: [\r\n ...scheduleModel,\r\n ...deviceModel,\r\n ...genderModel,\r\n ...ageModel,\r\n ...locationTargetsModel,\r\n ...companyNameModel,\r\n ...industryModel,\r\n ...jobFunctionModel,\r\n ],\r\n ...dsaTargetsModel,\r\n };\r\n\r\n return createOrUpdateAdGroup(modelToSave)\r\n // with bulk the result will have shape of:\r\n // - { ...entityData } - in case of success;\r\n // - { entity: { ...entityData }, errors: [(EditorialError|MTError)] } - in case of error(s).\r\n .then((result) => {\r\n const data = {\r\n campaign,\r\n adGroup: bulkModelToViewModelForAdGroupSetting({\r\n adGroupModel: result,\r\n originaladGroupModel: adGroupViewModel,\r\n campaignModel: campaign,\r\n bundleCountries,\r\n i18n,\r\n }),\r\n ...getErrorsPlaceholders(),\r\n };\r\n\r\n return data;\r\n }, (bulkOrSystemError) => {\r\n if (isBulkWrappedResponse(bulkOrSystemError)) {\r\n const { entity, errors } = bulkOrSystemError;\r\n\r\n const serverErrors = modelToViewModelForBulkErrors(\r\n errors,\r\n bulkUpsertEntityErrorMap,\r\n scenario,\r\n i18n,\r\n activityLogger\r\n );\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n campaign,\r\n adGroup: entity ? bulkModelToViewModelForAdGroupSetting({\r\n adGroupModel: entity,\r\n originaladGroupModel: adGroupViewModel,\r\n campaignModel: campaign,\r\n bundleCountries,\r\n i18n,\r\n }) : adGroupViewModel,\r\n serverErrors,\r\n });\r\n }\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n campaign,\r\n adGroup: adGroupViewModel,\r\n systemErrors: [i18n.getString(GENERIC_ERROR_MESSAGE_KEY)],\r\n });\r\n });\r\n};\r\n","import _ from 'underscore';\r\nimport jsdataCampaign from '@bingads-webui-component-legacy/js-data-campaign/index';\r\n\r\nconst odataOptions = {\r\n path: 'AdInsight/V2/',\r\n url: '/Customers(:advertisercustomer_id)/Accounts(:account_id)/Default.DSACategoryList',\r\n};\r\n\r\nexport const loadCategoryList = (domainName, languageCode, category, keyword, orderby, skip) => jsdataCampaign.CategoryTarget.findAll({\r\n query: {\r\n $top: 100,\r\n domainName,\r\n languageCode: languageCode || 'en',\r\n ...(category ? { category } : {}),\r\n ...(orderby ? { $orderby: orderby } : {}),\r\n ...(skip ? { $skip: skip } : {}),\r\n },\r\n ...(keyword ? {\r\n where: {\r\n CategoryName: {\r\n $contains: keyword,\r\n },\r\n },\r\n } : {}),\r\n}, _.defaults({ cacheResponse: false }, odataOptions));\r\n\r\nexport const loadCategoryNameList = (domainName, languageCode) => jsdataCampaign.CategoryTarget.findAll({\r\n query: {\r\n $select: 'CategoryName',\r\n $top: 20000,\r\n domainName,\r\n languageCode: languageCode || 'en',\r\n },\r\n}, _.defaults({ cacheResponse: false }, odataOptions));\r\n","import { edmCampaign } from '@bingads-webui/edm-campaign';\r\n\r\nexport const loadAssociatedPageFeeds = (cid, aid, campaignId) =>\r\n edmCampaign\r\n .Customers.$withKey(cid)\r\n .Accounts.$withKey(aid)\r\n .Campaigns.$withKey(campaignId)\r\n .FeedAssociations\r\n .get({\r\n top: 2147483647, // max Int32\r\n })\r\n .toPromise()\r\n .then(({ value }) => value.map(feedAssociation => ({\r\n key: feedAssociation.FeedId,\r\n text: feedAssociation.FeedName,\r\n })));\r\n","import { isEmpty } from 'underscore';\r\nimport React, { useCallback, useContext, useEffect } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classnames from 'classnames';\r\nimport { withCustomValidation } from '@bingads-webui-react/validation';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport {\r\n LocationTargetSetting,\r\n isLocationValid,\r\n getLanguageBundleString\r\n} from '@bingads-webui-campaign/hotel-common-targets';\r\nimport { notificationApi } from '@bingads-webui-campaign/notification-center';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { isBundledCountriesFound } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { getLocationsString } from '@bingads-webui-campaign-react/wizard-shared-components';\r\n\r\n\r\nexport const targetOptions = {\r\n bundle: 'bundle',\r\n specific: 'specific',\r\n everywhere: 'everywhere',\r\n};\r\n\r\nconst getStyles = () =>\r\n ({\r\n locationTargeting: {\r\n '& .radio>label': {\r\n left: '0',\r\n },\r\n '& .location-target-options': {\r\n '& > ul': {\r\n paddingLeft: '0',\r\n },\r\n '& .intent-target-options': {\r\n '& > ul': {\r\n paddingLeft: '20px',\r\n },\r\n '& .radio>label': {\r\n padding: '8px 0 0 0',\r\n },\r\n },\r\n },\r\n },\r\n });\r\n\r\nexport const updateTargetOption = ({\r\n i18n,\r\n locations,\r\n languages,\r\n market: rawMarket,\r\n permissions,\r\n isInit = false,\r\n}) => {\r\n const { IsDomesticSimplifiedChineseEnabled } = permissions;\r\n const showEverywhereOption = !IsDomesticSimplifiedChineseEnabled;\r\n const market = rawMarket || 'US';\r\n const bundleFound = isBundledCountriesFound({ languages, market });\r\n const { currentLevelSettings: { targetOption } } = locations;\r\n\r\n const info = i18n.getString(_TL_(\"Some location settings may be automatically adjusted due to the languages you've selected. Please review your location targeting settings and update as needed.\"));\r\n\r\n if (targetOption !== targetOptions.specific) {\r\n const shouldSwitchToBundle = (bundleFound || !showEverywhereOption) && targetOption === targetOptions.everywhere;\r\n const shouldSwitchToEverywhere = !bundleFound && showEverywhereOption && targetOption === targetOptions.bundle;\r\n\r\n if (shouldSwitchToBundle) {\r\n if (!isInit) {\r\n notificationApi.showInfo(info);\r\n }\r\n return {\r\n ...locations,\r\n currentLevelSettings: {\r\n ...locations.currentLevelSettings,\r\n targetOption: targetOptions.bundle,\r\n },\r\n useParentLevel: false,\r\n };\r\n }\r\n\r\n if (shouldSwitchToEverywhere) {\r\n if (!isInit) {\r\n notificationApi.showInfo(info);\r\n }\r\n return {\r\n ...locations,\r\n currentLevelSettings: {\r\n ...locations.currentLevelSettings,\r\n targetOption: targetOptions.everywhere,\r\n },\r\n };\r\n }\r\n }\r\n return locations;\r\n};\r\n\r\nexport const updateLocationTargetsForCampaign = ({\r\n campaign,\r\n i18n,\r\n market: rawMarket,\r\n permissions,\r\n isInit = false,\r\n}) => {\r\n const {\r\n locationTargets: locations,\r\n Languages: languages,\r\n } = campaign;\r\n const updatedLocations = updateTargetOption({\r\n i18n,\r\n locations,\r\n languages,\r\n market: rawMarket,\r\n permissions,\r\n isInit,\r\n });\r\n\r\n return {\r\n ...campaign,\r\n locationTargets: updatedLocations,\r\n };\r\n};\r\n\r\nconst LocationTargetSettingWithCustomValidation = ({\r\n validationProps, updateValidation, skipValidation, allowBidAdjustment, refreshLocationTargetsTimes, language, market, permissions, ...restProps\r\n}) => {\r\n const classes = useDefaultStyles(getStyles);\r\n const { data: locationTargets } = validationProps;\r\n const i18n = useContext(I18nContext);\r\n const activity = useContext(ActivityContext);\r\n\r\n const onChange = useCallback((newData) => {\r\n let errors = [];\r\n\r\n if (!skipValidation) {\r\n errors = isLocationValid(newData) ? [] : [i18n.getString(_TL_('Location target has validation errors'))];\r\n }\r\n\r\n updateValidation(errors, { locationTargets: newData });\r\n\r\n if (activity) {\r\n // signal activity to parent\r\n activity.signal(`onLocationTargetingChange - ${JSON.stringify(newData)}`);\r\n }\r\n }, [skipValidation, updateValidation, activity, i18n]);\r\n\r\n useEffect(() => {\r\n if (locationTargets && !isEmpty(language)) {\r\n const newLocations = updateTargetOption({\r\n i18n,\r\n locations: locationTargets,\r\n languages: language,\r\n market,\r\n permissions,\r\n });\r\n\r\n onChange(newLocations);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [refreshLocationTargetsTimes]);\r\n\r\n return (locationTargets ?\r\n \r\n
\r\n \r\n
\r\n setBidAdjustmentRef(newRef)} />\r\n
\r\n \r\n
: \r\n );\r\n};\r\n\r\nLocationTargetSettingWithCustomValidation.propTypes = {\r\n validationProps: PropTypes.shape({\r\n data: PropTypes.shape({\r\n locationTargets: PropTypes.shape({}),\r\n }),\r\n }).isRequired,\r\n refreshLocationTargetsTimes: PropTypes.number.isRequired,\r\n language: PropTypes.arrayOf(PropTypes.string).isRequired,\r\n market: PropTypes.string.isRequired,\r\n permissions: PropTypes.shape({\r\n dynamic: PropTypes.shape({\r\n BulkLocationsTargeting: PropTypes.bool,\r\n SearchCampaignCreationRevamp: PropTypes.bool,\r\n }),\r\n }).isRequired,\r\n updateValidation: PropTypes.func.isRequired,\r\n skipValidation: PropTypes.bool,\r\n allowBidAdjustment: PropTypes.bool,\r\n};\r\n\r\nLocationTargetSettingWithCustomValidation.defaultProps = {\r\n skipValidation: true,\r\n allowBidAdjustment: false,\r\n};\r\n\r\nexport const ValidatedLocationTargetSetting = withCustomValidation(LocationTargetSettingWithCustomValidation);\r\n\r\nconst getLocationDetailsString = (i18n, settings, bundleCountries, isAdGroupLevel, bidStrategyType, hideBid) => {\r\n const { targetOption } = settings;\r\n if (targetOption === targetOptions.bundle) {\r\n return `${i18n.getString(_TL_('Included locations: '))}${getLanguageBundleString(bundleCountries)}`;\r\n }\r\n return getLocationsString(i18n, settings, isAdGroupLevel, bidStrategyType, hideBid);\r\n};\r\n\r\nexport const getLocationTargetTitleDetails = (i18n, location, bundleCountries, isAdGroupLevel, bidStrategyType, hideBid = false) => {\r\n if (!location) return '';\r\n const {\r\n parentLevelSettings,\r\n currentLevelSettings,\r\n useParentLevel,\r\n } = location;\r\n\r\n if (useParentLevel) {\r\n if (isAdGroupLevel) {\r\n return i18n.getString(_TL_('Using campaign settings: {{settings}}'), {\r\n settings: getLocationDetailsString(i18n, parentLevelSettings, bundleCountries, isAdGroupLevel, bidStrategyType, hideBid),\r\n });\r\n }\r\n return i18n.getString(_TL_('Targeting everywhere.'));\r\n }\r\n\r\n return getLocationDetailsString(i18n, currentLevelSettings, bundleCountries, isAdGroupLevel, bidStrategyType, hideBid);\r\n};\r\n","import {\r\n alertStyle,\r\n entitySelectorStyle,\r\n paginationStyle,\r\n} from '@bingads-webui-campaign-react/common-styles';\r\n\r\nexport const getDisclaimerSettingsStyles = ({ palette, iconFontFamily = 'MsAds MDL2 Assets' }) => (\r\n {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n\r\n '& .form-group': {\r\n '& .glyphicon': {\r\n fontFamily: iconFontFamily,\r\n },\r\n\r\n '& .form-control-static': {\r\n marginTop: 8,\r\n marginBottom: 8,\r\n position: 'relative',\r\n\r\n '& .addDisclaimerButton': {\r\n position: 'absolute',\r\n left: 0,\r\n },\r\n },\r\n\r\n '& .alert.alert-info': {\r\n marginTop: 5,\r\n marginBottom: 16,\r\n width: 'fit-content',\r\n },\r\n\r\n '& .disclaimer-selector': {\r\n '& .list-selector-option': {\r\n '& .disclaimer-item-name': {\r\n display: 'inline-block',\r\n maxWidth: 180,\r\n },\r\n\r\n '& .action-right': {\r\n float: 'right',\r\n },\r\n },\r\n\r\n '& .open .dropdown-menu': {\r\n position: 'relative',\r\n marginBottom: 10,\r\n\r\n '& .list-selector-content': {\r\n height: 'auto',\r\n },\r\n },\r\n\r\n '& .truncated': {\r\n overflow: 'hidden',\r\n textOverflow: 'ellipsis',\r\n whiteSpace: 'nowrap',\r\n },\r\n },\r\n\r\n ...entitySelectorStyle({ palette, iconFontFamily }),\r\n ...paginationStyle({ palette }),\r\n },\r\n\r\n '& .col-sm-1, & .col-sm-2, & .col-sm-3, & .col-sm-4, & .col-sm-5, & .col-sm-6, & .col-sm-7, & .col-sm-8, & .col-sm-9, & .col-sm-10, & .col-sm-11, & .col-sm-12': {\r\n float: 'none',\r\n paddingLeft: 0,\r\n paddingRight: 0,\r\n },\r\n }\r\n);\r\n\r\nexport const getDisclaimerPanelStyles = ({ palette, iconFontFamily = 'MsAds MDL2 Assets' }) => ({\r\n '.disclaimer-editor-panel': {\r\n ...alertStyle({ palette, iconFontFamily }),\r\n\r\n '& .panel-content': {\r\n width: 592,\r\n\r\n '& .panel-title': {\r\n fontSize: 20,\r\n fontWeight: '600 !important',\r\n lineHeight: '27px',\r\n },\r\n\r\n '& .panel-body': {\r\n paddingRight: 64,\r\n display: 'flex',\r\n 'flex-direction': 'column',\r\n\r\n '& .disclaimer-setting-content': {\r\n marginBottom: 'auto',\r\n },\r\n\r\n '& .disclaimer-setting-footer': {\r\n marginTop: 32,\r\n\r\n '& button ~ button': {\r\n marginLeft: 10,\r\n },\r\n },\r\n },\r\n\r\n '& .form-group': {\r\n margin: 0,\r\n\r\n '& > .control-label': {\r\n textAlign: 'left',\r\n float: 'none',\r\n width: '100%',\r\n },\r\n\r\n '& > .col-sm-8': {\r\n width: '100%',\r\n },\r\n },\r\n\r\n '& .form-group ~ .form-group': {\r\n marginTop: 32,\r\n },\r\n\r\n '& .col-sm-1, & .col-sm-2, & .col-sm-3, & .col-sm-4, & .col-sm-5, & .col-sm-6, & .col-sm-7, & .col-sm-8, & .col-sm-9, & .col-sm-10, & .col-sm-11, & .col-sm-12': {\r\n float: 'none',\r\n paddingLeft: 0,\r\n paddingRight: 0,\r\n },\r\n\r\n '& .alert.alert-info': {\r\n marginTop: 8,\r\n },\r\n\r\n '& div.error': {\r\n color: '#A80000',\r\n margin: '4px 0 0 0',\r\n fontSize: 12,\r\n },\r\n\r\n '& .mt-error': {\r\n backgroundColor: '#fde7e9',\r\n padding: 5,\r\n marginTop: 10,\r\n '& .over-all-errors.error': {\r\n fontSize: 12,\r\n color: '#D90026',\r\n },\r\n },\r\n\r\n '& .setting-disclaimer-layoutType .radio': {\r\n paddingTop: 0,\r\n },\r\n\r\n '& .dropdown-toggle.btn': {\r\n border: 'none',\r\n width: '100%',\r\n height: '100%',\r\n paddingLeft: 8,\r\n paddingRight: 8,\r\n borderRadius: 2,\r\n\r\n '& span': {\r\n marginTop: 'auto',\r\n marginBottom: 'auto',\r\n },\r\n },\r\n\r\n '& .ba-dropdown-selector': {\r\n position: 'relative',\r\n border: `1px solid ${palette.neutralSecondary}`,\r\n minWidth: 132,\r\n verticalAlign: 'baseline',\r\n height: 30,\r\n borderRadius: 2,\r\n\r\n '& .glyphicon': {\r\n fontFamily: iconFontFamily,\r\n },\r\n\r\n '& .glyphicon-triangle-bottom': {\r\n marginTop: 4,\r\n '&::before': {\r\n content: '\"\\\\E70D\"',\r\n },\r\n },\r\n },\r\n\r\n '& .dropdown-menu': {\r\n top: 'auto',\r\n position: 'absolute',\r\n width: '100%',\r\n padding: '10px',\r\n },\r\n\r\n '& .ba-list-selector': {\r\n border: 'none',\r\n '& .list-selector-item': {\r\n padding: '5px 10px',\r\n margin: '0',\r\n '&:hover': {\r\n cursor: 'pointer',\r\n backgroundColor: '#f5f5f5',\r\n },\r\n '&.selected': {\r\n background: '#E7F0F6',\r\n },\r\n '& .item-actions': {\r\n float: 'right',\r\n },\r\n },\r\n },\r\n\r\n '& textarea#disclaimer-editor-information-popup': {\r\n height: 169,\r\n resize: 'none',\r\n },\r\n\r\n '& textarea#disclaimer-editor-information-additionalline': {\r\n height: 69,\r\n resize: 'none',\r\n },\r\n\r\n '& .url-editor-form': {\r\n display: 'flex',\r\n gridTemplateColumns: 'auto 1fr',\r\n\r\n '& > select.form-control': {\r\n width: 'auto',\r\n marginRight: 6,\r\n },\r\n\r\n '& > input': {\r\n marginLeft: 6,\r\n },\r\n },\r\n },\r\n },\r\n});\r\n","import _ from 'underscore';\r\nimport React, { useCallback, useContext, useState, useMemo, useRef } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { buildLegacyI18n } from '@bingads-webui/build-legacy-i18n';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { PermissionsContext } from '@bingads-webui-react/hoc-with-permissions';\r\nimport { withCustomValidation, withError } from '@bingads-webui-react/validation';\r\nimport { ValidationStringMap } from '@bingads-webui/validation-string-map';\r\nimport { AdsCampaignDisclaimers, DisclaimerStringMap } from '@bingads-webui-campaign-react/ads-campaign-disclaimers';\r\nimport { DisclaimerAdExtension } from '@bingads-webui/campaign-odata-schemas';\r\nimport DisclaimerRepository from '@bingads-webui-campaign-legacy/adextension-shared/service/repository';\r\nimport { uiblockerStyle } from '@bingads-webui-campaign-react/common-styles';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { getDisclaimerPanelStyles, getDisclaimerSettingsStyles } from './styles/disclaimer-styles';\r\n\r\nconst getStyles = (components, theme) => ({\r\n disclaimerContainer: {\r\n ...getDisclaimerSettingsStyles(theme),\r\n '& .ba-pagination': {\r\n '& .pager-input': {\r\n background: '#DCDCDC',\r\n },\r\n },\r\n '& .focus-style': {\r\n border: '1px solid black',\r\n },\r\n '& input': {\r\n outline: '0 !important',\r\n }\r\n },\r\n '@global': {\r\n ...getDisclaimerPanelStyles(theme),\r\n ...uiblockerStyle(theme),\r\n },\r\n});\r\n\r\nconst convert2ViewModel = (data, originalSelectedDisclaimer) => {\r\n const { DisclaimerAdsEnabled: disclaimerAdsEnabled, AdExtensionAssociations: adExtensionAssociations } = data;\r\n let selectedDisclaimer = null;\r\n if (adExtensionAssociations && adExtensionAssociations.length > 0) {\r\n const activeAssociations = adExtensionAssociations.filter(association => association.Status === 'Active');\r\n if (activeAssociations && activeAssociations.length > 0) {\r\n const activeAssociation = activeAssociations[0];\r\n selectedDisclaimer = {\r\n Id: activeAssociation.Id,\r\n Name: activeAssociation.Name,\r\n };\r\n }\r\n }\r\n\r\n return {\r\n DisclaimerAdsEnabled: disclaimerAdsEnabled,\r\n disclaimer: { originalSelectedDisclaimer, selectedDisclaimer, adExtensionAssociations },\r\n };\r\n};\r\n\r\nconst convert2LogData = (data) => {\r\n const { DisclaimerAdsEnabled: disclaimerAdsEnabled, disclaimer } = data || {};\r\n const logData = {\r\n Enabled: disclaimerAdsEnabled,\r\n };\r\n if (disclaimerAdsEnabled && disclaimer && disclaimer.selectedDisclaimer && disclaimer.selectedDisclaimer.Id > 0) {\r\n logData.DisclaimerId = disclaimer.selectedDisclaimer.Id;\r\n }\r\n return logData;\r\n};\r\n\r\nconst Disclaimer = ({\r\n campaignId,\r\n validationProps,\r\n updateValidation,\r\n}) => {\r\n const { data: { disclaimerAdsEnabled, disclaimer } } = validationProps;\r\n const { originalSelectedDisclaimer } = disclaimer || {};\r\n const i18n = useContext(I18nContext);\r\n const legacyI18n = useMemo(() => buildLegacyI18n(i18n, [ValidationStringMap, DisclaimerStringMap]), [i18n]);\r\n const classes = useDefaultStyles(getStyles);\r\n const permissions = useContext(PermissionsContext);\r\n const activity = useContext(ActivityContext);\r\n const [logData, setLogData] = useState(null);\r\n\r\n const disclaimerRepositoryRef = useRef(new DisclaimerRepository({\r\n schema: DisclaimerAdExtension,\r\n skipExtensionCache: true,\r\n }));\r\n\r\n const disclaimerRef = useRef(null);\r\n const onDataChange = useCallback(() => {\r\n const result = disclaimerRef.current.getValues();\r\n const error = disclaimerRef.current.validateAndWarn();\r\n const data = convert2ViewModel(result, originalSelectedDisclaimer);\r\n updateValidation(error ? [error] : [], data);\r\n\r\n if (activity) {\r\n const newLogData = convert2LogData(data);\r\n // This is to avoid unnecessary signal calls, e.g., when toggling the disclaimer as false, there are multiple calls to onDataChange\r\n if (!_.isEqual(logData, newLogData)) {\r\n setLogData(newLogData);\r\n activity.signal(`onDisclaimerChange - ${JSON.stringify(newLogData)}`);\r\n }\r\n }\r\n }, [activity, logData, originalSelectedDisclaimer, updateValidation]);\r\n\r\n // this is to ensure that the disclaimer is not rendered if initial data is not available\r\n if (!disclaimer) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n 0 ? campaignId : 0}\r\n repository={disclaimerRepositoryRef.current}\r\n i18n={legacyI18n}\r\n permissions={permissions}\r\n schema={DisclaimerAdExtension}\r\n AllowDisclaimerEnabled\r\n usePanel\r\n disableTitle\r\n isForNew\r\n enableRandomPage={false}\r\n />\r\n
\r\n );\r\n};\r\n\r\nDisclaimer.propTypes = {\r\n campaignId: PropTypes.number,\r\n validationProps: PropTypes.shape({\r\n data: PropTypes.shape({\r\n disclaimerAdsEnabled: PropTypes.bool,\r\n disclaimer: PropTypes.shape({\r\n selectedDisclaimer: PropTypes.shape({\r\n Id: PropTypes.number,\r\n Name: PropTypes.string,\r\n }),\r\n adExtensionAssociations: PropTypes.arrayOf(PropTypes.shape({\r\n Id: PropTypes.number,\r\n Name: PropTypes.string,\r\n Status: PropTypes.string,\r\n })),\r\n }),\r\n }),\r\n }).isRequired,\r\n updateValidation: PropTypes.func.isRequired,\r\n};\r\n\r\nDisclaimer.defaultProps = {\r\n campaignId: null,\r\n};\r\n\r\nexport const ValidatedDisclaimer = withError(withCustomValidation(Disclaimer));\r\n","import React, { useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { Checkbox } from '@bingads-webui-react/fabric-with-signal';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { withValidation, withError, AdapterFactory } from '@bingads-webui-react/validation';\r\nimport { LearnMoreLink } from '@bingads-webui-campaign-react/help';\r\nimport { ReactTemplate } from '@bingads-webui-react/react-template';\r\n\r\nexport const getAutoGeneratedAssetsDetails = (i18n, autoGeneratedAssetsEnabled) => (autoGeneratedAssetsEnabled ?\r\n i18n.getString(_TL_('On: Enable autogenerated assets')) :\r\n i18n.getString(_TL_('Off: Disable autogenerated assets')));\r\n\r\nconst AutoGeneratedAssetsValidationAdapter = AdapterFactory({\r\n convertEventToValue: event => event.target.checked,\r\n defaultValue: false,\r\n valueToInject: 'checked',\r\n functionToInject: 'onChange',\r\n});\r\n\r\nconst getStyles = () => ({\r\n autoGeneratedAssets: {\r\n '& .ms-Checkbox-text': {\r\n fontWeight: 'bold',\r\n },\r\n\r\n '& .description': {\r\n marginLeft: 28,\r\n },\r\n },\r\n});\r\n\r\nconst AutoGeneratedAssets = ({\r\n checked,\r\n onChange,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nAutoGeneratedAssets.propTypes = {\r\n checked: PropTypes.bool,\r\n onChange: PropTypes.func,\r\n};\r\n\r\nAutoGeneratedAssets.defaultProps = {\r\n checked: false,\r\n onChange: undefined,\r\n};\r\n\r\nexport const ValidatedAutoGeneratedAssets = withError(withValidation(AutoGeneratedAssets, AutoGeneratedAssetsValidationAdapter));\r\n","import React, { useCallback, useContext, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Text } from '@fluentui/react';\r\nimport { withCustomValidation, withError } from '@bingads-webui-react/validation';\r\nimport {\r\n ConversionGoalSelector,\r\n Scopes\r\n} from '@bingads-webui-campaign-react/goal-selector';\r\nimport { buildLegacyI18n } from '@bingads-webui/build-legacy-i18n';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { paginationStyle } from '@bingads-webui-campaign-react/common-styles';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { useP$DaterangeDefault, ConversionGoalKeyToStringMapping } from '@bingads-webui-campaign-react/wizard-shared-components';\r\n\r\nconst subTextOptions = [\r\n {\r\n id: Scopes.ACCOUNT,\r\n text: 'Campaign_Goals_Account_Level_Subtext',\r\n },\r\n {\r\n id: Scopes.CAMPAIGN,\r\n text: 'Campaign_Goals_Campaign_Level_Subtext',\r\n },\r\n];\r\n\r\nconst convert2LogData = (data) => {\r\n const { conversionGoals } = data || {};\r\n const logData = {\r\n GoalScopeSelection: conversionGoals.goalScopeSelection,\r\n };\r\n\r\n if (conversionGoals.goalScopeSelection === Scopes.CAMPAIGN && conversionGoals.goalSelection && conversionGoals.goalSelection.length > 0) {\r\n logData.GoalSelection = conversionGoals.goalSelection;\r\n }\r\n\r\n return logData;\r\n};\r\n\r\nconst ConversionGoalsWithCustomValidation = ({\r\n i18n, validationProps, updateValidation, ...restProps\r\n}) => {\r\n const { data: conversionGoalsData = {} } = validationProps;\r\n const { conversionGoals = {} } = conversionGoalsData || {};\r\n\r\n const classes = useDefaultStyles((_, theme) => ({\r\n ConversionGoalSelectorContainer: {\r\n ...paginationStyle(theme),\r\n '& .multi-selector': {\r\n width: 952,\r\n },\r\n '& .list-selector-container': {\r\n width: 468,\r\n },\r\n '& .goal-selector-subtext': {\r\n position: 'absolute',\r\n top: 30,\r\n left: 35,\r\n },\r\n '& .radio:not(:last-child)': {\r\n marginBottom: 15,\r\n },\r\n '& .radio': {\r\n width: 800,\r\n '& label': {\r\n outline: 'none !important',\r\n },\r\n },\r\n '& .radio[data-checked=\"true\"] span': {\r\n fontWeight: 700,\r\n },\r\n '& .goal-selector': {\r\n marginTop: 25,\r\n },\r\n '& .ba-pagination': {\r\n '& .pager-input': {\r\n background: '#DCDCDC',\r\n },\r\n },\r\n },\r\n }));\r\n\r\n const activity = useContext(ActivityContext);\r\n const legacyI18n = useMemo(() => buildLegacyI18n(\r\n i18n,\r\n [ConversionGoalKeyToStringMapping]\r\n ), [i18n]);\r\n\r\n const $dataRange = useP$DaterangeDefault();\r\n\r\n const onChange = useCallback((changedData) => {\r\n const newData = {\r\n conversionGoals: {\r\n ...conversionGoals,\r\n ...changedData,\r\n },\r\n };\r\n updateValidation([], newData);\r\n\r\n if (activity) {\r\n const newLogData = convert2LogData(newData);\r\n activity.signal(`onConversionGoalChange - ${JSON.stringify(newLogData)}`);\r\n }\r\n }, [conversionGoals, updateValidation, activity]);\r\n\r\n const campaignConversionGoal = useMemo(() => ({\r\n Goals: conversionGoals.originalConversionGoals,\r\n }), [conversionGoals.originalConversionGoals]);\r\n\r\n\r\n return (conversionGoals && conversionGoals.goalScopeSelection ?\r\n \r\n ({text}) }}\r\n template={i18n.getString(_TL_('By enabling this setting, Microsoft Advertising will automatically generate relevant assets.'))}\r\n />\r\n
\r\n \r\n
: null\r\n );\r\n};\r\n\r\nConversionGoalsWithCustomValidation.propTypes = {\r\n validationProps: PropTypes.shape({\r\n data: PropTypes.shape({\r\n conversionGoals: PropTypes.shape({\r\n goalSelection: PropTypes.arrayOf(PropTypes.shape({})),\r\n goalScopeSelection: PropTypes.string,\r\n originalConversionGoals: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n }),\r\n }).isRequired,\r\n updateValidation: PropTypes.func.isRequired,\r\n showTrackingStatusIcon: PropTypes.bool, // included in restProps\r\n};\r\n\r\nConversionGoalsWithCustomValidation.defaultProps = {\r\n showTrackingStatusIcon: false,\r\n};\r\nexport const ValidatedConversionGoals = withError(withCustomValidation(ConversionGoalsWithCustomValidation));\r\n","import React, { useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { Checkbox } from '@bingads-webui-react/fabric-with-signal';\r\nimport { MessageBar } from '@fluentui/react';\r\nimport { HelpPopup } from '@bingads-webui-react/help-popup';\r\nimport { HelpLink } from '@bingads-webui-react/help-link';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\n\r\nconst getStyles = (_, { palette }) => ({\r\n predictiveMatchingSection: {\r\n '& .predictive-matching-header': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n fontWeight: 'bold',\r\n },\r\n '& .predictive-matching-checkbox': {\r\n '& .ms-Checkbox-label': {\r\n fontWeight: 'bold',\r\n },\r\n },\r\n '& .predictive-matching-desc': {\r\n paddingLeft: 28,\r\n },\r\n\r\n '&.disabled p': {\r\n color: palette.neutralTertiaryAlt,\r\n },\r\n },\r\n messageBar: {\r\n background: palette.themeLighterAlt,\r\n marginBottom: 8,\r\n },\r\n});\r\n\r\nexport const getPredictiveMatchingDetails = (i18n, autoGeneratedAssetsEnabled) => (autoGeneratedAssetsEnabled ? i18n.getString(_TL_('On')) : i18n.getString(_TL_('Off')));\r\n\r\nexport const PredictiveMatching = (props) => {\r\n const classes = useDefaultStyles(getStyles);\r\n const {\r\n AutoTargetingEnabled, isPredictiveMatchingChecked, onValidate, i18n, hideDescription, disabled,\r\n } = props;\r\n\r\n const activity = useContext(ActivityContext);\r\n\r\n const onChange = (e, v) => {\r\n onValidate({\r\n data: {\r\n isPredictiveMatchingChecked: v,\r\n },\r\n isValid: true,\r\n });\r\n if (activity) {\r\n activity.signal(`onPredictiveMatchingChange - ${v}`);\r\n }\r\n };\r\n\r\n return (\r\n \r\n {i18n.getString(_TL_('How do you want to set your conversion goals'))} \r\n
\r\n \r\n {\r\n disabled && (\r\n \r\n {i18n.getString(_TL_('Change bid strategy to enable.'))}\r\n \r\n )\r\n }\r\n {!hideDescription &&\r\n
);\r\n};\r\n\r\nPredictiveMatching.propTypes = {\r\n onValidate: PropTypes.func.isRequired,\r\n isPredictiveMatchingChecked: PropTypes.bool.isRequired,\r\n AutoTargetingEnabled: PropTypes.bool,\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n hideDescription: PropTypes.bool,\r\n disabled: PropTypes.bool,\r\n};\r\n\r\nPredictiveMatching.defaultProps = {\r\n AutoTargetingEnabled: false,\r\n hideDescription: false,\r\n disabled: false,\r\n};\r\n","import { first, contains, isEmpty } from 'underscore';\r\nimport React, { useContext, useCallback } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classnames from 'classnames';\r\nimport { Label, Stack } from '@fluentui/react';\r\nimport { UrlInputFluent, withNoProtocol } from '@bingads-webui-campaign-react/url-input-fluent';\r\nimport { UrlInputFluent as UrlInputFluentV2, withNoProtocol as withNoProtocolV2 } from '@bingads-webui-campaign-react/url-input-fluent-v2';\r\nimport { HelpPopupInline } from '@bingads-webui-react/help-popup';\r\nimport { withError, withCustomValidation } from '@bingads-webui-react/validation';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { Input } from '@fluentui/react-components';\r\n\r\nconst UrlInputFluentWithNoProtocol = withNoProtocol(UrlInputFluent);\r\nconst UrlInputFluentV2WithNoProtocol = withNoProtocolV2(UrlInputFluentV2);\r\n\r\nconst getStyles = () =>\r\n ({\r\n websiteTitle: {\r\n '& .title': {\r\n fontSize: '16px',\r\n fontWeight: '600',\r\n },\r\n },\r\n websiteContent: {\r\n width: '380px',\r\n '& .url-field': {\r\n width: '100%',\r\n },\r\n },\r\n });\r\n\r\nexport const emptyUrls = ['http://', 'https://'];\r\n\r\nexport const ValidatedWebsiteTitle = () => {\r\n const classes = useDefaultStyles(getStyles);\r\n const i18n = useContext(I18nContext);\r\n\r\n return (\r\n \r\n {i18n.getString(_TL_('Do you want us to optimize your ad reach?'))}\r\n
\r\n
\r\n \r\n {i18n.getString(_TL_('Predictive matching acts as a complement to your existing keywords to match your ads with new, highly relevant search queries. Broad match will also be applied to keywords in your campaign to help you target all relevant search queries. '))}\r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nconst ValidatedNoProtocolWebsiteContent = ({\r\n validationProps, updateValidation, validateOnRender, enableSpecialCharactersValidation, useFluentV2, isEmptyValid, disabled,\r\n}) => {\r\n const { data: websites } = validationProps;\r\n const website = first(websites);\r\n\r\n const classes = useDefaultStyles(getStyles);\r\n const i18n = useContext(I18nContext);\r\n const activity = useContext(ActivityContext);\r\n\r\n const onChange = useCallback((errors, value) => {\r\n if (isEmptyValid && (!value || contains(emptyUrls, value))) {\r\n // website is optional\r\n updateValidation([], { websites: [value] });\r\n } else {\r\n updateValidation(errors, { websites: [value] }, (!isEmpty(errors) && !!website));\r\n }\r\n\r\n if (activity) {\r\n activity.signal(`onWebsiteChanged - ${JSON.stringify(value)}`);\r\n }\r\n }, [activity, updateValidation, isEmptyValid, website]);\r\n\r\n return (\r\n \r\n {\r\n disabled && (\r\n
\r\n );\r\n};\r\n\r\nValidatedNoProtocolWebsiteContent.propTypes = {\r\n validationProps: PropTypes.shape({\r\n data: PropTypes.shape([]),\r\n }).isRequired,\r\n updateValidation: PropTypes.func.isRequired,\r\n validateOnRender: PropTypes.bool,\r\n disabled: PropTypes.bool,\r\n enableSpecialCharactersValidation: PropTypes.bool,\r\n useFluentV2: PropTypes.bool,\r\n isEmptyValid: PropTypes.bool,\r\n};\r\n\r\nValidatedNoProtocolWebsiteContent.defaultProps = {\r\n validateOnRender: false,\r\n disabled: false,\r\n enableSpecialCharactersValidation: false,\r\n useFluentV2: false,\r\n isEmptyValid: false,\r\n};\r\n\r\nexport const ValidatedNoProtocolWebsite = withError(withCustomValidation(ValidatedNoProtocolWebsiteContent));\r\n","import { first, isEmpty, map, result } from 'underscore';\r\nimport React, { useCallback, useContext, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classnames from 'classnames';\r\nimport { withCustomValidation, withError } from '@bingads-webui-react/validation';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport {\r\n Radio,\r\n RadioGroup,\r\n Label,\r\n Dropdown,\r\n Option,\r\n Checkbox,\r\n} from '@fluentui/react-components';\r\nimport {\r\n MessageBar,\r\n MessageBarBody,\r\n MessageBarTitle\r\n} from '@fluentui/react-message-bar';\r\nimport { HelpPopup } from '@bingads-webui-react/help-popup';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { campaignLanguageStrings } from '@bingads-webui-campaign-react/language-target';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors, withContainerErrors, FormErrorBeaconAdapter } from '@bingads-webui-campaign-react/error-handling';\r\nimport { getDSAWebsiteLanguages, targetingSourceOptions, targetingSourceOptionStrings, ERROR_ENTITY } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { PageFeedSelectorSection } from '@bingads-webui-campaign-react/page-feed-selector';\r\nimport {\r\n andComp,\r\n entityIs,\r\n propertyIs,\r\n StandardControlAdapter,\r\n} from '@bingads-webui-campaign-react/form-error';\r\nimport { FocusableActuator } from '@bingads-webui-campaign-react/actuator';\r\n\r\nimport { ValidatedNoProtocolWebsite as WebsiteControl } from './validated-no-protocol-website';\r\n\r\nconst entityIsCampaign = entityIs(ERROR_ENTITY.Campaign);\r\nconst feedAssociationsProp = andComp(entityIsCampaign, propertyIs('FeedAssociations'));\r\nconst ServerValidatedPageFeedSelectorSection = withControlErrorHandling(withContainerErrors(PageFeedSelectorSection, { filter: feedAssociationsProp, Adapter: StandardControlAdapter() }), [FocusableActuator], [FormErrorBeaconAdapter]);\r\n\r\nconst domainProp = andComp(entityIsCampaign, propertyIs('DomainName'));\r\nconst ValidatedWebsite = withControlErrorHandling(withUnvalidatedControlErrors(WebsiteControl, { filter: domainProp }));\r\n\r\nconst getStyles = () =>\r\n ({\r\n dynamicSetting: {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: '16px',\r\n '& .ad-group-website-label': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n '& .ad-group-website-language-label': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n '& .website-language-dropdown': {\r\n width: '320px',\r\n },\r\n '& .ad-group-targeting-source-label': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n '& .page-feed-selector': {\r\n display: 'flex',\r\n marginLeft: '36px',\r\n },\r\n '& .message-bar': {\r\n marginTop: '20px',\r\n },\r\n },\r\n });\r\n\r\nconst ValidatedDynamicWebsite = ({\r\n websites,\r\n disabled,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n {i18n.getString(_TL_(\"Your website and website language cannot be changed once they're saved.\"))}
\r\n \r\n );\r\n};\r\n\r\nValidatedDynamicWebsite.propTypes = {\r\n websites: PropTypes.arrayOf(PropTypes.string).isRequired,\r\n disabled: PropTypes.bool,\r\n};\r\n\r\nValidatedDynamicWebsite.defaultProps = {\r\n disabled: false,\r\n};\r\n\r\nconst DynamicWebsiteLanguage = ({\r\n validationProps,\r\n updateValidation,\r\n permissions,\r\n disabled,\r\n}) => {\r\n const { data: selectedWebsiteLanguage } = validationProps;\r\n const i18n = useContext(I18nContext);\r\n const activity = useContext(ActivityContext);\r\n const websiteLanguages = getDSAWebsiteLanguages(permissions);\r\n\r\n const onWebsiteLanguageOptionSelect = useCallback((_evt, option) => {\r\n const newSelectedWebsiteLanguage = first(option.selectedOptions);\r\n if (newSelectedWebsiteLanguage !== selectedWebsiteLanguage) {\r\n updateValidation([], { selectedWebsiteLanguage: newSelectedWebsiteLanguage });\r\n activity.signal(`onDSAWebsiteLanguageChange - ${newSelectedWebsiteLanguage}`);\r\n }\r\n }, [activity, selectedWebsiteLanguage, updateValidation]);\r\n\r\n return (\r\n <>\r\n {\r\n selectedWebsiteLanguage && (\r\n <>\r\n\r\n \r\n
\r\n {\r\n websiteLanguages.length > 1 ? (\r\n {websiteLanguages[0]}
\r\n }\r\n \r\n )}\r\n \r\n );\r\n};\r\n\r\nDynamicWebsiteLanguage.propTypes = {\r\n validationProps: {\r\n data: PropTypes.string,\r\n }.isRequired,\r\n permissions: PropTypes.shape({\r\n dynamic: PropTypes.shape({\r\n website: PropTypes.shape({\r\n enabled: PropTypes.bool,\r\n }),\r\n }),\r\n }).isRequired,\r\n updateValidation: PropTypes.func.isRequired,\r\n disabled: PropTypes.bool,\r\n};\r\n\r\nDynamicWebsiteLanguage.defaultProps = {\r\n disabled: false,\r\n};\r\n\r\nconst ValidatedDynamicWebsiteLanguage = withControlErrorHandling(withUnvalidatedControlErrors(withError(withCustomValidation(DynamicWebsiteLanguage))));\r\n\r\nconst DynamicTargetingSource = ({\r\n validationProps,\r\n updateValidation,\r\n}) => {\r\n const { selectedTargetingSource, pageFeeds = [] } = validationProps;\r\n\r\n const i18n = useContext(I18nContext);\r\n const activity = useContext(ActivityContext);\r\n const { scope } = useContext(ScopeContext) || {};\r\n const serverContext = useContext(ServerContext);\r\n const { CurrentAccount } = serverContext || {};\r\n const { AdvertiserCustomerID: advertiserCustomerId } = CurrentAccount || {};\r\n\r\n const verifyTargetingSource = useCallback(({\r\n newSelectedTargetingSource = selectedTargetingSource,\r\n newPageFeeds = pageFeeds,\r\n }) => (\r\n newSelectedTargetingSource !== targetingSourceOptions.SystemIndex && isEmpty(newPageFeeds) ?\r\n [i18n.getString(_TL_('Please select at least one page feed'))] : []\r\n ), [i18n, pageFeeds, selectedTargetingSource]);\r\n\r\n const onTargetingSourceOptionSelect = useCallback((_evt, option) => {\r\n if (option.value !== selectedTargetingSource) {\r\n const newSelectedTargetingSource = option.value;\r\n const errors = verifyTargetingSource({ newSelectedTargetingSource });\r\n updateValidation(errors, { selectedTargetingSource: newSelectedTargetingSource });\r\n activity.signal(`onDSATargetingSourceChange - ${newSelectedTargetingSource}`);\r\n }\r\n }, [activity, selectedTargetingSource, updateValidation, verifyTargetingSource]);\r\n\r\n const onSelectedPageFeedsChange = useCallback((selectedPageFeeds) => {\r\n const newPageFeeds = selectedPageFeeds || [];\r\n const errors = verifyTargetingSource({ newPageFeeds });\r\n updateValidation(errors, { pageFeeds: newPageFeeds });\r\n activity.signal(`onSelectedPageFeedsChange - ${newPageFeeds}`);\r\n }, [activity, updateValidation, verifyTargetingSource]);\r\n\r\n return (\r\n <>\r\n \r\n \r\n
\r\n \r\n \r\n \r\n {i18n.getString(_TL_('Note'))} \r\n {i18n.getString(_TL_('Dynamic ad groups contain Dynamic Search ads and dynamic ad targets.'))}\r\n \r\n \r\n )}\r\n
\r\n );\r\n};\r\n\r\nValidatedDynamicSearchAdSetting.propTypes = {\r\n data: PropTypes.shape({\r\n websites: PropTypes.arrayOf(PropTypes.string),\r\n selectedWebsiteLanguage: PropTypes.string,\r\n selectedTargetingSource: PropTypes.string,\r\n dynamicTextEnabled: PropTypes.bool,\r\n pageFeeds: PropTypes.arrayOf(PropTypes.string),\r\n }).isRequired,\r\n disabled: PropTypes.bool,\r\n isMessageBarVisible: PropTypes.bool,\r\n};\r\n\r\nValidatedDynamicSearchAdSetting.defaultProps = {\r\n disabled: false,\r\n isMessageBarVisible: true,\r\n};\r\n","import { map } from 'underscore';\r\nimport React, { useCallback, useContext, useRef } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classnames from 'classnames';\r\nimport {\r\n Dropdown,\r\n Label,\r\n Option,\r\n Dialog,\r\n DialogSurface,\r\n DialogBody,\r\n DialogTitle,\r\n DialogContent,\r\n DialogActions,\r\n DialogTrigger,\r\n Button,\r\n useRestoreFocusTarget,\r\n} from '@fluentui/react-components';\r\nimport {\r\n MessageBar,\r\n MessageBarBody,\r\n MessageBarTitle\r\n} from '@fluentui/react-message-bar';\r\nimport { AdGroup } from '@bingads-webui/campaign-odata-schemas';\r\nimport { RemainingCharsValidatedTextField } from '@bingads-webui-campaign-react/remaining-chars-hint';\r\nimport { HelpPopup } from '@bingads-webui-react/help-popup';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\n\r\nimport { ValidatedDynamicSearchAdSetting } from './validated-dsa-setting';\r\n\r\nconst getStyles = () =>\r\n ({\r\n adGroupBasicSetting: {\r\n '& .ad-group-type-label': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n '& .ad-group-name-label': {\r\n marginTop: '20px',\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n '& .message-bar': {\r\n marginTop: '20px',\r\n },\r\n },\r\n });\r\n\r\nexport const AdGroupTypeSelector = ({\r\n allowAdGroupTypeChange, currentAdGroupType, onSwitchAdGroupType, adGroupTypes, adGroupTypeStrings,\r\n}) => {\r\n const classes = useDefaultStyles(getStyles);\r\n const i18n = useContext(I18nContext);\r\n const activity = useContext(ActivityContext);\r\n\r\n const newAdGroupType = useRef(currentAdGroupType);\r\n const [isDialogOpen, setIsDialogOpen] = React.useState(false);\r\n const restoreFocusTargetAttribute = useRestoreFocusTarget();\r\n\r\n const onOptionSelect = useCallback((_evt, option) => {\r\n if (option.optionValue !== currentAdGroupType) {\r\n setIsDialogOpen(true);\r\n newAdGroupType.current = option.optionValue;\r\n activity.signal(`onAdGroupTypeChangeDropdownOptionClicked - ${option.optionValue}`);\r\n }\r\n }, [activity, currentAdGroupType]);\r\n\r\n const onDialogSwitchClick = useCallback(() => {\r\n setIsDialogOpen(false);\r\n onSwitchAdGroupType(newAdGroupType.current);\r\n }, [onSwitchAdGroupType]);\r\n\r\n return (\r\n \r\n \r\n {map(adGroupTypes, adGroupType => (\r\n \r\n {i18n.getString(adGroupTypeStrings[adGroupType])}\r\n \r\n ))}\r\n \r\n {\r\n setIsDialogOpen(data.open);\r\n }}\r\n >\r\n \r\n \r\n {i18n.getString(_TL_('Are you sure you want to change the ad group type?'))} \r\n \r\n {/* eslint-disable-next-line react/no-danger */}\r\n \r\n {renderedItem}\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nCustomListItem.propTypes = {\r\n index: PropTypes.number.isRequired,\r\n item: PropTypes.shape({}).isRequired,\r\n onItemChange: PropTypes.func.isRequired,\r\n onItemRemove: PropTypes.func.isRequired,\r\n onRenderItem: PropTypes.func.isRequired,\r\n};\r\n\r\nexport const EditableFluentList = ({\r\n items,\r\n onItemChange,\r\n onItemRemove,\r\n onRenderHeader,\r\n onRenderItem,\r\n onRenderFooter,\r\n addButtonText,\r\n onAddButtonClick,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n\r\n return (\r\n <>\r\n {isFunction(onRenderHeader) && items && items.length > 0 && onRenderHeader()}\r\n \r\n \r\n \r\n \r\n {categories.map(({ CategoryName, Coverage }) => (\r\n \r\n ))}\r\n \r\n {\r\n pageTotal > categories.length && (\r\n \r\n )}\r\n \r\n \r\n );\r\n};\r\n\r\nCategorySelector.propTypes = {\r\n preloadedCategories: PropTypes.arrayOf(PropTypes.shape({})),\r\n disabledCategories: PropTypes.arrayOf(PropTypes.string),\r\n // preloadedCategoryNames: PropTypes.arrayOf(PropTypes.string),\r\n onChange: PropTypes.func,\r\n domainName: PropTypes.string.isRequired,\r\n languageCode: PropTypes.string,\r\n value: PropTypes.string.isRequired,\r\n};\r\n\r\nCategorySelector.defaultProps = {\r\n preloadedCategories: null,\r\n onChange: _.noop,\r\n // preloadedCategoryNames: null,\r\n languageCode: 'en',\r\n disabledCategories: [],\r\n};\r\n\r\nconst Adapter = AdapterFactory({ convertEventToValue: value => value });\r\nexport const ValidatedCategorySelector = withControlErrorHandling(withUnvalidatedControlErrors(withError(withValidation(CategorySelector, Adapter))));\r\n","import { bidWidth } from './shared-constant';\r\n\r\nexport const getCategoryTargetItemStyles = () => ({\r\n customLabelEditRowContainer: {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n marginBottom: 16,\r\n \"& div[role='alert'] .error\": {\r\n color: '#A80000',\r\n marginTop: 10,\r\n marginBottom: 10,\r\n fontSize: 12,\r\n },\r\n },\r\n editRow: {\r\n display: 'flex',\r\n gap: '10px',\r\n },\r\n bidEdit: {\r\n width: bidWidth,\r\n '& .fui-Input': {\r\n width: '100%',\r\n },\r\n },\r\n});\r\n","import React, { useCallback, useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classnames from 'classnames';\r\nimport _ from 'underscore';\r\nimport { Input, Label } from '@fluentui/react-components';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { withError, withValidation } from '@bingads-webui-react/validation';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport { WebpageCondition, DsaTarget } from '@bingads-webui/campaign-odata-schemas';\r\nimport { DSA_TARGET_OPERAND_TYPES, DSA_TARGET_OPERATOR_TYPES, generateKeyAndFormateDsaTarget } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { ValidatedCategorySelector } from './category-selector';\r\nimport { useCurrencyCode } from '../../utils';\r\nimport { getCategoryTargetItemStyles } from './styles/category-target-item-style';\r\n\r\nconst ValidatedTextInput = withControlErrorHandling(withUnvalidatedControlErrors(withError(withValidation(Input))));\r\n\r\nexport const CategoryTargetItem = ({\r\n preloadedCategories,\r\n domainName,\r\n languageCode,\r\n disabledCategories,\r\n item,\r\n onItemChange,\r\n alwaysShowError,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getCategoryTargetItemStyles);\r\n const currencyCode = useCurrencyCode();\r\n\r\n const { conditions } = item || {};\r\n const condition = _.first(conditions) || {};\r\n\r\n const onValidateArgumentOperand = useCallback((res) => {\r\n if (item) {\r\n const { key, conditions: newConditions } = generateKeyAndFormateDsaTarget([{ ...res.data, Operator: DSA_TARGET_OPERATOR_TYPES.Equals, Operand: DSA_TARGET_OPERAND_TYPES.Category }]);\r\n onItemChange({\r\n ...item,\r\n key,\r\n conditions: newConditions,\r\n isValid: res.isValid,\r\n });\r\n }\r\n }, [item, onItemChange]);\r\n\r\n const onValidateBid = useCallback((res) => {\r\n if (item) {\r\n onItemChange({\r\n ...item,\r\n Bid: res.data.Bid,\r\n isValid: res.isValid,\r\n });\r\n }\r\n }, [item, onItemChange]);\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n );\r\n };\r\n\r\n WrappedComponent.propTypes = {\r\n title: PropTypes.node.isRequired,\r\n isOpen: PropTypes.bool.isRequired,\r\n onClose: PropTypes.func.isRequired,\r\n };\r\n\r\n return WrappedComponent;\r\n};\r\n\r\n","import { CategoryTarget } from './category/category-target';\r\nimport { withSidePanel } from './with-side-panel';\r\n\r\nexport const CategoryTargetPanel = withSidePanel(CategoryTarget);\r\n\r\n","export const getSpecificTargetStyles = () => ({\r\n tabRoot: {\r\n marginTop: 4,\r\n '& button + button': {\r\n marginLeft: 24,\r\n },\r\n '& .message-bar': {\r\n maxWidth: '540px',\r\n },\r\n },\r\n divider: {\r\n marginTop: 5,\r\n },\r\n tabError: {\r\n color: '#A80000',\r\n },\r\n});\r\n","export const getExactUrlStyles = () => ({\r\n listHeader: {\r\n display: 'flex',\r\n gap: '10px',\r\n alignItems: 'start',\r\n padding: '10px 0',\r\n '& .url': {\r\n width: '322px',\r\n },\r\n '& .bid': {\r\n width: '120px',\r\n },\r\n },\r\n listFooter: {\r\n padding: '10px 0',\r\n },\r\n exactUrlEditRowContainer: {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n marginBottom: '10px',\r\n '& .exact-url-edit-row': {\r\n display: 'flex',\r\n gap: '10px',\r\n '& .website-edit': {\r\n width: '320px',\r\n '& .fui-Input': {\r\n maxWidth: '200px',\r\n },\r\n \"& div[role='alert'] .error\": {\r\n color: '#A80000',\r\n marginTop: '10px',\r\n marginBottom: '10px',\r\n },\r\n },\r\n '& .column-bid-edit': {\r\n width: '120px',\r\n '& .fui-Input': {\r\n width: '100%',\r\n },\r\n \"& div[role='alert'] .error\": {\r\n color: '#A80000',\r\n marginTop: '10px',\r\n marginBottom: '10px',\r\n },\r\n },\r\n },\r\n '& .duplicate-error': {\r\n color: '#A80000',\r\n marginTop: '10px',\r\n },\r\n },\r\n});\r\n","import { reduce, result, first } from 'underscore';\r\nimport React, { useCallback, useContext, useEffect, useState, useRef } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classnames from 'classnames';\r\nimport { Input, Label, Button } from '@fluentui/react-components';\r\nimport { DsaTarget } from '@bingads-webui/campaign-odata-schemas';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { withError, withValidation } from '@bingads-webui-react/validation';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport {\r\n DSA_TARGET_OPERAND_TYPES,\r\n DSA_TARGET_OPERATOR_TYPES,\r\n generateKeyAndFormateDsaTarget,\r\n} from '@bingads-webui-campaign-react/search-campaign-data';\r\n\r\nimport { DefaultBidDescription } from './default-bid-description';\r\nimport { EditableFluentList } from '../fluent-list-component';\r\nimport { getExactUrlStyles } from './styles/exact-url-style';\r\nimport { ValidatedWebsite as WebsiteControl } from '../validated-website';\r\nimport { useCurrencyCode } from '../utils';\r\n\r\nconst ValidatedWebsite = withControlErrorHandling(withUnvalidatedControlErrors(WebsiteControl));\r\nconst ValidatedTextInput = withControlErrorHandling(withUnvalidatedControlErrors(withError(withValidation(Input))));\r\n\r\nconst CustomEditRow = ({\r\n itemKeys, i18n, classes, item, onItemChange, applyFailCount,\r\n}) => {\r\n const { conditions } = item || {};\r\n const condition = first(conditions) || {};\r\n const currency = useCurrencyCode();\r\n\r\n const [isDuplicate, setIsDuplicate] = useState(false);\r\n const [alwaysShowError, setAlwaysShowError] = useState(false);\r\n\r\n const initialFailCount = useRef(applyFailCount);\r\n\r\n useEffect(() => {\r\n setIsDuplicate(item.isValid && itemKeys[item.key] > 1);\r\n }, [item, itemKeys]);\r\n\r\n useEffect(() => {\r\n if (!item.isValid && applyFailCount > initialFailCount.current) {\r\n setAlwaysShowError(true);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [applyFailCount]);\r\n\r\n const onValidateUrl = useCallback((res) => {\r\n const { websites } = res.data;\r\n if (item) {\r\n const { key, conditions: newConditions } = generateKeyAndFormateDsaTarget([{ ArgumentOperand: first(websites), Operator: DSA_TARGET_OPERATOR_TYPES.Equals, Operand: DSA_TARGET_OPERAND_TYPES.Url }]);\r\n onItemChange({\r\n ...item,\r\n key,\r\n conditions: newConditions,\r\n isConditionValid: res.isValid,\r\n isValid: res.isValid && item.isBidValid,\r\n });\r\n }\r\n }, [item, onItemChange]);\r\n\r\n const onValidateBid = useCallback((res) => {\r\n if (item) {\r\n onItemChange({\r\n ...item,\r\n Bid: res.data.Bid,\r\n isBidValid: res.isValid,\r\n isValid: res.isValid && item.isConditionValid,\r\n });\r\n }\r\n }, [item, onItemChange]);\r\n\r\n return (\r\n component)}\r\n >\r\n {map(summary, component => component)}\r\n \r\n );\r\n }, [item.conditions, i18n, currency, item.Bid, defaultBid]);\r\n\r\n return (\r\n \r\n setIsCategoryTargetPanelOpen(false)}\r\n domainName={websiteWithoutProtocol}\r\n preloadedCategories={preloadedCategories}\r\n languageCode={adGroup && adGroup.selectedWebsiteLanguage}\r\n />\r\n setIsSpecificTargetPanelOpen(false)}\r\n preloadedCategories={preloadedCategories}\r\n domainName={websiteWithoutProtocol}\r\n languageCode={adGroup && adGroup.selectedWebsiteLanguage}\r\n selectedTargetingSource={selectedTargetingSource}\r\n />\r\n setIsCustomLabelTargetPanelOpen(false)}\r\n />\r\n \r\n );\r\n};\r\n\r\nDynamicAdTarget.propTypes = {\r\n updateValidation: PropTypes.func.isRequired,\r\n validationProps: PropTypes.shape({\r\n data: PropTypes.shape({\r\n websites: PropTypes.arrayOf(PropTypes.string),\r\n DsaTargets: PropTypes.shape({}),\r\n allowEditDynamicAdTarget: PropTypes.bool,\r\n selectedWebsiteLanguage: PropTypes.string,\r\n selectedTargetingSource: PropTypes.string,\r\n }),\r\n }).isRequired,\r\n};\r\n\r\nexport const ValidatedDynamicAdTarget = withError(withCustomValidation(DynamicAdTarget));\r\n\r\n","import React, { useCallback, useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classnames from 'classnames';\r\nimport { withCustomValidation } from '@bingads-webui-react/validation';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { Checkbox } from '@fluentui/react-components';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { LearnMoreLink } from '@bingads-webui-campaign-react/help';\r\nimport { ValidatedDynamicSearchAdSetting } from './validated-dsa-setting';\r\n\r\nconst getStyles = (_, { palette }) => ({\r\n campaignDynamicSetting: {\r\n '& .fui-Checkbox .fui-Label': {\r\n padding: '0 4px',\r\n },\r\n\r\n '& .description': {\r\n marginLeft: 36,\r\n\r\n '&.disabled': {\r\n color: palette.neutralTertiaryAlt,\r\n },\r\n },\r\n },\r\n});\r\n\r\nexport const CampaignDynamicSearchAdSetting = ({\r\n validationProps, updateValidation,\r\n}) => {\r\n const { data } = validationProps;\r\n const {\r\n hasDsaSettings,\r\n disableDsaSettings,\r\n } = data || {};\r\n\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n const activity = useContext(ActivityContext);\r\n\r\n const onDynamicSearchAdsEnabledChange = useCallback((_evt, option) => {\r\n if (option.selectedOptions !== hasDsaSettings) {\r\n updateValidation([], {\r\n hasDsaSettings: option.checked,\r\n });\r\n activity.signal(`onHasDSASettingsChanged: ${option.checked}`);\r\n }\r\n }, [activity, hasDsaSettings, updateValidation]);\r\n\r\n return (\r\n \r\n \r\n );\r\n};\r\n\r\nStepHeader.propTypes = {\r\n title: PropTypes.string.isRequired,\r\n description: PropTypes.string.isRequired,\r\n};\r\n","import { isEmpty, map } from 'underscore';\r\nimport React, { useCallback, useContext, useMemo, useRef, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { Panel as BootstrapPanel } from 'react-bootstrap';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport {\r\n Collapse,\r\n TextTitle,\r\n ValidatedBootstrapPanel,\r\n ValidatedFixedPanel,\r\n ValidatedPanel,\r\n getPanelErrorProps,\r\n useCollapseState,\r\n collapseExpander,\r\n} from '@bingads-webui-campaign/wizard-jumbo-card';\r\nimport { Campaign } from '@bingads-webui/campaign-odata-schemas';\r\nimport { ValidationGroup, ErrorMessages } from '@bingads-webui-react/validation';\r\nimport { ActuationGroup } from '@bingads-webui-campaign-react/actuator';\r\nimport { AttentionBeaconGroup } from '@bingads-webui-campaign-react/attention-beacon';\r\nimport { FormErrorGroup, UnmappedFormErrors, andComp, entityIs, propertyIs, anyComp } from '@bingads-webui-campaign-react/form-error';\r\nimport { useFormService } from '@bingads-webui-react/form';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport { ValidationStringMap } from '@bingads-webui/validation-string-map';\r\nimport { buildLegacyI18n } from '@bingads-webui/build-legacy-i18n';\r\nimport { RemainingCharsValidatedTextField } from '@bingads-webui-campaign-react/remaining-chars-hint';\r\nimport {\r\n ValidatedWebsiteTitle, ValidatedWebsite as WebsiteControl,\r\n ValidatedLanguageTarget, LanguageTargetValidatorFactory, campaignLanguageStrings,\r\n ValidatedLocationTargetSetting, getLocationTargetTitleDetails,\r\n ValidatedAutoGeneratedAssets, getAutoGeneratedAssetsDetails,\r\n ValidatedConversionGoals,\r\n ValidatedDisclaimer,\r\n} from '@bingads-webui-campaign-react/search-campaign-wizard-controls';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { loadBundleCountries, ERROR_ENTITY } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport {\r\n getConversionGoalTitleDetails,\r\n getDisclaimerTitleDetails,\r\n} from '@bingads-webui-campaign-react/wizard-shared-components';\r\n\r\nimport { getStyles } from './styles';\r\nimport { StepHeader } from '../../shared/step-header';\r\nimport DisclaimerImg from '../../shared//media/disclaimer.svg';\r\nimport LocationImg from '../../shared//media/location.svg';\r\nimport LanguageImg from '../../shared//media/language.svg';\r\nimport AutoAssetsImg from '../../shared//media/auto-assets.svg';\r\nimport ConversionGoalsImg from '../../shared/media/conversion-goals.svg';\r\n\r\nconst entityIsCampaign = entityIs(ERROR_ENTITY.Campaign);\r\nconst campaignNameProp = andComp(entityIsCampaign, propertyIs('Name'));\r\nconst campaignLanguagesProp = andComp(entityIsCampaign, propertyIs('Languages'));\r\nconst campaignConversionProp = andComp(entityIs(ERROR_ENTITY.CampaignConversionGoal), propertyIs('CampaignConversionGoalAssociations'));\r\nconst campaignLocationCriterions = anyComp(\r\n entityIs(ERROR_ENTITY.CampaignLocation),\r\n entityIs(ERROR_ENTITY.CampaignRadius),\r\n entityIs(ERROR_ENTITY.CampaignNegativeLocation),\r\n entityIs(ERROR_ENTITY.CampaignLocationIntent)\r\n);\r\nconst autoGenerateAssetsEnabledProp = andComp(entityIsCampaign, propertyIs('AutoGeneratedAssetsEnabled'));\r\nconst disclaimerProp = anyComp(\r\n entityIs(ERROR_ENTITY.CampaignDisclaimerAdExtension),\r\n propertyIs('DisclaimerAdsEnabled')\r\n);\r\n\r\nconst ValidatedWebsite = withControlErrorHandling(withUnvalidatedControlErrors(WebsiteControl));\r\nconst ServerValidatedLanguageTarget = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedLanguageTarget, { filter: campaignLanguagesProp }));\r\nconst ServerValidatedLocationTargetSetting = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedLocationTargetSetting, { filter: campaignLocationCriterions }));\r\nconst ServerValidatedAutoGeneratedAssets = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedAutoGeneratedAssets, { filter: autoGenerateAssetsEnabledProp }));\r\nconst ServerValidatedDisclaimer = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedDisclaimer, { filter: disclaimerProp }));\r\nconst ServerValidatedConversionGoals = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedConversionGoals, { filter: campaignConversionProp }));\r\n\r\nexport const CampaignSettingsStep = ({\r\n data,\r\n onDataChange,\r\n error,\r\n}) => {\r\n const {\r\n campaign,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n websites,\r\n } = data || {};\r\n\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n const i18n = useContext(I18nContext);\r\n const legacyI18n = useMemo(() => buildLegacyI18n(i18n, [ValidationStringMap]), [i18n]);\r\n const { scope } = useContext(ScopeContext);\r\n const { cid, aid } = scope.values;\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n const serverContext = useContext(ServerContext);\r\n const {\r\n CurrentAccount: {AdvertiserCustomerID: advertiserCustomerId },\r\n CurrentLocale: locale,\r\n CurrentUser: { Market: market },\r\n DynamicPermissions,\r\n Permissions,\r\n } = serverContext || {};\r\n const permissions = useMemo(() => ({ dynamic: { ...DynamicPermissions }, ...Permissions }), [DynamicPermissions, Permissions]);\r\n\r\n const validateSpecialCharacters = permissions && permissions.dynamic && permissions.dynamic.PerformanceMaxCampaignsFinalURLValidation && permissions.dynamic.PMaxAndDSAFinalURLValidation;\r\n\r\n const { state: { context: { saveFailed: showAllValidationErrors } } } = useFormService();\r\n\r\n const { Languages } = campaign || {};\r\n const selectedLanguages = useRef(Languages);\r\n selectedLanguages.current = Languages;\r\n\r\n const refreshLocationTargetsTimes = useRef(0);\r\n\r\n const [\r\n allCampaignSettingsSections,\r\n campaignSettingsExpandedSections,\r\n setCampaignSettingsExpandedSections,\r\n ] = useCollapseState(\r\n ['campaign', 'locations', 'languages', 'auto-generate-assets'] /* all sections */,\r\n ['campaign', 'locations', 'languages', 'auto-generate-assets'] /* initially expanded sections */\r\n );\r\n\r\n const basicSettingsExpand = useMemo(\r\n () => collapseExpander({ setActiveKeys: setCampaignSettingsExpandedSections }),\r\n [setCampaignSettingsExpandedSections]\r\n );\r\n\r\n const onValidate = useCallback((result) => {\r\n if (data && data.campaign) {\r\n const newLanguages = result && result.data && result.data.Languages;\r\n if (!isEmpty(newLanguages) && selectedLanguages.current !== newLanguages) {\r\n selectedLanguages.current = newLanguages;\r\n refreshLocationTargetsTimes.current = (refreshLocationTargetsTimes.current + 1) % 1000;\r\n loadBundleCountries({\r\n cid, aid, serverContext, language: newLanguages,\r\n }).then((bundleCountriesAndLocationCriterions) => {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n campaign: {\r\n ...data.campaign,\r\n ...result.data,\r\n },\r\n ...bundleCountriesAndLocationCriterions,\r\n },\r\n isValid: result.isValid,\r\n });\r\n });\r\n } else {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n campaign: {\r\n ...data.campaign,\r\n ...result.data,\r\n },\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }\r\n }, [aid, cid, data, onDataChange, serverContext]);\r\n\r\n const basicSettingsSection = useMemo(() => {\r\n const campaignPanel = (\r\n i18n.getString(campaignLanguageStrings[lang] || _TL_(`${lang}`))).join(', ')}\r\n icon={LanguageImg}\r\n />}\r\n attentionBeaconProps={{ getExtraProps: getPanelErrorProps }}\r\n actuationProps={{\r\n expand: basicSettingsExpand,\r\n expandKey: 'languages',\r\n }}\r\n >\r\n \r\n \r\n ), [websites, validateSpecialCharacters]);\r\n\r\n return (\r\n \r\n \r\n);\r\n","/* eslint-disable @typescript-eslint/no-unused-vars */\r\nexport const getkeywordSuggestionStyles = (_, { palette = {} }) => ({\r\n keywordSuggestionContainer: {\r\n marginTop: 24,\r\n },\r\n});\r\n\r\nconst getKeywordSuggestionFooterButtonStyle = (_, { palette }) => ({\r\n rootHovered: {\r\n color: palette.white,\r\n backgroundColor: palette.themePrimary,\r\n },\r\n rootDisabled: {\r\n backgroundColor: palette.neutralLighter,\r\n color: palette.neutralTertiary,\r\n },\r\n textContainer: {\r\n overflow: 'hidden',\r\n },\r\n iconDisabled: {\r\n color: palette.neutralTertiaryAlt,\r\n },\r\n iconHovered: {\r\n color: palette.white,\r\n },\r\n});\r\n\r\nexport const getAddAllButtonStyle = (_, { palette }) => ({\r\n ...getKeywordSuggestionFooterButtonStyle(_, { palette }),\r\n root: {\r\n height: 32,\r\n padding: '0px 12px',\r\n border: '1px solid #D1D1D1',\r\n borderRadius: 4,\r\n color: palette.neutralPrimary,\r\n maxWidth: '100%', // Needed for the button to not overflow its container, truncate text instead\r\n },\r\n flexContainer: {\r\n '& i': {\r\n color: '#0078D4',\r\n },\r\n },\r\n flexContainerHovered: {\r\n color: palette.white,\r\n },\r\n label: {\r\n fontWeight: 600,\r\n overflow: 'hidden',\r\n whiteSpace: 'nowrap',\r\n textOverflow: 'ellipsis',\r\n lineHeight: 'unset',\r\n },\r\n});\r\n\r\nexport const getExploreKeywordsButtonStyle = (_, { palette }, isSuggestedItemsEmpty) => ({\r\n ...getKeywordSuggestionFooterButtonStyle(_, { palette }),\r\n root: {\r\n height: 32,\r\n padding: '0px 12px',\r\n border: '1px solid #D1D1D1',\r\n borderRadius: 4,\r\n color: palette.neutralPrimary,\r\n maxWidth: '100%', // Needed for the button to not overflow its container, truncate text instead\r\n ...isSuggestedItemsEmpty ? { position: 'absolute', right: 20 } : {},\r\n },\r\n flexContainer: {\r\n '& i': {\r\n marginBottom: 9,\r\n },\r\n },\r\n label: {\r\n fontWeight: 600,\r\n overflow: 'hidden',\r\n whiteSpace: 'nowrap',\r\n textOverflow: 'ellipsis',\r\n lineHeight: 'unset',\r\n marginBottom: 2,\r\n },\r\n});\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, { useMemo, useContext, useEffect, useState } from 'react';\r\nimport _ from 'underscore';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport {\r\n SuggestedItems,\r\n SuggestedItem,\r\n} from '@bingads-webui-campaign-react/pill-item-components';\r\nimport { useTheme } from 'react-jss';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { Stack } from '@fluentui/react';\r\nimport { DefaultButton } from '@bingads-webui-react/fabric-with-signal';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { SparkleImgSVGIcon, SparkleImgIcon } from '@bingads-webui-campaign-react/sparkle-icon';\r\nimport {\r\n TextTitle,\r\n} from '@bingads-webui-campaign/wizard-jumbo-card';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\n\r\nimport { SectionShimmer } from './section-shimmer';\r\nimport { useCircularBufferView } from './util/use-circular-buffer-view';\r\nimport { getkeywordSuggestionStyles, getAddAllButtonStyle, getExploreKeywordsButtonStyle } from './style/keyword-suggestion-style';\r\n\r\nexport const MAX_INLINE_RECOMMENDATIONS_PER_PAGE = 13;\r\n\r\nexport const KeywordSuggestion = (props) => {\r\n const activity = useContext(ActivityContext);\r\n const classes = useDefaultStyles(getkeywordSuggestionStyles);\r\n const theme = useTheme();\r\n const { components, core } = theme;\r\n const i18n = useContext(I18nContext);\r\n const {\r\n renderSuggestedItem,\r\n onAddSuggestedItem,\r\n renderMoreSuggestionsInlineButton,\r\n onAddAllSuggestedItems,\r\n onMoreSuggestionsButtonClick,\r\n disableAllSuggestions,\r\n disabledSuggestionTooltip,\r\n useStyleFluent2,\r\n suggestedItems,\r\n showSuggestionsSectionShimmer,\r\n perfMarker,\r\n } = props;\r\n\r\n const [availableSuggestedItems, canMoveNext, moveNext] = useCircularBufferView(suggestedItems, MAX_INLINE_RECOMMENDATIONS_PER_PAGE);\r\n const isAvailableSuggestedItemsEmpty = _.isEmpty(availableSuggestedItems);\r\n const suggestedItemsFooter = useMemo(() => (\r\n <>\r\n \r\n onAddAllSuggestedItems(availableSuggestedItems, activity)}\r\n useStyleFluent2={useStyleFluent2}\r\n useCustomStyle\r\n getCustomStyle={getAddAllButtonStyle}\r\n />\r\n onMoreSuggestionsButtonClick(activity)}\r\n iconProps={{ iconName: SparkleImgSVGIcon }}\r\n title={i18n.getString(_TL_('Explore keywords'))}\r\n name=\"Explore keywords\"\r\n allowDisabledFocus\r\n >\r\n {i18n.getString(_TL_('Explore keywords'))}\r\n \r\n \r\n \r\n ), [\r\n onAddAllSuggestedItems,\r\n onMoreSuggestionsButtonClick,\r\n i18n,\r\n useStyleFluent2,\r\n components,\r\n core,\r\n availableSuggestedItems,\r\n activity,\r\n ]);\r\n\r\n const emptySuggestedItemsView = useMemo(() => (\r\n <>\r\n \r\n onMoreSuggestionsButtonClick(activity)}\r\n title={i18n.getString(_TL_('Explore keywords'))}\r\n name=\"Explore keywords\"\r\n allowDisabledFocus\r\n >\r\n {i18n.getString(_TL_('Explore keywords'))}\r\n \r\n \r\n \r\n ), [\r\n onMoreSuggestionsButtonClick,\r\n i18n,\r\n components,\r\n core,\r\n isAvailableSuggestedItemsEmpty,\r\n activity,\r\n ]);\r\n\r\n const sectionContent = useMemo(() => (\r\n !isAvailableSuggestedItemsEmpty ?\r\n \r\n \r\n ({ itemText: keyword.Keyword, key: keyword.Keyword }))}\r\n perfMarker={keywordSuggestionPerfMarker}\r\n />\r\n \r\n );\r\n\r\n const keywordInputPanel = (\r\n \r\n {i18n.getString(_TL_('Add 20 or more keywords to improve ad performance.'))}\r\n \r\n )}\r\n (\r\n onKeywordInputChanged(e.target.value, activity)}\r\n className={classNames(classes.textArea, 'keyword-input-textarea')}\r\n />\r\n \r\n \r\n );\r\n};\r\n\r\nKeywordInput.propTypes = {\r\n keywordsInput: PropTypes.string.isRequired,\r\n onKeywordInputChanged: PropTypes.func.isRequired,\r\n validationResult: PropTypes.shape({\r\n error: PropTypes.arrayOf(PropTypes.string).isRequired,\r\n valid: PropTypes.bool.isRequired,\r\n }).isRequired,\r\n updateValidation: PropTypes.func.isRequired,\r\n};\r\n","import { useCallback, useContext } from 'react';\r\nimport _ from 'underscore';\r\nimport Promise from 'bluebird';\r\nimport { useWizardService, WIZARD_EVENTS } from '@bingads-webui-react/wizard';\r\nimport {\r\n saveKeyword,\r\n loadKeywords,\r\n getKeyFromKeyword,\r\n} from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ActivityContext, ScenarioContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\n\r\nimport { parseKeywords, parseKeyword, maxKeywords } from './util/parser';\r\n\r\nconst savedKeywords = {};\r\nconst updateSavedKeywords = (entity, keywordSuggestionsAdded, activity) => {\r\n if (entity && entity.Keywords) {\r\n const successfulKeywords = _.filter(entity.Keywords, keyword => keyword.Id);\r\n const newlyCreatedKeywords = [];\r\n _.each(successfulKeywords, (keyword) => {\r\n const key = getKeyFromKeyword(keyword);\r\n if (keyword.Status === 'Deleted') {\r\n delete savedKeywords[key];\r\n } else {\r\n savedKeywords[key] = keyword;\r\n newlyCreatedKeywords.push(keyword.Text);\r\n }\r\n });\r\n const numberOfCreatedKeywords = _.size(newlyCreatedKeywords);\r\n if (numberOfCreatedKeywords > 0) {\r\n const keywordsImportedFromPlanner = _.filter(keywordSuggestionsAdded, suggestedKeyword => _.indexOf(newlyCreatedKeywords, suggestedKeyword.Keyword) !== -1);\r\n // eslint-disable-next-line no-unused-expressions\r\n activity && activity.signal(`${JSON.stringify({\r\n keywordsCreated: numberOfCreatedKeywords,\r\n campaignId: entity && entity.Campaign && entity.Campaign.Id,\r\n adGroupId: entity.Id,\r\n suggestionsUsed: _.size(keywordsImportedFromPlanner),\r\n detailedSuggestionsUsed: _.chain(keywordsImportedFromPlanner)\r\n .groupBy(keyword => keyword.RequestId)\r\n .mapObject(reqGroup => _.pluck(reqGroup, 'Keyword'))\r\n .value(),\r\n })}`, 'createKeyword/updateViewModels');\r\n return true;\r\n }\r\n return false;\r\n }\r\n return false;\r\n};\r\n\r\nexport const useKeywordsRepository = () => {\r\n const i18n = useContext(I18nContext);\r\n const scenario = useContext(ScenarioContext);\r\n const activity = useContext(ActivityContext);\r\n const { scope } = useContext(ScopeContext) || {};\r\n const { cid, aid, campaignId: campaignIdFromScope, adGroupId: adGroupIdFromScope } = scope.values;\r\n const { send, state } = useWizardService();\r\n const {\r\n campaignId: campaignIdFromWizardData,\r\n adGroupId: adGroupIdFromWizardData,\r\n keywordsInput: savedKeywordsInput,\r\n previousLanguages: languages,\r\n previousLocation: locations,\r\n } = state.context.wizardData;\r\n\r\n const campaignId = campaignIdFromWizardData || campaignIdFromScope;\r\n const adGroupId = adGroupIdFromWizardData || adGroupIdFromScope;\r\n\r\n const load = useCallback(() => {\r\n const loadPromises = {\r\n keywords: adGroupId ? loadKeywords(cid, aid, campaignId, adGroupId, maxKeywords) : Promise.resolve({}),\r\n };\r\n\r\n return Promise.props(loadPromises)\r\n .then(({\r\n keywords,\r\n }) => {\r\n const { validResult } = parseKeywords({\r\n keywordsTextarealVal: savedKeywordsInput,\r\n i18n,\r\n });\r\n if (keywords && keywords.value && _.isArray(keywords.value)) {\r\n _.each(keywords.value, (keyword) => {\r\n savedKeywords[getKeyFromKeyword(keyword)] = keyword;\r\n });\r\n }\r\n return Promise.resolve({\r\n Languages: languages || [],\r\n locationCriterions: locations || [],\r\n keywordsInput: savedKeywordsInput,\r\n validationResult: _.isUndefined(savedKeywordsInput) ? { valid: true, error: [] } : validResult,\r\n keywordSuggestionsAdded: [],\r\n });\r\n })\r\n .catch((error) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Load keywords failed: ${error}`);\r\n activity.signal(`onKeywordsLoadFailed - ${JSON.stringify({\r\n campaignId,\r\n adGroupId,\r\n error,\r\n })}`);\r\n return Promise.reject(error);\r\n });\r\n }, [adGroupId, cid, aid, campaignId, savedKeywordsInput, i18n, languages, locations, activity]);\r\n\r\n const save = useCallback(({ data }) => {\r\n const { keywordsInput, keywordSuggestionsAdded } = data;\r\n // saved keywords\r\n const savedKeywordKeys = _.keys(savedKeywords);\r\n\r\n // current keywords\r\n const { uniqKeywords: currentKeywordTexts, validResult } = parseKeywords({\r\n keywordsTextarealVal: keywordsInput,\r\n i18n,\r\n });\r\n\r\n // check validation\r\n if (!validResult.valid) {\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n data: {\r\n ...data,\r\n keywordsInput,\r\n validationResult: validResult,\r\n },\r\n });\r\n }\r\n\r\n const keywordTextsNeedAdd = _.difference(currentKeywordTexts, savedKeywordKeys);\r\n const keywordTextsNeedDelete = _.difference(savedKeywordKeys, currentKeywordTexts);\r\n let keywordObjsNeedAdd = [];\r\n let keywordObjsNeedDelete = [];\r\n if (!_.isEmpty(keywordTextsNeedAdd)) {\r\n keywordObjsNeedAdd = _.map(keywordTextsNeedAdd, (keyword) => {\r\n const keywordObj = parseKeyword(keyword, i18n);\r\n return {\r\n ...keywordObj,\r\n AdGroup: { Id: adGroupId },\r\n };\r\n });\r\n }\r\n\r\n if (!_.isEmpty(keywordTextsNeedDelete)) {\r\n keywordObjsNeedDelete = _.map(keywordTextsNeedDelete, (keyword) => {\r\n const keywordObj = parseKeyword(keyword, i18n);\r\n return {\r\n ...keywordObj,\r\n AdGroup: { Id: adGroupId },\r\n Status: 'Deleted',\r\n Id: savedKeywords[keyword].Id,\r\n };\r\n });\r\n }\r\n\r\n const keywords = keywordObjsNeedAdd.concat(keywordObjsNeedDelete);\r\n\r\n if (!_.isEmpty(keywords)) {\r\n // eslint-disable-next-line no-unused-expressions\r\n activity && activity.signal(`onSaveKeywords - ${JSON.stringify({\r\n KeywordsInput: keywords,\r\n })}`);\r\n\r\n const saveKeywordPromise = () => saveKeyword({\r\n campaignId,\r\n adGroupId,\r\n keywords,\r\n }, {\r\n scenario: scenario.name,\r\n i18n,\r\n activityLogger: activity,\r\n });\r\n\r\n return saveKeywordPromise()\r\n .then((entity) => {\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n keywordsInput,\r\n });\r\n const clearKeywordSuggestionsAdded = updateSavedKeywords(entity, keywordSuggestionsAdded, activity);\r\n return Promise.resolve({\r\n ...data,\r\n keywordsInput,\r\n validResult,\r\n keywordSuggestionsAdded: clearKeywordSuggestionsAdded ? [] : keywordSuggestionsAdded,\r\n });\r\n })\r\n .catch((error) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n entity,\r\n } = error || {};\r\n\r\n const clearKeywordSuggestionsAdded = updateSavedKeywords(entity, keywordSuggestionsAdded, activity);\r\n\r\n if (_.isEmpty(serverErrors) && _.isEmpty(systemErrors)) {\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n keywordsInput,\r\n });\r\n return Promise.resolve({\r\n ...data,\r\n keywordsInput,\r\n validResult,\r\n keywordSuggestionsAdded: clearKeywordSuggestionsAdded ? [] : keywordSuggestionsAdded,\r\n });\r\n }\r\n\r\n // eslint-disable-next-line no-console\r\n console.error(`Save keywords failed: ${error}`);\r\n activity.signal(`onKeywordsSaveFailed - ${JSON.stringify({\r\n data,\r\n error,\r\n })}`);\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n data: {\r\n ...data,\r\n keywordsInput,\r\n validResult,\r\n keywordSuggestionsAdded: clearKeywordSuggestionsAdded ? [] : keywordSuggestionsAdded,\r\n },\r\n error: {\r\n serverErrors: _.flatten(serverErrors.filter(val => val !== null)),\r\n systemErrors: _.flatten(systemErrors.filter(val => val !== null)),\r\n },\r\n });\r\n });\r\n }\r\n\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n keywordsInput,\r\n });\r\n\r\n return Promise.resolve({\r\n ...data,\r\n keywordsInput,\r\n validResult,\r\n });\r\n }, [i18n, send, adGroupId, activity, campaignId, scenario.name]);\r\n\r\n return {\r\n load,\r\n save,\r\n };\r\n};\r\n","export const getStyles = () => ({\r\n addTextStep: {\r\n '& .ad-type-selector': {\r\n marginBottom: '16px',\r\n\r\n '& .ad-type-label': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n\r\n '& .ad-type-dropdown': {\r\n width: '600px',\r\n },\r\n },\r\n '& .ad-footer': {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n gap: '16px',\r\n marginTop: '32px',\r\n },\r\n },\r\n});\r\n","import React from 'react';\r\nimport classNames from 'classnames';\r\nimport PropTypes from 'prop-types';\r\nimport { DefaultButton, PrimaryButton } from '@bingads-webui-react/fabric-with-signal';\r\nimport { Dialog, DialogFooter, DialogType } from '@fluentui/react';\r\n\r\nexport const SwitchAdTypeDialog = ({\r\n className,\r\n i18n,\r\n showDialog,\r\n onConfirm,\r\n onCancel,\r\n}) => (\r\n \r\n {/* eslint-disable-next-line react/no-danger */}\r\n
\r\n \r\n
\r\n Campaigns > Ad groups.\")) }} />\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nAdGroupTypeSelector.propTypes = {\r\n allowAdGroupTypeChange: PropTypes.bool.isRequired,\r\n currentAdGroupType: PropTypes.string.isRequired,\r\n onSwitchAdGroupType: PropTypes.func.isRequired,\r\n adGroupTypes: PropTypes.shape({\r\n SearchStandard: PropTypes.string.isRequired,\r\n SearchDynamic: PropTypes.string.isRequired,\r\n }).isRequired,\r\n adGroupTypeStrings: PropTypes.shape({}).isRequired,\r\n isEditingScenario: PropTypes.bool.isRequired,\r\n};\r\n\r\n\r\nexport const ValidatedStandardAdGroup = ({\r\n adGroup,\r\n currentAdGroupType,\r\n onSwitchAdGroupType,\r\n adGroupTypes,\r\n adGroupTypeStrings,\r\n isMixedMode,\r\n isEditingScenario,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n return (\r\n \r\n {isMixedMode && (\r\n \r\n {i18n.getString(_TL_('Note'))} \r\n {i18n.getString(_TL_('Standard ad groups contain Multimedia ads and/or Responsive Search ads.'))}\r\n \r\n \r\n )}\r\n
\r\n );\r\n};\r\n\r\nValidatedStandardAdGroup.propTypes = {\r\n adGroup: PropTypes.shape({\r\n allowAdGroupTypeChange: PropTypes.bool,\r\n }).isRequired,\r\n currentAdGroupType: PropTypes.string.isRequired,\r\n onSwitchAdGroupType: PropTypes.func.isRequired,\r\n adGroupTypes: PropTypes.shape({\r\n SearchStandard: PropTypes.string.isRequired,\r\n SearchDynamic: PropTypes.string.isRequired,\r\n }).isRequired,\r\n adGroupTypeStrings: PropTypes.shape({}).isRequired,\r\n isMixedMode: PropTypes.bool.isRequired,\r\n isEditingScenario: PropTypes.bool.isRequired,\r\n};\r\n\r\nexport const ValidatedDynamicAdGroup = ({\r\n adGroup,\r\n currentAdGroupType,\r\n onSwitchAdGroupType,\r\n adGroupTypes,\r\n adGroupTypeStrings,\r\n}) => {\r\n const { showDsaSettings, disableEditDsaSettings } = adGroup || {};\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nValidatedDynamicAdGroup.propTypes = {\r\n adGroup: PropTypes.shape({\r\n allowAdGroupTypeChange: PropTypes.bool,\r\n }).isRequired,\r\n currentAdGroupType: PropTypes.string.isRequired,\r\n onSwitchAdGroupType: PropTypes.func.isRequired,\r\n adGroupTypes: PropTypes.shape({\r\n SearchStandard: PropTypes.string.isRequired,\r\n SearchDynamic: PropTypes.string.isRequired,\r\n }).isRequired,\r\n adGroupTypeStrings: PropTypes.shape({}).isRequired,\r\n};\r\n\r\n","import { useContext } from 'react';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { defaultBid } from '@bingads-webui-campaign-legacy/budget/shared/defaultBid';\r\n\r\nexport const useCurrencyCode = () => {\r\n const serverContext = useContext(ServerContext);\r\n const currencyCode = (serverContext && serverContext.CurrentAccount && serverContext.CurrentAccount.CurrencyCode) || 'USD';\r\n return currencyCode;\r\n};\r\n\r\nexport const useDefaultBid = () => defaultBid();\r\n","export const getDefaultBidDescriptionStyles = () => ({\r\n root: {\r\n padding: '10px 0',\r\n },\r\n});\r\n","import React, { useContext } from 'react';\r\nimport classnames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { getDefaultBidDescriptionStyles } from './styles/default-bid-description-style';\r\nimport { useCurrencyCode, useDefaultBid } from '../utils';\r\n\r\nexport const DefaultBidDescription = () => {\r\n const classes = useDefaultStyles(getDefaultBidDescriptionStyles);\r\n const i18n = useContext(I18nContext);\r\n const currency = useCurrencyCode();\r\n const defaultBid = useDefaultBid();\r\n\r\n return (\r\n \r\n \r\n
\r\n {i18n.getString(_TL_('The default ad group bid is {{amount}} {{currency}}'), {\r\n amount: defaultBid,\r\n currency,\r\n })}\r\n
\r\n );\r\n};\r\n","export const getActionBarStyles = () => ({\r\n root: {\r\n width: '100%',\r\n bottom: 0,\r\n position: 'fixed',\r\n borderTop: '1px solid #EDEBE9',\r\n padding: 16,\r\n margin: '0 -24px',\r\n },\r\n});\r\n","import React, { useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Stack } from '@fluentui/react';\r\nimport { Button } from '@fluentui/react-components';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { getActionBarStyles } from './styles/action-bar-style';\r\n\r\nexport const ActionBar = ({\r\n onApply,\r\n onCancel,\r\n}) => {\r\n const classes = useDefaultStyles(getActionBarStyles);\r\n const i18n = useContext(I18nContext);\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nActionBar.propTypes = {\r\n onApply: PropTypes.func.isRequired,\r\n onCancel: PropTypes.func.isRequired,\r\n};\r\n","import { map, isFunction } from 'underscore';\r\nimport React, { useContext, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Button, Tooltip } from '@fluentui/react-components';\r\nimport { List, ListItem } from '@fluentui/react-list-preview';\r\nimport { AddRegular, DeleteRegular } from '@fluentui/react-icons';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\n\r\nconst CustomListItem = ({\r\n index,\r\n item,\r\n onItemChange,\r\n onItemRemove,\r\n onRenderItem,\r\n}) => {\r\n const renderedItem = useMemo(() => onRenderItem({ item, onItemChange }), [item, onItemChange, onRenderItem]);\r\n\r\n return (\r\n - \r\n {map(items, (item, index) => (\r\n
\r\n
\r\n );\r\n};\r\n\r\nListHeader.propTypes = {\r\n parentCategory: PropTypes.string.isRequired,\r\n onChangeScope: PropTypes.func.isRequired,\r\n onSortChange: PropTypes.func.isRequired,\r\n orderby: PropTypes.shape({\r\n CategoryName: PropTypes.number,\r\n Coverage: PropTypes.number,\r\n }).isRequired,\r\n};\r\n","import React, { useCallback, useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Link, useId } from '@fluentui/react-components';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { getCategorySelectorItemStyles } from './styles/category-selector-style';\r\nimport { convertToMultiLine, minRoundCoverage } from './utils';\r\n\r\nexport const ListItem = ({ name, size, onChangeScope }) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getCategorySelectorItemStyles);\r\n const names = convertToMultiLine(name);\r\n const onClick = useCallback((e) => {\r\n e.stopPropagation();\r\n onChangeScope(name);\r\n }, [name, onChangeScope]);\r\n const isParent = name.endsWith('/');\r\n const linkId = useId('link');\r\n\r\n return (\r\n \r\n { parentCategory &&\r\n
\r\n \r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nListItem.propTypes = {\r\n name: PropTypes.string.isRequired,\r\n size: PropTypes.number.isRequired,\r\n onChangeScope: PropTypes.func.isRequired,\r\n};\r\n","export const convertToMultiLine = text => text.replace(new RegExp('/$'), '').replace(new RegExp('/', 'g'), '>/').split('/');\r\nexport const convertToSingleLine = text => text.replace(new RegExp('/', 'g'), '>').replace(new RegExp('>$'), '');\r\nexport const minRoundCoverage = 0.0001;\r\n","import React, { useCallback } from 'react';\r\nimport $ from 'jquery';\r\n\r\nconst getNextActiveElement = (activeElement, direction) => {\r\n if (activeElement.is('button')) {\r\n const parentOption = activeElement.parentsUntil('[role=option],[role=heading]');\r\n const buttons = parentOption.find('button:not([disabled])');\r\n const activeIndex = buttons.index(activeElement);\r\n const nextIndex = activeIndex + direction;\r\n if (nextIndex >= 0 && nextIndex < buttons.length) {\r\n return buttons.eq(nextIndex);\r\n }\r\n return activeElement;\r\n }\r\n return activeElement.find('button:not([disabled])').eq(0);\r\n};\r\n\r\nexport const InputSlot = (Component, passedProps) => {\r\n const originKeyDown = passedProps.onKeyDown;\r\n const inputEle = $('[role=listbox]').parent().find('input');\r\n const onInputKeyDown = useCallback((e) => {\r\n if (passedProps['aria-expanded']) {\r\n if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\r\n const currentActiveEle = $('[role=listbox] [data-activedescendant-focusvisible]');\r\n const nextActiveElement = getNextActiveElement(currentActiveEle, e.key === 'ArrowRight' ? 1 : -1);\r\n if (nextActiveElement.length !== 0) {\r\n currentActiveEle.removeAttr('data-activedescendant-focusvisible');\r\n nextActiveElement.attr('data-activedescendant-focusvisible', true);\r\n inputEle.attr('aria-activedescendant', nextActiveElement.attr('id'));\r\n }\r\n e.preventDefault();\r\n e.stopPropagation();\r\n return;\r\n } else if (e.key === 'Enter' || e.key === ' ') {\r\n const activeID = inputEle.attr('aria-activedescendant');\r\n const activeElement = $(`#${activeID}`);\r\n if (activeElement.is('button')) {\r\n activeElement.trigger('click');\r\n e.preventDefault();\r\n e.stopPropagation();\r\n return;\r\n }\r\n }\r\n $('[role=listbox] button[data-activedescendant-focusvisible]').removeAttr('data-activedescendant-focusvisible');\r\n originKeyDown(e);\r\n } else {\r\n originKeyDown(e);\r\n }\r\n }, [inputEle, originKeyDown, passedProps]);\r\n return \r\n {names.map((n, i) => {\r\n const key = `category-name-${n}`;\r\n return i === names.length - 1 ? (\r\n // eslint-disable-next-line jsx-a11y/anchor-is-valid\r\n
\r\n { isParent ? {n} : ({n})}
\r\n ) : ({n});\r\n })}\r\n \r\n {size > 0 && size < minRoundCoverage ? i18n.getString(_TL_('<0.01%')) : i18n.formatPercentToFixed(size, { digits: 2 })}\r\n
\r\n \r\n
\r\n );\r\n};\r\n\r\nCategoryTargetItem.propTypes = {\r\n disabledCategories: PropTypes.shape({}).isRequired,\r\n item: PropTypes.shape({}).isRequired,\r\n onItemChange: PropTypes.func.isRequired,\r\n preloadedCategories: PropTypes.arrayOf(PropTypes.shape({})),\r\n domainName: PropTypes.string.isRequired,\r\n languageCode: PropTypes.string.isRequired,\r\n alwaysShowError: PropTypes.bool.isRequired,\r\n};\r\n\r\nCategoryTargetItem.defaultProps = {\r\n preloadedCategories: null,\r\n};\r\n","import React, { useState, useEffect, useCallback, useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport _ from 'underscore';\r\nimport classnames from 'classnames';\r\nimport { Label, Button } from '@fluentui/react-components';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ActionBar } from '../action-bar';\r\nimport { EditableFluentList } from '../../fluent-list-component';\r\nimport { getCategoryTargetStyles } from './styles/category-target-style';\r\nimport { CategoryTargetItem } from './category-target-item';\r\nimport { DefaultBidDescription } from '../default-bid-description';\r\nimport { useDefaultBid } from '../../utils';\r\n\r\nexport const CategoryTarget = ({\r\n data, onDataChange, onCancel, preloadedCategories, domainName, languageCode,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getCategoryTargetStyles);\r\n const defaultBid = useDefaultBid();\r\n\r\n const [itemKeys, setItemKeys] = useState({});\r\n const [alwaysShowError, setAlwaysShowError] = useState(false);\r\n\r\n useEffect(() => {\r\n onDataChange({ ...data, bufferItems: [...data.items] });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n const newKeys = _.reduce(data.bufferItems, (acc, item) => {\r\n const key = item.conditions && item.conditions[0].ArgumentOperand;\r\n acc[key] = _.result(acc, key, 0) + 1;\r\n return acc;\r\n }, {});\r\n setItemKeys(newKeys);\r\n }, [data.bufferItems]);\r\n\r\n const verifyData = useCallback(() => (\r\n _.every(itemKeys, (value, index) => value <= 1 && index !== 'undefined' && !_.isEmpty(index)) && _.every(data.bufferItems, item => item.isValid)\r\n ), [data.bufferItems, itemKeys]);\r\n\r\n const onListItemChange = useCallback(index => (item) => {\r\n const newBufferItems = data.bufferItems.slice();\r\n newBufferItems[index] = item;\r\n onDataChange({ ...data, bufferItems: newBufferItems });\r\n }, [data, onDataChange]);\r\n\r\n const onListItemRemove = useCallback(index => () => {\r\n const newBufferItems = data.bufferItems.slice();\r\n newBufferItems.splice(index, 1);\r\n\r\n onDataChange({ ...data, bufferItems: newBufferItems });\r\n }, [data, onDataChange]);\r\n\r\n const onRemoveAll = useCallback(() => {\r\n onDataChange({ ...data, bufferItems: [] });\r\n }, [data, onDataChange]);\r\n\r\n const onAddButtonClick = useCallback(() => {\r\n onDataChange({ ...data, bufferItems: [...data.bufferItems, {}] });\r\n }, [data, onDataChange]);\r\n\r\n const onApply = useCallback(() => {\r\n setAlwaysShowError(true);\r\n if (!verifyData()) {\r\n return;\r\n }\r\n const newItems = _.map(data.bufferItems, item => ({\r\n ...item,\r\n Bid: item.Bid || defaultBid,\r\n }));\r\n onDataChange({ ...data, items: newItems });\r\n onCancel();\r\n }, [data, onCancel, onDataChange, verifyData, defaultBid]);\r\n\r\n const onRenderHeader = useCallback(() => (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n {i18n.getString(_TL_('Remove all'))}\r\n \r\n
\r\n ), [classes.listHeader, i18n, onRemoveAll]);\r\n\r\n const onRenderItem = useCallback(({ item, onItemChange }) => (\r\n \r\n
\r\n );\r\n};\r\n\r\nCategoryTarget.propTypes = {\r\n data: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n onCancel: PropTypes.func.isRequired,\r\n preloadedCategories: PropTypes.arrayOf(PropTypes.shape({})),\r\n domainName: PropTypes.string.isRequired,\r\n languageCode: PropTypes.string.isRequired,\r\n};\r\n\r\nCategoryTarget.defaultProps = {\r\n preloadedCategories: null,\r\n};\r\n","import { helpbuttonStyle, convertToLocalStyle } from '@bingads-webui-campaign-react/common-styles';\r\n\r\nexport const getPanelStyles = ({ palette = {} }) => ({\r\n '@global': {\r\n '.side-panel-dynamic-target.panel-right .panel-content': {\r\n '& .panel-body': {\r\n width: 600,\r\n paddingLeft: 20,\r\n paddingRight: 24,\r\n display: 'flex',\r\n height: 'calc(100% - 56px)',\r\n overflowX: 'hidden',\r\n overflowY: 'scroll',\r\n marginBottom: 65,\r\n },\r\n '& .panel-header': {\r\n paddingLeft: 24,\r\n '& .panel-title': {\r\n fontSize: 22,\r\n },\r\n },\r\n '& .react-block-ui-none, .react-block-ui': {\r\n display: 'flex',\r\n height: '100%',\r\n },\r\n ...convertToLocalStyle(helpbuttonStyle({ palette })),\r\n },\r\n },\r\n flexContainer: {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n },\r\n});\r\n","import React, { useCallback, useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { ThemeProvider } from 'react-jss';\r\nimport { FluentProvider, webLightTheme } from '@fluentui/react-components';\r\nimport { ComponentSettings, ThemeFluent } from '@bingads-webui-theme-2018/theme-fluent';\r\nimport { Panel } from '@bingads-webui-campaign-react/panel';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\n\r\nimport { getPanelStyles } from './styles/panel-style';\r\n\r\nexport const withSidePanel = (Component) => {\r\n const WrappedComponent = ({\r\n title,\r\n isOpen,\r\n onClose,\r\n ...props\r\n }) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getPanelStyles);\r\n const onCancel = useCallback(() => {\r\n onClose();\r\n }, [onClose]);\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nCustomEditRow.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n classes: PropTypes.shape({\r\n exactUrlEditRowContainer: PropTypes.string.isRequired,\r\n }).isRequired,\r\n item: PropTypes.shape({\r\n key: PropTypes.string,\r\n isValid: PropTypes.bool,\r\n isBidValid: PropTypes.bool,\r\n isConditionValid: PropTypes.bool,\r\n }).isRequired,\r\n onItemChange: PropTypes.func.isRequired,\r\n applyFailCount: PropTypes.number.isRequired,\r\n};\r\n\r\nexport const ExactUrlTarget = ({\r\n data, onDataChange, itemKeys, setItemKeys, applyFailCount,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getExactUrlStyles);\r\n\r\n useEffect(() => {\r\n const newKeys = reduce(data.bufferItems, (acc, item) => {\r\n acc[item.key] = result(acc, item.key, 0) + 1;\r\n return acc;\r\n }, {});\r\n setItemKeys(newKeys);\r\n }, [data.bufferItems, setItemKeys]);\r\n\r\n const onListItemChange = useCallback(index => (item) => {\r\n const newBufferItems = data.bufferItems.slice();\r\n newBufferItems[index] = item;\r\n onDataChange({ ...data, bufferItems: newBufferItems });\r\n }, [data, onDataChange]);\r\n\r\n const onListItemRemove = useCallback(index => () => {\r\n const removedItemKey = data.bufferItems[index].key;\r\n const newKeys = { ...data.itemKeys };\r\n delete newKeys[removedItemKey];\r\n\r\n const newBufferItems = data.bufferItems.slice();\r\n newBufferItems.splice(index, 1);\r\n\r\n onDataChange({ ...data, bufferItems: newBufferItems, itemKeys: newKeys });\r\n }, [data, onDataChange]);\r\n\r\n const onRemoveAll = useCallback(() => {\r\n onDataChange({ ...data, bufferItems: [], itemKeys: {} });\r\n }, [data, onDataChange]);\r\n\r\n const onAddButtonClick = useCallback(() => {\r\n onDataChange({ ...data, bufferItems: [...data.bufferItems, { isBidValid: true }] });\r\n }, [data, onDataChange]);\r\n\r\n const onRenderHeader = useCallback(() => (\r\n \r\n
\r\n {isDuplicate && \r\n
\r\n \r\n
\r\n \r\n {i18n.getString(_TL_('Duplicate dynamic ad target'))}
}\r\n \r\n \r\n \r\n \r\n {i18n.getString(_TL_('Remove all'))}\r\n \r\n
\r\n ), [classes.listHeader, i18n, onRemoveAll]);\r\n\r\n const onRenderItem = useCallback(({ item, onItemChange }) => (\r\n \r\n
\r\n );\r\n};\r\n\r\nCategoryRule.propTypes = {\r\n condition: PropTypes.shape({}).isRequired,\r\n preloadedCategories: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\r\n domainName: PropTypes.string.isRequired,\r\n languageCode: PropTypes.string.isRequired,\r\n onValidateArgumentOperand: PropTypes.func.isRequired,\r\n};\r\n\r\nconst SingleRule = ({\r\n condition, i18n, activity, onChangeRule, onRemoveRule, alwaysShowError, preloadedCategories, domainName, languageCode, selectedTargetingSource,\r\n}) => {\r\n const selectedRuleType = condition.Operand || DSA_TARGET_OPERAND_TYPES.Url;\r\n const restoreFocusTargetAttribute = useRestoreFocusTarget();\r\n\r\n const onOptionSelect = useCallback((_evt, option) => {\r\n if (option.optionValue !== selectedRuleType) {\r\n onChangeRule({\r\n ...condition,\r\n Operand: option.optionValue,\r\n Operator: DSA_SPECIFIC_TARGET_OPERATOR_MAP[option.optionValue],\r\n });\r\n activity.signal(`onRuleTypeChangeDropdownOptionClicked - ${option.optionValue}`);\r\n }\r\n }, [activity, selectedRuleType, condition, onChangeRule]);\r\n\r\n const onValidateArgumentOperand = useCallback((res) => {\r\n if (condition) {\r\n onChangeRule({\r\n ...condition,\r\n ArgumentOperand: res.data.ArgumentOperand,\r\n isValid: res.isValid,\r\n });\r\n }\r\n }, [condition, onChangeRule]);\r\n\r\n return (\r\n {i18n.getString(_TL_('Category'))}
\r\n \r\n
\r\n \r\n {\r\n selectedRuleType === DSA_TARGET_OPERAND_TYPES.Category ?\r\n \r\n {map(RULE_TYPES, ruleType => (\r\n \r\n {i18n.getString(DSA_TARGET_OPERAND_TYPE_STRINGS[ruleType])}\r\n \r\n ))}\r\n \r\n )}\r\n {selectedRuleType !== DSA_TARGET_OPERAND_TYPES.Category && isString(DSA_SPECIFIC_TARGET_OPERATOR_MAP[selectedRuleType]) && (\r\n \r\n )}\r\n {selectedRuleType !== DSA_TARGET_OPERAND_TYPES.Category && isString(DSA_SPECIFIC_TARGET_OPERATOR_MAP[selectedRuleType]) && (\r\n
\r\n );\r\n};\r\n\r\nSingleRule.propTypes = {\r\n condition: PropTypes.shape({}).isRequired,\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n activity: PropTypes.shape({}).isRequired,\r\n onChangeRule: PropTypes.func.isRequired,\r\n onRemoveRule: PropTypes.func.isRequired,\r\n preloadedCategories: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\r\n domainName: PropTypes.string.isRequired,\r\n languageCode: PropTypes.string.isRequired,\r\n selectedTargetingSource: PropTypes.string.isRequired,\r\n};\r\n\r\nconst CustomEditRow = ({\r\n itemKeys, i18n, classes, activity, item, onItemChange, applyFailCount, preloadedCategories, domainName, languageCode, selectedTargetingSource,\r\n}) => {\r\n const currency = useCurrencyCode();\r\n const defaultBid = useDefaultBid();\r\n\r\n const [open, setOpen] = useState(false);\r\n const [isDuplicate, setIsDuplicate] = useState(false);\r\n const [isRuleEmpty, setIsRuleEmpty] = useState(false);\r\n const [alwaysShowError, setAlwaysShowError] = useState(false);\r\n\r\n const initialFailCount = useRef(applyFailCount);\r\n\r\n useEffect(() => {\r\n setIsDuplicate(item.isValid && itemKeys[item.key] > 1);\r\n }, [item, itemKeys]);\r\n\r\n useEffect(() => {\r\n if (!item.isValid) {\r\n setOpen(true);\r\n if (applyFailCount > initialFailCount.current) {\r\n setAlwaysShowError(true);\r\n if (!item.conditions || item.conditions.length === 0) {\r\n setIsRuleEmpty(true);\r\n }\r\n }\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [applyFailCount]);\r\n\r\n const verifyConditions = conditions => conditions && conditions.length > 0 && every(conditions, 'isValid');\r\n\r\n const onAddRule = useCallback(() => {\r\n const newConditions = item.conditions ? [...item.conditions, { Operand: RULE_TYPES[0], Operator: DSA_SPECIFIC_TARGET_OPERATOR_MAP[RULE_TYPES[0]] }] : [{ Operand: RULE_TYPES[0], Operator: DSA_SPECIFIC_TARGET_OPERATOR_MAP[RULE_TYPES[0]] }];\r\n onItemChange({ ...item, conditions: newConditions, isValid: false });\r\n setIsRuleEmpty(false);\r\n }, [item, onItemChange]);\r\n\r\n const onChangeRule = useCallback(index => (condition) => {\r\n const newConditions = item.conditions.slice();\r\n newConditions[index] = condition;\r\n const { key, conditions: newFormattedConditions } = generateKeyAndFormateDsaTarget(newConditions);\r\n onItemChange({\r\n ...item, conditions: newFormattedConditions, key, isValid: verifyConditions(newFormattedConditions) && item.isBidValid,\r\n });\r\n });\r\n\r\n const onRemoveRule = index => () => {\r\n const newConditions = item.conditions.slice();\r\n newConditions.splice(index, 1);\r\n const { key, conditions: newFormattedConditions } = generateKeyAndFormateDsaTarget(newConditions);\r\n if (newFormattedConditions.length === 0) {\r\n setIsRuleEmpty(true);\r\n onItemChange({\r\n ...item, conditions: newFormattedConditions, key, isValid: false,\r\n });\r\n }\r\n onItemChange({ ...item, conditions: newFormattedConditions, key });\r\n };\r\n\r\n const onValidateBid = useCallback((res) => {\r\n if (item) {\r\n onItemChange({\r\n ...item,\r\n Bid: res.data.Bid,\r\n isBidValid: res.isValid,\r\n isValid: res.isValid && verifyConditions(item.conditions),\r\n });\r\n }\r\n }, [item, onItemChange]);\r\n\r\n const RuleSummary = useMemo(() => {\r\n if (!item.conditions) {\r\n return null;\r\n }\r\n const summary = reduce(item.conditions, (acc, cur, index) => {\r\n acc.push((\r\n <>\r\n {index === 0 && ({`${i18n.getCurrencySymbol(currency)}${item.Bid || defaultBid} ${currency}`})}\r\n {' · '}\r\n {i18n.getString(DSA_TARGET_OPERAND_TYPE_STRINGS[cur.Operand])}\r\n {` (${cur.ArgumentOperand})`}\r\n \r\n ));\r\n return acc;\r\n }, []);\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nCustomEditRow.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n getCurrencySymbol: PropTypes.func.isRequired,\r\n }).isRequired,\r\n classes: PropTypes.shape({\r\n exactUrlEditRowContainer: PropTypes.string.isRequired,\r\n }).isRequired,\r\n activity: PropTypes.shape({}).isRequired,\r\n item: PropTypes.shape({}).isRequired,\r\n onItemChange: PropTypes.func.isRequired,\r\n applyFailCount: PropTypes.number.isRequired,\r\n preloadedCategories: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\r\n domainName: PropTypes.string.isRequired,\r\n languageCode: PropTypes.string.isRequired,\r\n selectedTargetingSource: PropTypes.string.isRequired,\r\n};\r\n\r\nexport const RuleTarget = ({\r\n data, onDataChange, itemKeys, setItemKeys, applyFailCount, preloadedCategories, domainName, languageCode, selectedTargetingSource,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getRuleStyles);\r\n const activity = useContext(ActivityContext);\r\n\r\n useEffect(() => {\r\n const newKeys = reduce(data.bufferItems, (acc, item) => {\r\n acc[item.key] = result(acc, item.key, 0) + 1;\r\n return acc;\r\n }, {});\r\n setItemKeys(newKeys);\r\n }, [data.bufferItems, setItemKeys]);\r\n\r\n const onListItemChange = useCallback(index => (item) => {\r\n const newBufferItems = data.bufferItems.slice();\r\n newBufferItems[index] = item;\r\n onDataChange({ ...data, bufferItems: newBufferItems });\r\n }, [data, onDataChange]);\r\n\r\n const onListItemRemove = useCallback(index => () => {\r\n const removedItemKey = data.bufferItems[index].key;\r\n const newKeys = { ...data.itemKeys };\r\n delete newKeys[removedItemKey];\r\n\r\n const newBufferItems = data.bufferItems.slice();\r\n newBufferItems.splice(index, 1);\r\n\r\n onDataChange({ ...data, bufferItems: newBufferItems, itemKeys: newKeys });\r\n }, [data, onDataChange]);\r\n\r\n const onRemoveAll = useCallback(() => {\r\n onDataChange({ ...data, bufferItems: [], itemKeys: {} });\r\n }, [data, onDataChange]);\r\n\r\n const onAddButtonClick = useCallback(() => {\r\n onDataChange({ ...data, bufferItems: [...data.bufferItems, { isValid: false, isBidValid: true }] });\r\n }, [data, onDataChange]);\r\n\r\n const onRenderHeader = useCallback(() => (\r\n \r\n setOpen(!open)}\r\n >\r\n 0 ? RuleSummary : i18n.getString(_TL_('Rule'))}\r\n />\r\n \r\n \r\n \r\n
\r\n {isRuleEmpty && \r\n {map(item.conditions, (condition, index) => (\r\n <>\r\n {index > 0 && }\r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {i18n.getString(_TL_('Please add at least one rule'))}
}\r\n {isDuplicate && {i18n.getString(_TL_('Duplicate dynamic ad target'))}
}\r\n \r\n \r\n \r\n {i18n.getString(_TL_('Remove all'))}\r\n \r\n
\r\n ), [classes.listHeader, i18n, onRemoveAll]);\r\n\r\n const onRenderItem = useCallback(({ item, onItemChange }) => (\r\n \r\n
\r\n );\r\n};\r\n\r\nSpecificTarget.propTypes = {\r\n data: PropTypes.arrayOf(PropTypes.shape({\r\n exactUrls: PropTypes.shape({\r\n items: PropTypes.arrayOf(PropTypes.shape({})),\r\n bufferItems: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n })).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n onCancel: PropTypes.func.isRequired,\r\n preloadedCategories: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\r\n domainName: PropTypes.string.isRequired,\r\n languageCode: PropTypes.string.isRequired,\r\n selectedTargetingSource: PropTypes.string.isRequired,\r\n};\r\n\r\nexport const SpecificTargetPanel = withSidePanel(SpecificTarget);\r\n","export const getCustomLabelStyles = () => ({\r\n listHeader: {\r\n display: 'flex',\r\n gap: '10px',\r\n alignItems: 'start',\r\n padding: '10px 0',\r\n '& .custom-label': {\r\n width: '320px',\r\n },\r\n '& .bid': {\r\n width: '120px',\r\n },\r\n },\r\n listFooter: {\r\n padding: '10px 0',\r\n },\r\n customLabelEditRowContainer: {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n '& .custom-label-edit-row': {\r\n display: 'flex',\r\n gap: '10px',\r\n '& .text-input-container': {\r\n width: '320px',\r\n \"& div[role='alert'] .error\": {\r\n marginTop: '-10px',\r\n marginBottom: '10px',\r\n },\r\n },\r\n '& .column-bid-edit': {\r\n width: '120px',\r\n '& .fui-Input': {\r\n width: '100%',\r\n },\r\n \"& div[role='alert'] .error\": {\r\n color: '#A80000',\r\n marginTop: '10px',\r\n marginBottom: '10px',\r\n },\r\n },\r\n },\r\n '& .duplicate-error': {\r\n color: '#A80000',\r\n marginTop: '-10px',\r\n marginBottom: '10px',\r\n },\r\n },\r\n});\r\n","import { reduce, result, every, map, first } from 'underscore';\r\nimport React, { useCallback, useContext, useEffect, useState, useRef } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classnames from 'classnames';\r\nimport { Input, Label, Button } from '@fluentui/react-components';\r\nimport { WebpageCondition, DsaTarget } from '@bingads-webui/campaign-odata-schemas';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { withError, withValidation } from '@bingads-webui-react/validation';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport { RemainingCharsValidatedTextField } from '@bingads-webui-campaign-react/remaining-chars-hint';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport {\r\n DSA_TARGET_OPERAND_TYPES,\r\n DSA_TARGET_OPERATOR_TYPES,\r\n generateKeyAndFormateDsaTarget,\r\n} from '@bingads-webui-campaign-react/search-campaign-data';\r\n\r\nimport { DefaultBidDescription } from './default-bid-description';\r\nimport { withSidePanel } from './with-side-panel';\r\nimport { ActionBar } from './action-bar';\r\nimport { EditableFluentList } from '../fluent-list-component';\r\nimport { getCustomLabelStyles } from './styles/custom-label-style';\r\nimport { useCurrencyCode, useDefaultBid } from '../utils';\r\n\r\nconst ValidatedTextInput = withControlErrorHandling(withUnvalidatedControlErrors(withError(withValidation(Input))));\r\n\r\nconst CustomEditRow = ({\r\n itemKeys, i18n, classes, item, onItemChange, applyFailCount,\r\n}) => {\r\n const { conditions } = item || {};\r\n const condition = first(conditions) || {};\r\n const currency = useCurrencyCode();\r\n\r\n const [isDuplicate, setIsDuplicate] = useState(false);\r\n const [alwaysShowError, setAlwaysShowError] = useState(false);\r\n\r\n const initialFailCount = useRef(applyFailCount);\r\n\r\n useEffect(() => {\r\n setIsDuplicate(item.isValid && itemKeys[item.key] > 1);\r\n }, [item, itemKeys]);\r\n\r\n useEffect(() => {\r\n if (!item.isValid && applyFailCount > initialFailCount.current) {\r\n setAlwaysShowError(true);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [applyFailCount]);\r\n\r\n const onValidateArgumentOperand = useCallback((res) => {\r\n if (item) {\r\n const { key, conditions: newConditions } = generateKeyAndFormateDsaTarget([{ ...res.data, Operator: DSA_TARGET_OPERATOR_TYPES.Equals, Operand: DSA_TARGET_OPERAND_TYPES.CustomLabel }]);\r\n onItemChange({\r\n ...item,\r\n key,\r\n conditions: newConditions,\r\n isConditionValid: res.isValid,\r\n isValid: res.isValid && item.isBidValid,\r\n });\r\n }\r\n }, [item, onItemChange]);\r\n\r\n const onValidateBid = useCallback((res) => {\r\n if (item) {\r\n onItemChange({\r\n ...item,\r\n Bid: res.data.Bid,\r\n isBidValid: res.isValid,\r\n isValid: res.isValid && item.isConditionValid,\r\n });\r\n }\r\n }, [item, onItemChange]);\r\n\r\n return (\r\n \r\n \r\n \r\n {i18n.getString(_TL_('Note'))} \r\n \r\n {selectedTab === TABLIST.EXACTURLS ?\r\n i18n.getString(_TL_('You can target exact URLs on your website.'))\r\n : i18n.getString(_TL_('You can target specific pages of your website based on their URL, category, page title, page content, or custom label.'))\r\n }\r\n \r\n \r\n \r\n \r\n \r\n {i18n.getString(_TL_('Exact URLs'))}\r\n {showExactUrlsTabError && *}\r\n \r\n \r\n {i18n.getString(_TL_('Rules'))}\r\n {showRulesTabError && *}\r\n \r\n \r\n
\r\n {\r\n selectedTab === TABLIST.EXACTURLS && (\r\n \r\n
\r\n );\r\n};\r\n\r\nCustomEditRow.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n classes: PropTypes.shape({\r\n customLabelEditRowContainer: PropTypes.string.isRequired,\r\n }).isRequired,\r\n itemKeys: PropTypes.shape({}).isRequired,\r\n item: PropTypes.shape({\r\n key: PropTypes.string,\r\n isValid: PropTypes.bool,\r\n isBidValid: PropTypes.bool,\r\n isConditionValid: PropTypes.bool,\r\n }).isRequired,\r\n onItemChange: PropTypes.func.isRequired,\r\n applyFailCount: PropTypes.number.isRequired,\r\n};\r\n\r\nconst CustomLabelTarget = ({\r\n data, onDataChange, onCancel,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getCustomLabelStyles);\r\n const defaultBid = useDefaultBid();\r\n\r\n const [itemKeys, setItemKeys] = useState({});\r\n\r\n const [applyFailCount, setApplyFailCount] = useState(0);\r\n\r\n useEffect(() => {\r\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n onDataChange({ ...data, bufferItems: data.items.map(({ errors, ...rest }) => ({ ...rest })) });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n const newKeys = reduce(data.bufferItems, (acc, item) => {\r\n acc[item.key] = result(acc, item.key, 0) + 1;\r\n return acc;\r\n }, {});\r\n setItemKeys(newKeys);\r\n }, [data.bufferItems]);\r\n\r\n const verifyData = useCallback(() => (\r\n every(Object.values(itemKeys), value => value <= 1) && every(data.bufferItems, item => item.isValid)\r\n ), [data.bufferItems, itemKeys]);\r\n\r\n const onListItemChange = useCallback(index => (item) => {\r\n const newBufferItems = data.bufferItems.slice();\r\n newBufferItems[index] = item;\r\n onDataChange({ ...data, bufferItems: newBufferItems });\r\n }, [data, onDataChange]);\r\n\r\n const onListItemRemove = useCallback(index => () => {\r\n const removedItemKey = data.bufferItems[index].key;\r\n const newKeys = { ...data.itemKeys };\r\n delete newKeys[removedItemKey];\r\n\r\n const newBufferItems = data.bufferItems.slice();\r\n newBufferItems.splice(index, 1);\r\n\r\n onDataChange({ ...data, bufferItems: newBufferItems, itemKeys: newKeys });\r\n }, [data, onDataChange]);\r\n\r\n const onRemoveAll = useCallback(() => {\r\n onDataChange({ ...data, bufferItems: [], itemKeys: {} });\r\n }, [data, onDataChange]);\r\n\r\n const onAddButtonClick = useCallback(() => {\r\n onDataChange({ ...data, bufferItems: [...data.bufferItems, { isBidValid: true }] });\r\n }, [data, onDataChange]);\r\n\r\n const onApply = useCallback(() => {\r\n if (!verifyData()) {\r\n setApplyFailCount(count => count + 1);\r\n return;\r\n }\r\n const newItems = map(data.bufferItems, item => ({\r\n ...item,\r\n Bid: item.Bid || defaultBid,\r\n }));\r\n onDataChange({ ...data, items: newItems });\r\n onCancel();\r\n }, [data, onCancel, onDataChange, verifyData, defaultBid]);\r\n\r\n const onRenderHeader = useCallback(() => (\r\n \r\n
\r\n {isDuplicate && \r\n
\r\n \r\n {i18n.getString(_TL_('Duplicate dynamic ad target'))}
}\r\n \r\n \r\n \r\n \r\n {i18n.getString(_TL_('Remove all'))}\r\n \r\n
\r\n ), [classes.listHeader, i18n, onRemoveAll]);\r\n\r\n const onRenderItem = useCallback(({ item, onItemChange }) => (\r\n \r\n
\r\n );\r\n};\r\n\r\nCustomLabelTarget.propTypes = {\r\n data: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n onCancel: PropTypes.func.isRequired,\r\n};\r\n\r\nexport const CustomLabelTargetPanel = withSidePanel(CustomLabelTarget);\r\n","import { map, isEmpty, values, first, reduce, chain, debounce } from 'underscore';\r\nimport React, { useCallback, useContext, useState, useEffect, useMemo, useRef } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classnames from 'classnames';\r\nimport { withError, withCustomValidation, withValidation, ValidationGroup } from '@bingads-webui-react/validation';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { DsaTarget } from '@bingads-webui/campaign-odata-schemas';\r\nimport {\r\n Label,\r\n Button,\r\n Checkbox,\r\n Input,\r\n} from '@fluentui/react-components';\r\nimport {\r\n MessageBar,\r\n MessageBarBody,\r\n MessageBarTitle\r\n} from '@fluentui/react-message-bar';\r\nimport { AddRegular } from '@fluentui/react-icons';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport { SelectedItem } from '@bingads-webui-campaign-react/pill-item-components';\r\nimport {\r\n DSA_TARGET_TYPES,\r\n DSA_TARGET_SUB_TYPES,\r\n DSA_TARGET_OPERAND_TYPE_STRINGS,\r\n loadCategoryList,\r\n targetingSourceOptions,\r\n // loadCategoryNameList,\r\n} from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { HelpPopup } from '@bingads-webui-react/help-popup';\r\nimport { HelpLink } from '@bingads-webui-react/help-link';\r\n\r\nimport { useCurrencyCode } from './utils';\r\nimport { DefaultBidDescription } from './dynamic-ad-target-panel/default-bid-description';\r\n\r\nimport { CategoryTargetPanel, SpecificTargetPanel, CustomLabelTargetPanel } from './dynamic-ad-target-panel';\r\n\r\nconst ValidatedTextInput = withControlErrorHandling(withUnvalidatedControlErrors(withError(withValidation(Input))));\r\n\r\nconst getStyles = () =>\r\n ({\r\n dynamicAdTargetContainer: {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: '8px',\r\n '& .message-bar': {\r\n marginTop: '20px',\r\n },\r\n },\r\n dynamicAdTargetOption: {\r\n paddingLeft: '36px',\r\n '& .add-button': {\r\n marginTop: '18px',\r\n },\r\n },\r\n selectedAdTargetTags: {\r\n '& .tagsContainer': {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n gridGap: '8px',\r\n '& .feeds-number-hint': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n },\r\n '& .show-more-button': {\r\n marginTop: '10px',\r\n marginBottom: '10px',\r\n },\r\n },\r\n targetAllBid: {\r\n paddingLeft: '36px',\r\n '& .bid-input-container': {\r\n display: 'flex',\r\n gap: '8px',\r\n alignItems: 'start',\r\n '& .bid-input': {\r\n width: '200px',\r\n },\r\n },\r\n },\r\n targetOptionTitle: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n helpLink: {\r\n marginLeft: 5,\r\n },\r\n });\r\n\r\nconst AdTargetsPillItem = ({\r\n title,\r\n maxNumberWithoutCollapse,\r\n selectedOptions = [],\r\n generateItemText,\r\n onRemoveItem,\r\n allowEditDynamicAdTarget,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n const selectedOptionsWithErrors = useMemo(() => selectedOptions.filter(item => !isEmpty(item.errors)), [selectedOptions]);\r\n const selectedOptionsWithoutErrors = useMemo(() => selectedOptions.filter(item => isEmpty(item.errors)), [selectedOptions]);\r\n const sortedSelectedOptions = useMemo(() => [...selectedOptionsWithErrors, ...selectedOptionsWithoutErrors], [selectedOptionsWithErrors, selectedOptionsWithoutErrors]);\r\n\r\n const [isCollapsed, setIsCollapsed] = useState(false);\r\n\r\n useEffect(() => {\r\n setIsCollapsed(sortedSelectedOptions.length > maxNumberWithoutCollapse && selectedOptionsWithErrors.length <= maxNumberWithoutCollapse);\r\n }, [maxNumberWithoutCollapse, sortedSelectedOptions, selectedOptionsWithErrors]);\r\n\r\n return (\r\n \r\n {sortedSelectedOptions.length > 0 && }\r\n setIsCollapsed(prev => !prev)}\r\n >\r\n {isCollapsed ? i18n.getString(_TL_('Show more')) : i18n.getString(_TL_('Show less'))}\r\n \r\n )}\r\n
\r\n );\r\n};\r\n\r\nAdTargetsPillItem.propTypes = {\r\n title: PropTypes.string.isRequired,\r\n maxNumberWithoutCollapse: PropTypes.number.isRequired,\r\n selectedOptions: PropTypes.arrayOf(PropTypes.shape({\r\n key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n text: PropTypes.string,\r\n })).isRequired,\r\n generateItemText: PropTypes.func.isRequired,\r\n onRemoveItem: PropTypes.func.isRequired,\r\n allowEditDynamicAdTarget: PropTypes.bool.isRequired,\r\n};\r\n\r\nconst DynamicAdTargetOption = ({\r\n selectedTargets,\r\n generateItemText,\r\n showAddButton,\r\n onAddButtonClick,\r\n allowEditDynamicAdTarget,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n return (\r\n \r\n {\r\n !isEmpty(sortedSelectedOptions) && map(sortedSelectedOptions, (item, index) => {\r\n if (isCollapsed && index >= maxNumberWithoutCollapse) {\r\n return null;\r\n }\r\n const itemText = generateItemText(item);\r\n return (\r\n error.message).uniq().value()}\r\n onDelete={allowEditDynamicAdTarget ? () => onRemoveItem(item) : undefined}\r\n />\r\n );\r\n })\r\n }\r\n {\r\n isCollapsed && (\r\n {`+ ${sortedSelectedOptions.length - maxNumberWithoutCollapse}`}\r\n )\r\n }\r\n
\r\n {\r\n sortedSelectedOptions.length > maxNumberWithoutCollapse && (\r\n \r\n {\r\n selectedTargets && selectedTargets.length > 0 && map(selectedTargets, selectedTarget => (\r\n
\r\n );\r\n};\r\n\r\nDynamicAdTargetOption.propTypes = {\r\n selectedTargets: PropTypes.arrayOf(PropTypes.shape({\r\n title: PropTypes.string,\r\n maxNumberWithoutCollapse: PropTypes.number,\r\n items: PropTypes.arrayOf(PropTypes.shape({\r\n key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n text: PropTypes.string,\r\n })),\r\n onRemoveItem: PropTypes.func,\r\n })).isRequired,\r\n generateItemText: PropTypes.func.isRequired,\r\n showAddButton: PropTypes.bool.isRequired,\r\n onAddButtonClick: PropTypes.func.isRequired,\r\n allowEditDynamicAdTarget: PropTypes.bool.isRequired,\r\n};\r\n\r\nconst TargetAllBidInput = ({\r\n i18n, items, onChange, allowEditDynamicAdTarget,\r\n}) => {\r\n const item = useMemo(() => first(items) || {}, [items]);\r\n const classes = useDefaultStyles(getStyles);\r\n const currency = useCurrencyCode();\r\n\r\n const onValidateBid = useCallback((res) => {\r\n if (items) {\r\n onChange({\r\n items: [{ ...item, Bid: res.data.Bid }],\r\n });\r\n }\r\n }, [item, items, onChange]);\r\n\r\n return (\r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nTargetAllBidInput.propTypes = {\r\n onChange: PropTypes.func.isRequired,\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n items: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\r\n allowEditDynamicAdTarget: PropTypes.bool.isRequired,\r\n};\r\n\r\nconst DynamicAdTarget = ({\r\n validationProps, updateValidation,\r\n}) => {\r\n const { data: adGroup } = validationProps;\r\n const {\r\n websites, DsaTargets, selectedWebsiteLanguage, allowEditDynamicAdTarget, selectedTargetingSource,\r\n } = adGroup;\r\n const website = first(websites) || '';\r\n const websiteWithoutProtocol = website.replace(/(^\\w+:|^)\\/\\//, '');\r\n\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n const currency = useCurrencyCode();\r\n\r\n const {\r\n [DSA_TARGET_TYPES.categoryTargets]: categoryTargets,\r\n [DSA_TARGET_TYPES.allTargets]: allTargets,\r\n [DSA_TARGET_TYPES.specificTargets]: specificTargets,\r\n [DSA_TARGET_TYPES.customLabelTargets]: customLabelTargets,\r\n } = DsaTargets || {};\r\n\r\n const {\r\n [DSA_TARGET_SUB_TYPES.exactUrls]: exactUrls,\r\n [DSA_TARGET_SUB_TYPES.rules]: rules,\r\n } = specificTargets || {};\r\n\r\n const categoryTitle = useMemo(() => (\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {i18n.getString(_TL_('Target categories of webpages'))}\r\n
\r\n ), [i18n, classes]);\r\n\r\n const allTitle = useMemo(() => (\r\n \r\n {i18n.getString(_TL_('Target all webpages'))}\r\n
\r\n ), [i18n, classes]);\r\n\r\n const specificTitle = useMemo(() => (\r\n \r\n {i18n.getString(_TL_('Target specific webpages'))}\r\n
\r\n ), [i18n, classes]);\r\n\r\n const customLabelTitle = useMemo(() => (\r\n \r\n {i18n.getString(_TL_('Target custom labels from your page feed(s)'))}\r\n
\r\n ), [i18n, classes]);\r\n\r\n const [isCategoryTargetPanelOpen, setIsCategoryTargetPanelOpen] = useState(false);\r\n const [isSpecificTargetPanelOpen, setIsSpecificTargetPanelOpen] = useState(false);\r\n const [isCustomLabelTargetPanelOpen, setIsCustomLabelTargetPanelOpen] = useState(false);\r\n\r\n const validateDynamicTargets = useCallback((dynamicTargets) => {\r\n const {\r\n [DSA_TARGET_TYPES.categoryTargets]: newCategoryTargets,\r\n [DSA_TARGET_TYPES.allTargets]: newAllTargets,\r\n [DSA_TARGET_TYPES.specificTargets]: newSpecificTargets,\r\n [DSA_TARGET_TYPES.customLabelTargets]: newCustomLabelTargets,\r\n } = dynamicTargets;\r\n\r\n let isValid = false;\r\n if (newCategoryTargets && !newCategoryTargets.disabled && newCategoryTargets.selected && newCategoryTargets.items && newCategoryTargets.items.length > 0) {\r\n isValid = true;\r\n }\r\n if (newAllTargets && !newAllTargets.disabled && newAllTargets.selected) {\r\n isValid = true;\r\n }\r\n if (newSpecificTargets && !newSpecificTargets.disabled && newSpecificTargets.selected && values(newSpecificTargets).some(subValue => subValue.items && subValue.items.length > 0)) {\r\n isValid = true;\r\n }\r\n if (newCustomLabelTargets && !newCustomLabelTargets.disabled && newCustomLabelTargets.selected && newCustomLabelTargets.items && newCustomLabelTargets.items.length > 0) {\r\n isValid = true;\r\n }\r\n return isValid ? [] : [i18n.getString(_TL_('Please select and add at least one target'))];\r\n }, [i18n]);\r\n\r\n const onOptionChange = option => (_evt, data) => {\r\n const newDsaTargets = {\r\n ...DsaTargets,\r\n [option]: {\r\n ...DsaTargets[option],\r\n selected: data.checked,\r\n },\r\n };\r\n\r\n const errors = validateDynamicTargets(newDsaTargets);\r\n updateValidation(errors, { DsaTargets: newDsaTargets });\r\n };\r\n\r\n const onDsaTargetsChange = option => (newDsaSubTargets) => {\r\n const newDsaTargets = {\r\n ...DsaTargets,\r\n [option]: {\r\n ...DsaTargets[option],\r\n ...newDsaSubTargets,\r\n },\r\n };\r\n\r\n const errors = validateDynamicTargets(newDsaTargets);\r\n updateValidation(errors, { DsaTargets: newDsaTargets });\r\n };\r\n\r\n const onDsaTargetsRemove = option => (item) => {\r\n const newDsaTargets = {\r\n ...DsaTargets,\r\n [option]: {\r\n ...DsaTargets[option],\r\n items: DsaTargets[option].items.filter(value => value.key !== item.key),\r\n },\r\n };\r\n\r\n const errors = validateDynamicTargets(newDsaTargets);\r\n updateValidation(errors, { DsaTargets: newDsaTargets });\r\n };\r\n\r\n const onSubDsaTargetsRemove = subOption => (item) => {\r\n const newDsaTargets = {\r\n ...DsaTargets,\r\n specificTargets: {\r\n ...specificTargets,\r\n [subOption]: {\r\n ...specificTargets[subOption],\r\n items: specificTargets[subOption].items.filter(value => value.key !== item.key),\r\n },\r\n },\r\n };\r\n\r\n const errors = validateDynamicTargets(newDsaTargets);\r\n updateValidation(errors, { DsaTargets: newDsaTargets });\r\n };\r\n\r\n const [preloadedCategories, setPreloadedCategories] = useState([]);\r\n const renderCycleRef = useRef(0);\r\n const loadCategory = useCallback((domain, language) => {\r\n loadCategoryList(domain, language).then((response) => {\r\n if (window.e2eTestEnvironment) {\r\n setPreloadedCategories([{ Bid: 0, CategoryName: 'browse/', Coverage: 0.1334 }]);\r\n } else {\r\n setPreloadedCategories(response.totalCount ? response : []);\r\n }\r\n });\r\n }, []);\r\n const debouncedLoadCategory = useMemo(() => debounce(loadCategory, 500), [loadCategory]);\r\n // const [preloadedCategoryNames, setPreloadedCategoryNames] = useState([]);\r\n useEffect(() => {\r\n if (!isEmpty(adGroup)) {\r\n if (websiteWithoutProtocol) {\r\n debouncedLoadCategory(websiteWithoutProtocol, selectedWebsiteLanguage);\r\n // loadCategoryNameList(websiteWithoutProtocol).then((response) => {\r\n // setPreloadedCategoryNames(response);\r\n // });\r\n } else {\r\n setPreloadedCategories([]);\r\n // setPreloadedCategoryNames([]);\r\n }\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [websiteWithoutProtocol, selectedWebsiteLanguage]);\r\n\r\n const onCategoryUpdate = useCallback((data) => {\r\n if (!isEmpty(adGroup)) {\r\n const newDsaTargets = {\r\n ...DsaTargets,\r\n [DSA_TARGET_TYPES.categoryTargets]: {\r\n ...DsaTargets[DSA_TARGET_TYPES.categoryTargets],\r\n disabled: data.disabled,\r\n // 1. skip updating items in the first 2 render cycles, that's caused by mounting (mount preloadedCategories; mount website, update preloadedCategories); in mounting, don't clear\r\n // 2. whenever user changes website, clear the selected categories\r\n items: renderCycleRef.current <= 2 ? DsaTargets[DSA_TARGET_TYPES.categoryTargets].items : [],\r\n selected: data.disabled ? false : DsaTargets[DSA_TARGET_TYPES.categoryTargets].selected,\r\n },\r\n };\r\n\r\n const errors = validateDynamicTargets(newDsaTargets);\r\n updateValidation(errors, { DsaTargets: newDsaTargets }, false);\r\n }\r\n }, [adGroup, DsaTargets, updateValidation, validateDynamicTargets]);\r\n\r\n useEffect(() => {\r\n renderCycleRef.current += 1;\r\n if (adGroup && adGroup.DsaTargets) {\r\n onCategoryUpdate({ disabled: isEmpty(preloadedCategories) });\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [preloadedCategories]);\r\n\r\n useEffect(() => {\r\n if (adGroup && adGroup.DsaTargets) {\r\n const newDsaTargets = {\r\n ...DsaTargets,\r\n [DSA_TARGET_TYPES.customLabelTargets]: {\r\n ...DsaTargets[DSA_TARGET_TYPES.customLabelTargets],\r\n disabled: selectedTargetingSource === targetingSourceOptions.SystemIndex,\r\n },\r\n };\r\n\r\n const errors = validateDynamicTargets(newDsaTargets);\r\n updateValidation(errors, { DsaTargets: newDsaTargets }, false);\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [selectedTargetingSource]);\r\n\r\n return (\r\n \r\n \r\n \r\n {i18n.getString(_TL_('Note'))} \r\n {/* eslint-disable-next-line react/no-danger */}\r\n Campaigns > Dynamic ad targets.')) }} />\r\n \r\n \r\n )}\r\n \r\n \r\n {i18n.getString(_TL_('Note'))} \r\n {i18n.getString(_TL_(\"We automatically generate Dynamic Search ads for you based on your website's content. Set up dynamic ad targets to tell us which pages of your website to focus on.\"))}\r\n \r\n {i18n.getString(_TL_('Learn more'))}\r\n \r\n \r\n \r\n
\r\n \r\n \r\n setIsCategoryTargetPanelOpen(true)}\r\n generateItemText={(item) => {\r\n const condition = first(item.conditions) || {};\r\n return `(${i18n.getCurrencySymbol(currency)}${item.Bid} ${currency}) ${condition.ArgumentOperand}`;\r\n }}\r\n allowEditDynamicAdTarget={allowEditDynamicAdTarget}\r\n />\r\n )}\r\n
\r\n \r\n
\r\n \r\n {\r\n const condition = first(item.conditions) || {};\r\n return `(${i18n.getCurrencySymbol(currency)}${item.Bid} ${currency}) ${condition.ArgumentOperand}`;\r\n }}\r\n showAddButton={false}\r\n onAddButtonClick={() => setIsSpecificTargetPanelOpen(true)}\r\n allowEditDynamicAdTarget={allowEditDynamicAdTarget}\r\n />\r\n {\r\n const text = reduce(item.conditions, (acc, condition) => {\r\n acc.push(`${i18n.getString(DSA_TARGET_OPERAND_TYPE_STRINGS[condition.Operand])} (${condition.ArgumentOperand})`);\r\n return acc;\r\n }, []);\r\n return `${i18n.getCurrencySymbol(currency)}${item.Bid} ${currency} · ${text.join(' · ')}`;\r\n }}\r\n showAddButton\r\n onAddButtonClick={() => setIsSpecificTargetPanelOpen(true)}\r\n allowEditDynamicAdTarget={allowEditDynamicAdTarget}\r\n />\r\n \r\n )}\r\n
\r\n \r\n {\r\n const condition = first(item.conditions) || {};\r\n return `(${i18n.getCurrencySymbol(currency)}${item.Bid} ${currency}) ${condition.ArgumentOperand}`;\r\n }}\r\n showAddButton\r\n onAddButtonClick={() => setIsCustomLabelTargetPanelOpen(true)}\r\n allowEditDynamicAdTarget={allowEditDynamicAdTarget}\r\n />\r\n )}\r\n
\r\n {!allowEditDynamicAdTarget && (\r\n \r\n
\r\n );\r\n};\r\n\r\nCampaignDynamicSearchAdSetting.propTypes = {\r\n validationProps: PropTypes.shape({\r\n data: PropTypes.shape({\r\n hasDsaSettings: PropTypes.bool,\r\n }),\r\n }).isRequired,\r\n updateValidation: PropTypes.func.isRequired,\r\n};\r\n\r\nexport const ValidatedCampaignDynamicSearchAdSetting = withCustomValidation(CampaignDynamicSearchAdSetting);\r\n","import _ from 'underscore';\r\nimport React, { useContext, useCallback } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { MessageBar } from '@fluentui/react';\r\nimport { BrandListsPicker } from '@bingads-webui-campaign-react/brand-lists-components';\r\nimport { withCustomValidation, withError } from '@bingads-webui-react/validation';\r\n\r\nexport const getBrandListsTitleDetails = (i18n, brandProtections) => {\r\n const { selectedBrandLists } = brandProtections || {};\r\n if (_.isEmpty(selectedBrandLists)) {\r\n return i18n.getString(_TL_('Add brand protections so that your ads will show on search queries that mention those brands.'));\r\n }\r\n if (selectedBrandLists.length === 1) {\r\n return i18n.getString(_TL_('You’ve added 1 brand list, which makes it so that your ads will show on search queries that mention those brands.'));\r\n }\r\n return i18n.getString(_TL_('You’ve added {{number}} brand lists, which makes it so that your ads will show on search queries that mention those brands.'), { number: selectedBrandLists.length });\r\n};\r\n\r\nconst getStyles = (unused, { palette }) => ({\r\n brandListsPicker: {\r\n '&.disabled': {\r\n '& p,div': {\r\n color: palette.neutralTertiaryAlt,\r\n },\r\n },\r\n },\r\n messageBar: {\r\n background: palette.themeLighterAlt,\r\n marginBottom: 8,\r\n },\r\n});\r\n\r\nexport const BrandLists = ({\r\n campaignId, updateValidation, disabled,\r\n}) => {\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n const i18n = useContext(I18nContext);\r\n const activity = useContext(ActivityContext);\r\n const serverContext = useContext(ServerContext);\r\n const { scope } = useContext(ScopeContext);\r\n const { aid } = scope.values;\r\n\r\n const {\r\n CurrentAccount: {\r\n // This is to handle agency cases\r\n AdvertiserCustomerID: cid,\r\n },\r\n } = serverContext;\r\n\r\n const onBrandListsChange = useCallback((selectedBrandLists, [deletedBrandListIds, addedBrandListIds]) => {\r\n updateValidation([], {\r\n brandProtections: {\r\n deletedBrandListIds,\r\n addedBrandListIds,\r\n selectedBrandLists,\r\n },\r\n });\r\n\r\n if (activity) {\r\n activity.signal(`onBrandListsChange - ${selectedBrandLists}`);\r\n }\r\n }, [updateValidation, activity]);\r\n\r\n return (\r\n \r\n {i18n.getString(_TL_('By enabling this setting, we\\'ll create targeted and relevant ads automatically.'))}\r\n
\r\n {\r\n disabled && (\r\n \r\n {i18n.getString(_TL_('Please select predictive matching to enable brand protection.'))}\r\n \r\n )\r\n }\r\n
);\r\n};\r\n\r\nBrandLists.propTypes = {\r\n campaignId: PropTypes.number.isRequired,\r\n updateValidation: PropTypes.func.isRequired,\r\n disabled: PropTypes.bool,\r\n};\r\n\r\nBrandLists.defaultProps = {\r\n disabled: false,\r\n};\r\n\r\nexport const ValidatedBrandLists = withError(withCustomValidation(BrandLists));\r\n","import React, { useCallback, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Switch } from '@fluentui/react-components';\r\n\r\nexport const withUseCampaignSettings = (Component) => {\r\n const HOC = (props) => {\r\n const {\r\n i18n,\r\n level,\r\n onLevelChange,\r\n } = props;\r\n\r\n const useCampaignSettings = useMemo(() => level !== 'adgroup', [level]);\r\n\r\n const onSwitchChange = useCallback((ev, { checked }) => {\r\n if (checked !== useCampaignSettings) {\r\n onLevelChange(checked ? 'campaign' : 'adgroup');\r\n }\r\n }, [onLevelChange, useCampaignSettings]);\r\n\r\n return (\r\n \r\n {\r\n campaignId && (\r\n
\r\n \r\n
\r\n );\r\n };\r\n\r\n HOC.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n level: PropTypes.string.isRequired,\r\n onLevelChange: PropTypes.func.isRequired,\r\n };\r\n\r\n HOC.displayName = `withUseCampaignSettings(${Component.displayName || Component.name})`;\r\n\r\n return HOC;\r\n};\r\n","export const getStepStyles = () => ({\r\n maxWidth: 1000,\r\n});\r\n\r\nexport const getCollapsiblePanelStyles = (components, theme) => ({\r\n border: 'none',\r\n marginBottom: 'unset',\r\n backgroundColor: 'unset',\r\n\r\n '& .panel-heading': {\r\n padding: 0,\r\n borderBottom: 'none',\r\n marginBottom: 18,\r\n\r\n '& .panel-title': {\r\n fontSize: 18,\r\n '& > a': {\r\n color: theme.palette.themePrimary,\r\n padding: 0,\r\n '&:hover, &:active': {\r\n color: theme.palette.themeDarker,\r\n textDecoration: 'none',\r\n backgroundColor: 'unset',\r\n },\r\n },\r\n\r\n '& > a:after': {\r\n transform: 'rotate(180deg)',\r\n },\r\n\r\n '& > a.collapsed:after': {\r\n transform: 'rotate(90deg)',\r\n },\r\n },\r\n },\r\n\r\n '& .panel-collapse': {\r\n '& .panel-body': {\r\n padding: 0,\r\n overflow: 'hidden',\r\n },\r\n },\r\n});\r\n","import { getCollapsiblePanelStyles, getStepStyles } from '../../shared/styles';\r\n\r\nexport const getStyles = (components, theme) => ({\r\n collapsiblePanel: getCollapsiblePanelStyles(components, theme),\r\n campaignSettingsStep: {\r\n ...getStepStyles(),\r\n\r\n '& .collapse-panel.disclaimer': {\r\n '& .collapse-content': {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n },\r\n },\r\n '& .collapse-fixed-panel.website': {\r\n '& .collapse-title-bar': {\r\n paddingBottom: '5px',\r\n },\r\n '& .website-section': {\r\n '& input[type=\"text\"]:focus': {\r\n border: 'none',\r\n },\r\n '& input[type=\"text\"]:hover': {\r\n border: 'none',\r\n },\r\n },\r\n },\r\n '& .section-title': {\r\n marginTop: '28px',\r\n marginBottom: '8px',\r\n },\r\n '& .section-description': {\r\n marginBottom: '16px',\r\n },\r\n },\r\n});\r\n","import React, { useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\n\r\nexport const getStyles = () => ({\r\n stepTitle: {\r\n marginTop: 0,\r\n },\r\n stepDescription: {\r\n marginBottom: 30,\r\n },\r\n});\r\n\r\nexport const StepHeader = ({\r\n title,\r\n description,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n return (\r\n \r\n {i18n.getString(title)}\r\n
\r\n {description &&\r\n\r\n {i18n.getString(description)}\r\n
\r\n }\r\n\r\n \r\n { basicSettings }\r\n \r\n
\r\n );\r\n }, [Languages, allCampaignSettingsSections, basicSettingsExpand, bundleCountries, bundleLocationCriterions, campaign, campaignSettingsExpandedSections, i18n, locale, market, permissions, scope, setCampaignSettingsExpandedSections]);\r\n\r\n const autoGenerateSection = useMemo(() => {\r\n const autoGenerateAssetsPanel = (\r\n \r\n \r\n { autoGenerateSettings }\r\n \r\n
\r\n );\r\n }, [allCampaignSettingsSections, campaign, campaignSettingsExpandedSections, i18n, setCampaignSettingsExpandedSections]);\r\n\r\n const [\r\n allAdvancedSettingsSections,\r\n advancedSettingsExpandedSections,\r\n setAdvancedSettingsExpandedSections,\r\n ] = useCollapseState(\r\n ['conversions', 'disclaimer'] /* all sections */,\r\n ['conversions', 'disclaimer'] /* initially expanded sections */\r\n );\r\n\r\n const allAdvancedSettingsExpand = useMemo(\r\n () => collapseExpander({ setActiveKeys: setAdvancedSettingsExpandedSections }),\r\n [setAdvancedSettingsExpandedSections]\r\n );\r\n\r\n const [advancedSettingsSectionExpanded, setAdvancedSettingsSectionExpanded] = useState(false);\r\n const onAdvancedSettingsSectionToggle = useCallback((expanded) => {\r\n setAdvancedSettingsSectionExpanded(expanded);\r\n }, []);\r\n\r\n const advancedSettingsSection = useMemo(() => {\r\n const conversionsPanel = (\r\n {i18n.getString(_TL_('Automatically generate assets for your ads'))}
\r\n\r\n {i18n.getString(_TL_('Maximize ad performance by increasing the amount of relevant assets available for your responsive search ads. We automatically generate assets, so you don’t have to create them manually.'))}\r\n
\r\n \r\n (\r\n <>\r\n \r\n \r\n {i18n.getString(_TL_('Advanced settings'))}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n
\r\n );\r\n }, [advancedSettingsExpandedSections, advancedSettingsSectionExpanded, aid, allAdvancedSettingsExpand, allAdvancedSettingsSections, campaign, cid, classes.advancedCampaignSection, classes.collapsiblePanel, data, i18n, onAdvancedSettingsSectionToggle, onValidate, setAdvancedSettingsExpandedSections]);\r\n\r\n const onValidateWebsite = useCallback((result) => {\r\n if (data) {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n ...result.data,\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }, [data, onDataChange]);\r\n\r\n const websiteSection = useMemo(() => (\r\n \r\n \r\n { advancedSettings }\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n { websiteSection }\r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nCampaignSettingsStep.propTypes = {\r\n data: PropTypes.shape({\r\n campaign: PropTypes.shape({\r\n Id: PropTypes.string,\r\n Name: PropTypes.string,\r\n locationTargets: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n websites: PropTypes.shape([]),\r\n }).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n};\r\n\r\nCampaignSettingsStep.defaultProps = {\r\n error: null,\r\n};\r\n","import _ from 'underscore';\r\nimport {\r\n getTargetedLocationInfo,\r\n getSupportedLanguages,\r\n getSearchIdeaModel,\r\n} from '@bingads-webui-campaign-react/copilot-keyword-planner';\r\nimport { WIZARD_EVENTS } from '@bingads-webui-react/wizard';\r\nimport { LOCATION_CRITERION_TYPE } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { targetOptions } from '@bingads-webui-campaign-react/search-campaign-wizard-controls';\r\nimport {\r\n CHANNEL_TYPES,\r\n} from '@bingads-webui-campaign-react/keyword-planner-shared';\r\n\r\nconst getTargetedLocationNameTypeCombo = (location) => {\r\n const type = _.property('CriterionType')(location);\r\n return `${type} - ${_.property(['Criterion', `${type}Criterion`, 'Name'])(location)}`;\r\n};\r\nconst mapToLocationNameTypeCombo = locations => (_.map(locations, location => getTargetedLocationNameTypeCombo(location)));\r\n\r\n\r\nexport const useSetKeywordSuggestionsData = ({ send, permissions }) => {\r\n const onRequest = () => {\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n keywordSuggestions: null,\r\n });\r\n };\r\n const onSuccess = (rawData) => {\r\n if (permissions && permissions.dynamic && permissions.dynamic.KeywordPlannerLiteRefactorPhase1) {\r\n const keywordSuggestions = _.first(rawData.data.value).Keywords || [];\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n keywordSuggestions: _.map(keywordSuggestions, keyword => ({\r\n Keyword: keyword.Keyword.Text,\r\n RequestId: rawData.traceInfo && rawData.traceInfo.requestId,\r\n })),\r\n });\r\n } else {\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n keywordSuggestions: _.flatten(_.map(rawData.value, group => (_.isElement(group.Suggestions) ? [] : group.Suggestions))),\r\n });\r\n }\r\n };\r\n const onFailed = () => {\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n keywordSuggestions: [],\r\n });\r\n };\r\n\r\n return {\r\n onRequest, onSuccess, onFailed,\r\n };\r\n};\r\n\r\nexport const handleKeywordSuggestionsWhenChanges = ({\r\n currentUrl, currentLocationSettings, currentLanguages,\r\n previousUrl, previousLocation, previousLanguages,\r\n activity, bundleLocationCriterions,\r\n onRequest, onSuccess, onFailed, recommendateRequest, getSearchIdea, send, permissions,\r\n}) => {\r\n const log = activity ? activity.signal : _.noop;\r\n const targetOption = _.property(['targetOption'])(currentLocationSettings);\r\n let currentLocation = null;\r\n\r\n if (targetOption === targetOptions.everywhere) {\r\n currentLocation = [];\r\n } else if (targetOption === targetOptions.bundle) {\r\n currentLocation = bundleLocationCriterions;\r\n } else if (targetOption === targetOptions.specific) {\r\n currentLocation = _.property(['currentLocations'])(currentLocationSettings);\r\n }\r\n\r\n log(`onHandleKeywordSuggestions - ${JSON.stringify({\r\n Url: currentUrl,\r\n Location: {\r\n TargetOption: _.property(['targetOption'])(currentLocationSettings),\r\n TargetedLocationInfo: _.map(currentLocation, (location) => {\r\n if (location.CriterionType === LOCATION_CRITERION_TYPE.LOCATION) {\r\n return _.property(['Criterion', 'LocationCriterion'])(location);\r\n } else if (location.CriterionType === LOCATION_CRITERION_TYPE.RADIUS) {\r\n return _.property(['Criterion', 'RadiusCriterion'])(location);\r\n }\r\n return null;\r\n }),\r\n },\r\n Languages: currentLanguages,\r\n })}`);\r\n\r\n const isUrlEqual = _.isEqual(currentUrl, previousUrl);\r\n if (!isUrlEqual) {\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n previousUrl: currentUrl,\r\n });\r\n }\r\n\r\n const previousLocationNameTypeCombo = mapToLocationNameTypeCombo(previousLocation);\r\n const currentLocationNameTypeCombo = mapToLocationNameTypeCombo(currentLocation);\r\n const isLocationEqual = _.isEqual(currentLocationNameTypeCombo, previousLocationNameTypeCombo);\r\n if (!isLocationEqual) {\r\n const locationsNeedToAdd = _.difference(currentLocationNameTypeCombo, previousLocationNameTypeCombo);\r\n const locationsNeedToRemove = _.difference(previousLocationNameTypeCombo, currentLocationNameTypeCombo);\r\n const locationsAdded = _.filter(currentLocation, location => _.contains(locationsNeedToAdd, getTargetedLocationNameTypeCombo(location)));\r\n const locationsLeftedOver = _.filter(previousLocation, location => !_.contains(locationsNeedToRemove, getTargetedLocationNameTypeCombo(location)));\r\n currentLocation = locationsAdded.concat(locationsLeftedOver);\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n previousLocation: currentLocation,\r\n });\r\n }\r\n\r\n const isLanguagesEqual = _.isEqual(currentLanguages, previousLanguages);\r\n if (!isLanguagesEqual) {\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n previousLanguages: currentLanguages,\r\n });\r\n }\r\n\r\n if (!isUrlEqual || !isLocationEqual || !isLanguagesEqual) {\r\n const targetedLocationInfo = getTargetedLocationInfo(isLocationEqual ? previousLocation : currentLocation, permissions);\r\n const languages = getSupportedLanguages(isLanguagesEqual ? previousLanguages : currentLanguages, permissions);\r\n if ((currentUrl && !_.isEmpty(currentUrl.replace(/^(https?:\\/\\/)/, ''))) && !_.isEmpty(targetedLocationInfo) && !_.isEmpty(languages)) {\r\n onRequest();\r\n try {\r\n if (permissions && permissions.dynamic && permissions.dynamic.KeywordPlannerLiteRefactorPhase1) {\r\n getSearchIdea({\r\n model: getSearchIdeaModel({\r\n url: currentUrl,\r\n targetedLocationInfo,\r\n languages,\r\n }),\r\n isLanguageDecoupling: true,\r\n channel: CHANNEL_TYPES.CAMPAIGN_CREATION,\r\n }).then((rawData) => {\r\n if (rawData && rawData.data && rawData.data.value && _.first(rawData.data.value)) {\r\n log('onFetchRecommendationInSetting - has data');\r\n onSuccess(rawData);\r\n } else {\r\n log('onFetchRecommendationInSetting - no data');\r\n onFailed();\r\n }\r\n }).catch((error) => {\r\n log(`onFetchRecommendationInSetting - has error - ${JSON.stringify({\r\n ErrorStatus: error && error.status,\r\n })}`);\r\n onFailed();\r\n });\r\n } else {\r\n recommendateRequest({\r\n url: currentUrl,\r\n targetedLocationInfo,\r\n languages,\r\n }).then((rawData) => {\r\n if (rawData && rawData.value) {\r\n log('onFetchRecommendationInSetting - has data');\r\n onSuccess(rawData);\r\n } else {\r\n log('onFetchRecommendationInSetting - no data');\r\n onFailed();\r\n }\r\n }).catch((error) => {\r\n log(`onFetchRecommendationInSetting - has error - ${JSON.stringify({\r\n ErrorStatus: error && error.status,\r\n })}`);\r\n onFailed();\r\n });\r\n }\r\n } catch (error) {\r\n onFailed();\r\n }\r\n } else {\r\n onFailed();\r\n }\r\n }\r\n};\r\n","import _ from 'underscore';\r\nimport Promise from 'bluebird';\r\nimport { useCallback, useContext, useMemo } from 'react';\r\nimport { useWizardService, WIZARD_EVENTS } from '@bingads-webui-react/wizard';\r\nimport {\r\n loadCampaign,\r\n saveCampaign,\r\n loadAdGroup,\r\n CAMPAIGN_NEGATIVE_REFERENCE_ID,\r\n loadBundleCountries,\r\n modelToViewModelForCampaign,\r\n readLocationCriterions,\r\n loadDisclaimerAssociations,\r\n} from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ActivityContext, ScenarioContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { globalizationModelSetup } from '@bingads-webui-campaign/ads-globalization';\r\nimport {\r\n getDefaultLanguage,\r\n updateLocationTargetsForCampaign,\r\n} from '@bingads-webui-campaign-react/search-campaign-wizard-controls';\r\nimport {\r\n useKeywordPlannerService,\r\n} from '@bingads-webui-campaign-react/keyword-planner-shared';\r\nimport {\r\n useKeywordSuggestion,\r\n} from '@bingads-webui-campaign-react/copilot-keyword-planner';\r\nimport { getBudgetRange } from '@bingads-webui-campaign-legacy/common-grid-config/budget/get-budget-range';\r\nimport { generateNameSuggestionSuffix } from '@bingads-webui-campaign/audience-campaign-shared';\r\nimport { handleKeywordSuggestionsWhenChanges, useSetKeywordSuggestionsData } from '../../shared/keyword-suggestion-util';\r\n\r\nconst defaultLocationTargets = {\r\n bidMode: false,\r\n currentLevelSettings: {\r\n initLocations: [],\r\n currentLocations: [],\r\n peopleInLocation: true,\r\n peopleSearchingForLocation: true,\r\n targetOption: 'bundle',\r\n },\r\n parentLevelSettings: {},\r\n useParentLevel: false,\r\n};\r\n\r\nconst getDefaultBudget = (serverContext) => {\r\n const defaultBudget = getBudgetRange(serverContext.CurrentAccount.CurrencyCode).Daily.Default;\r\n const USDefaultBudget = serverContext.Permissions.IsDefaultBudgetExperimentationEnabled ? 25 : 20;\r\n return {\r\n Amount: serverContext.CurrentAccount.CurrencyCode === 'USD' ? USDefaultBudget : defaultBudget,\r\n Type: 'DailyStandard',\r\n };\r\n};\r\n\r\nconst defaultConversionGoals = {\r\n goalScopeSelection: 'account-scope',\r\n goalSelection: [],\r\n originalConversionGoals: [],\r\n};\r\n\r\nconst defaultDisclaimer = {\r\n originalSelectedDisclaimer: null,\r\n selectedDisclaimer: null,\r\n};\r\n\r\nconst getDefaultCampaignSettings = serverContext => ({\r\n locationTargets: defaultLocationTargets,\r\n Budget: getDefaultBudget(serverContext),\r\n AutoGeneratedAssetsEnabled: false,\r\n conversionGoals: defaultConversionGoals,\r\n DisclaimerAdsEnabled: false,\r\n disclaimer: defaultDisclaimer,\r\n});\r\n\r\nconst defaultAdGroup = {\r\n Name: 'Ad Group 1',\r\n AdGroupType: 'SearchStandard',\r\n};\r\n\r\nconst defaultWebsites = [];\r\n\r\nexport const useCampaignSettingsRepository = () => {\r\n const i18n = useContext(I18nContext);\r\n const scenario = useContext(ScenarioContext);\r\n const activity = useContext(ActivityContext);\r\n const serverContext = useContext(ServerContext);\r\n\r\n const { scope } = useContext(ScopeContext) || {};\r\n const { cid, aid } = scope.values;\r\n\r\n const {\r\n CurrentLocale: locale,\r\n CurrentUser: { Market: market },\r\n DynamicPermissions,\r\n Permissions,\r\n } = serverContext;\r\n const permissions = useMemo(() => ({ dynamic: { ...DynamicPermissions }, ...Permissions }), [DynamicPermissions, Permissions]);\r\n const defaultName = generateNameSuggestionSuffix('Search-Campaign');\r\n const defaultLanguage = useMemo(() => getDefaultLanguage(permissions, locale), [permissions, locale]);\r\n\r\n const { state, send } = useWizardService();\r\n const {\r\n campaignId,\r\n adGroupId,\r\n websites: savedWebsites,\r\n } = state.context.wizardData;\r\n const { onRequest, onSuccess, onFailed } = useSetKeywordSuggestionsData({ send, permissions });\r\n\r\n const { getSearchIdea } = useKeywordPlannerService();\r\n\r\n let defaultAdgroupSettings = defaultAdGroup;\r\n if (permissions.IsDomesticSimplifiedChineseEnabled) {\r\n const { LANGUAGES: supportedLanguages } = globalizationModelSetup({ permissions, culture: locale });\r\n if (supportedLanguages.length !== 1) {\r\n activity.error('Feature changed!!! Please reconsider the default language setting of ad group');\r\n }\r\n defaultAdgroupSettings = {\r\n ...defaultAdgroupSettings,\r\n Language: supportedLanguages[0],\r\n };\r\n }\r\n\r\n const load = useCallback(() => {\r\n const loadPromises = {\r\n campaign: campaignId ? loadCampaign(cid, aid, campaignId) : Promise.resolve({ ...getDefaultCampaignSettings(serverContext), Name: defaultName, Languages: defaultLanguage }),\r\n adGroup: adGroupId ? loadAdGroup(cid, aid, campaignId, adGroupId) : Promise.resolve(defaultAdgroupSettings),\r\n locationTargets: campaignId ? readLocationCriterions(cid, aid, campaignId) : Promise.resolve(defaultLocationTargets),\r\n disclaimerAssociations: campaignId ? loadDisclaimerAssociations({ cid, aid, campaignId }) : Promise.resolve({ value: [] }),\r\n };\r\n\r\n return Promise.props(loadPromises)\r\n .then(async ({\r\n campaign: rawCampaign,\r\n adGroup,\r\n locationTargets,\r\n disclaimerAssociations,\r\n }) => {\r\n const bundleCountriesAndLocationCriterions = await loadBundleCountries({\r\n cid, aid, serverContext, language: rawCampaign.Languages,\r\n });\r\n\r\n const campaign = campaignId ? modelToViewModelForCampaign({\r\n campaignModel: rawCampaign,\r\n locationCriterionsModel: locationTargets ? locationTargets.value : [],\r\n bundleCountries: bundleCountriesAndLocationCriterions.bundleCountries,\r\n disclaimerAssociations: disclaimerAssociations ? disclaimerAssociations.value : [],\r\n }) : updateLocationTargetsForCampaign({\r\n campaign: rawCampaign,\r\n i18n,\r\n market,\r\n permissions,\r\n isInit: true,\r\n });\r\n\r\n return Promise.resolve({\r\n campaign,\r\n adGroup,\r\n ...bundleCountriesAndLocationCriterions,\r\n websites: savedWebsites || defaultWebsites,\r\n });\r\n })\r\n .catch((error) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Load campaign settings failed: ${error}`);\r\n activity.signal(`onCampaignSettingsLoadFailed - ${JSON.stringify({\r\n campaignId,\r\n error,\r\n })}`);\r\n return Promise.reject(error);\r\n });\r\n }, [activity, adGroupId, aid, campaignId, cid, defaultLanguage, defaultName, i18n, market, permissions, savedWebsites, serverContext]);\r\n\r\n const recommendateRequest = useKeywordSuggestion();\r\n const save = useCallback(({ data }) => {\r\n const {\r\n campaign,\r\n adGroup,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n websites,\r\n } = data;\r\n\r\n // This is for creation scenario only\r\n campaign.Status = 'Paused';\r\n\r\n if (!campaign.Id) {\r\n campaign.Id = CAMPAIGN_NEGATIVE_REFERENCE_ID;\r\n campaign.AdGroups = [{ ...adGroup, Campaign: { Id: CAMPAIGN_NEGATIVE_REFERENCE_ID } }];\r\n }\r\n\r\n // handle early getsuggested keywords api call to improve performance\r\n handleKeywordSuggestionsWhenChanges({\r\n currentUrl: websites && websites[0],\r\n currentLocationSettings: _.property(['locationTargets', 'currentLevelSettings'])(campaign),\r\n currentLanguages: campaign && campaign.Languages,\r\n previousUrl: state.context.wizardData.previousUrl || [],\r\n previousLocation: state.context.wizardData.previousLocation || [],\r\n previousLanguages: state.context.wizardData.previousLanguages || [],\r\n bundleLocationCriterions,\r\n activity,\r\n onRequest,\r\n onSuccess,\r\n onFailed,\r\n recommendateRequest,\r\n getSearchIdea,\r\n send,\r\n permissions,\r\n });\r\n\r\n const saveCampaignPromise = () => saveCampaign({\r\n campaign,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n websites,\r\n }, {\r\n scenario: scenario.name,\r\n i18n,\r\n activityLogger: activity,\r\n });\r\n\r\n return saveCampaignPromise()\r\n .then((result) => {\r\n const campaignResult = _.omit(result.campaign, 'AdGroups');\r\n // This condition is to handle update scenario, which won't return the adGroup in bulk response\r\n const adGroupResult = adGroupId ? adGroup : result.campaign.AdGroups[0];\r\n\r\n // Only record the campaignId when creating a new campaign\r\n if (campaign.Id < 0) {\r\n activity.signal(`onSaveCampaignSucceeded - ${campaignId}`);\r\n }\r\n\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n campaignId: Number(campaignResult.Id),\r\n campaignName: campaignResult.Name,\r\n adGroupId: Number(adGroupResult.Id),\r\n websites,\r\n });\r\n\r\n return Promise.resolve({\r\n campaign: campaignResult,\r\n adGroup: adGroupResult,\r\n websites,\r\n });\r\n })\r\n .catch((error) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n // eslint-disable-next-line no-console\r\n console.error(`Save campaign settings failed: ${error}`);\r\n activity.signal(`onCampaignSettingsSaveFailed - ${JSON.stringify({\r\n data,\r\n error,\r\n })}`);\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n error: {\r\n serverErrors: _.flatten(serverErrors.filter(val => val !== null)),\r\n systemErrors: _.flatten(systemErrors.filter(val => val !== null)),\r\n },\r\n });\r\n });\r\n }, [activity, adGroupId, campaignId, i18n, onFailed, onRequest, onSuccess, recommendateRequest, scenario.name, send, state.context.wizardData.previousLanguages, state.context.wizardData.previousLocation, state.context.wizardData.previousUrl, getSearchIdea, permissions]);\r\n\r\n return {\r\n load,\r\n save,\r\n };\r\n};\r\n","/* eslint-disable no-useless-escape */\r\nimport _ from 'underscore';\r\n\r\nexport const maxKeywordLength = 100;\r\nexport const maxKeywords = 1000;\r\n\r\nexport const peekKeywords = ({ keywordsTextarealVal, isNegativeKeyword = false, activity }) => {\r\n let newKeywords = keywordsTextarealVal;\r\n if (!_.isString(newKeywords) || _.isEmpty(newKeywords) || _.isEmpty(newKeywords.replace(/[,\\s]+/, ''))) {\r\n return [];\r\n }\r\n const splitChar = ',';\r\n\r\n // Trim white space and commas from the beginning and end of the input string\r\n newKeywords = newKeywords.replace(/((^[,\\s]+)|([,\\s]+$))/g, '');\r\n // Trim extra whitespace and commas from before and after each keyword\r\n if (isNegativeKeyword) {\r\n // keywords with commas should not be split into multiple keywords\r\n newKeywords = newKeywords.replace(',', '%2C');\r\n } else if (newKeywords.indexOf(',') >= 0 && activity) {\r\n activity.signal(`User has comma in keywords input - ${JSON.stringify({\r\n KeywordsInput: newKeywords,\r\n })}`);\r\n }\r\n newKeywords = newKeywords.replace(/([,\\s]*[\\n\\r\\,]+[,\\s]*)/g, splitChar);\r\n // Remove extra spaces at the beginning or end of match type brackets\r\n newKeywords = newKeywords.replace(/[\\t ]+(?=\\]|\\)|\\\")/g, '');\r\n newKeywords = newKeywords.replace(/(\\[|\\(|\\\")[\\t ]+/g, '$1');\r\n // Remove extra spaces or tabs within compound keywords (ex: 'car insurance')\r\n newKeywords = newKeywords.replace(/\\s+/g, ' ');\r\n\r\n let keywords = newKeywords.split(splitChar);\r\n\r\n if (isNegativeKeyword) {\r\n keywords = _.map(keywords, keyword => keyword.replace('%2C', ','));\r\n }\r\n\r\n return keywords;\r\n};\r\n\r\nconst isKeywordsValid = (parsedKeywords, i18n) => {\r\n const keywords = parsedKeywords;\r\n\r\n if (!keywords.length > 0) {\r\n return {\r\n valid: false,\r\n error: [i18n.getString(_TL_('You haven\\'t entered any keywords.'))],\r\n };\r\n }\r\n\r\n if (keywords.length > maxKeywords) {\r\n return {\r\n valid: false,\r\n error: [i18n.getString(_TL_('You can\\'t add more than {0} keywords at a time.')).replace('{0}', maxKeywords)],\r\n };\r\n }\r\n\r\n const message = [];\r\n _.each(keywords, (keyword) => {\r\n let text = keyword;\r\n\r\n if (/^\".*\"$/.test(text)) {\r\n text = text.replace(/\\\"/g, '');\r\n } else if (/^\\[.*\\]$/.test(text)) {\r\n text = text.replace(/(\\[|\\])/g, '');\r\n } else if (/^\\(.*\\)$/.test(text)) {\r\n text = text.replace(/\\(|\\)/g, '');\r\n }\r\n\r\n if (_.size(text) > maxKeywordLength) {\r\n const truncatedKeyword = _.escape(`${text.substring(0, 100)}...`);\r\n const limitErrorMessage = i18n.getString(_TL_('Keyword cannot have more than {0} characters.')).replace('{0}', maxKeywordLength);\r\n message.push(i18n.getString(_TL_('{0}: {1}'))\r\n .replace('{0}', truncatedKeyword)\r\n .replace('{1}', limitErrorMessage));\r\n }\r\n });\r\n\r\n if (_.isArray(message) && _.size(message) > 0) {\r\n return {\r\n valid: false,\r\n error: message,\r\n };\r\n }\r\n\r\n return {\r\n valid: true,\r\n error: [],\r\n };\r\n};\r\n\r\nexport const getUniqueParsedKeywords = (keywords) => {\r\n if (_.size(keywords) > 0) {\r\n return _.unique(keywords, false, keyword => keyword.toLowerCase());\r\n // DB's duplicate validation is case-insensitive\r\n }\r\n return [];\r\n};\r\n\r\nexport const parseKeywords =\r\n ({\r\n keywordsTextarealVal,\r\n i18n,\r\n isNegativeKeyword = false,\r\n activity,\r\n }) => {\r\n const newKeywords = peekKeywords({ keywordsTextarealVal, isNegativeKeyword, activity });\r\n\r\n return {\r\n keywords: newKeywords,\r\n uniqKeywords: getUniqueParsedKeywords(newKeywords),\r\n validResult: isKeywordsValid(newKeywords, i18n),\r\n };\r\n };\r\n\r\nexport const parseKeyword = (text) => {\r\n let matchType = '';\r\n let keyword = text;\r\n\r\n if (/^\".*\"$/.test(text)) {\r\n keyword = text.replace(/\\\"/g, '');\r\n matchType = 'Phrase';\r\n } else if (/^\\[.*\\]$/.test(text)) {\r\n keyword = text.replace(/(\\[|\\])/g, '');\r\n matchType = 'Exact';\r\n } else {\r\n matchType = 'Broad';\r\n }\r\n\r\n return {\r\n Text: keyword,\r\n MatchType: matchType,\r\n };\r\n};\r\n","import { getStepStyles } from '../../../shared/styles';\r\n\r\nexport const getkeywordStepStyles = () => ({\r\n keywordsStep: {\r\n ...getStepStyles(),\r\n },\r\n});\r\n","import React from 'react';\r\nimport { Stack, Shimmer } from '@fluentui/react';\r\n\r\nexport const SectionShimmer = () => (\r\n \r\n
\r\n \r\n
\r\n \r\n { basicSettingsSection }\r\n { autoGenerateSection }\r\n { advancedSettingsSection }\r\n
\r\n \r\n \r\n {showSuggestionsSectionShimmer ?\r\n
\r\n );\r\n};\r\n\r\nKeywordSuggestion.propTypes = {\r\n suggestedItems: PropTypes.arrayOf(PropTypes.shape({})).isRequired,\r\n showSuggestionsSectionShimmer: PropTypes.bool.isRequired,\r\n onAddSuggestedItem: PropTypes.func.isRequired,\r\n renderSuggestedItem: PropTypes.func,\r\n renderMoreSuggestionsInlineButton: PropTypes.func,\r\n onAddAllSuggestedItems: PropTypes.func,\r\n onMoreSuggestionsButtonClick: PropTypes.func,\r\n disableAllSuggestions: PropTypes.bool,\r\n disabledSuggestionTooltip: PropTypes.oneOfType([\r\n PropTypes.string,\r\n PropTypes.element,\r\n PropTypes.arrayOf(PropTypes.element),\r\n ]),\r\n useStyleFluent2: PropTypes.bool,\r\n perfMarker: PropTypes.shape({\r\n willInit: PropTypes.func.isRequired,\r\n done: PropTypes.func.isRequired,\r\n }).isRequired,\r\n};\r\n\r\nKeywordSuggestion.defaultProps = {\r\n renderSuggestedItem: SuggestedItems.defaultProps.renderSuggestedItem,\r\n renderMoreSuggestionsInlineButton: SuggestedItems.defaultProps.renderMoreSuggestionsInlineButton,\r\n onAddAllSuggestedItems: _.noop,\r\n onMoreSuggestionsButtonClick: _.noop,\r\n disableAllSuggestions: false,\r\n disabledSuggestionTooltip: undefined,\r\n useStyleFluent2: true,\r\n};\r\n","import { useCallback, useEffect, useState, useContext } from 'react';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\n\r\nexport const useCircularBufferView = (collection, pageSize) => {\r\n const activity = useContext(ActivityContext);\r\n const [page, setPage] = useState([]);\r\n const [currentIndex, setCurrentIndex] = useState(0);\r\n\r\n useEffect(() => {\r\n if (collection.length === 0) {\r\n setPage([]);\r\n return;\r\n }\r\n\r\n const newPage = [];\r\n let index = currentIndex % collection.length;\r\n let count = 0;\r\n while (count < pageSize && count < collection.length) {\r\n newPage.push(collection[index]);\r\n index = (index + 1) % collection.length;\r\n count += 1;\r\n }\r\n setPage(newPage);\r\n }, [collection, currentIndex, pageSize]);\r\n\r\n const canMoveNext = collection.length > pageSize;\r\n\r\n const moveNext = useCallback(() => {\r\n setCurrentIndex((currentIndex + pageSize) % collection.length);\r\n // eslint-disable-next-line no-unused-expressions\r\n activity && activity.signal(`onRefreshMainPageSuggestedKeywords - ${JSON.stringify({\r\n SuggestedKeywordsSize: collection.length,\r\n })}`);\r\n }, [currentIndex, collection.length, pageSize, activity]);\r\n\r\n return [page, canMoveNext, moveNext];\r\n};\r\n","/* eslint-disable @typescript-eslint/no-unused-vars */\r\nexport const getKeywordInputStyles = (_, { palette = {} }) => ({\r\n keywordInputContainer: {\r\n width: 928,\r\n },\r\n filed: {\r\n marginTop: 20,\r\n },\r\n labelContainer: {\r\n marginBottom: 8,\r\n },\r\n helpLink: {\r\n marginLeft: 5,\r\n },\r\n textArea: {\r\n height: 220,\r\n },\r\n});\r\n\r\nexport const messageBarStyle = {\r\n root: {\r\n background: '#eff6fc',\r\n '& span.iconba-Insights': {\r\n fontSize: '16px',\r\n top: 0,\r\n color: '#0078D4',\r\n },\r\n },\r\n innerText: {\r\n lineHeight: 21,\r\n },\r\n};\r\n","import _ from 'underscore';\r\nimport { parseKeywords } from './parser';\r\n\r\nexport const suggestedKeywordItemsToKeywordsInput = (suggestedKeywordItems) => {\r\n if (_.isEmpty(suggestedKeywordItems)) {\r\n return '';\r\n }\r\n\r\n let suggestedKeywords = '';\r\n _.each(suggestedKeywordItems, (suggestedKeywordItem, index) => {\r\n suggestedKeywords = `${suggestedKeywords}${index === 0 ? '' : '\\n'}${suggestedKeywordItem.Keyword}`;\r\n });\r\n\r\n return suggestedKeywords;\r\n};\r\n\r\nexport const withNewAddedKeywords = ({ keywordsInput, newAddedKeywords }) => (\r\n _.isEmpty(keywordsInput) ? newAddedKeywords : `${keywordsInput}\\n${newAddedKeywords}`\r\n);\r\n\r\nexport const filterExistingKeywords = ({\r\n keywordSuggestions,\r\n keywordsInput,\r\n i18n,\r\n}) => {\r\n let { uniqKeywords } = parseKeywords({\r\n keywordsTextarealVal: keywordsInput,\r\n i18n,\r\n });\r\n uniqKeywords = uniqKeywords.reduce((parsedKeywordsObj, keywordText) => ({\r\n ...parsedKeywordsObj,\r\n [keywordText]: keywordText,\r\n }), {});\r\n return _.filter(keywordSuggestions, suggestedKeywordItem => _.isUndefined(uniqKeywords[suggestedKeywordItem.Keyword]));\r\n};\r\n\r\nexport const getKeywordsAdded = ({ keywordSuggestions, suggestedItems }) => {\r\n const suggestedItemsDict = suggestedItems.reduce((parsedKeywordsObj, suggestedItem) => ({\r\n ...parsedKeywordsObj,\r\n [suggestedItem.itemText]: suggestedItem.itemText,\r\n }), {});\r\n return _.filter(keywordSuggestions, suggestedKeywordItem => !_.isUndefined(suggestedItemsDict[suggestedKeywordItem.Keyword]));\r\n};\r\n","import React, { useContext, useMemo, useCallback, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport _ from 'underscore';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { ValidationGroup, withError, withCustomValidation, ErrorMessages } from '@bingads-webui-react/validation';\r\nimport { ActuationGroup } from '@bingads-webui-campaign-react/actuator';\r\nimport { AttentionBeaconGroup } from '@bingads-webui-campaign-react/attention-beacon';\r\nimport { FormErrorGroup, UnmappedFormErrors, entityIs } from '@bingads-webui-campaign-react/form-error';\r\nimport { useFormService } from '@bingads-webui-react/form';\r\nimport { ValidationStringMap } from '@bingads-webui/validation-string-map';\r\nimport { buildLegacyI18n } from '@bingads-webui/build-legacy-i18n';\r\nimport {\r\n Collapse,\r\n useCollapseState,\r\n ValidatedFixedPanel,\r\n getPanelErrorProps,\r\n TextTitle,\r\n} from '@bingads-webui-campaign/wizard-jumbo-card';\r\nimport {\r\n KeywordPlannerPanel,\r\n getTargetedLocationInfo,\r\n getSupportedLanguages,\r\n isAllLocationsUnsupported,\r\n} from '@bingads-webui-campaign-react/copilot-keyword-planner';\r\nimport { useWizardService } from '@bingads-webui-react/wizard';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport { ERROR_ENTITY } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\n\r\nimport { parseKeywords } from './util/parser';\r\nimport { getkeywordStepStyles } from './style/keyword-step-style';\r\nimport { StepHeader } from '../../shared/step-header';\r\nimport { KeywordSuggestion } from './keyword-suggestion';\r\nimport { KeywordInput } from './keyword-input';\r\nimport KeywordImg from './media/keyword.svg';\r\nimport {\r\n suggestedKeywordItemsToKeywordsInput,\r\n withNewAddedKeywords,\r\n filterExistingKeywords,\r\n getKeywordsAdded,\r\n} from './util/keyword-parse-helper';\r\n\r\nconst keywordsProp = entityIs(ERROR_ENTITY.Keyword);\r\nconst ValidatedKeywordInput = withControlErrorHandling(withUnvalidatedControlErrors(withError(withCustomValidation(KeywordInput))));\r\n\r\nexport const KeywordsStep = ({\r\n data,\r\n onDataChange,\r\n error,\r\n wizardPerfMarker,\r\n}) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n const i18n = useContext(I18nContext);\r\n const legacyI18n = useMemo(() => buildLegacyI18n(i18n, [ValidationStringMap]), [i18n]);\r\n const classes = useDefaultStyles(getkeywordStepStyles);\r\n const { state: { context: { saveFailed: showAllValidationErrors } } } = useFormService();\r\n const keywordSuggestionPerfMarker = useMemo(() =>\r\n wizardPerfMarker.createChild('KeywordSuggestion', { autoEnd: true }), [wizardPerfMarker]);\r\n const {\r\n Permissions,\r\n DynamicPermissions,\r\n } = useContext(ServerContext);\r\n const permissions = useMemo(() => ({ dynamic: { ...DynamicPermissions }, ...Permissions }), [DynamicPermissions, Permissions]);\r\n\r\n // props data\r\n const {\r\n Languages,\r\n locationCriterions,\r\n keywordsInput,\r\n validationResult,\r\n keywordSuggestionsAdded,\r\n } = data || {};\r\n\r\n // wizard data\r\n const { state } = useWizardService();\r\n const {\r\n keywordSuggestions,\r\n } = state.context.wizardData;\r\n\r\n\r\n // local state\r\n const [isOpen, setIsOpen] = useState(false);\r\n const [\r\n allCampaignSettingsSections,\r\n campaignSettingsExpandedSections,\r\n setCampaignSettingsExpandedSections,\r\n ] = useCollapseState(\r\n ['keyword-suggestion', 'keyword-input'] /* all sections */,\r\n ['keyword-suggestion', 'keyword-input'] /* initially expanded sections */\r\n );\r\n\r\n const targetedLocationInfo = useMemo(() => getTargetedLocationInfo(locationCriterions, permissions), [locationCriterions, permissions]);\r\n const supportedLanguages = useMemo(() => getSupportedLanguages(Languages, permissions), [Languages, permissions]);\r\n const hideKeywordSuggestions = useMemo(() => ((permissions && permissions.dynamic && permissions.dynamic.KeywordPlannerLiteRefactorPhase1) ?\r\n _.isEmpty(targetedLocationInfo) : isAllLocationsUnsupported(targetedLocationInfo)) || _.isEmpty(supportedLanguages), [\r\n targetedLocationInfo,\r\n supportedLanguages,\r\n permissions,\r\n ]);\r\n const filteredKeywordSuggestions = useMemo(() => (filterExistingKeywords({\r\n keywordSuggestions,\r\n keywordsInput,\r\n i18n,\r\n })), [\r\n keywordSuggestions,\r\n keywordsInput,\r\n i18n,\r\n ]);\r\n\r\n // handle adding keywords\r\n const onAddKeywords = useCallback((rawKeywordsInput, keywordsAdded, activity) => {\r\n const { validResult } = parseKeywords({\r\n keywordsTextarealVal: rawKeywordsInput,\r\n i18n,\r\n activity,\r\n });\r\n onDataChange({\r\n data: {\r\n ...data,\r\n keywordsInput: rawKeywordsInput,\r\n validationResult: validResult,\r\n keywordSuggestionsAdded: [...keywordSuggestionsAdded, ...keywordsAdded],\r\n },\r\n isValid: validResult.valid,\r\n });\r\n }, [\r\n onDataChange,\r\n i18n,\r\n data,\r\n keywordSuggestionsAdded,\r\n ]);\r\n\r\n const onKeywordInputChanged = useCallback((rawKeywordsInput, activity) => {\r\n onAddKeywords(rawKeywordsInput, [], activity);\r\n }, [onAddKeywords]);\r\n\r\n const onAddSuggestedItem = useCallback((index, text, activity) => {\r\n onAddKeywords(withNewAddedKeywords({\r\n keywordsInput,\r\n newAddedKeywords: text,\r\n }), getKeywordsAdded({ keywordSuggestions: filteredKeywordSuggestions, suggestedItems: [{ itemText: text }] }));\r\n // eslint-disable-next-line no-unused-expressions\r\n activity && activity.signal(`onAddMainPageSuggestedKeyword - ${JSON.stringify({\r\n SuggestedKeyword: [text],\r\n })}`);\r\n }, [keywordsInput, onAddKeywords, filteredKeywordSuggestions]);\r\n\r\n const onAddAllSuggestedItems = useCallback((suggestedItems, activity) => {\r\n const keywordsAdded = getKeywordsAdded({ keywordSuggestions: filteredKeywordSuggestions, suggestedItems });\r\n onAddKeywords(withNewAddedKeywords({\r\n keywordsInput,\r\n newAddedKeywords: suggestedKeywordItemsToKeywordsInput(keywordsAdded),\r\n }), keywordsAdded);\r\n // eslint-disable-next-line no-unused-expressions\r\n activity && activity.signal(`onAddAllMainPageSuggestedKeywords - ${JSON.stringify({\r\n SuggestedKeywords: _.map(suggestedItems, item => item.itemText),\r\n })}`);\r\n }, [keywordsInput, onAddKeywords, filteredKeywordSuggestions]);\r\n\r\n const onToggle = (selectedData, selectedTab, activity) => {\r\n // eslint-disable-next-line no-unused-expressions\r\n activity && activity.signal(`onAddKeywordsFromSidePanel - ${JSON.stringify({\r\n SelectedKeywords: selectedData,\r\n Tab: selectedTab,\r\n })}`);\r\n const filteredSelectedData = filterExistingKeywords({\r\n keywordSuggestions: selectedData,\r\n keywordsInput,\r\n i18n,\r\n });\r\n if (!_.isEmpty(filteredSelectedData)) {\r\n onAddKeywords(withNewAddedKeywords({\r\n keywordsInput,\r\n newAddedKeywords: suggestedKeywordItemsToKeywordsInput(filteredSelectedData),\r\n }), selectedData);\r\n }\r\n setIsOpen(!isOpen);\r\n };\r\n\r\n const onMoreSuggestionsButtonClick = (activity) => {\r\n setIsOpen(true);\r\n // eslint-disable-next-line no-unused-expressions\r\n activity && activity.signal('onClickExploreButton');\r\n };\r\n\r\n // components\r\n const keywordsSection = useMemo(() => {\r\n const keywordSuggestionPanel = hideKeywordSuggestions ? null : (\r\n \r\n \r\n { keywords }\r\n \r\n
\r\n );\r\n }, [\r\n allCampaignSettingsSections,\r\n campaignSettingsExpandedSections,\r\n setCampaignSettingsExpandedSections,\r\n keywordsInput,\r\n onAddAllSuggestedItems,\r\n onAddSuggestedItem,\r\n onKeywordInputChanged,\r\n validationResult,\r\n keywordSuggestions,\r\n keywordSuggestionPerfMarker,\r\n hideKeywordSuggestions,\r\n filteredKeywordSuggestions,\r\n ]);\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nKeywordsStep.propTypes = {\r\n data: PropTypes.shape({}).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n wizardPerfMarker: PropTypes.shape({\r\n createChild: PropTypes.func.isRequired,\r\n }).isRequired,\r\n};\r\n\r\nKeywordsStep.defaultProps = {\r\n error: null,\r\n};\r\n","import React, { useContext, useEffect, useMemo } from 'react';\r\nimport _ from 'underscore';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { Textarea, Field, Text } from '@fluentui/react-components';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { MessageBar } from '@fluentui/react';\r\nimport { HelpLink } from '@bingads-webui-react/help-link';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\n\r\nimport { getKeywordInputStyles, messageBarStyle } from './style/keyword-input-style';\r\nimport { parseKeywords } from './util/parser';\r\n\r\nexport const KeywordInput = (props) => {\r\n const activity = useContext(ActivityContext);\r\n const classes = useDefaultStyles(getKeywordInputStyles);\r\n const i18n = useContext(I18nContext);\r\n\r\n const {\r\n keywordsInput,\r\n onKeywordInputChanged,\r\n updateValidation,\r\n validationResult,\r\n } = props;\r\n\r\n const showMessageBar = useMemo(() => {\r\n const { uniqKeywords } = parseKeywords({\r\n keywordsTextarealVal: keywordsInput,\r\n i18n,\r\n });\r\n\r\n return uniqKeywords.length < 20;\r\n }, [\r\n keywordsInput,\r\n i18n,\r\n ]);\r\n\r\n useEffect(() => {\r\n const { error, valid } = validationResult;\r\n updateValidation(!_.isEmpty(error) ? error : [], { custom: valid });\r\n }, [validationResult, updateValidation]);\r\n\r\n return (\r\n <>\r\n {showMessageBar && (\r\n \r\n
\r\n \r\n
\r\n \r\n { keywordsSection }\r\n {isOpen &&\r\n
\r\n \r\n \r\n {i18n.getString(_TL_('Not sure which match type to use or how to add negative keywords?'))} \r\n \r\n {i18n.getString(_TL_('Learn more'))}\r\n \r\n
\r\n ),\r\n }}\r\n className={classes.filed}\r\n >\r\n Campaigns > Ad groups or within Campaigns > Ads & extensions.')) }} />\r\n \r\n \r\n \r\n);\r\n\r\nSwitchAdTypeDialog.propTypes = {\r\n className: PropTypes.string,\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n showDialog: PropTypes.bool.isRequired,\r\n onConfirm: PropTypes.func.isRequired,\r\n onCancel: PropTypes.func.isRequired,\r\n};\r\n\r\nSwitchAdTypeDialog.defaultProps = {\r\n className: '',\r\n};\r\n","export const AdTypes = {\r\n ResponsiveSearch: 'ResponsiveSearch',\r\n Responsive: 'Responsive',\r\n DynamicSearch: 'DynamicSearch',\r\n};\r\n\r\nexport const AdTypeStrings = {\r\n [AdTypes.ResponsiveSearch]: _TL_('Responsive Search ad'),\r\n [AdTypes.Responsive]: _TL_('Multimedia ad'),\r\n [AdTypes.DynamicSearch]: _TL_('Dynamic Search ad'),\r\n};\r\n\r\nexport const AdTypePluralStrings = {\r\n [AdTypes.ResponsiveSearch]: _TL_('Responsive Search ads'),\r\n [AdTypes.Responsive]: _TL_('Multimedia ads'),\r\n [AdTypes.DynamicSearch]: _TL_('Dynamic Search ads'),\r\n};\r\n\r\nexport const AdTypeMaxCount = {\r\n [AdTypes.ResponsiveSearch]: 3,\r\n [AdTypes.Responsive]: 5,\r\n [AdTypes.DynamicSearch]: 100,\r\n};\r\n\r\nexport const StandardAdTypes = [AdTypes.ResponsiveSearch, AdTypes.Responsive];\r\nexport const DynamicAdTypes = [AdTypes.DynamicSearch];\r\n","import { map } from 'underscore';\r\nimport React, { useCallback, useContext, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {\r\n Dropdown,\r\n Label,\r\n Option,\r\n} from '@fluentui/react-components';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { HelpPopup } from '@bingads-webui-react/help-popup';\r\nimport { SwitchAdTypeDialog } from './switch-ad-type-dialog';\r\nimport { AdTypeStrings } from '../../constants/ad-type';\r\n\r\nexport const AdTypeSelector = ({\r\n i18n,\r\n adTypes,\r\n enableAdTypeSelector,\r\n selectedAdType,\r\n onAdTypeChanged,\r\n confirmWhenSwitchAdType,\r\n}) => {\r\n const activity = useContext(ActivityContext);\r\n const [showConfirmDialog, setShowConfirmDialog] = useState(false);\r\n const [newAdType, setNewAdType] = useState(selectedAdType);\r\n\r\n const onOptionSelect = useCallback((_event, option) => {\r\n if (option.optionValue !== selectedAdType) {\r\n setNewAdType(option.optionValue);\r\n\r\n if (confirmWhenSwitchAdType) {\r\n setShowConfirmDialog(true);\r\n\r\n activity.signal(`onAdTypeChanging - ${JSON.stringify({\r\n oldAdType: selectedAdType,\r\n newAdType: option.optionValue,\r\n })}`);\r\n } else {\r\n onAdTypeChanged(option.optionValue);\r\n\r\n activity.signal(`onAdTypeChanged - ${JSON.stringify({\r\n oldAdType: selectedAdType,\r\n newAdType: option.optionValue,\r\n })}`);\r\n }\r\n }\r\n }, [activity, confirmWhenSwitchAdType, onAdTypeChanged, selectedAdType]);\r\n\r\n const onConfirm = useCallback(() => {\r\n setShowConfirmDialog(false);\r\n onAdTypeChanged(newAdType);\r\n\r\n activity.signal(`onAdTypeChanged - ${JSON.stringify({\r\n oldAdType: selectedAdType,\r\n newAdType,\r\n })}`);\r\n }, [activity, newAdType, onAdTypeChanged, selectedAdType]);\r\n\r\n const onCancel = useCallback(() => {\r\n setShowConfirmDialog(false);\r\n\r\n activity.signal(`onAdTypeChangeCanceled - ${JSON.stringify({\r\n oldAdType: selectedAdType,\r\n newAdType,\r\n })}`);\r\n }, [activity, newAdType, selectedAdType]);\r\n\r\n return (\r\n \r\n \r\n );\r\n};\r\n\r\nRsaEditor.propTypes = {\r\n i18n: PropTypes.shape({}).isRequired,\r\n ad: PropTypes.shape({\r\n data: PropTypes.shape({}),\r\n }),\r\n onAdChanged: PropTypes.func.isRequired,\r\n onAdExtensionsChanged: PropTypes.func.isRequired,\r\n permissions: PropTypes.shape({\r\n IsDisclaimerForRSAEnabled: PropTypes.bool,\r\n }).isRequired,\r\n perfMarker: PropTypes.shape({}).isRequired,\r\n scope: PropTypes.shape({\r\n customerId: PropTypes.string,\r\n accountId: PropTypes.string,\r\n campaignId: PropTypes.string,\r\n adGroupId: PropTypes.string,\r\n }).isRequired,\r\n serverContext: PropTypes.shape({\r\n Token: PropTypes.string,\r\n }).isRequired,\r\n apiErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n showAllValidationErrors: PropTypes.bool,\r\n editorRef: PropTypes.shape({\r\n current: PropTypes.shape({}),\r\n }).isRequired,\r\n};\r\n\r\nRsaEditor.defaultProps = {\r\n ad: { data: {} },\r\n apiErrors: undefined,\r\n showAllValidationErrors: false,\r\n};\r\n","import { adCustomizersStyle } from '@bingads-webui-campaign-react/common-styles';\r\nimport {\r\n getCommonPreviewContainerStyles,\r\n getCrudAdImagePreviewStyles,\r\n getMMAPreviewStyles,\r\n} from '@bingads-webui-campaign-react/shared-image-preview-styles';\r\n\r\nexport const getMMAStyles = (_, { palette = {}, iconFontFamily = 'MsAds MDL2 Assets' }) => ({\r\n mma: {\r\n ...getCommonPreviewContainerStyles(),\r\n ...getCrudAdImagePreviewStyles(_, { palette, iconFontFamily }),\r\n ...getMMAPreviewStyles(),\r\n ...adCustomizersStyle({ palette, iconFontFamily }),\r\n\r\n '& .ad-edit-and-preview-container': {\r\n position: 'relative',\r\n\r\n '& .new-preview-carousel-container': {\r\n background: 'white',\r\n },\r\n },\r\n\r\n '& .left-column': {\r\n width: '600px',\r\n minWidth: '600px',\r\n },\r\n },\r\n});\r\n","import { noop } from 'underscore';\r\nimport React, { useCallback, useImperativeHandle, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { CopilotSearchMMAEditor, ResponsiveAdRepository } from '@bingads-webui-campaign/responsive-ad-editor';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { mergeI18n } from '@bingads-webui-campaign-react/i18n-merger';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport config from '@bingads-webui-component-legacy/config';\r\n\r\nimport GenericImage from '../media/1.91to1.jpg';\r\nimport { getMMAStyles } from './mma-styles';\r\n\r\nexport const MmaEditor = ({\r\n ad,\r\n onAdChanged,\r\n i18n,\r\n perfMarker,\r\n permissions,\r\n scope,\r\n showAllValidationErrors,\r\n apiErrors,\r\n editorRef,\r\n}) => {\r\n const internalEditorRef = React.createRef();\r\n const classes = useDefaultStyles(getMMAStyles);\r\n\r\n const legacyI18n = useMemo(() => mergeI18n(\r\n window.globalLegacyI18n.get('@bingads-webui/i18n-amd-loader!campaignui/feature/audience-campaign'),\r\n i18n\r\n ), [i18n]);\r\n\r\n const viewContext = useMemo(() => ({\r\n currentCampaign: {\r\n Id: scope.campaignId,\r\n CampaignType: scope.campaignType,\r\n },\r\n currentAdGroup: {\r\n Id: scope.adGroupId,\r\n },\r\n }), [scope.campaignId, scope.campaignType, scope.adGroupId]);\r\n\r\n const responsiveAdRepository = useMemo(() => new ResponsiveAdRepository({\r\n viewContext,\r\n isVideo: false,\r\n campaignDomain: '',\r\n }), [viewContext]);\r\n\r\n const oDataConfig = useMemo(() => ({\r\n odataRootUrl: config.get('CampaignAzureDomain'),\r\n odataToken: config.get('odata.token'),\r\n odataPath: config.get('odata.url') + config.get('odata.path'),\r\n }), []);\r\n\r\n const onChanged = useCallback((data, isValid) => {\r\n onAdChanged({\r\n data,\r\n isValid,\r\n });\r\n }, [onAdChanged]);\r\n\r\n useImperativeHandle(editorRef, () => ({\r\n logAppliedSuggestions: (adData) => {\r\n if (internalEditorRef && internalEditorRef.current) {\r\n const {\r\n Id,\r\n FinalUrls,\r\n Headlines = {},\r\n LongHeadlines = {},\r\n Descriptions = {},\r\n ImageList,\r\n Images,\r\n } = adData;\r\n\r\n internalEditorRef.current.logAppliedSuggestion({\r\n assetData: {\r\n Id,\r\n FinalUrls,\r\n Headlines: Object.values(Headlines),\r\n LongHeadlines: Object.values(LongHeadlines),\r\n Descriptions: Object.values(Descriptions),\r\n Images: ImageList ? { ImageList } : Images,\r\n },\r\n isEditing: !!ad.data.Id,\r\n });\r\n }\r\n },\r\n }));\r\n\r\n return (\r\n \r\n \r\n {suggestedAdExtensionsSections.panels}\r\n \r\n }\r\n \r\n ), [allEnhanceYourAdsSections, enhanceYourAdsExpandedSections, setEnhanceYourAdsExpandedSections, suggestedAdExtensionsSections]);\r\n\r\n const [\r\n allMoreAssetsSections,\r\n moreAssetsExpandedSections,\r\n setMoreAssetsExpandedSections,\r\n ] = useCollapseState(\r\n otherAdExtensionsSections.sectionsInfo.allSections /* all sections */,\r\n [] /* initially expanded sections */\r\n );\r\n\r\n const moreExtensionsSection = useMemo(() => (\r\n <>\r\n {otherAdExtensionsSections.panels.length > 0 &&\r\n (\r\n <>\r\n \r\n \r\n {i18n.getString(_TL_('More assets'))}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n }\r\n \r\n ), [allMoreAssetsSections, getStyles, i18n, moreAssetsExpandedSections, otherAdExtensionsSections.panels, setMoreAssetsExpandedSections]);\r\n\r\n return loaded && (\r\n i18n.getString(campaignLanguageStrings[lang] || _TL_(`${lang}`))).join(', ')}\r\n icon={LanguageImg}\r\n />}\r\n attentionBeaconProps={{ getExtraProps: getPanelErrorProps }}\r\n actuationProps={{\r\n expand: basicSettingsExpand,\r\n expandKey: 'languages',\r\n }}\r\n >\r\n { }}\r\n adGroupTypes={AD_GROUP_TYPES}\r\n adGroupTypeStrings={AD_GROUP_TYPE_STRINGS}\r\n isMixedMode={isMixedMode}\r\n isEditingScenario\r\n />\r\n \r\n );\r\n\r\n const languagePanel = (\r\n adGroup && adGroup.AdGroupType && adGroup.AdGroupType === AD_GROUP_TYPES.SearchStandard &&\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...adGroup,\r\n ...level === 'campaign' && {\r\n companyNameTargets: campaign.companyNameTargets,\r\n adGroupCompanyNameTargets: adGroup.companyNameTargets,\r\n },\r\n ...level === 'adgroup' && {\r\n companyNameTargets: isEmpty(adGroup.adGroupCompanyNameTargets) ? map(campaign.companyNameTargets, target => omit(target, 'Id')) : adGroup.adGroupCompanyNameTargets,\r\n },\r\n currentSelectedCompanyNameLevel: level,\r\n },\r\n },\r\n })}\r\n validationProps={{\r\n data: {\r\n companyNameTargets: adGroup.companyNameTargets,\r\n },\r\n }}\r\n />\r\n \r\n );\r\n\r\n const industryPanel = permissions && !permissions.IsDomesticSimplifiedChineseEnabled && adGroup && (\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...adGroup,\r\n ...level === 'campaign' && {\r\n industry: campaign.industry,\r\n initialIndustryTargets: campaign.initialIndustryTargets,\r\n adGroupIndustry: adGroup.industry,\r\n adGroupInitialIndustryTargets: flattenTargetCriterion(adGroup.industryTargetsBidAdjustment, 'Industry'),\r\n },\r\n ...level === 'adgroup' && {\r\n industry: isEmpty(adGroup.adGroupIndustry) ? adGroup.industry : adGroup.adGroupIndustry,\r\n initialIndustryTargets: isEmpty(adGroup.adGroupIndustry) ? adGroup.initialIndustryTargets : adGroup.adGroupInitialIndustryTargets,\r\n },\r\n currentSelectedIndustryLevel: level,\r\n },\r\n },\r\n })}\r\n validationProps={{\r\n data: {\r\n industry: adGroup.industry,\r\n },\r\n }}\r\n initialIndustryTargets={adGroup.initialIndustryTargets}\r\n />\r\n \r\n );\r\n\r\n const jobFunctionPanel = permissions && !permissions.IsDomesticSimplifiedChineseEnabled && adGroup && (\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...adGroup,\r\n ...level === 'campaign' && {\r\n jobTargets: campaign.jobTargets,\r\n initialJobFunctionTargets: campaign.initialJobFunctionTargets,\r\n adGroupJobTargets: adGroup.jobTargets,\r\n adGroupInitialJobFunctionTargets: flattenTargetCriterion(adGroup.jobTargetBidAdjustments, 'JobFunction'),\r\n },\r\n ...level === 'adgroup' && {\r\n jobTargets: isEmpty(adGroup.adGroupJobTargets) ? adGroup.jobTargets : adGroup.adGroupJobTargets,\r\n initialJobFunctionTargets: isEmpty(adGroup.adGroupJobTargets) ? adGroup.initialJobFunctionTargets : adGroup.adGroupInitialJobFunctionTargets,\r\n },\r\n currentSelectedJobFunctionLevel: level,\r\n },\r\n },\r\n })}\r\n validationProps={{\r\n data: {\r\n jobTargets: adGroup.jobTargets,\r\n },\r\n }}\r\n initialJobTargets={adGroup.initialJobFunctionTargets}\r\n />\r\n \r\n );\r\n\r\n const bidAdjustment = [\r\n locationPanel,\r\n agePanel,\r\n devicePanel,\r\n genderPanel,\r\n companyNamePanel,\r\n industryPanel,\r\n jobFunctionPanel,\r\n ];\r\n\r\n const onBidAdjustmentSectionCollapse = () => {\r\n if (!bidAdjustmentSectionExpanded) {\r\n setBidAdjustmentSectionExpanded(true);\r\n expandAllBidAdjustmentSections();\r\n } else {\r\n flipBidAdjustmentExpandAllState();\r\n }\r\n };\r\n\r\n return (\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...adGroup,\r\n ...level === 'campaign' && {\r\n companyNameTargets: campaign.companyNameTargets,\r\n adGroupCompanyNameTargets: adGroup.companyNameTargets,\r\n },\r\n ...level === 'adgroup' && {\r\n companyNameTargets: isEmpty(adGroup.adGroupCompanyNameTargets) ? map(campaign.companyNameTargets, target => omit(target, 'Id')) : adGroup.adGroupCompanyNameTargets,\r\n },\r\n currentSelectedCompanyNameLevel: level,\r\n },\r\n },\r\n })}\r\n validationProps={{\r\n data: {\r\n companyNameTargets: adGroup.companyNameTargets,\r\n },\r\n }}\r\n />\r\n \r\n );\r\n\r\n const industryPanel = permissions && !permissions.IsDomesticSimplifiedChineseEnabled && adGroup && (\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...adGroup,\r\n ...level === 'campaign' && {\r\n industry: campaign.industry,\r\n initialIndustryTargets: campaign.initialIndustryTargets,\r\n adGroupIndustry: adGroup.industry,\r\n adGroupInitialIndustryTargets: flattenTargetCriterion(adGroup.industryTargetsBidAdjustment, 'Industry'),\r\n },\r\n ...level === 'adgroup' && {\r\n industry: isEmpty(adGroup.adGroupIndustry) ? adGroup.industry : adGroup.adGroupIndustry,\r\n initialIndustryTargets: isEmpty(adGroup.adGroupIndustry) ? adGroup.initialIndustryTargets : adGroup.adGroupInitialIndustryTargets,\r\n },\r\n currentSelectedIndustryLevel: level,\r\n },\r\n },\r\n })}\r\n validationProps={{\r\n data: {\r\n industry: adGroup.industry,\r\n },\r\n }}\r\n initialIndustryTargets={adGroup.initialIndustryTargets}\r\n />\r\n \r\n );\r\n\r\n const jobFunctionPanel = permissions && !permissions.IsDomesticSimplifiedChineseEnabled && adGroup && (\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...adGroup,\r\n ...level === 'campaign' && {\r\n jobTargets: campaign.jobTargets,\r\n initialJobFunctionTargets: campaign.initialJobFunctionTargets,\r\n adGroupJobTargets: adGroup.jobTargets,\r\n adGroupInitialJobFunctionTargets: flattenTargetCriterion(adGroup.jobTargetBidAdjustments, 'JobFunction'),\r\n },\r\n ...level === 'adgroup' && {\r\n jobTargets: isEmpty(adGroup.adGroupJobTargets) ? adGroup.jobTargets : adGroup.adGroupJobTargets,\r\n initialJobFunctionTargets: isEmpty(adGroup.adGroupJobTargets) ? adGroup.initialJobFunctionTargets : adGroup.adGroupInitialJobFunctionTargets,\r\n },\r\n currentSelectedJobFunctionLevel: level,\r\n },\r\n },\r\n })}\r\n validationProps={{\r\n data: {\r\n jobTargets: adGroup.jobTargets,\r\n },\r\n }}\r\n initialJobTargets={adGroup.initialJobFunctionTargets}\r\n />\r\n \r\n );\r\n\r\n const basicSettings = [\r\n bidPanel,\r\n locationPanel,\r\n agePanel,\r\n devicePanel,\r\n genderPanel,\r\n companyNamePanel,\r\n industryPanel,\r\n jobFunctionPanel,\r\n ];\r\n\r\n return (\r\n \r\n {i18n.getString(_TL_('Please review your changes before returning to the summary page.'))} \r\n \r\n {i18n.getString(_TL_('Dismiss'))}\r\n {i18n.getString(_TL_('Save & return to Summary'))}\r\n \r\n );\r\n return toast;\r\n }, [handleDismiss, handleSaveAndReturn, i18n]);\r\n\r\n useEffect(() => {\r\n const wizardData = getWizardData(state);\r\n if (_.get(wizardData, ['focusedStepId']) === currentStepId) {\r\n dispatchToast(backToSummaryToast, { toastId: toasterId, timeout: -1 });\r\n }\r\n if (currentStepId === SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.SUMMARY) {\r\n dismissToast(toasterId);\r\n }\r\n }, [currentStepId, state, dispatchToast, dismissToast, toasterId, backToSummaryToast]);\r\n\r\n return (\r\n <>\r\n \r\n \r\n {buttonText}\r\n \r\n );\r\n};\r\n\r\nexport const SaveAndExitButton = ({ buttonText, disabled }) => {\r\n const i18n = useContext(I18nContext);\r\n\r\n const { state, send } = useWizardService();\r\n const isBlocking = matchStepState(state, STEP_STATES.FETCHING) || matchStepState(state, STEP_STATES.LOADING) || matchStepState(state, STEP_STATES.SAVING);\r\n\r\n const onNextClicked = useCallback(() => {\r\n send(WIZARD_EVENTS.SAVE_AND_EXIT);\r\n }, [send]);\r\n\r\n return (\r\n \r\n {buttonText || i18n.getString(_TL_('Save & exit'))}\r\n \r\n );\r\n};\r\nSaveAndExitButton.propTypes = {\r\n buttonText: PropTypes.string,\r\n disabled: PropTypes.bool,\r\n};\r\nSaveAndExitButton.defaultProps = {\r\n buttonText: undefined,\r\n disabled: false,\r\n};\r\n\r\nexport const CreationFooter = ({\r\n nextButtonText,\r\n nextDisabled,\r\n backButtonText,\r\n cancelButtonText,\r\n hideBackButton,\r\n}) => {\r\n const { state } = useWizardService();\r\n const { campaignId } = state.context.wizardData;\r\n const isFirstStep = getIsFirstStep(state);\r\n const isLastStep = getIsLastStep(state);\r\n const i18n = useContext(I18nContext);\r\n\r\n const Disclaimer = useMemo(() => () => {\r\n const disclaimer = FOOTER_DISCLAIMERS[getCurrentStepId(state)];\r\n return disclaimer ? (\r\n \r\n \r\n {i18n.getString(_TL_('Note'))} \r\n {disclaimer.topic ? (\r\n \r\n \r\n ) : null;\r\n }, [i18n, state]);\r\n\r\n return (\r\n \r\n \r\n {(!isFirstStep && !hideBackButton) && \r\n \r\n );\r\n};\r\nCreationFooter.propTypes = {\r\n nextButtonText: PropTypes.string,\r\n nextDisabled: PropTypes.bool,\r\n backButtonText: PropTypes.string,\r\n cancelButtonText: PropTypes.string,\r\n hideBackButton: PropTypes.bool,\r\n};\r\nCreationFooter.defaultProps = {\r\n nextButtonText: undefined,\r\n nextDisabled: false,\r\n backButtonText: undefined,\r\n cancelButtonText: undefined,\r\n hideBackButton: false,\r\n};\r\n","import React, { useCallback, useContext } from 'react';\r\nimport { SingleStepLogger } from '@bingads-webui-campaign-react/step-wizard-logger';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\n\r\nexport const SingleStepLoggerUnderActivity = () => {\r\n const activity = useContext(ActivityContext);\r\n const writeStepLog = useCallback((...args) => {\r\n activity.signal(...args);\r\n }, [activity]);\r\n\r\n return (\r\n \r\n \r\n );\r\n};\r\n","import { property } from 'underscore';\r\nimport React, { useCallback, useContext, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport {\r\n Wizard,\r\n Layout,\r\n LayoutContainer,\r\n StepContainer,\r\n} from '@bingads-webui-react/wizard';\r\nimport { StepList, BusyBlocker, CancelWizardDialog, DefaultTemplate } from '@bingads-webui-react/wizard-ui-library';\r\nimport { withSiteMap, getRoutePathById } from '@bingads-webui-campaign-react/with-site-map';\r\nimport { WizardPerfMarker } from '@bingads-webui-campaign/wizard-performance-marker';\r\nimport { WizardStepLogger } from '@bingads-webui-campaign-react/step-wizard-logger';\r\nimport { Activity, Scenario, ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { ContentFooter } from '@bingads-webui-campaign-react/content-footer';\r\n\r\nimport { CreationFooter } from '../shared/creation-footer';\r\nimport { SingleStepLoggerUnderActivity } from '../shared/logger-under-activity';\r\nimport { withStepActivity } from '../shared/with-step-activity';\r\n\r\nconst StepContainerWithStepActivity = withStepActivity(StepContainer);\r\nconst StepFooterWithStepActivity = withStepActivity(CreationFooter);\r\nconst CancelWizardDialogWithStepActivity = withStepActivity(CancelWizardDialog);\r\n\r\nconst CreationWizardInternal = (props) => {\r\n const {\r\n getStepListConfig,\r\n permissions,\r\n wizardLoggerFlowName,\r\n wizardLoggerSubFlowName,\r\n wizardLoggerStepToPage,\r\n } = props;\r\n const i18n = useContext(I18nContext);\r\n\r\n const stepListConfig = useMemo(() => getStepListConfig({\r\n i18n,\r\n showExtensionsStep: property(['dynamic', 'SearchRevampPhase1Post'])(permissions),\r\n }), [getStepListConfig, i18n, permissions]);\r\n\r\n const activity = useContext(ActivityContext);\r\n const writeWizardLog = useCallback((...args) => {\r\n activity.signal(...args);\r\n }, [activity]);\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nCreationWizardInternal.propTypes = {\r\n getStepListConfig: PropTypes.func.isRequired,\r\n permissions: PropTypes.shape({}).isRequired,\r\n wizardLoggerFlowName: PropTypes.string.isRequired,\r\n wizardLoggerSubFlowName: PropTypes.string.isRequired,\r\n wizardLoggerStepToPage: PropTypes.shape({}).isRequired,\r\n};\r\n\r\nexport const CreationWizardWithActivity = (props) => {\r\n const {\r\n scenarioName,\r\n activityName,\r\n stepConfigs,\r\n perfMarker,\r\n scope,\r\n siteMap,\r\n perfMarkerName,\r\n onDoneNavigateToSiteMapId,\r\n initialFlowFactors,\r\n getFlow,\r\n isLegalFooter,\r\n dynamicOptions,\r\n } = props;\r\n\r\n const wizardPerfMarker = useMemo(() => (\r\n perfMarker.createChild(perfMarkerName)\r\n ), [perfMarker, perfMarkerName]);\r\n\r\n const routeToNavigateToWhenDone = useMemo(() => getRoutePathById(siteMap, onDoneNavigateToSiteMapId), [onDoneNavigateToSiteMapId, siteMap]);\r\n\r\n const config = useMemo(() => {\r\n const newStepConfigs = stepConfigs.map(stepConfig => ({\r\n ...stepConfig,\r\n view: viewProps => (\r\n <>\r\n {stepConfig.view({ ...viewProps, wizardPerfMarker })}\r\n \r\n \r\n \r\n \r\n \r\n {isLegalFooter && \r\n \r\n \r\n );\r\n};\r\n\r\nCreationWizardWithActivity.propTypes = {\r\n scenarioName: PropTypes.string.isRequired,\r\n activityName: PropTypes.string.isRequired,\r\n stepConfigs: PropTypes.arrayOf(PropTypes.shape({\r\n id: PropTypes.string.isRequired,\r\n view: PropTypes.func.isRequired,\r\n })).isRequired,\r\n getStepListConfig: PropTypes.func.isRequired,\r\n perfMarker: PropTypes.shape({\r\n createChild: PropTypes.func.isRequired,\r\n }).isRequired,\r\n scope: PropTypes.shape({\r\n save: PropTypes.func.isRequired,\r\n }).isRequired,\r\n siteMap: PropTypes.shape({}).isRequired,\r\n perfMarkerName: PropTypes.string.isRequired,\r\n onDoneNavigateToSiteMapId: PropTypes.string.isRequired,\r\n initialFlowFactors: PropTypes.shape({}),\r\n getFlow: PropTypes.func,\r\n isLegalFooter: PropTypes.bool,\r\n dynamicOptions: PropTypes.shape({}),\r\n};\r\n\r\nCreationWizardWithActivity.defaultProps = {\r\n initialFlowFactors: {},\r\n dynamicOptions: {},\r\n getFlow: undefined,\r\n isLegalFooter: false,\r\n};\r\n\r\nexport const CreationWizard = withSiteMap(CreationWizardWithActivity);\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { property } from 'underscore';\r\n\r\nimport { searchCampaignCreationStepConfigs } from '../steps/step-configs';\r\nimport { getCampaignCreationStepListConfig, getSearchCampaignCreationFlow, SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS } from '../steps/step-utils';\r\nimport { CreationWizard } from './creation-wizard';\r\n\r\nexport const SearchCampaignCreationWizard = props => (\r\n \r\n \r\n);\r\n\r\nEditFooter.propTypes = {\r\n saveAndExitButtonText: PropTypes.string,\r\n cancelButtonText: PropTypes.string,\r\n};\r\n\r\nEditFooter.defaultProps = {\r\n saveAndExitButtonText: undefined,\r\n cancelButtonText: undefined,\r\n};\r\n","import React, { useCallback, useContext, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {\r\n Wizard,\r\n Layout,\r\n LayoutContainer,\r\n StepContainer,\r\n} from '@bingads-webui-react/wizard';\r\nimport { BusyBlocker, CancelWizardDialog, ConfirmWizardDialog, DefaultTemplate } from '@bingads-webui-react/wizard-ui-library';\r\nimport { withSiteMap, getRoutePathById } from '@bingads-webui-campaign-react/with-site-map';\r\nimport { WizardPerfMarker } from '@bingads-webui-campaign/wizard-performance-marker';\r\nimport { WizardStepLogger } from '@bingads-webui-campaign-react/step-wizard-logger';\r\nimport { Activity, Scenario, ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { ContentFooter } from '@bingads-webui-campaign-react/content-footer';\r\nimport { useConfirmDialogConfigWithLogger } from '@bingads-webui-campaign-react/campaign-settings-wizard-v1-utils';\r\n\r\nimport { EditFooter } from '../shared/edit-footer';\r\nimport { SingleStepLoggerUnderActivity } from '../shared/logger-under-activity';\r\nimport { SEARCH_WIZARD_TYPE_NAME } from './constants';\r\n\r\nconst EditWizardInternal = (props) => {\r\n const {\r\n i18n,\r\n stepConfigs,\r\n perfMarker,\r\n scope,\r\n siteMap,\r\n wizardTypeName,\r\n wizardLoggerFlowName,\r\n wizardLoggerSubFlowName,\r\n wizardLoggerStepToPage,\r\n perfMarkerName,\r\n permissions,\r\n onDoneNavigateToSiteMapId,\r\n } = props;\r\n const wizardPerfMarker = useMemo(() => (\r\n perfMarker.createChild(perfMarkerName)\r\n ), [perfMarker, perfMarkerName]);\r\n const isConversionAssociationWarningP2Enabled = permissions && permissions.dynamic && permissions.dynamic.ConversionAssociationWarningP2;\r\n const shouldHaveConfirmationDialog = isConversionAssociationWarningP2Enabled && wizardTypeName === SEARCH_WIZARD_TYPE_NAME.SEARCH_CAMPAIGN_EDIT_WIZARD;\r\n\r\n const routeToNavigateToWhenDone = useMemo(() => getRoutePathById(siteMap, onDoneNavigateToSiteMapId), [onDoneNavigateToSiteMapId, siteMap]);\r\n\r\n const activity = useContext(ActivityContext);\r\n const writeWizardLog = useCallback((...args) => {\r\n activity.signal(...args);\r\n }, [activity]);\r\n\r\n const config = useMemo(() => {\r\n const newStepConfigs = stepConfigs.map(stepConfig => ({\r\n ...stepConfig,\r\n view: viewProps => (\r\n <>\r\n {stepConfig.view({ ...viewProps, wizardPerfMarker })}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nEditWizardInternal.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n stepConfigs: PropTypes.arrayOf(PropTypes.shape({\r\n id: PropTypes.string.isRequired,\r\n view: PropTypes.func.isRequired,\r\n })).isRequired,\r\n perfMarker: PropTypes.shape({\r\n createChild: PropTypes.func.isRequired,\r\n }).isRequired,\r\n scope: PropTypes.shape({\r\n save: PropTypes.func.isRequired,\r\n }).isRequired,\r\n siteMap: PropTypes.shape({}).isRequired,\r\n wizardTypeName: PropTypes.string.isRequired,\r\n wizardLoggerFlowName: PropTypes.string.isRequired,\r\n wizardLoggerSubFlowName: PropTypes.string.isRequired,\r\n wizardLoggerStepToPage: PropTypes.shape({}).isRequired,\r\n perfMarkerName: PropTypes.string.isRequired,\r\n permissions: PropTypes.shape({}).isRequired,\r\n onDoneNavigateToSiteMapId: PropTypes.string.isRequired,\r\n};\r\n\r\nexport const EditWizardWithActivity = props => (\r\n \r\n \r\n \r\n \r\n);\r\n\r\nEditWizardWithActivity.propTypes = {\r\n scenarioName: PropTypes.string.isRequired,\r\n activityName: PropTypes.string.isRequired,\r\n};\r\n\r\nexport const EditWizard = withSiteMap(EditWizardWithActivity);\r\n","import React from 'react';\r\n\r\nimport { getSearchCampaignEditStepConfigs } from '../steps/step-configs';\r\nimport { SEARCH_CAMPAIGN_EDIT_WIZARD_STEP_PATHS } from '../steps/step-utils';\r\nimport { EditWizard } from './edit-wizard';\r\nimport { SEARCH_WIZARD_TYPE_NAME } from './constants';\r\n\r\nexport const SearchCampaignEditWizard = (props) => {\r\n const { permissions } = props || {};\r\n const stepConfigs = getSearchCampaignEditStepConfigs(permissions);\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n};\r\n\r\nBrandsContextProvider.propTypes = {\r\n children: PropTypes.oneOfType([\r\n PropTypes.arrayOf(PropTypes.node),\r\n PropTypes.node,\r\n ]).isRequired,\r\n cid: PropTypes.number.isRequired,\r\n aid: PropTypes.number.isRequired,\r\n brandListId: PropTypes.number,\r\n selectedOptionsLimit: PropTypes.number.isRequired,\r\n optionsDisplayLimit: PropTypes.number.isRequired,\r\n loadBrandsFactory: PropTypes.func,\r\n loadAssociatedBrandsFactory: PropTypes.func,\r\n onChange: PropTypes.func.isRequired,\r\n savedAddedSelectedOptionsKeys: PropTypes.arrayOf(PropTypes.number),\r\n savedDeletedSelectedOptionsKeys: PropTypes.arrayOf(PropTypes.number),\r\n};\r\n\r\nBrandsContextProvider.defaultProps = {\r\n brandListId: undefined,\r\n loadBrandsFactory: loadBrandsFactoryFromProp,\r\n loadAssociatedBrandsFactory: loadBrandsUnderBrandListFactoryFromProp,\r\n savedAddedSelectedOptionsKeys: [],\r\n savedDeletedSelectedOptionsKeys: [],\r\n};\r\n\r\nexport const useBrandsData = useMultiSelectContext;\r\n\r\n","import React, { useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { CommandBarButton } from '@fluentui/react';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport classNames from 'classnames';\r\nimport { useBrandsData } from './brands-data';\r\n\r\nconst getStyles = (_components, { palette }) => ({\r\n RequestBrandButton: {\r\n height: 32,\r\n color: palette.themePrimary,\r\n\r\n '&.is-disabled': {\r\n color: palette.neutralTertiaryAlt,\r\n },\r\n },\r\n});\r\n\r\nexport const RequestBrandButton = ({\r\n onClick,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n const {\r\n isSelectedOptionsLimitReached,\r\n } = useBrandsData();\r\n\r\n return (\r\n \r\n {i18n.getString(_TL_('We cannot load your brand lists at this time. Please try again later.'))}\r\n \r\n );\r\n};\r\n\r\nexport const MaxSelectionAlertForBrandLists = ({ selectedOptionsLimit }) => {\r\n const i18n = useContext(I18nContext);\r\n return (\r\n \r\n {i18n.getString(_TL_('You can only add up to {{selectedOptionsLimit}} brand lists per campaign. Please review your selections and try again.'), { selectedOptionsLimit })}\r\n \r\n );\r\n};\r\n\r\nMaxSelectionAlertForBrandLists.propTypes = {\r\n selectedOptionsLimit: PropTypes.number.isRequired,\r\n};\r\n\r\nexport const NoInitialDataAlertForBrandLists = ({ noInitialDataText }) => {\r\n const i18n = useContext(I18nContext);\r\n return (\r\n \r\n {noInitialDataText || i18n.getString(_TL_('Create a brand list so that your ads won’t serve on search queries that mention those brands.'))}\r\n \r\n );\r\n};\r\n\r\nNoInitialDataAlertForBrandLists.propTypes = {\r\n noInitialDataText: PropTypes.string,\r\n};\r\n\r\nNoInitialDataAlertForBrandLists.defaultProps = {\r\n noInitialDataText: undefined,\r\n};\r\n\r\nexport const SystemErrorAlertForBrands = () => {\r\n const i18n = useContext(I18nContext);\r\n return (\r\n \r\n {i18n.getString(_TL_('We cannot load your brands at this time. Please try again later.'))}\r\n \r\n );\r\n};\r\n\r\nexport const MaxSelectionAlertForBrands = ({ selectedOptionsLimit }) => {\r\n const i18n = useContext(I18nContext);\r\n return (\r\n \r\n \r\n {i18n.getString(_TL_('We only display the first {{optionsLimit}} brands. Please refine your search.'), { optionsLimit })}\r\n \r\n );\r\n};\r\n\r\nMoreOptionsInlineAlertForBrands.propTypes = {\r\n optionsLimit: PropTypes.number.isRequired,\r\n};\r\n\r\n","import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';\r\nimport _ from 'underscore';\r\nimport classNames from 'classnames';\r\nimport PropTypes from 'prop-types';\r\nimport {\r\n withMultiSelectCombobox,\r\n useFluentV1Styles,\r\n} from '@bingads-webui-campaign-react/multi-selector';\r\nimport { useDebouncedState } from '@bingads-webui-campaign-react/common-generic-hooks';\r\nimport {\r\n FluentProvider,\r\n webLightTheme,\r\n makeStyles,\r\n mergeClasses,\r\n shorthands,\r\n useId,\r\n Combobox,\r\n Option,\r\n} from '@fluentui/react-components';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { InlineLoading, LoadingOverlay } from '@bingads-webui-campaign-react/loading';\r\nimport { RequestBrandButton } from './request-brand-button';\r\nimport { MaxSelectionAlertForBrands, MoreOptionsInlineAlertForBrands, SystemErrorAlertForBrands } from '../alerts';\r\nimport { useBrandsData } from './brands-data';\r\nimport { MT_ALLOWED_MIN_SEARCH_FILTER_LENGTH } from '../constants';\r\n\r\nconst MultiSelectCombobox = withMultiSelectCombobox(Combobox);\r\nconst searchStartDelayMs = 500;\r\n\r\nconst useMultiSelectorStyles = makeStyles({\r\n listbox: {\r\n maxHeight: '500px',\r\n },\r\n});\r\n\r\nconst useStyles = makeStyles({\r\n ExistingBrandsPicker: {\r\n width: '100%',\r\n },\r\n BrandItem: {\r\n width: '545px',\r\n overflowWrap: 'break-word',\r\n paddingLeft: '8px',\r\n '&:hover': {\r\n backgroundColor: '#f4f4f4',\r\n cursor: 'pointer',\r\n },\r\n },\r\n BrandItemLink: {\r\n color: '#0078d4',\r\n ...shorthands.textDecoration('underline'),\r\n },\r\n TypeInContent: {\r\n ...shorthands.margin('12px'),\r\n fontSize: '14px',\r\n lineHeight: '20px',\r\n },\r\n NonOptionContent: {\r\n ...shorthands.margin('12px'),\r\n '& .brand-empty-header': {\r\n fontSize: '14px',\r\n lineHeight: '20px',\r\n },\r\n '& .brand-empty-description': {\r\n fontSize: '12px',\r\n lineHeight: '20px',\r\n },\r\n },\r\n});\r\n\r\nexport const ExistingBrandsPicker = ({ onRequestBrand }) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useStyles();\r\n\r\n const comboboxId = useId('combobox');\r\n const styles = useMultiSelectorStyles();\r\n const fluentV1ComboboxStyles = useFluentV1Styles();\r\n\r\n const {\r\n isLoadingOptions,\r\n isFirstOptionsLoad,\r\n // isNoOptionsAfterFirstLoad, // No need to handle this, since there is an create brand button\r\n isMoreOptionsThanLimit,\r\n options,\r\n optionsLoadError,\r\n lastLoadedSearchFilter,\r\n optionsDisplayLimit,\r\n selectedOptionsLimit,\r\n\r\n isLoadingSelectedOptions,\r\n isSelectedOptionsLimitReached,\r\n selectedOptionsLoadError,\r\n selectedOptions,\r\n setSelectedOptions,\r\n\r\n setSearchFilter: setSearchFilterFromContext,\r\n } = useBrandsData();\r\n\r\n const isAnyLoading = isLoadingOptions || isLoadingSelectedOptions;\r\n const hasLoadErrors = optionsLoadError || selectedOptionsLoadError;\r\n const showInitialLoading = (isFirstOptionsLoad && !hasLoadErrors) || isLoadingSelectedOptions;\r\n const canUserStartOperating = !showInitialLoading && !selectedOptionsLoadError;\r\n const selectedOptionKeys = useMemo(() => _.pluck(selectedOptions, 'key'), [selectedOptions]);\r\n const selectedOptionsSet = useMemo(() => new Set(selectedOptionKeys), [selectedOptionKeys]);\r\n const shouldDisableSelection = useCallback(option => isSelectedOptionsLimitReached && !selectedOptionsSet.has(option.key), [isSelectedOptionsLimitReached, selectedOptionsSet]);\r\n\r\n const [isOpen, setIsOpen] = useState(false);\r\n const onOpenChange = useCallback((event, data) => {\r\n setIsOpen(data.open);\r\n }, []);\r\n\r\n const onOptionSelect = useCallback((event, data) => {\r\n setSelectedOptions(data.resolvedSelectedOptions);\r\n }, [setSelectedOptions]);\r\n\r\n const [debouncedSearchFilter, setSearchFilter, searchFilter] = useDebouncedState('', searchStartDelayMs);\r\n useEffect(() => {\r\n setSearchFilterFromContext(debouncedSearchFilter);\r\n }, [debouncedSearchFilter, setSearchFilterFromContext]);\r\n const onChange = useCallback((event) => {\r\n const { value: rawValue } = event.target;\r\n setSearchFilter(rawValue);\r\n }, [setSearchFilter]);\r\n\r\n const isSearchFilterEmpty = !lastLoadedSearchFilter || lastLoadedSearchFilter.length < MT_ALLOWED_MIN_SEARCH_FILTER_LENGTH;\r\n\r\n return (\r\n \r\n {isAnyLoading && isFirstOptionsLoad && \r\n \r\n {!optionsLoadError &&\r\n <>\r\n {isSearchFilterEmpty && _.isEmpty(options) && (\r\n \r\n \r\n )}\r\n \r\n );\r\n};\r\n\r\nExistingBrandsPicker.propTypes = {\r\n onRequestBrand: PropTypes.func.isRequired,\r\n};\r\n","import React, { useCallback, useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport _ from 'underscore';\r\nimport classNames from 'classnames';\r\nimport { CommandBarButton, DirectionalHint, TooltipHost } from '@fluentui/react';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { SelectedItem } from '@bingads-webui-campaign-react/pill-item-components';\r\n\r\nconst getStyles = (_components, { palette }) => ({\r\n RemoveAllButton: {\r\n height: 32,\r\n color: palette.themePrimary,\r\n },\r\n SelectedBrandsTagsHeader: {\r\n padding: 8,\r\n },\r\n SelectedBrandsTags: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n gridGap: 8,\r\n },\r\n TooltipContent: {\r\n padding: 8,\r\n '& p': {\r\n margin: 0,\r\n },\r\n },\r\n});\r\n\r\nexport const SelectedBrandsTags = ({\r\n className,\r\n selectedOptions,\r\n onRemoveAll,\r\n onRemoveItem,\r\n isAwaysDisplayHeader,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n const onRenderSelectedItemText = useCallback(({ item, text }) => (\r\n (\r\n \r\n \r\n \r\n setIsDoNotAskAgain(checked)}\r\n label={i18n.getString(_TL_('Don’t ask again'))}\r\n />\r\n \r\n \r\n );\r\n};\r\n\r\nSaveDialog.propTypes = {\r\n open: PropTypes.bool.isRequired,\r\n onConfirm: PropTypes.func.isRequired,\r\n onDismiss: PropTypes.func.isRequired,\r\n};\r\n","import React, { useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Dialog, DialogType, DialogFooter, PrimaryButton, DefaultButton } from '@fluentui/react';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\n\r\nconst modalProps = {\r\n isBlocking: true,\r\n className: 'cancel-brand-list-dialog',\r\n};\r\n\r\nexport const CancelDialog = (props) => {\r\n const { open, onConfirm, onDismiss } = props;\r\n const i18n = useContext(I18nContext);\r\n\r\n const dialogContentProps = {\r\n type: DialogType.normal,\r\n title: i18n.getString(_TL_('Cancel brand list creation')),\r\n closeButtonAriaLabel: i18n.getString(_TL_('Close')),\r\n subText: i18n.getString(_TL_('Your brand list will be deleted along with all the brands you\\'ve added and requested will be removed. Are you sure you want to cancel your brand list creation?')),\r\n };\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nCancelDialog.propTypes = {\r\n open: PropTypes.bool.isRequired,\r\n onConfirm: PropTypes.func.isRequired,\r\n onDismiss: PropTypes.func.isRequired,\r\n};\r\n","import React, { useCallback, useContext, useState, useMemo, useEffect } from 'react';\r\nimport _ from 'underscore';\r\nimport classNames from 'classnames';\r\nimport PropTypes from 'prop-types';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { PreferenceContext } from '@bingads-webui-react/preference-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { createBrandListFromProp, updateBrandListFromProp, getViewModelBulkUpsertErrors, extractAndRestoreFailedBrandItemAssociations } from '@bingads-webui-campaign-react/brand-lists-data';\r\nimport { Panel, PanelType, PrimaryButton, DefaultButton } from '@fluentui/react';\r\nimport { useBoolean } from '@fluentui/react-hooks';\r\nimport { BrandsContextProvider } from '../brands-picker/brands-data';\r\nimport { ManageBrandListPanelContent } from './manage-brand-list-panel-content';\r\nimport { RequestBrandPanel } from './request-brand-panel';\r\nimport { SaveDialog } from './save-dialog';\r\nimport { CancelDialog } from './cancel-dialog';\r\nimport { BRAND_OPTIONS_DISPLAY_LIMIT, BRAND_SELECTED_OPTIONS_LIMIT, DO_NOT_ASK_AGAIN_PREFERENCE_NAME } from '../constants';\r\n\r\nconst getStyles = (_components, { palette }) => ({\r\n ManageBrandListPanel: {\r\n '& .ms-Panel-main': {\r\n overflow: 'hidden',\r\n },\r\n '& .ms-Panel-footer': {\r\n background: palette.white,\r\n },\r\n },\r\n SaveButton: {\r\n marginRight: 8,\r\n },\r\n Error: {\r\n color: palette.redDark,\r\n },\r\n});\r\n\r\nexport const ManageBrandListPanel = ({\r\n className, cid, aid, brandListId, isOpen, onDismiss, onSaveCallback, isConfirmDialogOn, selectedOptionsLimit, optionsDisplayLimit,\r\n}) => {\r\n const classes = useDefaultStyles(getStyles);\r\n const i18n = useContext(I18nContext);\r\n\r\n const [isSaveDialogOpen, { setTrue: onOpenSaveDialog, setFalse: onDismissSaveDialog }] = useBoolean(false);\r\n const [isCancelDialogOpen, { setTrue: onOpenCancelDialog, setFalse: onDismissCancelDialog }] = useBoolean(false);\r\n\r\n const [isManagePanelOpen, setIsManagePanelOpen] = useState(false);\r\n const [isRequestBrandPanelOpen, setIsRequestBrandPanelOpen] = useState(false);\r\n\r\n const onOpenRequestBrandPanel = useCallback(() => {\r\n setIsManagePanelOpen(false);\r\n setIsRequestBrandPanelOpen(true);\r\n }, []);\r\n const onDismissRequestBrandPanel = useCallback(() => {\r\n setIsManagePanelOpen(true);\r\n setIsRequestBrandPanelOpen(false);\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (isOpen) {\r\n setIsManagePanelOpen(true);\r\n }\r\n }, [isOpen]);\r\n\r\n const preferenceService = useContext(PreferenceContext);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n const isDoNotAskAgain = useMemo(() => preferenceService.findByNameAtAccountLevel(DO_NOT_ASK_AGAIN_PREFERENCE_NAME) || false, [preferenceService, isOpen]);\r\n const setIsDoNotAskAgain = value => preferenceService.setAtAccountLevel({\r\n Name: DO_NOT_ASK_AGAIN_PREFERENCE_NAME,\r\n Data: value,\r\n });\r\n\r\n const [listName, setListName] = useState('');\r\n const [deletedBrandIds, setDeletedBrandIds] = useState([]);\r\n const [addedBrandIds, setAddedBrandIds] = useState([]);\r\n const [savedDeletedBrandIds, setSavedDeletedBrandIds] = useState([]);\r\n const [savedAddedBrandIds, setSavedAddedBrandIds] = useState([]);\r\n const [serverError, setServerError] = useState(null);\r\n\r\n useEffect(() => {\r\n if (isOpen) {\r\n setListName('');\r\n setServerError(null);\r\n setDeletedBrandIds([]);\r\n setAddedBrandIds([]);\r\n setSavedDeletedBrandIds([]);\r\n setSavedAddedBrandIds([]);\r\n }\r\n }, [brandListId, isOpen]);\r\n\r\n // This callback tracks user-made changes to the brand lists selection.\r\n const onChange = useCallback((newSelectedBrands, [newDeletedBrandIds, newAddedBrandIds]) => {\r\n setDeletedBrandIds(newDeletedBrandIds);\r\n setAddedBrandIds(newAddedBrandIds);\r\n }, []);\r\n\r\n const onError = useCallback((result, brandList, brandItems) => {\r\n const { errors } = result;\r\n const {\r\n savedAddedBrandItemIds: newSavedAddedBrandIds,\r\n savedDeletedBrandItemIds: newSavedDeletedBrandIds,\r\n filteredErrors,\r\n } = extractAndRestoreFailedBrandItemAssociations(errors, brandList, brandItems);\r\n\r\n setSavedAddedBrandIds(newSavedAddedBrandIds);\r\n setSavedDeletedBrandIds(newSavedDeletedBrandIds);\r\n\r\n const translatedErrors = getViewModelBulkUpsertErrors(i18n, {\r\n ...result,\r\n errors: filteredErrors,\r\n });\r\n const finalErrorMsg = _.chain(translatedErrors)\r\n .map(error => error.message)\r\n .uniq(true)\r\n .join('\\n')\r\n .value();\r\n setServerError(finalErrorMsg);\r\n }, [i18n]);\r\n\r\n const onCreate = useCallback(() => {\r\n const brandList = {\r\n Id: -1,\r\n Name: listName,\r\n };\r\n const brandItems = _.map(addedBrandIds, brandId => ({\r\n Id: brandId,\r\n Status: 'Active',\r\n ParentId: -1,\r\n }));\r\n brandList.BrandItems = brandItems;\r\n\r\n const brandListPayload = {\r\n BrandLists: [brandList],\r\n };\r\n\r\n const saveCallPromise = createBrandListFromProp({ cid, aid });\r\n saveCallPromise(brandListPayload)\r\n .then((result) => {\r\n if (onSaveCallback) {\r\n onSaveCallback({\r\n listId: result.BrandLists[0].Id,\r\n listName,\r\n });\r\n }\r\n onDismiss();\r\n })\r\n .catch((result) => {\r\n onError(result, brandList, brandItems);\r\n });\r\n }, [addedBrandIds, aid, cid, listName, onDismiss, onError, onSaveCallback]);\r\n\r\n const onUpdate = useCallback(() => {\r\n const activeBrands = _.map(addedBrandIds, brandId => ({\r\n Id: brandId,\r\n Status: 'Active',\r\n }));\r\n const deleteBrands = _.map(deletedBrandIds, brandId => ({\r\n Id: brandId,\r\n Status: 'Deleted',\r\n }));\r\n const brandItems = _.map([...activeBrands, ...deleteBrands], brand => ({\r\n Id: brand.Id,\r\n Status: brand.Status,\r\n ParentId: brandListId,\r\n }));\r\n\r\n const brandListPayload = {\r\n BrandItems: brandItems,\r\n };\r\n\r\n const saveCallPromise = updateBrandListFromProp({ cid, aid });\r\n saveCallPromise(brandListPayload)\r\n .then(() => {\r\n if (onSaveCallback) {\r\n onSaveCallback();\r\n }\r\n onDismiss();\r\n })\r\n .catch((result) => {\r\n onError(result, null, brandItems);\r\n });\r\n }, [addedBrandIds, deletedBrandIds, cid, aid, brandListId, onSaveCallback, onDismiss, onError]);\r\n\r\n const onSave = useCallback(() => {\r\n if (brandListId) {\r\n onUpdate();\r\n } else {\r\n onCreate();\r\n }\r\n }, [brandListId, onCreate, onUpdate]);\r\n\r\n const onRenderFooterContent = useCallback(() => {\r\n const isBrandsChanged = !_.isEmpty(addedBrandIds) || !_.isEmpty(deletedBrandIds);\r\n const isChanged = brandListId ? isBrandsChanged : listName;\r\n return (\r\n \r\n {isManagePanelOpen && (\r\n \r\n {\r\n if (value) {\r\n setIsDoNotAskAgain(true);\r\n }\r\n onDismissSaveDialog();\r\n onSave();\r\n }}\r\n onDismiss={onDismissSaveDialog}\r\n />\r\n )}\r\n {isCancelDialogOpen && (\r\n {\r\n onDismissCancelDialog();\r\n onDismiss();\r\n }}\r\n onDismiss={onDismissCancelDialog}\r\n />\r\n )}\r\n \r\n );\r\n};\r\n\r\nManageBrandListPanel.propTypes = {\r\n cid: PropTypes.number.isRequired,\r\n aid: PropTypes.number.isRequired,\r\n brandListId: PropTypes.number,\r\n className: PropTypes.string,\r\n isOpen: PropTypes.bool.isRequired,\r\n onDismiss: PropTypes.func.isRequired,\r\n onSaveCallback: PropTypes.func,\r\n isConfirmDialogOn: PropTypes.bool,\r\n selectedOptionsLimit: PropTypes.number,\r\n optionsDisplayLimit: PropTypes.number,\r\n};\r\n\r\nManageBrandListPanel.defaultProps = {\r\n brandListId: undefined,\r\n className: undefined,\r\n onSaveCallback: undefined,\r\n isConfirmDialogOn: false,\r\n selectedOptionsLimit: BRAND_SELECTED_OPTIONS_LIMIT,\r\n optionsDisplayLimit: BRAND_OPTIONS_DISPLAY_LIMIT,\r\n};\r\n","import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport _ from 'underscore';\r\nimport classNames from 'classnames';\r\nimport {\r\n withMultiSelectCombobox,\r\n useFluentV1Styles,\r\n useMultiSelectContext,\r\n} from '@bingads-webui-campaign-react/multi-selector';\r\nimport { useDebouncedState } from '@bingads-webui-campaign-react/common-generic-hooks';\r\nimport {\r\n FluentProvider,\r\n webLightTheme,\r\n makeStyles,\r\n mergeClasses,\r\n shorthands,\r\n useId,\r\n Combobox,\r\n Option,\r\n} from '@fluentui/react-components';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { LoadingOverlay } from '@bingads-webui-campaign-react/loading';\r\n\r\nconst MultiSelectCombobox = withMultiSelectCombobox(Combobox);\r\nconst searchStartDelayMs = 500;\r\n\r\nconst useMultiSelectorStyles = makeStyles({\r\n listbox: {\r\n maxHeight: '245px',\r\n },\r\n});\r\n\r\nconst useStyles = makeStyles({\r\n ExistingBrandListsPicker: {\r\n width: '560px',\r\n },\r\n ExistingBrandListsPickerContent: {\r\n width: '552px',\r\n },\r\n BrandListItem: {\r\n width: '100%',\r\n paddingLeft: '8px',\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '&:hover': {\r\n backgroundColor: '#f4f4f4',\r\n cursor: 'pointer',\r\n },\r\n },\r\n BrandListItemName: {\r\n maxWidth: '435px',\r\n overflowWrap: 'break-word',\r\n },\r\n BrandListItemBrandsCount: {\r\n color: '#605e5c',\r\n float: 'right',\r\n alignSelf: 'center',\r\n },\r\n BrandListItemLink: {\r\n color: '#0078d4',\r\n ...shorthands.textDecoration('underline'),\r\n },\r\n NonOptionContent: {\r\n ...shorthands.margin('12px'),\r\n '& .brand-list-empty-header': {\r\n fontSize: '14px',\r\n lineHeight: '20px',\r\n },\r\n '& .brand-list-empty-description': {\r\n fontSize: '12px',\r\n lineHeight: '20px',\r\n },\r\n },\r\n});\r\n\r\nexport const ExistingBrandListsPicker = ({\r\n disabled,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useStyles();\r\n\r\n const comboboxId = useId('combobox');\r\n const styles = useMultiSelectorStyles();\r\n const fluentV1ComboboxStyles = useFluentV1Styles();\r\n\r\n const {\r\n isLoadingOptions,\r\n isFirstOptionsLoad,\r\n isNoOptionsAfterFirstLoad,\r\n options,\r\n optionsLoadError,\r\n\r\n isLoadingSelectedOptions,\r\n isSelectedOptionsLimitReached,\r\n selectedOptions,\r\n setSelectedOptions,\r\n selectedOptionsLoadError,\r\n\r\n setSearchFilter: setSearchFilterFromContext,\r\n } = useMultiSelectContext();\r\n\r\n const hasLoadErrors = optionsLoadError || selectedOptionsLoadError;\r\n const showInitialLoading = (isFirstOptionsLoad && !hasLoadErrors) || isLoadingSelectedOptions;\r\n const hasInitialLoadErrors = isFirstOptionsLoad && hasLoadErrors;\r\n const canUserStartOperating = !showInitialLoading && !isNoOptionsAfterFirstLoad && !(hasInitialLoadErrors || selectedOptionsLoadError);\r\n const selectedOptionKeys = useMemo(() => _.pluck(selectedOptions, 'key'), [selectedOptions]);\r\n const selectedOptionsSet = useMemo(() => new Set(selectedOptionKeys), [selectedOptionKeys]);\r\n const shouldDisableSelection = useCallback(option => isSelectedOptionsLimitReached && !selectedOptionsSet.has(option.key), [isSelectedOptionsLimitReached, selectedOptionsSet]);\r\n\r\n const [isOpen, setIsOpen] = useState(false);\r\n const onOpenChange = useCallback((event, data) => {\r\n setIsOpen(data.open);\r\n }, []);\r\n\r\n const onOptionSelect = useCallback((event, data) => {\r\n setSelectedOptions(data.resolvedSelectedOptions);\r\n }, [setSelectedOptions]);\r\n\r\n const [debouncedSearchFilter, setSearchFilter, searchFilter] = useDebouncedState('', searchStartDelayMs);\r\n useEffect(() => {\r\n setSearchFilterFromContext(debouncedSearchFilter);\r\n }, [debouncedSearchFilter, setSearchFilterFromContext]);\r\n const onChange = useCallback((event) => {\r\n const { value: rawValue } = event.target;\r\n setSearchFilter(rawValue);\r\n }, [setSearchFilter]);\r\n\r\n return (\r\n \r\n \r\n \r\n {!optionsLoadError &&\r\n <>\r\n {_.isEmpty(options) && (\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nExistingBrandListsPicker.propTypes = {\r\n disabled: PropTypes.bool,\r\n};\r\n\r\nExistingBrandListsPicker.defaultProps = {\r\n disabled: false,\r\n};\r\n","import React, { useCallback } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport _ from 'underscore';\r\nimport classNames from 'classnames';\r\nimport { DirectionalHint, TooltipHost } from '@fluentui/react';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { SelectedItem } from '@bingads-webui-campaign-react/pill-item-components';\r\n\r\nconst getStyles = (_components, { palette }) => ({\r\n OperationButton: {\r\n height: 32,\r\n color: palette.themePrimary,\r\n },\r\n SelectedBrandListsTagsHeader: {\r\n padding: 8,\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: '8px',\r\n },\r\n SelectedBrandListsTags: {\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n gridGap: 8,\r\n marginBottom: 12,\r\n },\r\n BrandListItem: {\r\n padding: '12px 0 12px 12px',\r\n display: 'flex',\r\n alignItems: 'center',\r\n '&.disabled': {\r\n padding: 12,\r\n },\r\n },\r\n AndMoreText: {\r\n fontSize: 14,\r\n lineHeight: '34px',\r\n },\r\n});\r\n\r\nconst BRAND_LIST_NAME_DISPLAY_LIMIT = 20;\r\n\r\nconst convertToSubstring = (str, length) => {\r\n if (str.length <= length) {\r\n return str;\r\n }\r\n return `${str.substring(0, length)}...`;\r\n};\r\n\r\nexport const SelectedBrandListsTags = ({\r\n className,\r\n selectedOptions,\r\n setSelectedOptions,\r\n isDisabled,\r\n}) => {\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n const onRemoveItem = useCallback((index) => {\r\n const newSelectedOptions = _.clone(selectedOptions);\r\n newSelectedOptions.splice(index, 1);\r\n setSelectedOptions(newSelectedOptions);\r\n }, [selectedOptions, setSelectedOptions]);\r\n\r\n const onRenderSelectedItemText = useCallback(({ item, text }) => (\r\n \r\n \r\n {children}\r\n \r\n);\r\n\r\nBrandListsContextProvider.propTypes = {\r\n children: PropTypes.oneOfType([\r\n PropTypes.arrayOf(PropTypes.node),\r\n PropTypes.node,\r\n ]).isRequired,\r\n selectedOptionsLimit: PropTypes.number.isRequired,\r\n optionsDisplayLimit: PropTypes.number.isRequired,\r\n useOptions: PropTypes.func.isRequired,\r\n useSelectedOptions: PropTypes.func.isRequired,\r\n onChange: PropTypes.func,\r\n onSelectedOptionsUpdate: PropTypes.func,\r\n savedAddedSelectedOptionsKeys: PropTypes.arrayOf(PropTypes.number),\r\n savedDeletedSelectedOptionsKeys: PropTypes.arrayOf(PropTypes.number),\r\n};\r\n\r\nBrandListsContextProvider.defaultProps = {\r\n onChange: undefined,\r\n onSelectedOptionsUpdate: undefined,\r\n savedAddedSelectedOptionsKeys: [],\r\n savedDeletedSelectedOptionsKeys: [],\r\n};\r\n","import Promise from 'bluebird';\r\nimport React, { useCallback, useMemo, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport _ from 'underscore';\r\nimport {\r\n makeUseOptionsAsyncDataSourceWithClientFilter,\r\n makeUseSelectedOptionsAsyncDataSource,\r\n} from '@bingads-webui-campaign-react/multi-selector';\r\nimport { loadBrandListsFactory, loadCampaignAssociatedBrandListsFactory } from '@bingads-webui-campaign-react/brand-lists-data';\r\nimport { BrandListsPickerContent } from './brand-lists-picker-content';\r\nimport { BrandListsContextProvider } from './brand-lists-data';\r\nimport { BRAND_LIST_MAX_COUNT, BRAND_LIST_OPTIONS_DISPLAY_LIMIT, BRAND_LIST_SELECTED_OPTIONS_LIMIT } from '../constants';\r\n\r\nconst filterPredicate = searchFilter => (_.isEmpty(searchFilter) ?\r\n _.constant(true) :\r\n option => option.Name.toLowerCase().includes(searchFilter.toLowerCase()));\r\n\r\nexport const BrandListsPicker = ({\r\n className,\r\n disabled,\r\n selectedOptionsLimit,\r\n optionsDisplayLimit,\r\n loadBrandListsFactory: loadBrandListsFactoryFromProp,\r\n loadCampaignAssociatedBrandListsFactory: loadCampaignAssociatedBrandListsFactoryFromProp,\r\n isConfirmDialogOn,\r\n cid,\r\n aid,\r\n campaignId,\r\n onChange,\r\n onSelectedOptionsUpdate,\r\n savedAddedSelectedOptionsKeys,\r\n savedDeletedSelectedOptionsKeys,\r\n descriptionTextTemplate,\r\n noInitialDataText,\r\n}) => {\r\n const loadBrandLists = useMemo(() => loadBrandListsFactoryFromProp(cid, aid), [loadBrandListsFactoryFromProp, cid, aid]);\r\n const loadSelectedBrandLists = useMemo(\r\n () => (campaignId ? loadCampaignAssociatedBrandListsFactoryFromProp(cid, aid, campaignId) : () => Promise.delay(0, [])),\r\n [loadCampaignAssociatedBrandListsFactoryFromProp, cid, aid, campaignId]\r\n );\r\n\r\n const [isBrandListLimitReached, setIsBrandListLimitReached] = useState(false);\r\n const onDoneCallback = useCallback(allOptions => setIsBrandListLimitReached(allOptions && allOptions.length >= BRAND_LIST_MAX_COUNT), []);\r\n\r\n const useOptions = useMemo(() => makeUseOptionsAsyncDataSourceWithClientFilter(loadBrandLists, filterPredicate, onDoneCallback), [loadBrandLists, onDoneCallback]);\r\n const useSelectedOptions = useMemo(() => makeUseSelectedOptionsAsyncDataSource(loadSelectedBrandLists), [loadSelectedBrandLists]);\r\n\r\n return (\r\n \r\n \r\n \r\n
\r\n );\r\n };\r\n\r\n const customRenderBulkControl = (items, onBulkOperation, isSelectedList, innerClasses) => {\r\n if (isSelectedList) {\r\n return null;\r\n }\r\n const disabled = _.every(items, { isSelected: true });\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nWrappedBroadOnlySetting.propTypes = {\r\n theme: PropTypes.shape({\r\n components: PropTypes.shape({}),\r\n core: PropTypes.shape({}),\r\n }).isRequired,\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func,\r\n }).isRequired,\r\n preferenceService: PropTypes.shape({\r\n findByNameAtAccountLevel: PropTypes.func,\r\n setAtAccountLevel: PropTypes.func,\r\n }).isRequired,\r\n scope: PropTypes.shape({}).isRequired,\r\n serverContext: PropTypes.shape({\r\n CurrentUser: PropTypes.shape({}),\r\n CurrentCustomer: PropTypes.shape({}),\r\n CurrentAccount: PropTypes.shape({}),\r\n }).isRequired,\r\n permissions: PropTypes.shape({}).isRequired,\r\n};\r\n"],"names":["SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS","CAMPAIGN_SETTINGS","KEYWORDS","CREATE_AD","ADD_MORE_ASSETS","BUDGET_AND_BIDS","SUMMARY","getCampaignCreationStepListConfig","_ref","i18n","_ref$showExtensionsSt","showExtensionsStep","id","title","getString","_TL_","_objectSpread","steps","getSearchCampaignCreationFlow","flowFactors","_flowFactors$showExte","showExtensions","SEARCH_CAMPAIGN_EDIT_WIZARD_STEP_PATHS","CAMPAIGN_EDIT_SETTINGS","SEARCH_AD_GROUP_CREATION_WIZARD_STEP_PATHS","AD_GROUP_SETTINGS","CREATE_DSA_AD","BID_AND_TARGET","BID_AND_TARGET_DSA","getAdGroupCreationStepListConfig","_ref2","SEARCH_AD_GROUP_EDIT_WIZARD_STEP_PATHS","AD_GROUP_EDIT_SETTINGS","AD_GROUP_TYPES","SearchStandard","SearchDynamic","AD_GROUP_TYPE_STRINGS","_defineProperty","getSearchAdGroupCreationFlow","adGroupType","getStyles","websiteTitle","fontSize","fontWeight","websiteContent","width","emptyUrls","ValidatedWebsiteTitle","classes","useDefaultStyles","useContext","I18nContext","_jsx","className","classnames","children","Label","_jsxs","Stack","horizontal","verticalAlign","HelpPopupInline","topic","ValidatedWebsiteContent","validationProps","updateValidation","validateOnRender","enableSpecialCharactersValidation","useFluentV2","isEmptyValid","disabled","websites","data","website","first","activity","ActivityContext","onChange","useCallback","errors","value","contains","isEmpty","signal","concat","JSON","stringify","Input","UrlInputFluentV2","url","dropdownOptionAriaLabel","propertyKey","containerClassName","textFieldAriaLabel","UrlInputFluent","defaultProps","ValidatedWebsite","withError","withCustomValidation","LanguageTargetValidationAdapter","AdapterFactory","defaultValue","valueToInject","functionToInject","LanguageTargetValidatorFactory","defaultValidator","defaultErrors","_toConsumableArray","length","ValidatedLanguageTarget","withValidation","LanguageTarget","getBidAdjustmentStylesTargetStyles","_","palette","uiblockerStyle","audienceModalStyles","modalWidth","audienceExpressionStyle","audienceCombinedListStyle","pickerContainer","criterionSettingIndustryStyles","targetGridWidth","audienceAssociationSectionStyle","singleListBoxWidth","audienceTargetsSettingsStyles","audienceBudgetBidsStyles","commonDoubleListBoxStyle","paginationStyle","tableStyle","searchboxStyle","convertToLocalStyle","glyphIconStyle","helpbuttonStyle","color","content","fontFamily","position","marginLeft","display","marginRight","editTargetButtonContainer","paddingBottom","noTargetSelected","hide","AdGroupAgeRanges","EighteenToTwentyFive","TwentyFiveToThirtyFive","ThirtyFiveToFifty","FiftyToSixtyFive","SixtyFiveAndAbove","Unknown","localizedCriterionType","criterionType","getBidAdjuestmentTitleDetails","params","arguments","undefined","type","useCampaignSettings","details","len","forEach","key","index","bid","Criterion","BidAdjustment","target","DeviceCriterion","DeviceName","GenderCriterion","Target","AgeCriterion","CompanyNameCriterion","IndustryCriterion","JobFunctionCriterion","getTarget","Math","abs","settings","getBidAdjuestmentTitleSummary","targets","strings","_strings$noTarget","noTarget","_strings$singleTarget","singleTarget","_strings$multipleTarg","multipleTargets","number","size","formattedTargets","BidAdjustmentInternal","cid","aid","campaignId","adGroupId","criterionLevel","level","ranges","readOnly","parentData","_useState","useState","_useState2","_slicedToArray","bidAdjustmentRef","setBidAdjustmentRef","_useState3","_useState4","checked","setChecked","currentLevelTargetInfo","useMemo","AudienceTargetInfo","resourceName","isForVNext","initAudienceAssociationView","currentParentLevelTargetInfo","onSwitchChange","e","currentTarget","updatedValue","valid","newValue","getSnapshot","bidAdjustmentGridview","view","criterionTypes","supportCashbackSettings","showExclusion","isAudienceCampaign","readonly","render","useEffect","innerHTML","append","el","off","destroyAllAsync","createMultipleAsync","on","Switch","label","AgeRange","ageRanges","classNames","ref","newRef","ValidatedBidAdjustment","convertFuncs","Responsive","convertToAdModelInResponse","ResponsiveSearch","identity","isBulkWrappedResponse","bulkResult","has","ERROR_ENTITY","getBulkUploadErrorType","entitySchema","properties","name","getBulkUploadEntityType","modelToViewModelForBulkErrors","bulkUpsertEntityErrorMap","scenario","activityLogger","errorProcessor","getBulkApiErrors","map","error","errorType","mappedErrorType","result","mapBulkUpsertErrors","ReferencedEntityInvalidIdErrors","removeReferencedEntityInvalidIdErrors","bulkErrors","filter","Error","GENERIC_ERROR_MESSAGE_KEY","whitelistedSchemaPropertyKeysForModel","bulkModelToViewModelForDSA","adModel","pick","adResource","edmCampaign","types","resolve","bulkUpsertAdEntityErrorMap","Campaign","AdGroup","DynamicSearchAd","extend","Property","property","Message","message","Code","code","bulkModelToViewModelForRSA","ResponsiveSearchAd","ResponsiveAd","saveAdFuncs","DynamicSearch","ad","adViewModel","UrlCustomParameters","Key","Id","viewModelToModelForDSA","bulkUpdate","bind","bulkCreate","then","bulkOrSystemError","entity","all","CampaignCacheManager","invalidate","editorialErrors","filteredErrors","serverErrors","console","warn","stack","systemErrors","formatRSAObject","viewModelToModelForRSA","processViewModelDataForSaving","viewModelToModelForMMA","responsiveAdRepository","ResponsiveAdRepository","viewContext","currentCampaign","currentAdGroup","isVideo","campaignDomain","oDataConfig","odataRootUrl","config","get","odataToken","odataPath","imageOData","ImageOData","processImageAndSaveSearchAdAsync","response","convertFromBulkResponse","catch","deleteAdFuncs","adId","options","bulkDestroy","destroyCall","deleteAd","_ref3","adType","deleteAdFunc","parentId","Promise","reject","loadAds","_ref$filter","_ref$count","count","Customers","$withKey","Accounts","Campaigns","AdGroups","Ads","$makeCall","query","top","orderby","select","payload","gridDataParameters","toPromise","viewModelToBulkModelForConversionGoals","campaignViewModel","conversionGoals","convertToMTFormat","goalScopeSelection","originalConversionGoals","goalSelection","parseDateFromAPIFormat","date","dateFromMdyyyyFormat","parseDate","substring","raw","dateFromyyyyMdFormat","formatDateToAPIFormat","formatDate","getTargetCriterion","propKey","adGroupViewModel","bidAdjustment","_ref$overrideType","overrideType","_ref$level","propValue","criterion","Type","Status","status","CriterionType","flattenTargetCriterion","targetsWithBidAdjustment","_target$Criterion","_target$Criterion2","_target$Criterion3","hydrateCriterionWithBidAndId","initialTargetList","adddedCriterionList","targetWithBidAdjustmentList","_loop","i","matchingTargetWithBid","find","criterionWithBidAdjustment","originalCrition","initialTarget","LOCATION_CRITERION_TYPE","readCampaignCriterions","CampaignCriterions","$cast","where","readLocationCriterions","loadBundleCountries","serverContext","selectedLanguages","language","lcid","CurrentUser","LocaleID","market","Market","getBundleCountriesAndBundleLocationCriterions","readScheduleCriterions","viewModelToBulkModelForSchedule","adSchedulesBulkUpsert","campaignModel","modelToViewModelForDayTimeTargets","criterions","schedulingRows","each","push","Number","Day","StartHour","FromHour","StartMinute","FromMinute","EndHour","ToHour","EndMinute","ToMinute","BidAdjustmentType","CriterionBid","Multiplier","BidAdjustmentAmount","window","bulkModelToViewModelForDayTimeTargets","originalCriterions","deletedIds","added","DayTimeCriterion","minuteMap","range","r","toString","readTargetCriterion","deviceName","viewModelToBulkModelForDeviceTargets","_ref5","deviceTargets","Device","Targets","initialTargets","noChanged","currentDevice","initialDevice","compareDevice","addedDevices","modelToViewModelForDeviceTargets","_ref6","model","Name","OSName","cloneDeep","GenderName","modelToViewModelForGenderTargets","_ref7","genderTargets","Gender","GenderType","initialGender","viewModelToBulkModelForGenderTargets","_ref8","addedGender","changed","compareGender","AgeName","modelToViewModelForAgeTargets","_ref9","ageTargets","targetItem","Age","initialAge","modelToViewModelForCompanyNameTargets","_ref11","companyNameTargets","ProfileId","Size","Industry","CompanyName","initialCompanyNameTargets","modelToViewModelForIndustryTargets","_ref14","initialIndustry","industryTargets","industry","initialIndustryTargets","viewModelToBulkModelForIndustryTargets","_ref15","industryTargetsBidAdjustment","addedIndustryTargets","_ref16","targetWithBid","isIndustryTargetBidAdjustmentUpdated","removedIndustryTargets","addedIndustryCriterion","removedIndustryCriterion","modelToViewModelForJobFunctionTargets","_ref17","initialJobTargets","jobFunctionTargets","jobTargets","initialJobFunctionTargets","viewModelToBulkModelForJobFunctionTargets","_ref18","jobTargetBidAdjustments","addedJobTargets","_ref19","isJobTargetBidAdjustmentUpdated","removedJobTargets","addedJobCriterion","removedJobCriterion","magicDate","loadDisclaimerAssociations","AdExtensionAssociations","$count","$top","$expand","adExtensionType","startdate","enddate","cache","Date","now","imageExtensionsRepository","Repository","schema","globalLegacySchema","afterChangeComitted","summaryDataContextManager","updateContext","association","createRequestFactory","dropdownValue","modelToViewModelForBidAdjustment","disableDecrease","bidAdjustmentDropdown","bidAdjustmentInput","parseBidAdjustmentValue","isNumber","parseDecimal","viewModelToModelForBidAdjustment","modelToViewModelForMultiMediaBidAdjustment","campaignLevelValue","adgroupLevelData","multimediaAds","currentLevelData","ScopeLevel","parentLevelData","useParentLevel","viewModelToModelForMultiMediaAdBidAdjustment","viewmodel","_viewmodel$multimedia","MultimediaAdBidAdjustment","getDsaDefaultWebsiteLanguage","permissions","targetingSourceOptions","SystemIndex","AdvertiserSuppliedUrls","All","targetingSourceOptionStrings","defaultTargetingSource","dsaDefaultTextEnabled","dsaTargetOptions","Category","CustomLabel","getDefaultDsaSettingsForCampaign","Specific","selectedWebsiteLanguage","selectedTargetingSource","dynamicTextEnabled","viewModelToModelForPredictiveMatching","predictiveTargetingSetting","findWhere","CampaignSettings","autoTargetingDefault","PredictiveTargetingEnabled","autoTargetingEnabled","bidStratetyTypeValue","targetCpa","targetRoas","maximizeConversions","includes","BiddingScheme","isPredictiveMatchingChecked","AutoTargetingEnabled","brandProtections","deletedBrandListIds","BrandListsAssociations","brandListId","SharedEntityId","EntityId","addedBrandListIds","dynamic","PredictiveMatching","editSpecialProperty","whitelistedSchemaPropertyKeysForModelEdit","whitelistedSchemaPropertyKeys","whitelistedSchemaPropertyKeysEdit","bulkModelToViewModelForCampaign","originalCampaignModel","bundleCountries","isEdit","locationTargetsModel","locations","intent","intentId","intentOption","getLocationIntent","LocationIntentCriterion","IntentOption","targetOption","locationTargetsOptionKeys","specific","everywhere","shouldSelectBundleOption","bundleOrDefaultMarket","locationTargets","currentLevelSettings","initLocations","currentLocations","bidMode","bulkModelToViewModelForLocationTargets","_ref$errors","conversionGoalsBulkModel","CampaignConversionGoalAssociations","errorKey","originalGoalSelection","chain","goal","pluck","Action","GoalId","bulkModelToViewModelForConversionGoals","activeAssociations","selectedDisclaimer","originalSelectedDisclaimer","disclaimer","adExtensionAssociations","bulkModelToViewModelForDisclaimer","AutomatedCallToActionOptOut","dayTimeRanges","BidStrategyName","Portofolio","hasDsaSettings","DomainName","viewModel","LanguageCode","Source","DynamicDescriptionEnabled","disableDsaSettings","bulkModelToViewModelForDsaSettings","modelToViewModelForCampaign","locationCriterionsModel","disclaimerAssociations","scheduleCriterionModel","targetCriterionModel","pageFeeds","_ref4","_parseLocationTargets","parseLocationTargets","modelToViewModelForLocationTargets","adExtension","AdExtension","modelToViewModelForDisclaimer","disclaimerSetting","DisclaimerAdsEnabled","rsaSetting","AutoGeneratedAssetsEnabled","hasCampaignLevelGoals","CampaignConversionGoal","Goals","Scopes","CAMPAIGN","ACCOUNT","modelToViewModelForConversionGoals","MultiMediaAdBidAdjustment","campaignSettings","callToActionSetting","setting","modelToViewModelForAutomatedCallToActionOptOut","dsaSettings","Language","modelToViewModelForDsaSettings","campaignResource","ResourceIdentifier","createOrUpdateCampaign","bulkUpsertCampaignSettingsEntityErrorMap","_bulkUpsertCampaignSe","BrandListAssociation","saveCampaign","campaign","bundleLocationCriterions","IsDomesticSimplifiedChineseEnabled","MMAForCN","Budget","BudgetId","viewModelToModelForCampaign","convertLocationStateToLocationSchemaCampaign","bidStrategy","option","viewModelToBulkModelForLocationTargets","conversionGoalsAssociations","adExtensionAssociation","omit","viewModelToBulkModelForDisclaimer","scheduleModel","deviceModel","_ref4$permissions","join","PageFeedIds","feed","viewModelToBulkModelForDsaSettings","genderModel","ageModel","_ref10","addedAge","age","viewModelToBulkModelForAgeTargets","companyNameModel","_ref12","addedCompanyNameTargets","removedCompanyNameTargets","addedCompanyNameCriterion","_ref13","_objectWithoutProperties","_excluded","removedCompanyNameCriterion","viewModelToBulkModelForCompanyNameTargets","industryModel","jobFunctionModel","modelToSave","loadCampaign","readCampaign","bulkModelToViewModelForAdGroupBudget","adGroupModel","StartDate","EndDate","readAdGroup","loadAdGroup","loadAdGroupForBudget","modelToViewModelForAdGroupBudget","loadKeywords","Keywords","startDate","endDate","bulkModelToViewModelForBudget","saveBudget","adGroup","viewModelToModelForBudget","adgorupModel","without","viewModelToModelForAdGroupBudget","adGroupResource","Keyword","getKeyFromKeyword","keyword","MatchType","Text","handleBulkApiError","clientIdToKeywordMap","filteredKeywords","isUndefined","globalLegacyI18n","s$TextAd","getNameAndLengthForProperty","maxLength","clientId","errorFromAd","errorMessage","indexOf","pairs","replace","isHtmlMessage","DangerousHtmlMessage","saveKeyword","_asyncToGenerator","_regeneratorRuntime","mark","_callee","keywords","errorList","wrap","_context","prev","next","sent","abrupt","t0","isArray","errorsOfThisKeyword","getODataErrors","stop","_x","_x2","apply","readAdGroupCriterions","AdGroupCriterions","readAdGroupLocationCriterions","modelToViewModelForAdgroupLocationTargets","parentLevelSettings","campaignLocationModel","targetOptions","_parseLocationTargets2","campaignLocations","campaignIntentId","campaignIntentOption","campaignTargetOption","bundle","readAdGroupScheduleCriterions","readAdGroupTargetCriterion","AdGroupAgeName","updateAdGroupAgeTargets","targetsModel","ageRange","viewModelToBulkModelForAdGroupIndustryTargets","currentSelectedIndustryLevel","viewModelToBulkModelForAdGroupJobFunctionTargets","currentSelectedJobFunctionLevel","DSA_TARGET_TYPES","DSA_TARGET_SUB_TYPES","DSA_TARGET_OPERAND_TYPES","DSA_TARGET_OPERAND_TYPE_STRINGS","DSA_TARGET_OPERATOR_TYPES","DSA_SPECIFIC_TARGET_OPERATOR_MAP","viewModelToBulkModelForDsaTarget","dsaViewModel","campaignName","adGroupName","dsaTargets","reduce","acc","items","exactUrls","rules","savedItems","selectedItems","selected","itemsToSave","item","ItemSaved","Bid","newItem","conditions","keyOfItemsToDelete","difference","keys","res","AdGroupName","CampaignName","defaultBid","WebPage","Parameter","Conditions","condition","con","itemStatus","itemId","convertItemsToDsaTarget","dsaTargetsMapper","dsaType","viewConditions","dsaSubtype","_conditions$","Operand","Operator","defaultDsaTarget","checkArgumentOperandFormat","argumentOperand","isString","hasComma","hasDoubleQuote","resultArgumentOperand","replaceAll","generateKeyAndFormateDsaTarget","conditionsWithoutDisplayValue","formattedCondition","ArgumentOperand","isValid","whitelistedSchemaPropertyKeysForCampaignModel","whitelistedSchemaPropertyKeysForAdGroupModel","modelToViewModelForAdGroupSetting","campaignScheduleCriterionModel","adGroupScheduleCriterionModel","campaignTargetCriterionModel","adGroupTargetCriterionModel","adGroupLocationTargets","campaignLocationTargets","currentSelectedDeviceLevel","currentSelectedGenderLevel","currentSelectedAgeLevel","currentSelectedCompanyNameLevel","_parseLocationTargets3","_parseLocationTargets4","modelToViewModelForAdGroupLocationTargets","_targetItem$Criterion","isExcluded","modelToViewModelForAdGroupAgeTargets","currentLevel","modelToViewModelForAdGroupCompanyNameTargets","modelToViewModelForAdGroupIndustryTargets","modelToViewModelForAdGroupJobFunctionTargets","AdRotation","bulkModelToViewModelForAdGroupSetting","update","originaladGroupModel","newTarget","t","bulkModelToViewModelForAdGroupGenderTargets","bulkModelToViewModelForAdGroupAgeTargets","bulkModelToViewModelForAdGroupLocationTargets","DsaTargets","dsaBulkModel","bulkItem","ClientId","_dsaTargetsMapper","isBidValid","isConditionValid","bulkModelToViewModelForDsaTarget","loadDsaTargets","readDsaTargets","Amount","_dsaTargetsMapper2","bulkModelToViewModelForDsaTargetUnderDsaEntity","_bulkUpsertEntityErro","saveAdGroup","viewModelToModelForAdGroupSetting","every","schedule","viewModelToBulkModelForAdGroupSchedule","AdGroupId","viewModelToBulkModelForAdGroupDeviceTargets","addedGenders","viewModelToBulkModelForAdGroupGenderTargets","addedAges","removedAges","viewModelToBulkModelForAdGroupAgeTargets","viewModelToBulkModelForAdGroupLocationTargets","viewModelToBulkModelForAdGroupCompanyNameTargets","dsaTargetsModel","allowEditDynamicAdTarget","odataOptions","path","loadCategoryList","domainName","languageCode","category","skip","jsdataCampaign","CategoryTarget","findAll","$orderby","$skip","CategoryName","$contains","cacheResponse","loadAssociatedPageFeeds","FeedAssociations","feedAssociation","FeedId","text","FeedName","locationTargeting","left","paddingLeft","padding","updateTargetOption","languages","rawMarket","_ref$isInit","isInit","showEverywhereOption","bundleFound","languageBundle","isBundledCountriesFound","info","shouldSwitchToBundle","shouldSwitchToEverywhere","notificationApi","showInfo","updateLocationTargetsForCampaign","_ref2$isInit","Languages","updatedLocations","LocationTargetSettingWithCustomValidation","skipValidation","allowBidAdjustment","refreshLocationTargetsTimes","restProps","newData","isLocationValid","newLocations","LocationTargetSetting","setData","showBulkLocations","BulkLocationsTargeting","SearchCampaignCreationRevamp","ValidatedLocationTargetSetting","getLocationDetailsString","isAdGroupLevel","bidStrategyType","hideBid","getLanguageBundleString","getLocationsString","getLocationTargetTitleDetails","location","getDisclaimerSettingsStyles","_ref$iconFontFamily","iconFontFamily","flexDirection","marginTop","marginBottom","maxWidth","float","height","overflow","textOverflow","whiteSpace","entitySelectorStyle","paddingRight","getDisclaimerPanelStyles","_ref2$iconFontFamily","alertStyle","lineHeight","margin","textAlign","backgroundColor","paddingTop","border","borderRadius","neutralSecondary","minWidth","cursor","background","resize","gridTemplateColumns","components","theme","disclaimerContainer","outline","Disclaimer","_validationProps$data","disclaimerAdsEnabled","legacyI18n","buildLegacyI18n","ValidationStringMap","DisclaimerStringMap","PermissionsContext","logData","setLogData","disclaimerRepositoryRef","useRef","DisclaimerRepository","DisclaimerAdExtension","skipExtensionCache","disclaimerRef","onDataChange","current","getValues","validateAndWarn","activeAssociation","convert2ViewModel","newLogData","Enabled","DisclaimerId","convert2LogData","AdsCampaignDisclaimers","repository","AllowDisclaimerEnabled","usePanel","disableTitle","isForNew","enableRandomPage","ValidatedDisclaimer","getAutoGeneratedAssetsDetails","autoGeneratedAssetsEnabled","AutoGeneratedAssetsValidationAdapter","convertEventToValue","event","autoGeneratedAssets","AutoGeneratedAssets","Checkbox","ReactTemplate","b","template","LearnMoreLink","linkText","ariaLabel","ValidatedAutoGeneratedAssets","subTextOptions","ConversionGoalsWithCustomValidation","_ref3$conversionGoals","ConversionGoalSelectorContainer","ConversionGoalKeyToStringMapping","$dataRange","useP$DaterangeDefault","changedData","GoalScopeSelection","GoalSelection","campaignConversionGoal","ConversionGoalSelector","isSelectorEnabled","pageSize","isMultiMode","isHideSaveBar","showTrackingStatusIcon","ValidatedConversionGoals","predictiveMatchingSection","alignItems","neutralTertiaryAlt","messageBar","themeLighterAlt","getPredictiveMatchingDetails","props","onValidate","hideDescription","MessageBar","HelpPopup","v","HelpLink","UrlInputFluentWithNoProtocol","withNoProtocol","UrlInputFluentV2WithNoProtocol","withNoProtocolV2","ValidatedNoProtocolWebsiteContent","placeholder","ValidatedNoProtocolWebsite","entityIsCampaign","entityIs","feedAssociationsProp","andComp","propertyIs","ServerValidatedPageFeedSelectorSection","withControlErrorHandling","withContainerErrors","PageFeedSelectorSection","Adapter","StandardControlAdapter","FocusableActuator","FormErrorBeaconAdapter","domainProp","withUnvalidatedControlErrors","WebsiteControl","dynamicSetting","gap","ValidatedDynamicWebsite","_Fragment","weight","debounce","DynamicWebsiteLanguage","websiteLanguages","DSAEnableInFrenchGerman","IsEnabledForDSAInCHandNLandITandESandSE","IsSimplifiedChineseLanguageEnabledInMultipleLanguage","getDSAWebsiteLanguages","onWebsiteLanguageOptionSelect","_evt","newSelectedWebsiteLanguage","selectedOptions","Dropdown","campaignLanguageStrings","onOptionSelect","websiteLanguage","Option","ValidatedDynamicWebsiteLanguage","ValidatedDynamicTargetingSource","_validationProps$page","scope","ScopeContext","advertiserCustomerId","ServerContext","CurrentAccount","AdvertiserCustomerID","verifyTargetingSource","_ref7$newSelectedTarg","newSelectedTargetingSource","_ref7$newPageFeeds","newPageFeeds","onTargetingSourceOptionSelect","onSelectedPageFeedsChange","selectedPageFeeds","RadioGroup","targetingSourceOption","Radio","values","customizedDescription","customizedSearchPlaceholder","loadAssociatedPageFeedsFactory","ValidatedDynamicSearchText","isDynamicDescriptionPhase1Enabled","onDynamicTextChange","ValidatedDynamicSearchAdSetting","isMessageBarVisible","DynamicPermissions","Permissions","MessageBarBody","MessageBarTitle","adGroupBasicSetting","AdGroupTypeSelector","allowAdGroupTypeChange","currentAdGroupType","onSwitchAdGroupType","adGroupTypes","adGroupTypeStrings","newAdGroupType","_React$useState","React","_React$useState2","isDialogOpen","setIsDialogOpen","restoreFocusTargetAttribute","useRestoreFocusTarget","optionValue","onDialogSwitchClick","adGroupTypeSelectorContainer","Dialog","open","onOpenChange","DialogSurface","DialogBody","DialogTitle","DialogContent","dangerouslySetInnerHTML","__html","DialogActions","Button","appearance","onClick","DialogTrigger","disableButtonEnhancement","ValidatedStandardAdGroup","isMixedMode","isEditingScenario","RemainingCharsValidatedTextField","field","ValidatedDynamicAdGroup","showDsaSettings","disableEditDsaSettings","useCurrencyCode","CurrencyCode","useDefaultBid","getDefaultBidDescriptionStyles","root","DefaultBidDescription","currency","amount","getActionBarStyles","bottom","borderTop","ActionBar","onApply","onCancel","tokens","childrenGap","Item","CustomListItem","onItemChange","onItemRemove","onRenderItem","renderedItem","ListItem","Tooltip","relationship","style","icon","DeleteRegular","EditableFluentList","onRenderHeader","onRenderFooter","addButtonText","onAddButtonClick","isFunction","List","navigationMode","AddRegular","getCategoryTargetStyles","listHeader","getButtonInItemStyles","button","getCategorySelectorStyles","pager","footer","blocker","getCategorySelectorHeaderStyles","justifyContent","coverage","alignContent","getCategorySelectorItemStyles","link","ButtonInList","SortIcon","direction","ArrowSortDownRegular","ArrowSortUpRegular","ListHeader","parentCategory","onChangeScope","onSortChange","onBackClick","stopPropagation","slashCount","match","endsWith","firstSlashIndex","getParentCategory","onCategorySort","onCoverageSort","backId","useId","nameId","coverageId","ArrowLeftRegular","Coverage","names","RegExp","split","isParent","linkId","n","Link","formatPercentToFixed","digits","InputSlot","Component","passedProps","originKeyDown","onKeyDown","inputEle","$","parent","onInputKeyDown","currentActiveEle","nextActiveElement","activeElement","is","buttons","parentsUntil","nextIndex","eq","getNextActiveElement","removeAttr","attr","preventDefault","activeID","trigger","convertOrderby","dir","CategorySelector","preloadedCategories","onCategoryChange","disabledCategories","isLoading","setLoading","defaultCategories","setDefaultCategories","_useState5","_useState6","setParentCategory","_useState7","_useState8","categories","setCategories","_useState9","_useState10","setOrderby","_useState11","_useState12","pageNumber","setPageNumber","_useState13","totalCount","_useState14","pageTotal","setPageTotal","onPageChange","total","availablePageSizes","disablePageSizeControl","updateCategories","domain","sort","newCategories","e2eTestEnvironment","debouncedUpdateCategories","onInputChange","optionText","newOrderby","Combobox","inlinePopup","input","UiBlocker","blocking","loadingText","role","OptionGroup","Pagination","ValidatedCategorySelector","getCategoryTargetItemStyles","customLabelEditRowContainer","editRow","bidEdit","ValidatedTextInput","CategoryTargetItem","alwaysShowError","currencyCode","onValidateArgumentOperand","_generateKeyAndFormat","newConditions","onValidateBid","WebpageCondition","DsaTarget","itemKeys","setItemKeys","setAlwaysShowError","bufferItems","newKeys","verifyData","onListItemChange","newBufferItems","slice","onListItemRemove","splice","onRemoveAll","newItems","getPanelStyles","_ref$palette","overflowX","overflowY","flexContainer","withSidePanel","isOpen","onClose","Panel","panelClassName","ThemeProvider","ComponentSettings","core","ThemeFluent","FluentProvider","webLightTheme","CategoryTargetPanel","getSpecificTargetStyles","tabRoot","divider","tabError","getExactUrlStyles","listFooter","exactUrlEditRowContainer","CustomEditRow","applyFailCount","isDuplicate","setIsDuplicate","initialFailCount","onValidateUrl","ExactUrlTarget","removedItemKey","getRuleStyles","ruleEditRowContainer","getCategoryRuleStyles","selector","RULE_TYPES","CategoryRule","SingleRule","onChangeRule","onRemoveRule","selectedRuleType","ruleType","setOpen","isRuleEmpty","setIsRuleEmpty","verifyConditions","onAddRule","newFormattedConditions","_generateKeyAndFormat2","RuleSummary","summary","cur","getCurrencySymbol","component","AccordionCard","FormCardDefaultHeader","FormCardBody","RuleTarget","TABLIST","SpecificTargetPanel","exactUrlItemKeys","setExactUrlItemKeys","ruleItemKeys","setRuleItemKeys","selectedTab","setSelectedTab","setApplyFailCount","showExactUrlsTabError","setShowExactUrlsTabError","showRulesTabError","setShowRulesTabError","rest","_excluded2","onExactUrlDataChange","onRuleDataChange","isExactUrlsValid","Object","isRulesValid","onTabSelect","_e","tabData","Tab","newExactItems","newRuleItems","TabList","selectedValue","getCustomLabelStyles","CustomLabelTargetPanel","dynamicAdTargetContainer","dynamicAdTargetOption","selectedAdTargetTags","flexWrap","gridGap","targetAllBid","targetOptionTitle","helpLink","AdTargetsPillItem","maxNumberWithoutCollapse","_ref$selectedOptions","generateItemText","onRemoveItem","selectedOptionsWithErrors","selectedOptionsWithoutErrors","sortedSelectedOptions","isCollapsed","setIsCollapsed","itemText","SelectedItem","itemIndex","uniq","onDelete","DynamicAdTargetOption","selectedTargets","showAddButton","selectedTarget","TargetAllBidInput","ValidatedDynamicAdTarget","websiteWithoutProtocol","categoryTargets","allTargets","specificTargets","customLabelTargets","categoryTitle","allTitle","specificTitle","customLabelTitle","isCategoryTargetPanelOpen","setIsCategoryTargetPanelOpen","isSpecificTargetPanelOpen","setIsSpecificTargetPanelOpen","isCustomLabelTargetPanelOpen","setIsCustomLabelTargetPanelOpen","validateDynamicTargets","dynamicTargets","newCategoryTargets","newAllTargets","newSpecificTargets","newCustomLabelTargets","some","subValue","onOptionChange","newDsaTargets","onDsaTargetsChange","newDsaSubTargets","onDsaTargetsRemove","onSubDsaTargetsRemove","subOption","setPreloadedCategories","renderCycleRef","loadCategory","debouncedLoadCategory","onCategoryUpdate","ValidationGroup","campaignDynamicSetting","ValidatedCampaignDynamicSearchAdSetting","onDynamicSearchAdsEnabledChange","getBrandListsTitleDetails","selectedBrandLists","unused","brandListsPicker","BrandLists","onBrandListsChange","brandListsSection","BrandListsPicker","isConfirmDialogOn","descriptionTextTemplate","noInitialDataText","ValidatedBrandLists","withUseCampaignSettings","HOC","onLevelChange","ev","displayName","getCollapsiblePanelStyles","borderBottom","themePrimary","themeDarker","textDecoration","transform","collapsiblePanel","campaignSettingsStep","stepTitle","stepDescription","StepHeader","description","campaignNameProp","campaignLanguagesProp","campaignConversionProp","campaignLocationCriterions","anyComp","autoGenerateAssetsEnabledProp","disclaimerProp","ServerValidatedLanguageTarget","ServerValidatedLocationTargetSetting","ServerValidatedAutoGeneratedAssets","ServerValidatedDisclaimer","ServerValidatedConversionGoals","CampaignSettingsStep","_ref3$serverErrors","_ref3$systemErrors","_scope$values","locale","CurrentLocale","validateSpecialCharacters","PerformanceMaxCampaignsFinalURLValidation","PMaxAndDSAFinalURLValidation","showAllValidationErrors","useFormService","state","context","saveFailed","_useCollapseState","useCollapseState","_useCollapseState2","allCampaignSettingsSections","campaignSettingsExpandedSections","setCampaignSettingsExpandedSections","basicSettingsExpand","collapseExpander","setActiveKeys","newLanguages","bundleCountriesAndLocationCriterions","basicSettingsSection","basicSettings","ValidatedFixedPanel","TextTitle","titleKey","topicKey","attentionBeaconProps","getExtraProps","getPanelErrorProps","formErrorProps","ValidatedPanel","noOverflowHidden","LocationImg","actuationProps","expand","expandKey","DisplayBiddingStrategyType","lang","LanguageImg","validator","Collapse","allPanelItems","checkItems","skipItemsTypeCheck","activeKeys","autoGenerateSection","autoGenerateSettings","AutoAssetsImg","isRecommended","_useCollapseState3","_useCollapseState4","allAdvancedSettingsSections","advancedSettingsExpandedSections","setAdvancedSettingsExpandedSections","allAdvancedSettingsExpand","advancedSettingsSectionExpanded","setAdvancedSettingsSectionExpanded","onAdvancedSettingsSectionToggle","expanded","advancedSettingsSection","advancedSettings","getConversionGoalTitleDetails","ConversionGoalsImg","initialValue","getDisclaimerTitleDetails","DisclaimerImg","advancedCampaignSection","ValidatedBootstrapPanel","onToggle","BootstrapPanel","Heading","Title","toggle","Body","onValidateWebsite","websiteSection","ActuationGroup","isActive","AttentionBeaconGroup","FormErrorGroup","UnmappedFormErrors","ErrorMessages","messages","formContainer","getTargetedLocationNameTypeCombo","mapToLocationNameTypeCombo","useSetKeywordSuggestionsData","send","onRequest","WIZARD_EVENTS","UPDATE_WIZARD_DATA","keywordSuggestions","onSuccess","rawData","KeywordPlannerLiteRefactorPhase1","RequestId","traceInfo","requestId","group","Suggestions","onFailed","handleKeywordSuggestionsWhenChanges","currentUrl","currentLocationSettings","currentLanguages","previousUrl","previousLocation","previousLanguages","recommendateRequest","getSearchIdea","log","currentLocation","Url","Location","TargetOption","TargetedLocationInfo","isUrlEqual","previousLocationNameTypeCombo","currentLocationNameTypeCombo","isLocationEqual","locationsNeedToAdd","locationsNeedToRemove","locationsAdded","locationsLeftedOver","isLanguagesEqual","targetedLocationInfo","getTargetedLocationInfo","getSupportedLanguages","getSearchIdeaModel","isLanguageDecoupling","channel","CHANNEL_TYPES","CAMPAIGN_CREATION","ErrorStatus","defaultLocationTargets","peopleInLocation","peopleSearchingForLocation","getDefaultBudget","defaultBudget","getBudgetRange","Daily","Default","USDefaultBudget","IsDefaultBudgetExperimentationEnabled","defaultConversionGoals","defaultDisclaimer","getDefaultCampaignSettings","defaultAdGroup","AdGroupType","defaultWebsites","useCampaignSettingsRepository","ScenarioContext","defaultName","generateNameSuggestionSuffix","defaultLanguage","supportedLanguages","globalizationModelSetup","culture","LANGUAGES","getDefaultLanguage","_useWizardService","useWizardService","_state$context$wizard","wizardData","savedWebsites","_useSetKeywordSuggest","useKeywordPlannerService","defaultAdgroupSettings","load","loadPromises","rawCampaign","useKeywordSuggestion","save","campaignResult","adGroupResult","_ref5$serverErrors","_ref5$systemErrors","val","maxKeywords","isKeywordsValid","parsedKeywords","test","truncatedKeyword","limitErrorMessage","parseKeywords","keywordsTextarealVal","_ref2$isNegativeKeywo","isNegativeKeyword","newKeywords","_ref$isNegativeKeywor","KeywordsInput","peekKeywords","uniqKeywords","toLowerCase","validResult","parseKeyword","matchType","getkeywordStepStyles","keywordsStep","SectionShimmer","Shimmer","getkeywordSuggestionStyles","keywordSuggestionContainer","getKeywordSuggestionFooterButtonStyle","rootHovered","white","rootDisabled","neutralLighter","neutralTertiary","textContainer","iconDisabled","iconHovered","getAddAllButtonStyle","neutralPrimary","flexContainerHovered","getExploreKeywordsButtonStyle","isSuggestedItemsEmpty","right","KeywordSuggestion","useTheme","renderSuggestedItem","onAddSuggestedItem","renderMoreSuggestionsInlineButton","onAddAllSuggestedItems","onMoreSuggestionsButtonClick","disableAllSuggestions","disabledSuggestionTooltip","useStyleFluent2","suggestedItems","showSuggestionsSectionShimmer","perfMarker","_useCircularBufferVie","collection","page","setPage","currentIndex","setCurrentIndex","newPage","SuggestedKeywordsSize","useCircularBufferView","_useCircularBufferVie2","availableSuggestedItems","canMoveNext","moveNext","isAvailableSuggestedItemsEmpty","suggestedItemsFooter","SuggestedItem","onAdd","useCustomStyle","getCustomStyle","DefaultButton","styles","iconProps","iconName","SparkleImgSVGIcon","allowDisabledFocus","emptySuggestedItemsView","SparkleImgIcon","sectionContent","SuggestedItems","noSuggestionsDescription","suggestedSectionDescription","showMoreSuggestionsInlineButton","onMoreSuggestionsInlineButtonClick","willInit","done","getKeywordInputStyles","keywordInputContainer","filed","labelContainer","textArea","messageBarStyle","innerText","suggestedKeywordItemsToKeywordsInput","suggestedKeywordItems","suggestedKeywords","suggestedKeywordItem","withNewAddedKeywords","keywordsInput","newAddedKeywords","filterExistingKeywords","parsedKeywordsObj","keywordText","getKeywordsAdded","suggestedItemsDict","suggestedItem","keywordsProp","ValidatedKeywordInput","onKeywordInputChanged","validationResult","showMessageBar","custom","messageBarIconProps","Field","Textarea","KeywordsStep","wizardPerfMarker","_ref2$serverErrors","_ref2$systemErrors","keywordSuggestionPerfMarker","createChild","autoEnd","_useContext","locationCriterions","keywordSuggestionsAdded","setIsOpen","hideKeywordSuggestions","isAllLocationsUnsupported","filteredKeywordSuggestions","onAddKeywords","rawKeywordsInput","keywordsAdded","SuggestedKeyword","SuggestedKeywords","keywordsSection","KeywordImg","KeywordPlannerPanel","selectedData","SelectedKeywords","filteredSelectedData","savedKeywords","updateSavedKeywords","successfulKeywords","newlyCreatedKeywords","numberOfCreatedKeywords","keywordsImportedFromPlanner","suggestedKeyword","keywordsCreated","suggestionsUsed","detailedSuggestionsUsed","groupBy","mapObject","reqGroup","useKeywordsRepository","campaignIdFromScope","adGroupIdFromScope","campaignIdFromWizardData","adGroupIdFromWizardData","savedKeywordsInput","savedKeywordKeys","_parseKeywords2","currentKeywordTexts","keywordTextsNeedAdd","keywordTextsNeedDelete","keywordObjsNeedAdd","keywordObjsNeedDelete","keywordObj","clearKeywordSuggestionsAdded","_ref4$serverErrors","_ref4$systemErrors","addTextStep","SwitchAdTypeDialog","showDialog","onConfirm","hidden","modalProps","closeButtonAriaLabel","onDismiss","dialogContentProps","showCloseButton","DialogType","normal","DialogFooter","PrimaryButton","autoFocus","AdTypes","AdTypeStrings","AdTypePluralStrings","AdTypeMaxCount","StandardAdTypes","DynamicAdTypes","AdTypeSelector","adTypes","enableAdTypeSelector","selectedAdType","onAdTypeChanged","confirmWhenSwitchAdType","showConfirmDialog","setShowConfirmDialog","newAdType","setNewAdType","_event","oldAdType","AdFooter","enableCancel","enableCreateAnother","stepId","getCurrentStepId","onSaveAndCreateAnother","SAVE_AND_GOTO","NAVIGATE_TO","getRSAStyles","rsa","adEditorOverrideStyle","DependencyResolver","set","AudienceAssociationView","RsaEditor","onAdChanged","onAdExtensionsChanged","apiErrors","editorRef","editMode","mergeI18n","adStrengthRepository","AdStrengthRepository","edm","jsdata","removed","updated","cachedImageExtensionChanges","setCachedImageExtensionChanges","onImageExtensionChanged","changes","RecommendationContext","_useContext2$0$postAs","postAssetEventLog","noop","assetLibraryEventHandler","useAssetLibraryEventHandler","previewImageCallback","setPreviewImageCallback","savePreviewImageCallback","func","logAppliedSuggestionsFunc","setLogAppliedSuggestionsFunc","saveLogAppliedSuggestionsFunc","onChanged","incomplete","fetchDisclaimerInfo","IsDisclaimerForRSAEnabled","customerId","accountId","hasDisclaimer","disclaimerData","triggerTestUurl","fn","originalView","isInline","uurlLevels","Ad","entityId","testUurl","apiInLog","setActivityLogger","logger","instrumentation","create","start","logActivity","apiName","api","renderImageExtension","extraInfo","imagePathFromConfig","maxImageExtensionsPerAdGroup","MaxSelectedImagesPerAdGroupOrCampaignForV2","ImageExtensionsPane","imageExtRepository","adContext","dataModelUtil","imagePath","onPreviewImageChanged","adCreatorScenario","instrumentationScenarios","RSA","dateFormat","timeZone","isAADUser","useImperativeHandle","logAppliedSuggestions","adData","_adData$Headlines","Headlines","_adData$Descriptions","Descriptions","currentAdExtension","suggestedAdExtensions","ext","source","headlines","Asset","descriptions","ResponsiveSearchAdEditor","onFetchAdStrengthV2","fetchAdStrengthV2","onFetchDisclaimerInfo","showActionBar","showInitialErrors","token","Token","showUurlTestTool","showFinalUrlSuffix","showAdCustomizers","showDynamicTextExtention","jsDataCampaign","isForVnext","injectSetPreviewImage","isNewTextAssetsButtonStyle","getMMAStyles","mma","getCommonPreviewContainerStyles","getCrudAdImagePreviewStyles","getMMAPreviewStyles","adCustomizersStyle","MmaEditor","internalEditorRef","CampaignType","campaignType","FinalUrls","_adData$LongHeadlines","LongHeadlines","ImageList","Images","logAppliedSuggestion","assetData","isEditing","Provider","CopilotSearchMMAEditor","genericImage","GenericImage","hasWebsiteImageOptedInObservable","newI18n","externalErrors","showUnmappedFormErrors","getDSAStyles","dsa","DsaEditor","DynamicSearchAdEditor","Editors","errorFilter","errorMapper","AdEditorInternal","enableAdsManagment","_ref$serverErrors","_ref$systemErrors","_useFormService$state","formStateValue","ads","initialAdType","loaded","entityScope","userId","uid","setAdType","initialAd","setInitialAd","convertFunc","viewModelToModelInResponseForAd","isEqual","adExtensions","renderEditor","Editor","FORM_STATES","SAVING_SUCCEEDED","loadedAdType","mapper","AdEditor","withPermissions","withServerContext","withScope","useAdsRepository","_ref$enableAdsManagme","_ref$adTypes","adFilter","adTypesFilter","adToSave","adToDelete","deletedAd","extensions","bulkActions","saveAdFunc","saveAd","imageExtensionChanges","defaultParams","createImageExtensionsPromise","extension","newExtensions","newExtensionIds","deletePromise","destroyAll","in","updatePromise","updateAll","pageName","showWarning","finally","saveImageExtensions","allSettled","results","_results","_results$","saveStatus","savedValue","rejectedValue","reason","_results$2","deleteStatus","deletedData","savedResult","adToUpdate","savedAd","ResponsiveSearchAdPreview","resultData","convertedFinalUrl","headlineList","PinnedField","descriptionList","convertedTitle","getTitlePreview","convertedText","getDescPreview","convertedDisplayUrl","getExpandedTextAdDisplayUrl","DisplayUrl","Path1","Path2","block","href","nowrap","ResponsiveAdPreview","LandscapeImageMediaUrl","callToAction","originalActionTextMapper","CallToActionLanguage","CallToAction","src","align","alt","Headline","DynamicSearchAdPreview","combinedUrl","compact","combineDescriptions","TextPart2","AdPreviewComponents","AdListItem","enableCopy","onCopyAd","onEditAd","onDeleteAd","AdPreviewComponent","CopyRegular","EditRegular","AdList","maxCount","CreateAdButton","onCreateAd","Menu","MenuTrigger","MenuButton","MenuPopover","MenuList","MenuItem","adsManager","boxShadow","minHeight","zIndex","backgroundImage","objectFit","objectPosition","wordWrap","AdsManager","containerRef","_data$ads","availableAdTypes","filteredAds","adsRepository","anotherAdType","updatedAds","withUiBlock","adList","AddTextStepInternal","stepPerfMarker","showAdsManagement","AddTextStep","getExtensionsStepStyles","stepContainer","ExtensionsStepInternal","adExtensionsAssociations","adExtensionsAssociationsFactory","adExtensionsDynamicFeatures","useResponsiveStyles","onUpdateExtensionsAssociations","extensionType","associations","extensionAssociations","getAdExtensionsSections","extensionTypes","extensionsAssociationsFactory","memo","AssociationPanel","sectionKey","panel","extensionsAssociations","panels","sectionsInfo","allSections","_useMemo","getObjectiveExtensions","campaignObjective","_useMemo$suggestedObj","suggestedObjectiveExtensions","_useMemo$otherObjecti","otherObjectiveExtensions","suggestedAdExtensionsSections","otherAdExtensionsSections","allEnhanceYourAdsSections","enhanceYourAdsExpandedSections","setEnhanceYourAdsExpandedSections","suggestedExtensionsSection","allMoreAssetsSections","moreAssetsExpandedSections","setMoreAssetsExpandedSections","moreExtensionsSection","defaultExpanded","ExtensionsStep","extensionSchemaProcessors","addressSchema","Address","useExtensionsRepository","availableExtensionTypes","getAvailableExtensions","extensionEntityMapping","_ref6$adExtensionType","adExtensionTypes","_ref6$top","DateRange","associationType","loadExtensionsAssociations","entityType","pop","extensionNameMapping","budgetAndBidSection","toggleButtonStyle","linkStyle","containerBudgetStyle","sharedBudgetGridWrapper","selectElementStyle","statusStyle","visibility","entityIsAdGroup","ServerValidatedLegacyBidStrategy","ValidatedLegacyBidStrategy","ServerValidatedDefaultBid","ValidatedDefaultBid","ServerValidatedLegacyAdSchedule","ValidatedLegacyAdSchedule","ServerValidatedLegacyDateSetting","ValidatedDateSetting","orComp","ServerValidatedLegacySharedBudget","ValidatedLegacySharedBudget","ServerValidatedBrandLists","BudgetAndBidsStep","adScheduleView","setAdScheduleView","allBudgetAndBidSections","budgetAndBidExpandedSections","setBudgetAndBidExpandedSections","allAdScheduleSections","adScheduleExpandedSections","setAdScheduleExpandedSections","_useCollapseState5","_useCollapseState6","allPredictiveMatchingSections","predictiveMatchingExpandedSections","setPredictiveMatchingExpandedSections","_useCollapseState7","_useCollapseState8","allAdDistributionSections","adDistributionExpandedSections","setAdDistributionExpandedSections","onAdGroupValidate","onDistributionValidate","Medium","mediumEnum","Search","onCampaignValidate","biddingScheme","bidType","BidStrategyId","bidOption","portfolioBidStrategy","budgetAndBidSections","BudgetImg","getBudgetTitleDetails","BidStrategyImg","getBidStrategyTitleDetails","hideHeader","i18nNewDesign","isCreation","isInitialize","needConfirmManagePortfolio","budgetAmount","bidStrategyName","SearchBid","performanceSection","dateSettingComponent","getDateSettingDetails","TimeZone","isCreate","adScheduleSection","getAdScheduleDetails","AdScheduleUseSearcherTimeZone","showBidAdjustmentColumn","supportedBiddingStrategiesForPredictiveMatching","showPredictiveMatching","PredictiveMatchingPhase2","showBrandLists","PredictiveMatchingImg","BrandListsImg","AdDistributionWithValidationSection","budgetAndBidsStep","defaultCampaignSettings","AdDistribution","useBudgetAndBidSettingsRepository","scheduleCriterion","modelToViewModelForBudget","useSummarySchemaData","timeDisplayType","setTimeDisplayType","preferencesService","_preferencesService","initialize","isTwelveHourDisplay","findByName","Data","loc","SelectionStatus","websiteURL","showLength","budget","adSchedule","adSchedules","useSearcherTimeZone","startEndDates","adDistribution","adCreationPreview","buildSchemaData","SummaryStepInternal","schemaData","onCampaignSettingsHeaderActionClick","focusedStepId","onAdsHeaderActionClick","onKeywordsHeaderActionClick","onBudgetBidHeaderActionClick","separatorStyles","header","actionButton","buildDefaultDataProperty","dynamicProps","hd1","hd2","hd3","hd4","budgetBid","buildSchema","summaryStep","GeneratedUI","customComponentTypes","summaryPageComponentTypes","SummaryStep","useSummaryRepository","isPublishing","flatten","campaignEditSettingsStep","uurlTestToolStyle","listStyle","SEARCH_WIZARD_TYPE_NAME","SEARCH_CAMPAIGN_EDIT_WIZARD","dsaSettingsProp","codeIs","ServerValidatedCampaignDynamicSearchAdSetting","ServerValidatedDevice","ServerValidatedGender","ServerValidatedAge","ServerValidatedCompanyName","ValidatedCompanyPicker","ServerValidatedIndustry","ValidatedIndustryPicker","ServerValidatedJobFunction","ValidatedJobFunctionPicker","CampaignEditSettingsStep","wizardConfig","IsConversionAssociationWarningEnabled","ConversionAssociationWarning","IsConversionAssociationWarningP2Enabled","ConversionAssociationWarningP2","IsDSAMixedModeCampaignEnabled","isExperiment","ExperimentId","TrackingUrlTemplate","FinalUrlSuffix","urlOptions","urlOptionsDetails","flipCampaignSettingsExpandAllState","patchData","getMessageType","updatedData","customConfirmMessages","webExclusionsError","err","setExclusionsCallback","exclusionsData","patchedData","exclusions","campaignExclusions","campaignPanel","languagesPanel","budgetPanel","horizontalAlign","allBidAdjustmentSections","bidAdjustmentExpandedSections","setBidAdjustmentExpandedSections","flipBidAdjustmentExpandAllState","expandAllBidAdjustmentSections","allBidAdjustmentExpand","bidAdjustmentSectionExpanded","setBidAdjustmentSectionExpanded","onBidAdjustmentSectionToggle","bidAdjustmentSection","locationPanel","devicePanel","DeviceImg","IsOriginalDeviceTargetingEnabled","genderPanel","GenderImg","AgeImg","CompanyNameImg","showBidAdjustments","IndustryImg","JobFunctionImg","onBidAdjustmentSectionCollapse","flipAdvancedSettingsExpandAllState","expandAllAdvancedSettingsSections","dsaSettingPanel","predictiveMatchingPanel","brandListsPanel","adSchedulePanel","AdScheduleImg","urlOptionPanel","URLOptionsSection","trackingUrlTemplate","finalUrlSuffix","urlCustomParameters","conversionsPanel","disclaimerPanel","websiteExclusionsPanel","WebExclusionsSection","showSiteExclusion","showIPExclusion","exclusionData","multimediaAdsData","multimediaAdPanel","MultimediaAdBidAdjustmentSection","onAdvancedSettingsSectionCollapse","adGroupEditSettingsStep","adgroupLocationCriterions","AdGroupEditSettingsStep","allSettingsSections","settingsExpandedSections","setSettingsExpandedSections","allAdvancedSections","advancedExpandedSections","setAdvancedExpandedSections","flipAdvancedExpandAllState","adgroupExclusions","adGroupPanel","languagePanel","SingleLanguageTargetPanel","adgroupBidStrategy","campaignBidStrategy","disableBid","isAutoBidding","BidImg","formatBidValue","showUserParentLevelToggle","keepInitValueWhenToggle","adGroupCompanyNameTargets","adGroupIndustry","adGroupInitialIndustryTargets","adGroupJobTargets","adGroupInitialJobFunctionTargets","adgroupBiddingScheme","campaignBiddingSchema","disableOptions","adScheduleComponent","campaignDayTimeRanges","DateSettingImg","AdDistributionImg","AdRotationSection","adGroupSettingsStep","entityIsDynamicSearchAdTarget","DynamicAdTarget","AdGroupSettingsStep","standardAdGroup","dynamicAdGroup","allAdGroupSettingsSections","adGroupSettingsExpandedSections","setAdGroupSettingsExpandedSections","wizardState","getFlowFactor","UPDATE_FlOW_FACTORS","onValidateStandardAdGroup","onValidateDynamicAdGroup","standardAdGroupSection","campaignNamePanel","CampaignNameImg","AdGroupImg","dynamicAdGroupSection","DynamicAdTargetImg","defaultDsaTargets","defaultAdGroupSettings","bidAndTargetStep","BidAndTargetStep","allBidAndTargetSections","bidAndTargetExpandedSections","setBidAndTargetExpandedSections","useBidAndTargetRepository","campaignScheduleCriterion","adGroupScheduleCriterion","campaignTargetCriterion","adGroupTargetCriterion","rawAdGroup","_modelToViewModelForA","adGroupToSave","searchCampaignEditStepConfigs","InstrumentationContext","initialCampaign","setInitialCampaign","exclusionRepository","targetCriterion","_ref2$exclusions","_globalizationModelSe","savedExclusions","BudgetBidCampaignImportNotificationActivity","createScenarioAndActivity","scenarioName","activityName","showBudgetBidCampaignNotifications","campaignItemList","oldBudget","newBudget","oldBidStrategy","newBidStrategy","excludedIps","ExcludedIPs","entitySeparator","excludedSites","ExcludedSites","saveExclusionsData","AdvanceSettings","Exclusions","saveExtensions","exclusionsAfterSave","NegativeSitesResult","NegativeIPsResult","EntityErrors","formatInvalidEntities","newCampaign","isNonEditableDSAPropertyError","serverError","machineOptions","initialState","FETCHING","searchAdGroupCreationStepConfigs","defaultStandardName","defaultDynamicName","dsaDefaultWebsiteLanguage","defaultSearchStandard","defaultSearchDynamic","adgroupLocationTargets","loadedAdGroup","hasDSASettingsInCampaignSettings","subAdGroup","saveAdGroupPromiseWithErrorHandling","successCampaign","_ref5$adGroup","partialSuccessAdGroup","paths","errorClientIdMap","obj","getNestedValue","assign","insertErrorsByClientIdAndGenerateKey","_ref7$serverErrors","_ref7$systemErrors","_ref8$serverErrors","_ref8$systemErrors","viewProps","repositoryProps","searchAdGroupEditStepConfigs","_ref2$exclusions2","_ref2$exclusions3","_supportedLanguages","CampaignId","AdvancedSettings","toaster","BackSummaryToast","rootEle","setRootEle","currentStepId","toasterId","_useToastController","useToastController","dispatchToast","dismissToast","handleSaveAndReturn","handleDismiss","backToSummaryToast","Toast","ToastTitle","media","action","DismissRegular","ToastBody","ToastFooter","getWizardData","toastId","timeout","Toaster","mountNode","offset","vertical","FOOTER_DISCLAIMERS","SaveAndPublishButton","isBlocking","matchStepState","STEP_STATES","LOADING","SAVING","onNextClicked","SAVE_AND_EXIT","buttonText","SaveAndExitButton","_useWizardService2","CreationFooter","nextButtonText","nextDisabled","backButtonText","cancelButtonText","hideBackButton","isFirstStep","getIsFirstStep","isLastStep","getIsLastStep","BackButton","NextButton","CancelButton","SingleStepLoggerUnderActivity","writeStepLog","SingleStepLogger","writeLog","ACTIVITY_NAME","_ACTIVITY_NAME","withStepActivity","WrappedComponent","Activity","StepContainerWithStepActivity","StepContainer","StepFooterWithStepActivity","CancelWizardDialogWithStepActivity","CancelWizardDialog","CreationWizardInternal","getStepListConfig","wizardLoggerFlowName","wizardLoggerSubFlowName","wizardLoggerStepToPage","stepListConfig","writeWizardLog","WizardStepLogger","flow","subflow","stepToPage","shouldPost","LayoutContainer","DefaultTemplate","Layout","BusyBlocker","StepList","CreationWizardWithActivity","stepConfigs","siteMap","perfMarkerName","onDoneNavigateToSiteMapId","initialFlowFactors","getFlow","isLegalFooter","dynamicOptions","routeToNavigateToWhenDone","getRoutePathById","stepConfig","actions","onDone","onExited","initialWizardData","Scenario","Wizard","WizardPerfMarker","wizardName","wizardMarker","ContentFooter","CreationWizard","withSiteMap","SearchCampaignCreationWizard","EditFooter","saveAndExitButtonText","EditWizardInternal","wizardTypeName","shouldHaveConfirmationDialog","newStepConfigs","ConfirmWizardDialog","useConfirmDialogConfigWithLogger","EditWizard","SearchCampaignEditWizard","step","guards","needsConfirming","getNeedConfirming","getSearchCampaignEditStepConfigs","SearchAdGroupCreationWizard","SearchAdGroupEditWizard","DO_NOT_ASK_AGAIN_PREFERENCE_NAME","BrandsContextProvider","selectedOptionsLimit","optionsDisplayLimit","loadBrandsFactory","loadAssociatedBrandsFactory","savedAddedSelectedOptionsKeys","savedDeletedSelectedOptionsKeys","loadBrands","useOptions","makeUseOptionsAsyncDataSource","loadBrandsUnderBrandList","useOptionsUnderBrandList","makeUseSelectedOptionsAsyncDataSource","MultiSelectorContextProvider","useSelectedOptions","loadBrandsFactoryFromProp","loadBrandsUnderBrandListFactoryFromProp","useBrandsData","useMultiSelectContext","_components","RequestBrandButton","isSelectedOptionsLimitReached","CommandBarButton","InfoMessageBar","SystemErrorAlertForBrandLists","messageBarType","MessageBarType","MaxSelectionAlertForBrandLists","warning","NoInitialDataAlertForBrandLists","SystemErrorAlertForBrands","MaxSelectionAlertForBrands","MoreOptionsInlineAlertForBrands","optionsLimit","MultiSelectCombobox","withMultiSelectCombobox","useMultiSelectorStyles","makeStyles","listbox","maxHeight","useStyles","ExistingBrandsPicker","BrandItem","overflowWrap","BrandItemLink","shorthands","TypeInContent","NonOptionContent","onRequestBrand","comboboxId","fluentV1ComboboxStyles","useFluentV1Styles","_useBrandsData","isLoadingOptions","isFirstOptionsLoad","isMoreOptionsThanLimit","optionsLoadError","lastLoadedSearchFilter","isLoadingSelectedOptions","selectedOptionsLoadError","setSelectedOptions","setSearchFilterFromContext","setSearchFilter","isAnyLoading","hasLoadErrors","showInitialLoading","canUserStartOperating","selectedOptionKeys","selectedOptionsSet","Set","shouldDisableSelection","resolvedSelectedOptions","_useDebouncedState","useDebouncedState","_useDebouncedState2","debouncedSearchFilter","searchFilter","rawValue","isSearchFilterEmpty","InlineLoading","mergeClasses","LoadingOverlay","ExistingBrandsPickerContent","isVisible","brand","BrandItemName","isUnderReview","RemoveAllButton","SelectedBrandsTagsHeader","SelectedBrandsTags","TooltipContent","isAwaysDisplayHeader","onRenderSelectedItemText","TooltipHost","directionalHint","DirectionalHint","rightCenter","tooltipProps","onRenderContent","SelectedBrandsTagsContainer","onRenderText","SelectedExistingBrandsContainer","SelectedNewBrandsContainer","neutralLight","BrandsPicker","approvedBrands","pendingBrands","SelectedExistingBrandsTags","filteredBrands","selectedBrand","htmlFor","SelectedNewBrandsTags","useless","Form","ManageBrandListPanelContentImpl","unscopedSiteMap","onNameChange","onOpenRequestBrandPanel","listName","setListName","onChangeListName","userContext","UserContext","brandListsPageLink","siteMapItem","findSiteMap","getSiteMapItemRoute","FormItem","to","TextField","ManageBrandListPanelContent","processorSet","basic","scopeUnawareWithSiteMap","RequestBrandPanel","redDark","SaveButton","brandName","setBrandName","brandLink","setBrandLink","brandReason","setBrandReason","errorMsg","setErrorMsg","defaultRender","IconButton","onSaveBrand","onSave","saveCallPromise","newBrand","createBrandFromProp","Uri","GENERIC_ERROR_MESSAGE","getOdataResponseErrors","onRenderFooterContent","PanelType","medium","headerText","isFooterAtBottom","onOuterClick","multiline","rows","resizable","dialogFooterStyles","actionsRight","SaveDialog","isDoNotAskAgain","setIsDoNotAskAgain","subText","CancelDialog","ManageBrandListPanel","onSaveCallback","_useBoolean","useBoolean","_useBoolean2","isSaveDialogOpen","_useBoolean2$","onOpenSaveDialog","setTrue","onDismissSaveDialog","setFalse","_useBoolean3","_useBoolean4","isCancelDialogOpen","_useBoolean4$","onOpenCancelDialog","onDismissCancelDialog","isManagePanelOpen","setIsManagePanelOpen","isRequestBrandPanelOpen","setIsRequestBrandPanelOpen","onDismissRequestBrandPanel","preferenceService","PreferenceContext","findByNameAtAccountLevel","deletedBrandIds","setDeletedBrandIds","addedBrandIds","setAddedBrandIds","savedDeletedBrandIds","setSavedDeletedBrandIds","savedAddedBrandIds","setSavedAddedBrandIds","_useState15","_useState16","setServerError","newSelectedBrands","newDeletedBrandIds","newAddedBrandIds","onError","brandList","brandItems","_extractAndRestoreFai","extractAndRestoreFailedBrandItemAssociations","newSavedAddedBrandIds","savedAddedBrandItemIds","newSavedDeletedBrandIds","savedDeletedBrandItemIds","translatedErrors","getViewModelBulkUpsertErrors","finalErrorMsg","onCreate","brandId","ParentId","BrandItems","brandListPayload","createBrandListFromProp","listId","onUpdate","activeBrands","deleteBrands","updateBrandListFromProp","isBrandsChanged","isChanged","Cancel","setAtAccountLevel","ExistingBrandListsPicker","ExistingBrandListsPickerContent","BrandListItem","BrandListItemName","BrandListItemBrandsCount","alignSelf","BrandListItemLink","_useMultiSelectContex","isNoOptionsAfterFirstLoad","Count","OperationButton","SelectedBrandListsTagsHeader","SelectedBrandListsTags","AndMoreText","isDisabled","newSelectedOptions","str","SelectedBrandListsTagsContainer","BrandListsPickerOperations","Description","BrandListsPickerContentImpl","isBrandListLimitReached","isCreatePanelOpen","setIsCreatePanelOpen","triggerLoadOptions","aboutLink","rel","calloutProps","gapSpace","CreateButton","BrandListsPickerContent","BrandListsContextProvider","onSelectedOptionsUpdate","filterPredicate","loadBrandListsFactoryFromProp","loadBrandListsFactory","loadCampaignAssociatedBrandListsFactoryFromProp","loadCampaignAssociatedBrandListsFactory","loadBrandLists","loadSelectedBrandLists","setIsBrandListLimitReached","onDoneCallback","allOptions","makeUseOptionsAsyncDataSourceWithClientFilter","DataSource","onCampaignLoaded","DoubleListBoxContext","_useContext$state","search","dispatch","getCampaigns","getCampaignsFromProp","CurrentCustomer","isMounted","_loadData","campaignTypeMap","protection","exclusion","loadData","propTypes","PropTypes","isRequired","getTheme","ApplyBrandListPanel","PanelFooter","brandLists","edmProps","campaignBrandListAssociation","campaignBrandListAssociationFromProp","getCampaignBrandListAssociation","getCampaignBrandListAssociationFromProp","originalAssociation","setOriginalAssociation","submiting","setSubmiting","setSelectedItems","totalCampaigns","setTotalCampaigns","onSelectionChange","dlbRef","setError","applyAssociation","originalAssociationMap","errResult","_serverErrors","campaigns","isExclusion","errCode","finish","getOriginalAssociation","_callee2","_context2","EntityName","removeSelect","newSelectedItems","selectedItem","Spinner","SpinnerSize","small","layerProps","DoubleListBoxContextProvider","DoubleListBox","showSelectedItems","componentRef","customRenderItems","toggleSelection","typeMap","HelpIcon","isSelected","isEditDisabled","customRenderBulkControl","onBulkOperation","isSelectedList","innerClasses","bulkControl","customSearchPlaceHolder","large","OPTION_KEYS","OPTIONS","BroadOnlySetting","BroadOnlyChoiceGroup","BrandListsPickerOption","isBroadMatchOnly","setIsBroadMatchOnly","onSelectedBrandListsUpdate","isOn","setIsOn","ChoiceGroup","selectedKey","WrappedBroadOnlySetting","Router"],"sourceRoot":""}
\r\n \r\n {map(adTypes, adType => (\r\n \r\n ))}\r\n \r\n
\r\n );\r\n};\r\n\r\nAdTypeSelector.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n enableAdTypeSelector: PropTypes.bool,\r\n adTypes: PropTypes.arrayOf(PropTypes.string),\r\n selectedAdType: PropTypes.string,\r\n onAdTypeChanged: PropTypes.func.isRequired,\r\n confirmWhenSwitchAdType: PropTypes.bool,\r\n};\r\n\r\nAdTypeSelector.defaultProps = {\r\n enableAdTypeSelector: true,\r\n adTypes: [],\r\n selectedAdType: undefined,\r\n confirmWhenSwitchAdType: false,\r\n};\r\n","import React, { useCallback, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { DefaultButton } from '@bingads-webui-react/fabric-with-signal';\r\nimport { getCurrentStepId, useWizardService, WIZARD_EVENTS } from '@bingads-webui-react/wizard';\r\n\r\nexport const AdFooter = ({\r\n i18n,\r\n enableCancel,\r\n enableCreateAnother,\r\n}) => {\r\n const { send, state } = useWizardService();\r\n const stepId = useMemo(() => getCurrentStepId(state), [state]);\r\n\r\n const onSaveAndCreateAnother = useCallback(() => {\r\n send(WIZARD_EVENTS.SAVE_AND_GOTO, { stepId });\r\n }, [send, stepId]);\r\n\r\n const onCancel = useCallback(() => {\r\n send(WIZARD_EVENTS.NAVIGATE_TO, { stepId });\r\n }, [send, stepId]);\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n {enableCreateAnother && (\r\n \r\n {i18n.getString(_TL_('Save & create another ad'))}\r\n \r\n )}\r\n {enableCancel && (\r\n \r\n {i18n.getString(_TL_('Cancel'))}\r\n \r\n )}\r\n
\r\n );\r\n};\r\n\r\nAdFooter.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n enableCancel: PropTypes.bool,\r\n enableCreateAnother: PropTypes.bool,\r\n};\r\n\r\nAdFooter.defaultProps = {\r\n enableCancel: false,\r\n enableCreateAnother: false,\r\n};\r\n","import { adEditorOverrideStyle } from '@bingads-webui-campaign-react/ad-editor-styles';\r\n\r\nexport const getRSAStyles = (_, { palette = {}, iconFontFamily = 'MsAds MDL2 Assets' }) => ({\r\n rsa: {\r\n ...adEditorOverrideStyle({ palette, iconFontFamily }),\r\n\r\n '& .rsa-left-copilot-column': {\r\n width: '600px',\r\n minWidth: '600px',\r\n },\r\n },\r\n});\r\n","import { bind, extend, get, isEmpty, filter, noop, property, result } from 'underscore';\r\nimport React, { useCallback, useContext, useEffect, useImperativeHandle, useMemo, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport edm from '@bingads-webui-component-legacy/edm-campaign';\r\nimport jsdata from '@bingads-webui-component-legacy/js-data-campaign';\r\nimport { ThemeProvider } from 'react-jss';\r\nimport { ComponentSettings, ThemeFluent } from '@bingads-webui-theme-2018/theme-fluent';\r\nimport { AdStrengthRepository } from '@bingads-webui-campaign-react/responsive-search-ad-suggestion';\r\nimport { ResponsiveSearchAdEditor } from '@bingads-webui-campaign-react/responsive-search-ad-editor';\r\nimport { DependencyResolver } from '@bingads-webui-campaign/dependency-resolver';\r\nimport { AudienceAssociationView } from '@bingads-webui-campaign-legacy/audience-association/view/base-association-view';\r\nimport { Repository } from '@bingads-webui-campaign-legacy/adextension-image/service/repository';\r\nimport { ImageExtensionsPane } from '@bingads-webui-campaign-react/image-extensions-pane';\r\nimport { instrumentationScenarios } from '@bingads-webui-campaign/ad-creator-tools-instrumentation';\r\nimport { mergeI18n } from '@bingads-webui-campaign-react/i18n-merger';\r\nimport { RecommendationContext } from '@bingads-webui-campaign/responsive-search-ad-recommendation';\r\nimport { useAssetLibraryEventHandler } from '@bingads-webui-campaign-react/copilot-common';\r\nimport { testUurl, uurlLevels } from '@bingads-webui-component-legacy/upgraded-url/service/testUurl';\r\nimport { loadDisclaimerAssociations } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport config from '@bingads-webui-component-legacy/config';\r\nimport dataModelUtil from '@bingads-webui-campaign-legacy/adextension-image/util/dataModelConvert';\r\nimport summaryDataContextManager from '@bingads-webui-static-legacy/summary/SummaryDataContextManager';\r\nimport instrumentation from '@bingads-webui-campaign-legacy/instrumentation';\r\n\r\nimport { getRSAStyles } from './rsa-styles';\r\n\r\nDependencyResolver.set('campaignui/feature/audience/association/view/base-association-view', AudienceAssociationView);\r\n\r\nconst theme = { components: ComponentSettings, core: ThemeFluent };\r\n\r\nexport const RsaEditor = ({\r\n i18n,\r\n ad,\r\n onAdChanged,\r\n onAdExtensionsChanged,\r\n permissions,\r\n perfMarker,\r\n scope,\r\n serverContext,\r\n showAllValidationErrors,\r\n apiErrors,\r\n editorRef,\r\n}) => {\r\n const classes = useDefaultStyles(getRSAStyles);\r\n const editMode = useMemo(() => get(ad, ['data', 'Id']), [ad]);\r\n\r\n const legacyI18n = useMemo(() => mergeI18n(\r\n window.globalLegacyI18n.get('@bingads-webui/i18n-amd-loader!campaignui/feature/audience-campaign'),\r\n i18n\r\n ), [i18n]);\r\n\r\n const adStrengthRepository = useMemo(() => new AdStrengthRepository({ edm, jsdata }), []);\r\n\r\n const imageExtensionsRepository = useMemo(() => {\r\n const repository = new Repository({\r\n schema: window.globalLegacySchema.get('ImageAdExtension'),\r\n afterChangeComitted: () => {\r\n summaryDataContextManager.updateContext(['AdGroupAdExtensionsGrid']);\r\n },\r\n });\r\n repository.association.createRequestFactory('adgroup');\r\n return repository;\r\n }, []);\r\n\r\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n const [cachedImageExtensionChanges, setCachedImageExtensionChanges] = useState({\r\n current: [],\r\n added: [],\r\n removed: [],\r\n updated: [],\r\n });\r\n\r\n const onImageExtensionChanged = useCallback((changes) => {\r\n setCachedImageExtensionChanges(changes);\r\n onAdExtensionsChanged(changes);\r\n }, [onAdExtensionsChanged]);\r\n\r\n // const [assetLibraryEventHandler, setAssetLibraryEventHandler] = useState({});\r\n const [{ postAssetEventLog = noop }] = useContext(RecommendationContext);\r\n const assetLibraryEventHandler = useAssetLibraryEventHandler(postAssetEventLog);\r\n\r\n const [previewImageCallback, setPreviewImageCallback] = useState(null);\r\n const savePreviewImageCallback = useCallback((func) => {\r\n setPreviewImageCallback(() => func);\r\n }, []);\r\n\r\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n const [logAppliedSuggestionsFunc, setLogAppliedSuggestionsFunc] = useState(null);\r\n const saveLogAppliedSuggestionsFunc = useCallback((func) => {\r\n setLogAppliedSuggestionsFunc(() => func);\r\n }, []);\r\n\r\n const onChanged = useCallback((data) => {\r\n onAdChanged({\r\n ...data,\r\n isValid: !data.incomplete && isEmpty(data.errors),\r\n });\r\n }, [onAdChanged]);\r\n\r\n const fetchDisclaimerInfo = useCallback(() => {\r\n if (scope.campaignId && permissions.IsDisclaimerForRSAEnabled) {\r\n return loadDisclaimerAssociations({\r\n cid: scope.customerId,\r\n aid: scope.accountId,\r\n campaignId: scope.campaignId,\r\n })\r\n .then(({ value }) => {\r\n if (value && value.length > 0) {\r\n return {\r\n hasDisclaimer: true,\r\n disclaimerData: get(value[0], 'AdExtension', {}),\r\n };\r\n }\r\n return { hasDisclaimer: false };\r\n })\r\n .catch(() => ({ hasDisclaimer: false }));\r\n }\r\n return Promise.resolve({ hasDisclaimer: false });\r\n }, [permissions.IsDisclaimerForRSAEnabled, scope.accountId, scope.campaignId, scope.customerId]);\r\n\r\n const triggerTestUurl = useCallback((fn, originalView) => {\r\n extend(originalView, {\r\n isInline: false,\r\n level: uurlLevels.Ad,\r\n });\r\n const params = (ad && ad.data) || {};\r\n const context = {\r\n ...scope,\r\n entityId: params.Id || '',\r\n };\r\n const options = {\r\n apiInLog: 'search-campaign/ad-editor/uurlTest',\r\n };\r\n testUurl(fn, originalView, params, context, options);\r\n }, [ad, scope]);\r\n\r\n const [activityLogger, setActivityLogger] = useState(null);\r\n useEffect(() => {\r\n const scenario = instrumentation[`ad${editMode ? 'Edit' : 'Creation'}ResponsiveSearch`].create();\r\n const logger = scenario[`ad${editMode ? 'Edit' : 'Creation'}`].create();\r\n logger.start();\r\n setActivityLogger(logger);\r\n\r\n return () => {\r\n logger.stop();\r\n };\r\n }, [editMode]);\r\n\r\n const logActivity = useCallback((message, apiName = 'ad editor') => {\r\n if (activityLogger) {\r\n const api = `${activityLogger.value} | ResponsiveSearch | campaignType: 1 | adGroupType: 1 | ${apiName}`;\r\n activityLogger.signal(message, api);\r\n }\r\n }, [activityLogger]);\r\n\r\n const renderImageExtension = useCallback((extraInfo) => {\r\n if (scope.adGroupId && activityLogger) {\r\n const imagePathFromConfig = config.get('imagePath');\r\n const maxImageExtensionsPerAdGroup = config.get('Feature').AdExtension.MaxSelectedImagesPerAdGroupOrCampaignForV2;\r\n const oDataConfig = {\r\n odataRootUrl: config.get('CampaignAzureDomain'),\r\n odataPath: config.get('odata.url') + config.get('odata.path'),\r\n odataToken: config.get('odata.token'),\r\n };\r\n\r\n return (\r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nMmaEditor.propTypes = {\r\n ad: PropTypes.shape({\r\n data: PropTypes.shape({\r\n Id: PropTypes.string,\r\n }),\r\n }),\r\n onAdChanged: PropTypes.func.isRequired,\r\n i18n: PropTypes.shape({}).isRequired,\r\n perfMarker: PropTypes.shape({}).isRequired,\r\n permissions: PropTypes.shape({\r\n IsImpressionTrackingUrlsEnabled: PropTypes.bool,\r\n }).isRequired,\r\n scope: PropTypes.shape({\r\n accountId: PropTypes.string,\r\n customerId: PropTypes.string,\r\n userId: PropTypes.string,\r\n adGroupId: PropTypes.string,\r\n campaignId: PropTypes.string,\r\n campaignType: PropTypes.string,\r\n }).isRequired,\r\n serverContext: PropTypes.shape({}).isRequired,\r\n showAllValidationErrors: PropTypes.bool,\r\n apiErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n editorRef: PropTypes.shape({\r\n current: PropTypes.shape({}),\r\n }).isRequired,\r\n};\r\n\r\nMmaEditor.defaultProps = {\r\n ad: { data: {} },\r\n apiErrors: undefined,\r\n showAllValidationErrors: false,\r\n};\r\n","import { adCustomizersStyle } from '@bingads-webui-campaign-react/common-styles';\r\n\r\nexport const getDSAStyles = (_, { palette = {}, iconFontFamily = 'MsAds MDL2 Assets' }) => ({\r\n dsa: {\r\n ...adCustomizersStyle({ palette, iconFontFamily }),\r\n\r\n '& .field-label': {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n alignItems: 'center',\r\n },\r\n },\r\n});\r\n","import React, { useCallback } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { DynamicSearchAdEditor } from '@bingads-webui-campaign-react/dynamic-search-ad-editor';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { useWizardService } from '@bingads-webui-react/wizard';\r\n\r\nimport { getDSAStyles } from './dsa-styles';\r\n\r\nexport const DsaEditor = ({\r\n ad,\r\n onAdChanged,\r\n permissions,\r\n scope,\r\n}) => {\r\n const classes = useDefaultStyles(getDSAStyles);\r\n\r\n const { state } = useWizardService();\r\n const { domain } = state.context.wizardData;\r\n\r\n const onChanged = useCallback((data) => {\r\n onAdChanged({\r\n ...data,\r\n isValid: data.isValid,\r\n });\r\n }, [onAdChanged]);\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nDsaEditor.propTypes = {\r\n i18n: PropTypes.shape({}).isRequired,\r\n ad: PropTypes.shape({\r\n data: PropTypes.shape({}),\r\n }),\r\n onAdChanged: PropTypes.func.isRequired,\r\n permissions: PropTypes.shape({}).isRequired,\r\n scope: PropTypes.shape({\r\n customerId: PropTypes.string,\r\n accountId: PropTypes.string,\r\n campaignId: PropTypes.string,\r\n adGroupId: PropTypes.string,\r\n }).isRequired,\r\n};\r\n\r\nDsaEditor.defaultProps = {\r\n ad: { data: {} },\r\n};\r\n","import { AdTypes } from '../../../constants/ad-type';\r\nimport { RsaEditor } from './rsa-editor';\r\nimport { MmaEditor } from './mma-editor';\r\nimport { DsaEditor } from './dsa-editor';\r\n\r\nexport const Editors = {\r\n [AdTypes.ResponsiveSearch]: RsaEditor,\r\n [AdTypes.Responsive]: MmaEditor,\r\n [AdTypes.DynamicSearch]: DsaEditor,\r\n};\r\n","import { extend, first, get, isEqual, pick, result, size } from 'underscore';\r\nimport React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { ErrorMessages } from '@bingads-webui-react/validation';\r\nimport { ActuationGroup } from '@bingads-webui-campaign-react/actuator';\r\nimport { AttentionBeaconGroup } from '@bingads-webui-campaign-react/attention-beacon';\r\nimport { FormErrorGroup, UnmappedFormErrors } from '@bingads-webui-campaign-react/form-error';\r\nimport { useFormService, FORM_STATES } from '@bingads-webui-react/form';\r\nimport { withPermissions } from '@bingads-webui-react/hoc-with-permissions';\r\nimport { withServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { withScope, QueryParam } from '@bingads-webui-react/scope-service';\r\nimport { viewModelToModelInResponseForAd } from '@bingads-webui-campaign-react/search-campaign-data';\r\n\r\nimport { getStyles } from './styles';\r\nimport { AdTypeSelector } from './ad-type-selector';\r\nimport { AdFooter } from './ad-footer';\r\nimport { Editors } from './editors/index';\r\nimport { StepHeader } from '../../shared/step-header';\r\n\r\nconst errorFilter = error => error.message;\r\nconst errorMapper = error => error.message;\r\n\r\nconst AdEditorInternal = (props) => {\r\n const {\r\n data,\r\n onDataChange,\r\n error,\r\n permissions,\r\n serverContext,\r\n scope,\r\n wizardPerfMarker,\r\n adTypes,\r\n enableAdsManagment,\r\n confirmWhenSwitchAdType,\r\n } = props;\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n const editorRef = React.createRef();\r\n const classes = useDefaultStyles(getStyles);\r\n const i18n = useContext(I18nContext);\r\n const perfMarker = useMemo(() => wizardPerfMarker.createChild('AddTextStep', { autoEnd: true }), [wizardPerfMarker]);\r\n\r\n const {\r\n state: {\r\n context: {\r\n saveFailed: showAllValidationErrors,\r\n },\r\n value: formStateValue,\r\n },\r\n } = useFormService();\r\n\r\n const {\r\n campaignId,\r\n adGroupId,\r\n ads,\r\n adType: initialAdType,\r\n enableAdTypeSelector,\r\n isEmpty,\r\n loaded,\r\n } = data;\r\n\r\n const entityScope = useMemo(() => {\r\n const { values: { aid, cid, uid } } = scope;\r\n return {\r\n accountId: aid,\r\n advertiserCustomerId: cid,\r\n customerId: cid,\r\n userId: uid,\r\n campaignType: 1, // Search\r\n campaignId,\r\n adGroupId,\r\n };\r\n }, [adGroupId, campaignId, scope]);\r\n\r\n const [adType, setAdType] = useState(initialAdType || first(adTypes));\r\n const [initialAd, setInitialAd] = useState(get(ads, adType, {}));\r\n const apiErrors = useMemo(() => get(ads[adType], 'serverErrors'), [adType, ads]);\r\n\r\n const onAdTypeChanged = useCallback((newAdType) => {\r\n setAdType(newAdType);\r\n setInitialAd(viewModelToModelInResponseForAd(ads[newAdType], newAdType));\r\n }, [ads]);\r\n\r\n const onAdChanged = useCallback((ad) => {\r\n extend(ad.data, pick(get(initialAd, 'data', {}), ['Id']));\r\n const newData = {\r\n data: {\r\n ...data,\r\n ads: {\r\n ...data.ads,\r\n [adType]: ad,\r\n },\r\n adType,\r\n },\r\n isValid: ad.isValid,\r\n };\r\n if (!isEqual(data, newData.data)) {\r\n onDataChange(newData);\r\n }\r\n }, [adType, data, initialAd, onDataChange]);\r\n\r\n const onAdExtensionsChanged = useCallback((adExtensions) => {\r\n const newData = {\r\n data: {\r\n ...data,\r\n adExtensions,\r\n },\r\n };\r\n if (!isEqual(data, newData.data)) {\r\n onDataChange(newData);\r\n }\r\n }, [data, onDataChange]);\r\n\r\n const renderEditor = useMemo(() => {\r\n const Editor = Editors[adType];\r\n if (!Editor) {\r\n return null;\r\n }\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nAdEditorInternal.propTypes = {\r\n data: PropTypes.shape({\r\n campaignId: PropTypes.number,\r\n adGroupId: PropTypes.number,\r\n ads: PropTypes.shape({}),\r\n adType: PropTypes.string,\r\n enableAdTypeSelector: PropTypes.bool,\r\n isEmpty: PropTypes.bool,\r\n loaded: PropTypes.bool,\r\n }),\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.string),\r\n }),\r\n permissions: PropTypes.shape({\r\n IsImpressionTrackingUrlsEnabled: PropTypes.bool,\r\n }).isRequired,\r\n serverContext: PropTypes.shape({}).isRequired,\r\n scope: PropTypes.instanceOf(QueryParam).isRequired,\r\n wizardPerfMarker: PropTypes.shape({\r\n createChild: PropTypes.func.isRequired,\r\n }).isRequired,\r\n adTypes: PropTypes.arrayOf(PropTypes.string),\r\n enableAdsManagment: PropTypes.bool,\r\n confirmWhenSwitchAdType: PropTypes.bool,\r\n};\r\n\r\nAdEditorInternal.defaultProps = {\r\n data: {\r\n campaignId: -1,\r\n adGroupId: -1,\r\n ads: {},\r\n enableAdTypeSelector: true,\r\n loaded: false,\r\n },\r\n error: null,\r\n adTypes: [],\r\n enableAdsManagment: false,\r\n confirmWhenSwitchAdType: false,\r\n};\r\n\r\nexport const AdEditor = withPermissions(withServerContext(withScope(AdEditorInternal)));\r\n","import { extend, find, first, get, isArray, isEmpty, omit, size } from 'underscore';\r\nimport { useCallback, useContext, useMemo } from 'react';\r\nimport { ActivityContext, ScenarioContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { useWizardService } from '@bingads-webui-react/wizard';\r\nimport { loadAds, saveAd, deleteAd, saveImageExtensions } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { AdTypes } from '../../constants/ad-type';\r\n\r\nexport const useAdsRepository = ({\r\n enableAdsManagment = false,\r\n adTypes = [],\r\n} = {}) => {\r\n const i18n = useContext(I18nContext);\r\n const scenario = useContext(ScenarioContext);\r\n const activity = useContext(ActivityContext);\r\n const { scope } = useContext(ScopeContext);\r\n const {\r\n cid,\r\n aid,\r\n campaignId: campaignIdFromScope,\r\n adGroupId: adGroupIdFromScope,\r\n } = scope.values;\r\n const { state } = useWizardService();\r\n const {\r\n campaignId: campaignIdFromWizardData,\r\n adGroupId: adGroupIdFromWizardData,\r\n websites: savedWebsites,\r\n } = state.context.wizardData;\r\n\r\n const campaignId = useMemo(() => campaignIdFromWizardData || campaignIdFromScope, [campaignIdFromScope, campaignIdFromWizardData]);\r\n const adGroupId = useMemo(() => adGroupIdFromWizardData || adGroupIdFromScope, [adGroupIdFromScope, adGroupIdFromWizardData]);\r\n const adFilter = useMemo(() => {\r\n const adTypesFilter = adTypes.map(adType => `Type eq Enum.AdType'${adType}'`).join(' or ');\r\n return {\r\n where: `(${adTypesFilter}) and (Status eq Enum.AdStatus'Active')`,\r\n };\r\n }, [adTypes]);\r\n\r\n const load = useCallback(() =>\r\n loadAds({\r\n cid,\r\n aid,\r\n campaignId,\r\n adGroupId,\r\n filter: adFilter,\r\n count: enableAdsManagment ? 100 : 1,\r\n })\r\n .then((ads) => {\r\n if (enableAdsManagment && !isEmpty(ads)) {\r\n return {\r\n campaignId,\r\n adGroupId,\r\n ads,\r\n isEmpty: isEmpty(ads),\r\n loaded: true,\r\n };\r\n }\r\n\r\n const data = {\r\n campaignId,\r\n adGroupId,\r\n ads: adTypes.reduce((acc, adType) => {\r\n acc[adType] = {\r\n data: {\r\n FinalUrls: savedWebsites,\r\n },\r\n isValid: false,\r\n };\r\n return acc;\r\n }, {}),\r\n adType: first(adTypes),\r\n isEmpty: isEmpty(ads),\r\n loaded: true,\r\n };\r\n\r\n const ad = first(ads);\r\n if (ad) {\r\n extend(data, {\r\n ads: {\r\n ...data.ads,\r\n [ad.Type]: {\r\n data: ad,\r\n isValid: true,\r\n },\r\n },\r\n adType: ad.Type,\r\n });\r\n }\r\n\r\n return data;\r\n })\r\n .catch((error) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Load ads failed: ${error}`);\r\n activity.signal(`onAdLoadFailed - ${JSON.stringify({\r\n campaignId,\r\n adGroupId,\r\n error,\r\n })}`);\r\n\r\n return {\r\n campaignId,\r\n adGroupId,\r\n ads: {},\r\n loaded: true,\r\n errors: [error],\r\n };\r\n }), [activity, adFilter, adGroupId, adTypes, aid, campaignId, cid, enableAdsManagment, savedWebsites]);\r\n\r\n const save = useCallback(({ data }) => {\r\n const { ads, adType, adExtensions } = data;\r\n if (isArray(ads)) {\r\n activity.signal(`onAdsManagementSaving - ${JSON.stringify({\r\n count: size(ads),\r\n })}`);\r\n\r\n return Promise.resolve(data);\r\n }\r\n\r\n const adToSave = ads[adType];\r\n const adToDelete = !enableAdsManagment && find(ads, (val, key) => key !== adType && get(val, ['data', 'Id']));\r\n\r\n activity.signal(`onAdSaving - ${JSON.stringify({\r\n adType,\r\n ad: adToSave.data,\r\n deletedAd: adToDelete && adToDelete.data,\r\n extensions: adExtensions,\r\n })}`);\r\n\r\n const bulkActions = [];\r\n bulkActions.push(saveAd({\r\n ad: adToSave.data,\r\n adType,\r\n campaignId,\r\n adGroupId,\r\n cid,\r\n aid,\r\n }, {\r\n i18n,\r\n scenario: scenario.name,\r\n activityLogger: activity,\r\n })\r\n .then((response) => {\r\n const result = {\r\n ...data,\r\n ads: {\r\n ...data.ads,\r\n [adType]: response,\r\n },\r\n };\r\n if (response.serverErrors || response.systemErrors) {\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n data: result,\r\n error: {\r\n serverErrors: response.serverErrors,\r\n systemErrors: response.systemErrors,\r\n },\r\n });\r\n }\r\n return Promise.resolve({ data: result });\r\n }));\r\n\r\n bulkActions.push(adToDelete ? deleteAd({\r\n adId: adToDelete.data.Id,\r\n adType: find(adTypes, type => type !== adType),\r\n adGroupId,\r\n }, {\r\n i18n,\r\n scenario: scenario.name,\r\n activityLogger: activity,\r\n }) : Promise.resolve({}));\r\n\r\n bulkActions.push(adType === AdTypes.ResponsiveSearch ? saveImageExtensions({\r\n campaignId,\r\n adGroupId,\r\n adId: adToSave.data.Id,\r\n imageExtensionChanges: adExtensions,\r\n }, {\r\n i18n,\r\n activityLogger: activity,\r\n scenario: scenario.name,\r\n // perfMarker,\r\n }) : Promise.resolve({}));\r\n\r\n return Promise.allSettled(bulkActions)\r\n .then((results) => {\r\n const [{\r\n status: saveStatus,\r\n value: savedValue,\r\n reason: rejectedValue,\r\n }, {\r\n status: deleteStatus,\r\n value: deletedData,\r\n }] = results;\r\n const savedResult = savedValue || rejectedValue || {};\r\n\r\n if (deleteStatus === 'fulfilled' && deletedData.data && savedResult.data) {\r\n const adToUpdate = find(savedResult.data.ads, (val, key) => key !== adType);\r\n if (adToUpdate) {\r\n adToUpdate.data = omit(adToUpdate.data, 'Id'); // Prevent duplicate deletion\r\n }\r\n }\r\n\r\n if (saveStatus === 'rejected') {\r\n return Promise.reject(savedResult);\r\n }\r\n\r\n // Same as legacy workflow, failing to update extensions would not block the ad save\r\n const savedAd = savedResult.data.ads[adType];\r\n activity.signal(`onAdSaved - ${JSON.stringify({\r\n adType,\r\n ad: savedAd.data,\r\n deletedAd: adToDelete && adToDelete.data,\r\n extensions: adExtensions,\r\n editorialErrors: savedAd.editorialErrors,\r\n })}`);\r\n\r\n return savedResult.data;\r\n })\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n .catch((result) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Save ad failed: ${result}`);\r\n activity.signal(`onAdSaveFailed - ${JSON.stringify({\r\n adType,\r\n ad: adToSave.data,\r\n deletedAd: adToDelete && adToDelete.data,\r\n extensions: adExtensions,\r\n error: result,\r\n })}`);\r\n\r\n return Promise.reject(result);\r\n });\r\n }, [activity, adGroupId, adTypes, aid, campaignId, cid, enableAdsManagment, i18n, scenario.name]);\r\n\r\n const destroyAd = useCallback((ad) => {\r\n activity.signal(`onAdDeleting - ${JSON.stringify({\r\n ad,\r\n })}`);\r\n\r\n return deleteAd({\r\n adId: ad.Id,\r\n adType: ad.Type,\r\n adGroupId,\r\n }, {\r\n i18n,\r\n scenario: scenario.name,\r\n activityLogger: activity,\r\n })\r\n .then((response) => {\r\n activity.signal(`onAdDeleted - ${JSON.stringify({\r\n ad,\r\n response,\r\n })}`);\r\n\r\n return response;\r\n })\r\n .catch((result) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Delete ad failed: ${result}`);\r\n activity.signal(`onAdDeleteFailed - ${JSON.stringify({\r\n ad,\r\n error: result,\r\n })}`);\r\n\r\n return Promise.reject(result);\r\n });\r\n }, [activity, adGroupId, i18n, scenario.name]);\r\n\r\n return {\r\n load,\r\n save,\r\n deleteAd: destroyAd,\r\n };\r\n};\r\n","/* eslint-disable jsx-a11y/img-redundant-alt */\r\n/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport { first, map } from 'underscore';\r\nimport React, { useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Text } from '@bingads-webui-react/fabric-control';\r\nimport { Link } from '@bingads-webui-react/fabric-with-signal';\r\nimport { getTitlePreview, getDescPreview } from '@bingads-webui-campaign/summary-grid-helper';\r\nimport { getExpandedTextAdDisplayUrl } from '@bingads-webui-campaign-legacy/crud-ad/service/displayUrl';\r\n\r\nexport const ResponsiveSearchAdPreview = ({ ad, i18n }) => {\r\n const resultData = useMemo(() => {\r\n const convertedFinalUrl = first(ad.FinalUrls);\r\n const headlineList = map(ad.Headlines, i => ({\r\n Text: i.Asset && i.Asset.Text,\r\n PinnedField: i.PinnedField,\r\n }));\r\n const descriptionList = map(ad.Descriptions, i => ({\r\n Text: i.Asset && i.Asset.Text,\r\n PinnedField: i.PinnedField,\r\n }));\r\n const convertedTitle = getTitlePreview(headlineList);\r\n const convertedText = getDescPreview(descriptionList);\r\n const convertedDisplayUrl = getExpandedTextAdDisplayUrl(first(ad.FinalUrls), ad.DisplayUrl, ad.Path1, ad.Path2);\r\n return {\r\n convertedFinalUrl,\r\n convertedTitle,\r\n convertedText,\r\n convertedDisplayUrl,\r\n };\r\n }, [ad]);\r\n\r\n return (\r\n \r\n
\r\n \r\n
\r\n {size(adTypes) > 1 && \r\n \r\n {resultData.convertedTitle}\r\n \r\n \r\n {resultData.convertedDisplayUrl}\r\n \r\n \r\n {i18n.getString(_TL_('Ad'))}\r\n {resultData.convertedText}\r\n \r\n
\r\n );\r\n};\r\n\r\nResponsiveSearchAdPreview.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n ad: PropTypes.shape({\r\n FinalUrls: PropTypes.arrayOf(PropTypes.string),\r\n Headlines: PropTypes.arrayOf(PropTypes.shape({\r\n Asset: PropTypes.shape({\r\n Text: PropTypes.string,\r\n }),\r\n PinnedField: PropTypes.string,\r\n })),\r\n Descriptions: PropTypes.arrayOf(PropTypes.shape({\r\n Asset: PropTypes.shape({\r\n Text: PropTypes.string,\r\n }),\r\n PinnedField: PropTypes.string,\r\n })),\r\n DisplayUrl: PropTypes.string,\r\n Path1: PropTypes.string,\r\n Path2: PropTypes.string,\r\n }),\r\n};\r\n\r\nResponsiveSearchAdPreview.defaultProps = {\r\n ad: {\r\n FinalUrls: [],\r\n Headlines: [],\r\n Descriptions: [],\r\n DisplayUrl: '',\r\n Path1: '',\r\n Path2: '',\r\n },\r\n};\r\n","/* eslint-disable jsx-a11y/img-redundant-alt */\r\n/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport { first, get } from 'underscore';\r\nimport React, { useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Link } from '@bingads-webui-react/fabric-with-signal';\r\nimport { originalActionTextMapper } from '@bingads-webui-campaign-legacy/adextension-actionlink/model/language-type-translator';\r\n\r\nexport const ResponsiveAdPreview = ({ ad, i18n }) => { // for MMA\r\n const { LandscapeImageMediaUrl } = ad;\r\n const convertedFinalUrl = useMemo(() => first(ad.FinalUrls), [ad.FinalUrls]);\r\n const callToAction = useMemo(() => get(originalActionTextMapper, [ad.CallToActionLanguage, ad.CallToAction]), [ad.CallToActionLanguage, ad.CallToAction]);\r\n\r\n return (\r\n \r\n \r\n 
}\r\n
\r\n {i18n.getString(_TL_('Ad'))}
\r\n \r\n {LandscapeImageMediaUrl && \r\n
\r\n \r\n );\r\n};\r\n\r\nResponsiveAdPreview.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n ad: PropTypes.shape({\r\n FinalUrls: PropTypes.arrayOf(PropTypes.string),\r\n Headline: PropTypes.string,\r\n Text: PropTypes.string,\r\n LandscapeImageMediaUrl: PropTypes.string,\r\n DisplayUrl: PropTypes.string,\r\n CallToActionLanguage: PropTypes.string,\r\n CallToAction: PropTypes.string,\r\n }),\r\n};\r\n\r\nResponsiveAdPreview.defaultProps = {\r\n ad: {\r\n FinalUrls: [],\r\n Headline: '',\r\n Text: '',\r\n LandscapeImageMediaUrl: '',\r\n DisplayUrl: '',\r\n CallToActionLanguage: '',\r\n CallToAction: '',\r\n },\r\n};\r\n","import { chain } from 'underscore';\r\nimport React, { useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Text } from '@bingads-webui-react/fabric-control';\r\nimport { Link } from '@bingads-webui-react/fabric-with-signal';\r\nimport { combineDescriptions } from '@bingads-webui-campaign-react/ad-common';\r\n\r\nexport const DynamicSearchAdPreview = ({ ad, i18n }) => {\r\n const combinedUrl = useMemo(() => chain([ad.DisplayUrl, ad.Path1, ad.Path2]).compact().join('/').value(), [ad.DisplayUrl, ad.Path1, ad.Path2]);\r\n const description = useMemo(() => combineDescriptions(ad.Text, ad.TextPart2), [ad.Text, ad.TextPart2]);\r\n\r\n return (\r\n {ad.Headline}
\r\n {convertedFinalUrl}
\r\n {ad.Text}
\r\n {callToAction && }\r\n \r\n \r\n {i18n.getString(_TL_('{Dynamically generated headline}'))}\r\n \r\n \r\n {combinedUrl}\r\n \r\n \r\n {i18n.getString(_TL_('Ad'))}\r\n {description}\r\n \r\n
\r\n );\r\n};\r\n\r\nDynamicSearchAdPreview.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n ad: PropTypes.shape({\r\n Text: PropTypes.string,\r\n TextPart2: PropTypes.string,\r\n DisplayUrl: PropTypes.string,\r\n Path1: PropTypes.string,\r\n Path2: PropTypes.string,\r\n }),\r\n};\r\n\r\nDynamicSearchAdPreview.defaultProps = {\r\n ad: {},\r\n};\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { ListItem } from '@fluentui/react-list-preview';\r\nimport { Button, Tooltip } from '@fluentui/react-components';\r\nimport { CopyRegular, EditRegular, DeleteRegular } from '@fluentui/react-icons';\r\n\r\nimport { AdTypes, AdTypeStrings } from '../../constants/ad-type';\r\nimport { ResponsiveSearchAdPreview } from './rsa-preview';\r\nimport { ResponsiveAdPreview } from './mma-preview';\r\nimport { DynamicSearchAdPreview } from './dsa-preview';\r\n\r\nconst AdPreviewComponents = {\r\n [AdTypes.ResponsiveSearch]: ResponsiveSearchAdPreview,\r\n [AdTypes.Responsive]: ResponsiveAdPreview,\r\n [AdTypes.DynamicSearch]: DynamicSearchAdPreview,\r\n};\r\n\r\nexport const AdListItem = ({\r\n i18n,\r\n ad,\r\n enableCopy,\r\n onCopyAd,\r\n onEditAd,\r\n onDeleteAd,\r\n}) => {\r\n const AdPreviewComponent = AdPreviewComponents[ad.Type];\r\n\r\n return AdPreviewComponent && (\r\n \r\n \r\n } onClick={onCopyAd} disabled={!enableCopy} />\r\n \r\n \r\n } onClick={onEditAd} />\r\n \r\n \r\n } onClick={onDeleteAd} />\r\n \r\n
\r\n \r\n \r\n {map(ads, ad => (\r\n onCopyAd(ad)}\r\n onEditAd={() => onEditAd(ad)}\r\n onDeleteAd={() => onDeleteAd(ad)}\r\n />\r\n ))}\r\n \r\n
\r\n );\r\n};\r\n\r\nAdList.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n adType: PropTypes.string.isRequired,\r\n enableCopy: PropTypes.bool,\r\n ads: PropTypes.arrayOf(PropTypes.shape({})),\r\n onCopyAd: PropTypes.func.isRequired,\r\n onEditAd: PropTypes.func.isRequired,\r\n onDeleteAd: PropTypes.func.isRequired,\r\n};\r\n\r\nAdList.defaultProps = {\r\n ads: [],\r\n enableCopy: false,\r\n};\r\n","import { every, map, size } from 'underscore';\r\nimport React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {\r\n Button,\r\n Menu,\r\n MenuButton,\r\n MenuItem,\r\n MenuList,\r\n MenuPopover,\r\n MenuTrigger,\r\n} from '@fluentui/react-components';\r\nimport {\r\n AddRegular,\r\n} from '@fluentui/react-icons';\r\nimport { AdTypeStrings } from '../../constants/ad-type';\r\n\r\nexport const CreateAdButton = ({\r\n i18n,\r\n adTypes,\r\n onCreateAd,\r\n}) => (\r\n \r\n {listHeader}\r\n
\r\n \r\n {size(adTypes) === 1 && (\r\n
\r\n);\r\n\r\nCreateAdButton.propTypes = {\r\n i18n: PropTypes.shape({\r\n getString: PropTypes.func.isRequired,\r\n }).isRequired,\r\n adTypes: PropTypes.arrayOf(PropTypes.shape({\r\n adType: PropTypes.string,\r\n disabled: PropTypes.bool,\r\n })),\r\n onCreateAd: PropTypes.func.isRequired,\r\n};\r\n\r\nCreateAdButton.defaultProps = {\r\n adTypes: [],\r\n};\r\n","import { uiblockerStyle } from '@bingads-webui-campaign-react/common-styles';\r\n\r\nexport const getStyles = (_, theme = { palette: {} }) => ({\r\n '@global': {\r\n ...uiblockerStyle(theme),\r\n },\r\n\r\n adsManager: {\r\n '& .ad-list-container': {\r\n margin: '32px 0',\r\n\r\n '& .ad-list-header': {\r\n fontWeight: 600,\r\n marginBottom: 16,\r\n },\r\n\r\n '& .ad-list-item': {\r\n background: '#FFFFFF',\r\n border: '1px solid #E1DFDD',\r\n borderRadius: '8px',\r\n boxShadow: '0px 2px 4px 0px rgba(0, 0, 0, 0.05)',\r\n width: '500px',\r\n minHeight: '150px',\r\n marginBottom: '16px',\r\n position: 'relative',\r\n\r\n '& .ad-preview-overlay': {\r\n display: 'none',\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '100%',\r\n background: 'linear-gradient(180deg, rgba(0, 0, 0, 0.00) 50%, rgba(0, 0, 0, 0.80) 100%)',\r\n borderRadius: '6px',\r\n padding: '16px',\r\n zIndex: 1,\r\n alignItems: 'flex-end',\r\n justifyContent: 'flex-end',\r\n\r\n '& button': {\r\n background: 'transparent',\r\n border: 'none',\r\n color: '#FFFFFF',\r\n marginLeft: '4px',\r\n },\r\n },\r\n\r\n '&:hover .ad-preview-overlay, &:focus-within .ad-preview-overlay': {\r\n display: 'flex',\r\n },\r\n\r\n '& .rsa-ad-preview-content-container, .dsa-ad-preview-content-container': {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n justifyContent: 'center',\r\n padding: '20px',\r\n\r\n '& .ad-title-preview': {\r\n fontSize: '18px',\r\n lineHeight: '22px',\r\n color: '#1A0DAB',\r\n },\r\n '& .ad-url-preview': {\r\n fontSize: '14px',\r\n lineHeight: '20px',\r\n color: '#006621',\r\n },\r\n '& .ad-description-preview': {\r\n '& .ad-slug': {\r\n color: '#666',\r\n lineHeight: '24px',\r\n border: '1px solid #ddd',\r\n padding: '0 2px',\r\n fontSize: '11px',\r\n marginRight: '4px',\r\n borderRadius: '2px',\r\n },\r\n fontSize: '12px',\r\n lineHeight: '16px',\r\n color: '#666',\r\n marginTop: '4px',\r\n },\r\n },\r\n\r\n '& .mma-ad-preview-content-container': {\r\n position: 'relative',\r\n width: '100%',\r\n textDecoration: 'none',\r\n borderRadius: '8px',\r\n\r\n '&:active:hover': {\r\n textDecoration: 'none',\r\n },\r\n\r\n '& .ad-background': {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '100%',\r\n\r\n '& .ad-gradient-overlay': {\r\n position: 'absolute',\r\n width: '100%',\r\n height: '100%',\r\n borderRadius: '8px',\r\n backgroundImage: 'linear-gradient(to left, transparent 0, #333 100%)',\r\n },\r\n\r\n '& .ad-label': {\r\n color: '#767676',\r\n margin: '8px',\r\n padding: '0 2px',\r\n position: 'absolute',\r\n right: 0,\r\n top: 0,\r\n fontSize: '11px',\r\n lineHeight: '14px',\r\n borderRadius: '2px',\r\n backgroundColor: '#ddd',\r\n },\r\n\r\n '& .ad-preview-image': {\r\n width: '100%',\r\n height: '100%',\r\n objectFit: 'cover',\r\n objectPosition: 'top',\r\n borderRadius: '8px',\r\n },\r\n },\r\n\r\n '& .mma-text-content-container': {\r\n position: 'relative',\r\n padding: '20px',\r\n color: '#FFF',\r\n wordWrap: 'break-word',\r\n\r\n '& .mma-short-headline': {\r\n fontSize: '18px',\r\n lineHeight: '22px',\r\n },\r\n\r\n '& .mma-display-url': {\r\n fontSize: '14px',\r\n lineHeight: '20px',\r\n },\r\n\r\n '& .mma-description': {\r\n fontSize: '12px',\r\n lineHeight: '16px',\r\n },\r\n\r\n '& .mma-callToAction': {\r\n color: '#515151',\r\n border: 'none',\r\n position: 'absolute',\r\n padding: '8px 16px',\r\n marginTop: '8px',\r\n fontSize: '12px',\r\n lineHeight: '16px',\r\n fontWeight: '600',\r\n borderRadius: '20px',\r\n backgroundColor: '#D3D3D3',\r\n },\r\n },\r\n },\r\n },\r\n },\r\n },\r\n});\r\n","import { filter, find, first, isEmpty, map, omit, size } from 'underscore';\r\nimport React, { useCallback, useContext, useMemo, useRef } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { Stack } from '@fluentui/react';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { useWizardService } from '@bingads-webui-react/wizard';\r\nimport { withUiBlock } from '@bingads-webui/uiblocker';\r\n\r\nimport { useAdsRepository } from '../add-text/use-ads-repository';\r\nimport { StepHeader } from '../../shared/step-header';\r\nimport { AdTypeMaxCount } from '../../constants/ad-type';\r\nimport { AdList } from './ad-list';\r\nimport { CreateAdButton } from './create-ad-button';\r\nimport { getStyles } from './styles';\r\n\r\nexport const AdsManager = ({\r\n data,\r\n onDataChange,\r\n adTypes,\r\n description,\r\n}) => {\r\n const containerRef = useRef();\r\n const classes = useDefaultStyles(getStyles);\r\n const i18n = useContext(I18nContext);\r\n\r\n const { state } = useWizardService();\r\n const { websites } = state.context.wizardData;\r\n\r\n const { ads = [] } = data;\r\n const availableAdTypes = useMemo(() => map(adTypes, (adType) => {\r\n const filteredAds = filter(ads, ad => ad.Type === adType);\r\n return {\r\n adType,\r\n ads: filteredAds,\r\n disabled: size(filteredAds) >= AdTypeMaxCount[adType],\r\n };\r\n }), [adTypes, ads]);\r\n\r\n const adsRepository = useAdsRepository({ enableAdsManagment: true, adTypes });\r\n\r\n const onCreateAd = useCallback((adType) => {\r\n const anotherAdType = find(availableAdTypes, type => type.adType !== adType);\r\n const enableAdTypeSelector = anotherAdType && !anotherAdType.disabled;\r\n\r\n onDataChange({\r\n data: {\r\n ...data,\r\n ads: {\r\n [adType]: {\r\n data: {\r\n FinalUrls: websites,\r\n },\r\n isValid: false,\r\n },\r\n },\r\n adType,\r\n enableAdTypeSelector,\r\n },\r\n isValid: false,\r\n });\r\n }, [availableAdTypes, data, onDataChange, websites]);\r\n\r\n const onCopyAd = useCallback((ad) => {\r\n const anotherAdType = find(availableAdTypes, type => type.adType !== ad.Type);\r\n const enableAdTypeSelector = anotherAdType && !anotherAdType.disabled;\r\n\r\n onDataChange({\r\n data: {\r\n ...data,\r\n ads: {\r\n [ad.Type]: {\r\n data: omit(ad, 'Id'),\r\n isValid: true,\r\n },\r\n },\r\n adType: ad.Type,\r\n enableAdTypeSelector,\r\n },\r\n isValid: true,\r\n });\r\n }, [availableAdTypes, data, onDataChange]);\r\n\r\n const onEditAd = useCallback((ad) => {\r\n const anotherAdType = find(availableAdTypes, type => type.adType !== ad.Type);\r\n const enableAdTypeSelector = anotherAdType && !anotherAdType.disabled;\r\n\r\n onDataChange({\r\n data: {\r\n ...data,\r\n ads: {\r\n [ad.Type]: {\r\n data: ad,\r\n isValid: true,\r\n },\r\n },\r\n adType: ad.Type,\r\n enableAdTypeSelector,\r\n },\r\n isValid: true,\r\n });\r\n }, [availableAdTypes, data, onDataChange]);\r\n\r\n const onDeleteAd = useCallback((ad) => {\r\n adsRepository\r\n .deleteAd(ad)\r\n .then(() => {\r\n const updatedAds = ads.filter(item => item.Id !== ad.Id);\r\n if (isEmpty(updatedAds)) {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n ads: adTypes.reduce((acc, adType) => {\r\n acc[adType] = {\r\n data: {\r\n FinalUrls: websites,\r\n },\r\n isValid: false,\r\n };\r\n return acc;\r\n }, {}),\r\n adType: first(adTypes),\r\n isEmpty: true,\r\n },\r\n isValid: false,\r\n });\r\n } else {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n ads: updatedAds,\r\n },\r\n isValid: true,\r\n });\r\n }\r\n })\r\n .finally(withUiBlock(containerRef.current));\r\n }, [adTypes, ads, adsRepository, data, onDataChange, websites]);\r\n\r\n return (\r\n \r\n \r\n {map(availableAdTypes, ({ adType, ads: adList, disabled }) => (\r\n
\r\n );\r\n};\r\n\r\nAdsManager.propTypes = {\r\n data: PropTypes.shape({\r\n ads: PropTypes.arrayOf(PropTypes.shape({})),\r\n }).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n adTypes: PropTypes.arrayOf(PropTypes.string),\r\n description: PropTypes.string,\r\n};\r\n\r\nAdsManager.defaultProps = {\r\n adTypes: [],\r\n description: '',\r\n};\r\n","import { isArray, isEmpty } from 'underscore';\r\nimport React, { useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { withPermissions } from '@bingads-webui-react/hoc-with-permissions';\r\nimport { withServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { withScope, QueryParam } from '@bingads-webui-react/scope-service';\r\n\r\nimport { AdEditor } from './ad-editor';\r\nimport { AdsManager } from '../ads-management';\r\n\r\nconst AddTextStepInternal = (props) => {\r\n const {\r\n data,\r\n enableAdsManagment,\r\n wizardPerfMarker,\r\n } = props;\r\n\r\n const stepPerfMarker = useMemo(() => wizardPerfMarker.createChild('AddTextStep', { autoEnd: true }), [wizardPerfMarker]);\r\n\r\n // eslint-disable-next-line object-curly-newline\r\n const { ads, loaded } = data;\r\n\r\n const showAdsManagement = useMemo(() => enableAdsManagment && isArray(ads) && !isEmpty(ads), [enableAdsManagment, ads]);\r\n\r\n return loaded && (\r\n \r\n {showAdsManagement ? (\r\n
\r\n );\r\n};\r\n\r\nAddTextStepInternal.propTypes = {\r\n data: PropTypes.shape({\r\n campaignId: PropTypes.number,\r\n adGroupId: PropTypes.number,\r\n ads: PropTypes.shape({}),\r\n adType: PropTypes.string,\r\n loaded: PropTypes.bool,\r\n }),\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.string),\r\n }),\r\n permissions: PropTypes.shape({\r\n IsImpressionTrackingUrlsEnabled: PropTypes.bool,\r\n }).isRequired,\r\n serverContext: PropTypes.shape({}).isRequired,\r\n scope: PropTypes.instanceOf(QueryParam).isRequired,\r\n wizardPerfMarker: PropTypes.shape({\r\n createChild: PropTypes.func.isRequired,\r\n }).isRequired,\r\n enableAdsManagment: PropTypes.bool,\r\n adTypes: PropTypes.arrayOf(PropTypes.string),\r\n};\r\n\r\nAddTextStepInternal.defaultProps = {\r\n data: {\r\n campaignId: -1,\r\n adGroupId: -1,\r\n ads: {},\r\n loaded: false,\r\n },\r\n error: null,\r\n enableAdsManagment: false,\r\n adTypes: [],\r\n};\r\n\r\nexport const AddTextStep = withPermissions(withServerContext(withScope(AddTextStepInternal)));\r\n","import { uiblockerStyle } from '@bingads-webui-campaign-react/common-styles';\r\n\r\nexport const getExtensionsStepStyles = (_, theme = { palette: {} }) => ({\r\n '@global': {\r\n ...uiblockerStyle(theme),\r\n },\r\n\r\n stepContainer: {\r\n width: '100%',\r\n },\r\n 'stepContainer-xl': {\r\n width: '430px',\r\n },\r\n 'stepContainer-xxl': {\r\n width: '530px',\r\n },\r\n\r\n stepDescription: {\r\n marginBottom: 30,\r\n },\r\n\r\n collapsiblePanel: {\r\n border: 'none',\r\n marginBottom: 'unset',\r\n backgroundColor: 'unset',\r\n '& .panel-heading': {\r\n padding: 0,\r\n borderBottom: 'none',\r\n marginBottom: 18,\r\n\r\n '& .panel-title': {\r\n fontSize: 18,\r\n '& > a': {\r\n marginLeft: '-8px', // compensate 8px padding on the left of icon\r\n color: theme.palette.themePrimary,\r\n padding: 0,\r\n '&:hover, &:active': {\r\n color: theme.palette.themeDarker,\r\n textDecoration: 'none',\r\n backgroundColor: 'unset',\r\n },\r\n },\r\n\r\n '& > a:after': {\r\n transform: 'rotate(180deg)',\r\n },\r\n\r\n '& > a.collapsed:after': {\r\n transform: 'rotate(90deg)',\r\n },\r\n },\r\n },\r\n\r\n '& .panel-collapse': {\r\n '& .panel-body': {\r\n padding: 0,\r\n overflow: 'hidden',\r\n },\r\n },\r\n },\r\n});\r\n","import React, { useCallback, useContext, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { Panel as BootstrapPanel } from 'react-bootstrap';\r\nimport {\r\n Collapse,\r\n TextTitle,\r\n useCollapseState,\r\n ValidatedBootstrapPanel,\r\n} from '@bingads-webui-campaign/wizard-jumbo-card';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ErrorMessages } from '@bingads-webui-react/validation';\r\nimport { ActuationGroup } from '@bingads-webui-campaign-react/actuator';\r\nimport { AttentionBeaconGroup } from '@bingads-webui-campaign-react/attention-beacon';\r\nimport { LearnMoreLink } from '@bingads-webui-campaign-react/help';\r\nimport { FormErrorGroup, UnmappedFormErrors } from '@bingads-webui-campaign-react/form-error';\r\nimport { withPermissions } from '@bingads-webui-react/hoc-with-permissions';\r\nimport { withServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { useResponsiveStyles } from '@bingads-webui-campaign-react/common-hooks';\r\nimport { useWizardService } from '@bingads-webui-react/wizard';\r\n\r\nimport { getExtensionsStepStyles } from './styles';\r\nimport { StepHeader } from '../../shared/step-header';\r\n\r\nconst ExtensionsStepInternal = (props) => {\r\n const {\r\n data,\r\n onDataChange,\r\n error,\r\n permissions,\r\n } = props;\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n const {\r\n campaignId,\r\n campaignName,\r\n adExtensionsAssociations,\r\n loaded,\r\n } = data;\r\n\r\n const { state } = useWizardService();\r\n const {\r\n adExtensionsAssociationsFactory,\r\n adExtensionsDynamicFeatures,\r\n } = state.context.wizardData;\r\n\r\n const activity = useContext(ActivityContext);\r\n const getStyles = useResponsiveStyles(getExtensionsStepStyles);\r\n const i18n = useContext(I18nContext);\r\n\r\n const onUpdateExtensionsAssociations = useCallback((extensionType, associations) => {\r\n activity.signal(`onExtensionsUpdate - ${JSON.stringify({\r\n extensionType,\r\n extensionAssociations: associations,\r\n })}`);\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adExtensionsAssociations: {\r\n ...adExtensionsAssociations,\r\n [extensionType]: associations,\r\n },\r\n },\r\n isValid: true,\r\n });\r\n }, [adExtensionsAssociations]); // eslint-disable-line react-hooks/exhaustive-deps\r\n\r\n const getAdExtensionsSections = useCallback(\r\n extensionTypes => adExtensionsAssociationsFactory.extensionsAssociationsFactory(campaignId, campaignName, extensionTypes, adExtensionsDynamicFeatures)\r\n .reduce((memo, {\r\n extensionType,\r\n title,\r\n topic,\r\n details,\r\n AssociationPanel,\r\n }) => {\r\n const sectionKey = extensionType;\r\n const associations = adExtensionsAssociations[extensionType];\r\n\r\n const panel = (\r\n \r\n \r\n {otherAdExtensionsSections.panels}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n <>\r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nExtensionsStepInternal.propTypes = {\r\n data: PropTypes.shape({\r\n campaignId: PropTypes.number,\r\n campaignName: PropTypes.string,\r\n adExtensionsAssociations: PropTypes.shape({}),\r\n loaded: PropTypes.bool,\r\n }),\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.string),\r\n }),\r\n permissions: PropTypes.shape({\r\n IsImpressionTrackingUrlsEnabled: PropTypes.bool,\r\n }).isRequired,\r\n serverContext: PropTypes.shape({}).isRequired,\r\n wizardPerfMarker: PropTypes.shape({\r\n createChild: PropTypes.func.isRequired,\r\n }).isRequired,\r\n};\r\n\r\nExtensionsStepInternal.defaultProps = {\r\n data: {\r\n adExtensionsAssociations: {},\r\n loaded: false,\r\n },\r\n error: null,\r\n};\r\n\r\nexport const ExtensionsStep = withPermissions(withServerContext(ExtensionsStepInternal));\r\n","/* eslint-disable import/no-named-as-default-member */\r\nimport { map } from 'underscore';\r\nimport { useCallback, useContext, useMemo } from 'react';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { useWizardService } from '@bingads-webui-react/wizard';\r\nimport { loadExtensionsAssociations } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport addressSchema from '@bingads-webui-component-legacy/address/addressSchema';\r\n\r\nconst extensionSchemaProcessors = {\r\n Location: entity => ({\r\n ...entity,\r\n display: addressSchema.display(entity.Address),\r\n }),\r\n};\r\n\r\nexport const useExtensionsRepository = ({ permissions }) => {\r\n const activity = useContext(ActivityContext);\r\n const { scope } = useContext(ScopeContext);\r\n const { cid, aid } = scope.values;\r\n\r\n const { state } = useWizardService();\r\n const {\r\n campaignId,\r\n campaignName,\r\n adExtensionsAssociationsFactory,\r\n } = state.context.wizardData;\r\n\r\n const availableExtensionTypes = useMemo(\r\n () => map(adExtensionsAssociationsFactory.getAvailableExtensions(permissions, 'Search'), extension => adExtensionsAssociationsFactory.extensionEntityMapping[extension] || extension),\r\n [adExtensionsAssociationsFactory, permissions]\r\n );\r\n\r\n const load = useCallback(() => loadExtensionsAssociations({\r\n cid,\r\n aid,\r\n campaignId,\r\n adExtensionTypes: availableExtensionTypes,\r\n }).then(({ value }) => {\r\n const adExtensionsAssociations = value.reduce((extensionsAssociations, item) => {\r\n const entityType = item.AdExtension['@odata.type'].split('.').pop(); // Extract the type\r\n const extensionType = adExtensionsAssociationsFactory.extensionNameMapping[entityType] || entityType;\r\n if (!extensionsAssociations[extensionType]) {\r\n // eslint-disable-next-line no-param-reassign\r\n extensionsAssociations[extensionType] = [];\r\n }\r\n if (extensionSchemaProcessors[extensionType]) {\r\n extensionsAssociations[extensionType].push(extensionSchemaProcessors[extensionType](item.AdExtension));\r\n } else {\r\n extensionsAssociations[extensionType].push(item.AdExtension);\r\n }\r\n return extensionsAssociations;\r\n }, {});\r\n\r\n return {\r\n campaignId,\r\n campaignName,\r\n adExtensionsAssociations,\r\n loaded: true,\r\n };\r\n }), [adExtensionsAssociationsFactory.extensionNameMapping, aid, availableExtensionTypes, campaignId, campaignName, cid]);\r\n\r\n const save = useCallback(({ data }) => {\r\n const { adExtensionsAssociations } = data;\r\n activity.signal(`onExtensionsSaved - ${JSON.stringify(adExtensionsAssociations)}`);\r\n return Promise.resolve(data);\r\n }, [activity]);\r\n\r\n return {\r\n load,\r\n save,\r\n };\r\n};\r\n","import { paginationStyle,\r\n toggleButtonStyle,\r\n searchboxStyle,\r\n tableStyle,\r\n linkStyle,\r\n statusStyle,\r\n containerBudgetStyle,\r\n sharedBudgetGridWrapper,\r\n selectElementStyle,\r\n alertStyle } from '@bingads-webui-campaign-react/common-styles';\r\nimport { getCollapsiblePanelStyles } from '../../shared/styles';\r\n\r\nexport const getStyles = (components, theme, palette = {}) => ({\r\n collapsiblePanel: {\r\n ...getCollapsiblePanelStyles(components, theme),\r\n '& .predictive-matching-desc': {\r\n width: 566,\r\n },\r\n },\r\n formContainer: {\r\n display: 'flex',\r\n width: '100%',\r\n gap: '36px',\r\n '& .left-part': {\r\n minWidth: '966px',\r\n },\r\n '& .right-part': {\r\n width: '350px',\r\n },\r\n '& .section-title': {\r\n marginTop: '28px',\r\n marginBottom: '8px',\r\n },\r\n '& .section-description': {\r\n marginBottom: '16px',\r\n },\r\n },\r\n budgetAndBidSection: {\r\n ...searchboxStyle,\r\n ...toggleButtonStyle,\r\n ...linkStyle,\r\n ...containerBudgetStyle(theme),\r\n ...sharedBudgetGridWrapper(theme),\r\n ...tableStyle(theme),\r\n ...selectElementStyle(theme),\r\n ...alertStyle(theme),\r\n ...statusStyle(theme),\r\n '& .displayNone': {\r\n display: 'none',\r\n },\r\n '& .bid-strategy-selection-container': {\r\n '& .col-sm-6': {\r\n width: '100%',\r\n '& .form-control-static': {\r\n fontWeight: 600,\r\n '& a': {\r\n visibility: 'hidden',\r\n },\r\n },\r\n },\r\n },\r\n '& .original-portfolio-strategy-container': {\r\n width: '700px',\r\n },\r\n '& label[for=\"input-bid\"]': {\r\n padding: '16px 0px 8px 0px',\r\n },\r\n ...paginationStyle({ palette }),\r\n },\r\n});\r\n","import React, { useContext, useState, useCallback, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { Panel as BootstrapPanel } from 'react-bootstrap';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { HelpPopup } from '@bingads-webui-react/help-popup';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { ValidationGroup, ErrorMessages } from '@bingads-webui-react/validation';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { ActuationGroup } from '@bingads-webui-campaign-react/actuator';\r\nimport {\r\n Collapse,\r\n TextTitle,\r\n ValidatedBootstrapPanel,\r\n ValidatedPanel,\r\n getPanelErrorProps,\r\n useCollapseState,\r\n} from '@bingads-webui-campaign/wizard-jumbo-card';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport { Campaign } from '@bingads-webui/campaign-odata-schemas';\r\nimport { AttentionBeaconGroup } from '@bingads-webui-campaign-react/attention-beacon';\r\nimport { FormErrorGroup, UnmappedFormErrors, andComp, orComp, entityIs, propertyIs } from '@bingads-webui-campaign-react/form-error';\r\nimport { useFormService } from '@bingads-webui-react/form';\r\nimport { AdDistributionWithValidationSection } from '@bingads-webui-campaign/ad-distribution';\r\nimport { ValidatedLegacyAdSchedule, getAdScheduleDetails } from '@bingads-webui-campaign/ad-schedule';\r\nimport { ValidatedLegacyBidStrategy } from '@bingads-webui-campaign/bid-strategy';\r\nimport { ValidatedDefaultBid } from '@bingads-webui-campaign-react/default-bid';\r\nimport { ValidationStringMap } from '@bingads-webui/validation-string-map';\r\nimport { buildLegacyI18n } from '@bingads-webui/build-legacy-i18n';\r\nimport { mediumEnum, getBidStrategyTitleDetails, bidStratetyTypeValue } from '@bingads-webui-campaign-react/constants';\r\nimport { ERROR_ENTITY } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { ValidatedDateSetting, getDateSettingDetails } from '@bingads-webui-campaign-react/date-setting';\r\nimport { ValidatedLegacySharedBudget, getBudgetTitleDetails } from '@bingads-webui-campaign/shared-budget';\r\nimport { PredictiveMatching, getPredictiveMatchingDetails, ValidatedBrandLists, getBrandListsTitleDetails } from '@bingads-webui-campaign-react/search-campaign-wizard-controls';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\n\r\nimport { getStyles } from './styles';\r\nimport { StepHeader } from '../../shared/step-header';\r\nimport BudgetImg from '../../shared/media/budget.svg';\r\nimport BidStrategyImg from '../../shared/media/bid-strategy.svg';\r\nimport PredictiveMatchingImg from '../../shared/media/predictive-matching.svg';\r\nimport BrandListsImg from '../../shared/media/brand-lists.svg';\r\n\r\nconst entityIsAdGroup = entityIs(ERROR_ENTITY.AdGroup);\r\nconst entityIsCampaign = entityIs(ERROR_ENTITY.Campaign);\r\nconst ServerValidatedLegacyBidStrategy = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedLegacyBidStrategy, { filter: andComp(entityIsCampaign, propertyIs('BiddingScheme')) }));\r\nconst ServerValidatedDefaultBid = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedDefaultBid, { filter: andComp(entityIsAdGroup, propertyIs('BidAmount')) }));\r\nconst ServerValidatedLegacyAdSchedule = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedLegacyAdSchedule, { filter: entityIs(ERROR_ENTITY.CampaignDayTimeCriterion) }));\r\nconst ServerValidatedLegacyDateSetting = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedDateSetting, { filter: andComp(entityIsAdGroup, orComp(propertyIs('StartDate'), propertyIs('EndDate'))) }));\r\nconst ServerValidatedLegacySharedBudget = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedLegacySharedBudget, { filter: andComp(entityIsCampaign, propertyIs('Budget')) }));\r\nconst ServerValidatedBrandLists = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedBrandLists, { filter: entityIs(ERROR_ENTITY.BrandListAssociation) }));\r\n\r\nexport const BudgetAndBidsStep = ({\r\n data,\r\n onDataChange,\r\n error,\r\n}) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n const i18n = useContext(I18nContext);\r\n const legacyI18n = useMemo(() => buildLegacyI18n(i18n, [ValidationStringMap]), [i18n]);\r\n const activity = useContext(ActivityContext);\r\n const classes = useDefaultStyles(getStyles);\r\n const { state: { context: { saveFailed: showAllValidationErrors } } } = useFormService();\r\n const [advancedSettingsSectionExpanded, setAdvancedSettingsSectionExpanded] = useState(false);\r\n const [adScheduleView, setAdScheduleView] = useState(null);\r\n const onAdvancedSettingsSectionToggle = useCallback((expanded) => {\r\n setAdvancedSettingsSectionExpanded(expanded);\r\n }, []);\r\n\r\n const serverContext = useContext(ServerContext);\r\n const {\r\n DynamicPermissions,\r\n } = serverContext;\r\n\r\n const [\r\n allBudgetAndBidSections,\r\n budgetAndBidExpandedSections,\r\n setBudgetAndBidExpandedSections,\r\n ] = useCollapseState(\r\n ['budget', 'bid-strategy'] /* all sections */,\r\n ['budget', 'bid-strategy'] /* initially expanded sections */\r\n );\r\n\r\n const [\r\n allAdScheduleSections,\r\n adScheduleExpandedSections,\r\n setAdScheduleExpandedSections,\r\n ] = useCollapseState(\r\n ['start-end-date', 'ad-schedule'] /* all sections */,\r\n [] /* initially expanded sections */\r\n );\r\n\r\n const [\r\n allPredictiveMatchingSections,\r\n predictiveMatchingExpandedSections,\r\n setPredictiveMatchingExpandedSections,\r\n ] = useCollapseState(\r\n ['predictive-matching', 'brand-lists'] /* all sections */,\r\n ['predictive-matching', 'brand-lists'] /* initially expanded sections */\r\n );\r\n\r\n const [\r\n allAdDistributionSections,\r\n adDistributionExpandedSections,\r\n setAdDistributionExpandedSections,\r\n ] = useCollapseState(\r\n ['ad-distribution'] /* all sections */,\r\n [] /* initially expanded sections */\r\n );\r\n\r\n const onAdGroupValidate = useCallback((result) => {\r\n if (data && data.adGroup) {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...data.adGroup,\r\n ...result.data,\r\n },\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }, [data, onDataChange]);\r\n\r\n const onDistributionValidate = useCallback((result) => {\r\n if (data && data.adGroup) {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...data.adGroup,\r\n ...result.data,\r\n Medium: mediumEnum.Search,\r\n },\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }, [data, onDataChange]);\r\n\r\n const onCampaignValidate = useCallback((result) => {\r\n if (data && data.campaign) {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n campaign: {\r\n ...data.campaign,\r\n ...result.data,\r\n },\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }, [data, onDataChange]);\r\n\r\n const budgetAndBidSection = useMemo(() => {\r\n const biddingScheme = data && data.campaign && data.campaign.BiddingScheme;\r\n const bidType = biddingScheme && biddingScheme.Type;\r\n const bidStrategy = biddingScheme && biddingScheme.BidStrategyId;\r\n let bidOption = bidType;\r\n if (!bidOption || bidStrategy) {\r\n bidOption = bidStratetyTypeValue.portfolioBidStrategy;\r\n }\r\n const budgetComponent = (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {suggestedExtensionsSection}\r\n {moreExtensionsSection}\r\n
\r\n \r\n \r\n { budgetAndBidSections }\r\n \r\n
\r\n );\r\n }, [activity, allBudgetAndBidSections, budgetAndBidExpandedSections, classes.budgetAndBidSection, data, i18n, onAdGroupValidate, onCampaignValidate, serverContext, setBudgetAndBidExpandedSections]);\r\n\r\n const performanceSection = useMemo(() => {\r\n /* const campaignPerformanceComponent = (\r\n \r\n \r\n { performanceSections }\r\n \r\n
\r\n );\r\n }, []);\r\n\r\n const advancedSettingsSection = useMemo(() => {\r\n const dateSettingComponent = (\r\n \r\n (\r\n <>\r\n \r\n \r\n {i18n.getString(_TL_('Advanced settings'))}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n
\r\n );\r\n }, [DynamicPermissions, adDistributionExpandedSections, adScheduleExpandedSections, adScheduleView, advancedSettingsSectionExpanded, allAdDistributionSections, allAdScheduleSections, allPredictiveMatchingSections, classes.collapsiblePanel, data, i18n, onAdGroupValidate, onAdvancedSettingsSectionToggle, onCampaignValidate, onDistributionValidate, predictiveMatchingExpandedSections, setAdDistributionExpandedSections, setAdScheduleExpandedSections, setPredictiveMatchingExpandedSections]);\r\n\r\n return (\r\n \r\n \r\n { showPredictiveMatching &&\r\n \r\n \r\n { adScheduleSection }\r\n \r\n \r\n \r\n
\r\n \r\n \r\n {i18n.getString(_TL_('Ad schedule'))}\r\n
\r\n
\r\n \r\n {i18n.getString(_TL_('Ad schedule'))}\r\n
\r\n \r\n {i18n.getString(_TL_('Choose when you want your ads to run.'))}\r\n
\r\n \r\n \r\n {i18n.getString(_TL_('Ad distribution'))}\r\n
\r\n
\r\n \r\n {i18n.getString(_TL_('Ad distribution'))}\r\n
\r\n \r\n {i18n.getString(_TL_('Choose where you want to show your ad on the Microsoft Advertising Network.'))}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nBudgetAndBidsStep.propTypes = {\r\n data: PropTypes.shape({}).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n};\r\n\r\nBudgetAndBidsStep.defaultProps = {\r\n error: null,\r\n};\r\n","import _ from 'underscore';\r\nimport Promise from 'bluebird';\r\nimport { useCallback, useContext } from 'react';\r\nimport { useWizardService } from '@bingads-webui-react/wizard';\r\nimport { loadCampaign, saveBudget, loadAdGroupForBudget, modelToViewModelForBudget, readScheduleCriterions } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ActivityContext, ScenarioContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { mediumEnum } from '@bingads-webui-campaign-react/constants';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\n\r\nconst defaultCampaignSettings = {\r\n BiddingScheme: {\r\n Type: 'EnhancedCpc',\r\n },\r\n};\r\n\r\nconst defaultAdGroup = {\r\n AdDistribution: 'BingYahooAndSearchPartners',\r\n};\r\n\r\nexport const useBudgetAndBidSettingsRepository = () => {\r\n const i18n = useContext(I18nContext);\r\n const { scope } = useContext(ScopeContext) || {};\r\n const scenario = useContext(ScenarioContext);\r\n const activity = useContext(ActivityContext);\r\n const { cid, aid } = scope.values;\r\n const { state } = useWizardService();\r\n const { campaignId, adGroupId } = state.context.wizardData;\r\n\r\n const load = useCallback(() => {\r\n const loadPromises = {\r\n campaign: campaignId ? loadCampaign(cid, aid, campaignId) : Promise.resolve(defaultCampaignSettings),\r\n adGroup: adGroupId ? loadAdGroupForBudget(cid, aid, campaignId, adGroupId, i18n) : Promise.resolve(defaultAdGroup),\r\n scheduleCriterion: campaignId ? readScheduleCriterions(cid, aid, campaignId) : Promise.resolve(null),\r\n };\r\n\r\n return Promise.props(loadPromises)\r\n .then(({\r\n campaign: rawCampaign,\r\n adGroup,\r\n scheduleCriterion,\r\n }) => {\r\n const campaign = modelToViewModelForBudget({\r\n campaignModel: rawCampaign,\r\n scheduleCriterionModel: scheduleCriterion ? scheduleCriterion.value : null,\r\n });\r\n\r\n return Promise.resolve({\r\n campaign,\r\n adGroup: _.defaults(adGroup, {\r\n Medium: mediumEnum.Search, // default to Search for saarch campaign\r\n }),\r\n });\r\n })\r\n .catch((error) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Load budget and bid settings failed: ${error}`);\r\n activity.signal(`onBidBudgetLoadFailed - ${JSON.stringify({\r\n campaignId,\r\n adGroupId,\r\n error,\r\n })}`);\r\n return Promise.reject(error);\r\n });\r\n }, [activity, adGroupId, aid, campaignId, cid, i18n]);\r\n\r\n const save = useCallback(({ data }) => {\r\n // to do later: bulk\r\n const saveBudgetPromise = () => saveBudget(data, {\r\n scenario: scenario.name,\r\n i18n,\r\n activityLogger: activity,\r\n });\r\n\r\n return saveBudgetPromise()\r\n .catch((error) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n // eslint-disable-next-line no-console\r\n console.error(`Save budget and bid settings failed: ${error}`);\r\n activity.signal(`onBidBudgetSaveFailed - ${JSON.stringify({\r\n data,\r\n error,\r\n })}`);\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n data: {\r\n campaign: error.campaign,\r\n adGroup: error.adGroup,\r\n },\r\n error: {\r\n serverErrors: _.flatten(serverErrors.filter(val => val !== null)),\r\n systemErrors: _.flatten(systemErrors.filter(val => val !== null)),\r\n },\r\n });\r\n });\r\n }, [activity, i18n, scenario.name]);\r\n\r\n return {\r\n load,\r\n save,\r\n };\r\n};\r\n","export const getStyles = () => ({\r\n\r\n});\r\n","import _ from 'underscore';\r\nimport { useContext, useEffect, useState } from 'react';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport _preferencesService from '@bingads-webui-component-legacy/preference/service/index';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { KEYWORDS_SHOW_COUNT } from '@bingads-webui-campaign-react/search-campaign-data';\r\n\r\nconst buildSchemaData = ({\r\n data, serverContext, timeDisplayType, i18n,\r\n}) => {\r\n const locations = _.map(\r\n _.filter(\r\n data.campaign && data.campaign.locationTargets && data.campaign.locationTargets.currentLevelSettings.currentLocations,\r\n loc => loc.SelectionStatus === 'Included'\r\n ),\r\n loc => loc.location\r\n );\r\n\r\n return ({\r\n websiteURL: {\r\n data: (data.websites && data.websites[0]) || i18n.getString(_TL_('No website URL')),\r\n },\r\n campaignName: {\r\n data: data.campaign && data.campaign.Name,\r\n },\r\n locationTargeting: {\r\n locations,\r\n targetOption: data.campaign && data.campaign.locationTargets && data.campaign.locationTargets.currentLevelSettings.targetOption,\r\n },\r\n languages: {\r\n data: data.campaign && data.campaign.Languages,\r\n },\r\n conversionGoals: {\r\n conversionGoals: data.campaign && data.campaign.conversionGoals,\r\n },\r\n keywords: {\r\n data: data.keywords,\r\n showLength: KEYWORDS_SHOW_COUNT,\r\n },\r\n budget: {\r\n data: data.campaign.Budget,\r\n currencyCode: serverContext.CurrentAccount.CurrencyCode,\r\n },\r\n bidStrategy: {\r\n data: data.campaign && data.campaign.BiddingScheme,\r\n },\r\n adSchedule: {\r\n adSchedules: data.campaign && data.campaign.dayTimeRanges,\r\n useSearcherTimeZone: data.campaign && data.campaign.AdScheduleUseSearcherTimeZone,\r\n timeDisplayType,\r\n },\r\n startEndDates: {\r\n startDate: data.adGroup && data.adGroup.StartDate,\r\n endDate: data.adGroup && data.adGroup.EndDate,\r\n },\r\n adDistribution: {\r\n adDistribution: data.adGroup && data.adGroup.AdDistribution,\r\n },\r\n adCreationPreview: {\r\n data: data.ads,\r\n },\r\n });\r\n};\r\n\r\nexport const useSummarySchemaData = ({ data }) => {\r\n const i18n = useContext(I18nContext);\r\n const serverContext = useContext(ServerContext);\r\n const [timeDisplayType, setTimeDisplayType] = useState('12-hour');\r\n\r\n useEffect(() => {\r\n const preferencesService = _preferencesService.default || _preferencesService;\r\n preferencesService.initialize().then(() => {\r\n const isTwelveHourDisplay = preferencesService.findByName('WebApp.CampaignUI.isTwelveHourDisplay') || {};\r\n setTimeDisplayType(_.isUndefined(isTwelveHourDisplay.Data) || isTwelveHourDisplay.Data ? '12-hour' : '24-hour');\r\n });\r\n }, []);\r\n\r\n return (data && buildSchemaData({\r\n data, serverContext, timeDisplayType, i18n,\r\n })) || {};\r\n};\r\n","import React, { useCallback, useContext, useMemo } from 'react';\r\nimport classNames from 'classnames';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { Stack } from '@bingads-webui-react/fabric-control';\r\nimport { useFormService } from '@bingads-webui-react/form';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ReactTemplate } from '@bingads-webui-react/react-template';\r\nimport { GeneratedUI } from '@bingads-webui-campaign-react/ui-generator';\r\nimport { summaryPageComponentTypes } from '@bingads-webui-campaign-react/summary-page';\r\nimport { useWizardService, WIZARD_EVENTS } from '@bingads-webui-react/wizard';\r\nimport { FormErrorGroup, UnmappedFormErrors } from '@bingads-webui-campaign-react/form-error';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { getStyles } from './styles';\r\nimport { buildSchema } from './schema';\r\nimport { useSummarySchemaData } from './use-summary-schema-data';\r\nimport { SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS } from '../step-utils';\r\nimport { StepHeader } from '../../shared/step-header';\r\n\r\nconst SummaryStepInternal = ({ data, error }) => {\r\n const i18n = useContext(I18nContext);\r\n const schemaData = useSummarySchemaData({ data });\r\n const { send } = useWizardService();\r\n const classes = useDefaultStyles(getStyles);\r\n const activity = useContext(ActivityContext);\r\n const {\r\n serverErrors = [],\r\n } = error || {};\r\n const { state: { context: { saveFailed: showAllValidationErrors } } } = useFormService();\r\n\r\n const onCampaignSettingsHeaderActionClick = useCallback(() => {\r\n if (activity) {\r\n activity.signal('onCampaignSettingsHeaderActionClick');\r\n }\r\n const stepId = SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.CAMPAIGN_SETTINGS;\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, { focusedStepId: stepId });\r\n send(WIZARD_EVENTS.NAVIGATE_TO, {\r\n stepId,\r\n });\r\n }, [send, activity]);\r\n\r\n const onAdsHeaderActionClick = useCallback(() => {\r\n if (activity) {\r\n activity.signal('onAdsHeaderActionClick');\r\n }\r\n const stepId = SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.CREATE_AD;\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, { focusedStepId: stepId });\r\n send(WIZARD_EVENTS.NAVIGATE_TO, {\r\n stepId,\r\n });\r\n }, [send, activity]);\r\n\r\n const onKeywordsHeaderActionClick = useCallback(() => {\r\n if (activity) {\r\n activity.signal('onKeywordsHeaderActionClick');\r\n }\r\n const stepId = SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.KEYWORDS;\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, { focusedStepId: stepId });\r\n send(WIZARD_EVENTS.NAVIGATE_TO, {\r\n stepId,\r\n });\r\n }, [send, activity]);\r\n\r\n const onBudgetBidHeaderActionClick = useCallback(() => {\r\n if (activity) {\r\n activity.signal('onBudgetBidHeaderActionClick');\r\n }\r\n const stepId = SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.BUDGET_AND_BIDS;\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, { focusedStepId: stepId });\r\n send(WIZARD_EVENTS.NAVIGATE_TO, {\r\n stepId,\r\n });\r\n }, [send, activity]);\r\n\r\n const options = useMemo(() => ({\r\n onCampaignSettingsHeaderActionClick,\r\n onAdsHeaderActionClick,\r\n onKeywordsHeaderActionClick,\r\n onBudgetBidHeaderActionClick,\r\n }), [onCampaignSettingsHeaderActionClick, onAdsHeaderActionClick, onKeywordsHeaderActionClick, onBudgetBidHeaderActionClick]);\r\n\r\n const schema = useMemo(() => buildSchema(options), [options]);\r\n const model = useMemo(() => ({ b: text => {text} }), []);\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n { budgetAndBidSection }\r\n { advancedSettingsSection }\r\n
\r\n \r\n {performanceSection}\r\n
\r\n \r\n \r\n \r\n \r\n {data ?\r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nexport const SummaryStep = ({ data, error }) => (\r\n \r\n
\r\n \r\n
\r\n : null\r\n }\r\n \r\n
\r\n \r\n \r\n {campaignSettingsExpandedSections.length ? i18n.getString(_TL_('Collapse all')) : i18n.getString(_TL_('Expand all'))}\r\n \r\n \r\n { basicSettings }\r\n \r\n
\r\n );\r\n }, [activity, allCampaignSettingsSections, basicSettingsExpand, campaign, campaignSettingsExpandedSections, data, flipCampaignSettingsExpandAllState, i18n, locale, onValidate, permissions, serverContext, setCampaignSettingsExpandedSections]);\r\n\r\n\r\n const [\r\n allBidAdjustmentSections,\r\n bidAdjustmentExpandedSections,\r\n setBidAdjustmentExpandedSections,\r\n flipBidAdjustmentExpandAllState,\r\n expandAllBidAdjustmentSections,\r\n ] = useCollapseState(\r\n ['locations', 'device', 'gender', 'age', 'companyName', 'industry', 'jobFunction'] /* all sections */,\r\n [] /* initially expanded sections */\r\n );\r\n\r\n const allBidAdjustmentExpand = useMemo(\r\n () => collapseExpander({ setActiveKeys: setBidAdjustmentExpandedSections }),\r\n [setBidAdjustmentExpandedSections]\r\n );\r\n\r\n const [bidAdjustmentSectionExpanded, setBidAdjustmentSectionExpanded] = useState(false);\r\n const onBidAdjustmentSectionToggle = useCallback((expanded) => {\r\n setBidAdjustmentSectionExpanded(expanded);\r\n }, []);\r\n\r\n const bidAdjustmentSection = useMemo(() => {\r\n const locationPanel = (\r\n \r\n (\r\n <>\r\n \r\n \r\n {i18n.getString(_TL_('Bid adjustments'))}\r\n \r\n \r\n {bidAdjustmentSectionExpanded && bidAdjustmentExpandedSections.length ? i18n.getString(_TL_('Collapse all')) : i18n.getString(_TL_('Expand all')) }\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n
\r\n );\r\n }, [Languages, aid, allBidAdjustmentExpand, allBidAdjustmentSections, basicSettingsExpand, bidAdjustmentExpandedSections, bidAdjustmentSectionExpanded, campaign, campaignId, cid, classes, data, expandAllBidAdjustmentSections, flipBidAdjustmentExpandAllState, i18n, market, onBidAdjustmentSectionToggle, permissions, scope, setBidAdjustmentExpandedSections]);\r\n\r\n const [\r\n allAdvancedSettingsSections,\r\n advancedSettingsExpandedSections,\r\n setAdvancedSettingsExpandedSections,\r\n flipAdvancedSettingsExpandAllState,\r\n expandAllAdvancedSettingsSections,\r\n ] = useCollapseState(\r\n ['conversions', 'disclaimer', 'web-exclusions', 'dsa-settings', 'ad-schedule', 'advanced-url-options', 'predictive-matching', 'brand-lists', 'multimedia-ad'] /* all sections */,\r\n ['conversions', 'disclaimer', 'dsa-settings', 'ad-schedule', 'web-exclusions', 'predictive-matching', 'brand-lists'] /* initially expanded sections */\r\n );\r\n\r\n const allAdvancedSettingsExpand = useMemo(\r\n () => collapseExpander({ setActiveKeys: setAdvancedSettingsExpandedSections }),\r\n [setAdvancedSettingsExpandedSections]\r\n );\r\n\r\n const [advancedSettingsSectionExpanded, setAdvancedSettingsSectionExpanded] = useState(false);\r\n const onAdvancedSettingsSectionToggle = useCallback((expanded) => {\r\n setAdvancedSettingsSectionExpanded(expanded);\r\n }, []);\r\n\r\n const triggerTestUurl = useCallback((fn, originalView) => {\r\n extend(originalView, {\r\n isInline: false,\r\n level: uurlLevels.Campaign,\r\n });\r\n const context = {\r\n customerId: cid,\r\n userId: uid,\r\n accountId: aid,\r\n campaignId,\r\n };\r\n const params = urlOptionsDetails.current;\r\n const options = {\r\n apiInLog: 'advancedSettingsUrlOptions/uurlTest',\r\n };\r\n testUurl(fn, originalView, params, context, options);\r\n }, [aid, campaignId, cid, uid]);\r\n\r\n const advancedSettingsSection = useMemo(() => {\r\n const dsaSettingPanel = (\r\n \r\n \r\n { bidAdjustment }\r\n \r\n
\r\n \r\n (\r\n <>\r\n \r\n \r\n {i18n.getString(_TL_('Advanced settings'))}\r\n \r\n \r\n {advancedSettingsSectionExpanded && advancedSettingsExpandedSections.length ? i18n.getString(_TL_('Collapse all')) : i18n.getString(_TL_('Expand all'))}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n
\r\n );\r\n }, [DynamicPermissions, permissions, FinalUrlSuffix, IsConversionAssociationWarningEnabled, Token, TrackingUrlTemplate, UrlCustomParameters, adScheduleView, advancedSettingsExpandedSections, advancedSettingsSectionExpanded, aid, allAdvancedSettingsExpand, allAdvancedSettingsSections, campaign, campaignId, cid, classes.advancedCampaignSection, classes.collapsiblePanel, data, expandAllAdvancedSettingsSections, flipAdvancedSettingsExpandAllState, i18n, onAdvancedSettingsSectionToggle, onValidate, setAdvancedSettingsExpandedSections, setExclusionsCallback, triggerTestUurl, webExclusionsError]);\r\n\r\n return (\r\n \r\n \r\n { advancedSettings }\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nCampaignEditSettingsStep.propTypes = {\r\n data: PropTypes.shape({\r\n campaign: PropTypes.shape({\r\n Id: PropTypes.string,\r\n Name: PropTypes.string,\r\n AutoTargetingEnabled: PropTypes.bool,\r\n BiddingScheme: PropTypes.shape({\r\n Type: PropTypes.string,\r\n }),\r\n BidStrategyName: PropTypes.string,\r\n Budget: PropTypes.shape({\r\n Amount: PropTypes.number,\r\n }),\r\n isPredictiveMatchingChecked: PropTypes.bool,\r\n brandProtections: PropTypes.shape({}),\r\n locationTargets: PropTypes.arrayOf(PropTypes.shape({})),\r\n dayTimeRanges: PropTypes.arrayOf(PropTypes.shape({})),\r\n TimeZone: PropTypes.string,\r\n AdScheduleUseSearcherTimeZone: PropTypes.bool,\r\n }),\r\n bundleCountries: PropTypes.shape({}),\r\n bundleLocationCriterions: PropTypes.shape({}),\r\n websites: PropTypes.shape([]),\r\n exclusions: PropTypes.shape({\r\n campaignExclusions: PropTypes.shape({}),\r\n }).isRequired,\r\n multimediaAds: PropTypes.shape({}).isRequired,\r\n dsaSettings: PropTypes.shape({}).isRequired,\r\n }).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n};\r\n\r\nCampaignEditSettingsStep.defaultProps = {\r\n error: null,\r\n};\r\n","import _ from 'underscore';\r\nimport Promise from 'bluebird';\r\nimport { useState, useCallback, useContext, useMemo } from 'react';\r\nimport { useWizardService, WIZARD_EVENTS } from '@bingads-webui-react/wizard';\r\nimport {\r\n loadCampaign,\r\n saveCampaign,\r\n loadBundleCountries,\r\n modelToViewModelForCampaign,\r\n readLocationCriterions,\r\n loadDisclaimerAssociations,\r\n readScheduleCriterions,\r\n readTargetCriterion,\r\n loadAssociatedPageFeeds,\r\n} from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ActivityContext, ScenarioContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport exclusionRepository from '@bingads-webui-campaign-legacy/advanced-settings/util/exclusion-repository';\r\nimport { ScopeLevel } from '@bingads-webui-campaign-react/constants';\r\nimport { entitySeparator, formatInvalidEntities } from '@bingads-webui-react/web-exclusions';\r\nimport { InstrumentationContext } from '@bingads-webui-react/hoc-with-instrumentation';\r\nimport { showBudgetBidCampaignNotifications } from '@bingads-webui-campaign/import-shared-utils';\r\nimport { globalizationModelSetup } from '@bingads-webui-campaign/ads-globalization';\r\n\r\nconst defaultWebsites = [];\r\n\r\nexport const useCampaignEditSettingsRepository = () => {\r\n const i18n = useContext(I18nContext);\r\n const scenario = useContext(ScenarioContext);\r\n const activity = useContext(ActivityContext);\r\n const serverContext = useContext(ServerContext);\r\n const instrumentation = useContext(InstrumentationContext);\r\n\r\n const { scope } = useContext(ScopeContext) || {};\r\n const {\r\n cid, aid, campaignId,\r\n } = scope.values;\r\n\r\n const {\r\n CurrentLocale: locale,\r\n DynamicPermissions,\r\n Permissions,\r\n } = serverContext;\r\n const permissions = useMemo(() => ({ dynamic: { ...DynamicPermissions }, ...Permissions }), [DynamicPermissions, Permissions]);\r\n\r\n const { state, send } = useWizardService();\r\n const {\r\n websites: savedWebsites,\r\n } = state.context.wizardData;\r\n\r\n const [initialCampaign, setInitialCampaign] = useState({});\r\n\r\n const load = useCallback(() => {\r\n const loadPromises = {\r\n campaign: loadCampaign(cid, aid, campaignId),\r\n locationTargets: readLocationCriterions(cid, aid, campaignId),\r\n scheduleCriterion: readScheduleCriterions(cid, aid, campaignId),\r\n disclaimerAssociations: loadDisclaimerAssociations({ cid, aid, campaignId }),\r\n exclusions: exclusionRepository.load(campaignId, null, ScopeLevel.Campaign),\r\n targetCriterion: readTargetCriterion(cid, aid, campaignId),\r\n pageFeeds: loadAssociatedPageFeeds(cid, aid, campaignId),\r\n };\r\n\r\n return Promise.props(loadPromises)\r\n .then(async ({\r\n campaign: rawCampaign,\r\n adGroup,\r\n locationTargets,\r\n scheduleCriterion,\r\n disclaimerAssociations,\r\n exclusions: [campaignExclusions],\r\n targetCriterion,\r\n pageFeeds,\r\n }) => {\r\n const bundleCountriesAndLocationCriterions = await loadBundleCountries({\r\n cid, aid, serverContext, language: rawCampaign.Languages,\r\n });\r\n\r\n const campaign = modelToViewModelForCampaign({\r\n campaignModel: rawCampaign,\r\n locationCriterionsModel: locationTargets ? locationTargets.value : [],\r\n bundleCountries: bundleCountriesAndLocationCriterions.bundleCountries,\r\n scheduleCriterionModel: scheduleCriterion ? scheduleCriterion.value : null,\r\n disclaimerAssociations: disclaimerAssociations ? disclaimerAssociations.value : [],\r\n targetCriterionModel: targetCriterion ? targetCriterion.value : null,\r\n pageFeeds: pageFeeds || [],\r\n isEdit: true,\r\n });\r\n\r\n if (permissions && permissions.IsDomesticSimplifiedChineseEnabled) {\r\n const { LANGUAGES: supportedLanguages } = globalizationModelSetup({ permissions, culture: locale });\r\n campaign.Languages = _.chain(campaign.Languages)\r\n .filter(language => _.contains(supportedLanguages, language))\r\n .value();\r\n }\r\n\r\n setInitialCampaign(campaign);\r\n\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, { exclusions: campaignExclusions });\r\n\r\n return Promise.resolve({\r\n campaign,\r\n adGroup,\r\n ...bundleCountriesAndLocationCriterions,\r\n websites: savedWebsites || defaultWebsites,\r\n exclusions: {\r\n campaignExclusions,\r\n },\r\n });\r\n })\r\n .catch((error) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Load campaign settings failed: ${error}`);\r\n activity.signal(`onCampaignSettingsLoadFailed - ${JSON.stringify({\r\n campaignId,\r\n error,\r\n })}`);\r\n return Promise.reject(error);\r\n });\r\n }, [activity, aid, campaignId, cid, savedWebsites, send, serverContext, permissions, locale]);\r\n\r\n const save = useCallback(({ data }) => {\r\n const {\r\n campaign,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n websites,\r\n exclusions,\r\n } = data;\r\n\r\n const saveCampaignPromise = () => saveCampaign({\r\n campaign,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n websites,\r\n isEdit: true,\r\n permissions,\r\n }, {\r\n scenario: scenario.name,\r\n i18n,\r\n activityLogger: activity,\r\n });\r\n\r\n return saveCampaignPromise()\r\n .then(() => {\r\n const {\r\n exclusions: savedExclusions,\r\n } = state.context.wizardData;\r\n\r\n const { activity: BudgetBidCampaignImportNotificationActivity } = instrumentation.createScenarioAndActivity({\r\n scenarioName: 'BudgetBidCampaignImportNotification',\r\n activityName: 'SearchCampaignRevampSettingPage',\r\n });\r\n\r\n showBudgetBidCampaignNotifications({\r\n campaignItemList: [initialCampaign],\r\n oldBudget: initialCampaign.Budget,\r\n newBudget: campaign.Budget,\r\n oldBidStrategy: initialCampaign.BiddingScheme,\r\n newBidStrategy: campaign.BiddingScheme,\r\n activity: BudgetBidCampaignImportNotificationActivity,\r\n });\r\n\r\n const excludedIps = exclusions.campaignExclusions.ExcludedIPs.replace(entitySeparator, '');\r\n const excludedSites = exclusions.campaignExclusions.ExcludedSites.replace(entitySeparator, '');\r\n const isExclusionsChanged = !_.isEqual(excludedIps, savedExclusions.ExcludedIPs) || !_.isEqual(excludedSites, savedExclusions.ExcludedSites);\r\n if (isExclusionsChanged) {\r\n const saveExclusionsData = {\r\n campaignId: campaign.Id,\r\n AdvanceSettings: {\r\n Exclusions: {\r\n ExcludedIPs: excludedIps,\r\n ExcludedSites: excludedSites,\r\n },\r\n },\r\n };\r\n\r\n return exclusionRepository.saveExtensions(saveExclusionsData, ScopeLevel.Campaign);\r\n }\r\n\r\n return {};\r\n })\r\n .catch((error) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n let exclusionsAfterSave = exclusions;\r\n\r\n // exclusion error\r\n if (error.NegativeSitesResult || error.NegativeIPsResult) {\r\n serverErrors.push({\r\n property: 'webExclusions',\r\n NegativeSitesResult: error.NegativeSitesResult ? error.NegativeSitesResult.EntityErrors : undefined,\r\n NegativeIPsResult: error.NegativeIPsResult ? error.NegativeIPsResult.EntityErrors : undefined,\r\n });\r\n exclusionsAfterSave = {\r\n campaignExclusions: {\r\n ExcludedIPs: error.NegativeIPsResult ? formatInvalidEntities(error.NegativeIPsResult) : exclusions.campaignExclusions.ExcludedIPs,\r\n ExcludedSites: error.NegativeSitesResult ? formatInvalidEntities(error.NegativeSitesResult) : exclusions.campaignExclusions.ExcludedSites,\r\n },\r\n };\r\n }\r\n\r\n // eslint-disable-next-line no-console\r\n console.error(`Save campaign settings failed: ${error}`);\r\n activity.signal(`onCampaignSettingsSaveFailed - ${JSON.stringify({\r\n data,\r\n error,\r\n })}`);\r\n\r\n const newCampaign = error.campaign || campaign;\r\n // handle dsa settings when dsa settings save failed\r\n const isNonEditableDSAPropertyError = serverErrors.filter(serverError => _.contains(['DomainName'], serverError.property)).length > 0;\r\n if (!campaign.disableDsaSettings && isNonEditableDSAPropertyError) {\r\n newCampaign.disableDsaSettings = false;\r\n } else {\r\n newCampaign.disableDsaSettings = true;\r\n }\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n data: {\r\n campaign: newCampaign,\r\n exclusions: exclusionsAfterSave,\r\n },\r\n error: {\r\n serverErrors: _.flatten(serverErrors.filter(val => val !== null)),\r\n systemErrors: _.flatten(systemErrors.filter(val => val !== null)),\r\n },\r\n });\r\n });\r\n }, [activity, i18n, initialCampaign, instrumentation, permissions, scenario.name, state.context.wizardData]);\r\n\r\n return {\r\n load,\r\n save,\r\n };\r\n};\r\n","import { uurlTestToolStyle } from '@bingads-webui-campaign-react/common-styles';\r\nimport { getCollapsiblePanelStyles, getStepStyles } from '../../shared/styles';\r\n\r\nexport const getStyles = (components, theme) => ({\r\n collapsiblePanel: {\r\n ...getCollapsiblePanelStyles(components, theme),\r\n ...uurlTestToolStyle(theme),\r\n '& .jumbo-card-control-all-btn-stack': {\r\n width: '20%',\r\n },\r\n '& .panel-heading': {\r\n padding: 0,\r\n borderBottom: 'none',\r\n marginBottom: 18,\r\n display: 'flex',\r\n\r\n '& .panel-title': {\r\n fontSize: 18,\r\n width: '80%',\r\n '& > a': {\r\n color: theme.palette.themePrimary,\r\n padding: 0,\r\n '&:hover, &:active': {\r\n color: theme.palette.themeDarker,\r\n textDecoration: 'none',\r\n backgroundColor: 'unset',\r\n },\r\n },\r\n\r\n '& > a:after': {\r\n transform: 'rotate(180deg)',\r\n },\r\n\r\n '& > a.collapsed:after': {\r\n transform: 'rotate(90deg)',\r\n },\r\n },\r\n },\r\n },\r\n adGroupEditSettingsStep: {\r\n ...getStepStyles(),\r\n },\r\n\r\n});\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, { useCallback, useContext, useMemo, useState, useRef } from 'react';\r\nimport { extend, get, contains, isEmpty, isEqual, map, omit } from 'underscore';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport {\r\n Collapse,\r\n TextTitle,\r\n useCollapseState,\r\n ValidatedFixedPanel,\r\n ValidatedPanel,\r\n ValidatedBootstrapPanel,\r\n getPanelErrorProps,\r\n collapseExpander,\r\n} from '@bingads-webui-campaign/wizard-jumbo-card';\r\nimport { Link, Stack } from '@bingads-webui-react/fabric-control';\r\nimport { Panel as BootstrapPanel } from 'react-bootstrap';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { AdGroup } from '@bingads-webui/campaign-odata-schemas';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { ValidationGroup, ErrorMessages } from '@bingads-webui-react/validation';\r\nimport { ActuationGroup } from '@bingads-webui-campaign-react/actuator';\r\nimport { AttentionBeaconGroup } from '@bingads-webui-campaign-react/attention-beacon';\r\nimport { FormErrorGroup, UnmappedFormErrors, andComp, orComp, entityIs, propertyIs, anyComp } from '@bingads-webui-campaign-react/form-error';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport {\r\n getBidAdjuestmentTitleDetails,\r\n getBidAdjuestmentTitleSummary,\r\n getLocationTargetTitleDetails,\r\n ValidatedStandardAdGroup,\r\n ValidatedBidAdjustment,\r\n ValidatedLocationTargetSetting,\r\n withUseCampaignSettings,\r\n} from '@bingads-webui-campaign-react/search-campaign-wizard-controls';\r\nimport { useFormService } from '@bingads-webui-react/form';\r\nimport { ValidationStringMap } from '@bingads-webui/validation-string-map';\r\nimport { buildLegacyI18n } from '@bingads-webui/build-legacy-i18n';\r\nimport { flattenTargetCriterion, loadBundleCountries, updateAdGroupAgeTargets, ERROR_ENTITY } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { ValidatedDefaultBid, isAutoBidding } from '@bingads-webui-campaign-react/default-bid';\r\nimport { formatBidValue } from '@bingads-webui-campaign-react/summary-page';\r\nimport { WebExclusionsSection } from '@bingads-webui-react/web-exclusions';\r\nimport { ScopeLevel } from '@bingads-webui-campaign-react/constants';\r\nimport { AdDistributionWithValidationSection } from '@bingads-webui-campaign/ad-distribution';\r\nimport { SingleLanguageTargetPanel } from '@bingads-webui-campaign-react/wizard-shared-components';\r\nimport { MultimediaAdBidAdjustmentSection } from '@bingads-webui-campaign-react/multimedia-ad-adjustment';\r\nimport { ValidatedDateSetting, getDateSettingDetails } from '@bingads-webui-campaign-react/date-setting';\r\nimport { ValidatedLegacyAdSchedule, getAdScheduleDetails } from '@bingads-webui-campaign/ad-schedule';\r\nimport { URLOptionsSection } from '@bingads-webui-campaign-react/validated-url-input';\r\nimport { AdRotationSection } from '@bingads-webui-react/ad-rotation';\r\nimport { testUurl, uurlLevels } from '@bingads-webui-component-legacy/upgraded-url/service/testUurl';\r\nimport {\r\n ValidatedCompanyPicker,\r\n ValidatedIndustryPicker,\r\n ValidatedJobFunctionPicker,\r\n} from '@bingads-webui-campaign-react/display-plus-campaigns';\r\n\r\nimport { getStyles } from './styles';\r\nimport { AD_GROUP_TYPES, AD_GROUP_TYPE_STRINGS } from '../step-utils';\r\nimport BidImg from '../../shared/media/bid.svg';\r\nimport AdDistributionImg from '../../shared/media/ad-distribution.svg';\r\nimport DateSettingImg from '../../shared/media/date-setting.svg';\r\nimport AdScheduleImg from '../../shared/media/ad-schedule.svg';\r\nimport DeviceImg from '../../shared/media/device.svg';\r\nimport GenderImg from '../../shared/media/gender.svg';\r\nimport AgeImg from '../../shared/media/age.svg';\r\nimport LocationImg from '../../shared//media/location.svg';\r\nimport CompanyNameImg from '../../shared/media/company-name.svg';\r\nimport IndustryImg from '../../shared/media/industry.svg';\r\nimport JobFunctionImg from '../../shared/media/job-function.svg';\r\n\r\nconst adgroupLocationCriterions = anyComp(\r\n entityIs(ERROR_ENTITY.AdGroupLocation),\r\n entityIs(ERROR_ENTITY.AdGroupRadius),\r\n entityIs(ERROR_ENTITY.AdGroupNegativeLocation),\r\n entityIs(ERROR_ENTITY.AdGroupLocationIntent)\r\n);\r\nconst entityIsAdGroup = entityIs(ERROR_ENTITY.AdGroup);\r\nconst ServerValidatedDefaultBid = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedDefaultBid, { filter: andComp(entityIsAdGroup, propertyIs('BidAmount')) }));\r\nconst ServerValidatedLegacyDateSetting = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedDateSetting, { filter: andComp(entityIsAdGroup, orComp(propertyIs('StartDate'), propertyIs('EndDate'))) }));\r\nconst ServerValidatedLegacyAdSchedule = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedLegacyAdSchedule, { filter: entityIs(ERROR_ENTITY.AdGroupDayTimeCriterion) }));\r\nconst ServerValidatedDevice = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedBidAdjustment, { filter: entityIs(ERROR_ENTITY.AdGroupDeviceOSCriterion) }));\r\nconst ServerValidatedGender = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedBidAdjustment, { filter: entityIs(ERROR_ENTITY.AdGroupGenderCriterion) }));\r\nconst ServerValidatedAge = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedBidAdjustment, { filter: entityIs(ERROR_ENTITY.AdGroupAgeCriterion) }));\r\nconst ServerValidatedLocationTargetSetting = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedLocationTargetSetting, { filter: adgroupLocationCriterions }));\r\nconst ServerValidatedCompanyName = withControlErrorHandling(withUnvalidatedControlErrors(withUseCampaignSettings(ValidatedCompanyPicker), { filter: entityIs(ERROR_ENTITY.AdGroupCompanyNameCriterion) }));\r\nconst ServerValidatedIndustry = withControlErrorHandling(withUnvalidatedControlErrors(withUseCampaignSettings(ValidatedIndustryPicker), { filter: entityIs(ERROR_ENTITY.AdGroupIndustryCriterion) }));\r\nconst ServerValidatedJobFunction = withControlErrorHandling(withUnvalidatedControlErrors(withUseCampaignSettings(ValidatedJobFunctionPicker), { filter: entityIs(ERROR_ENTITY.AdGroupJobFunctionCriterion) }));\r\n\r\nexport const AdGroupEditSettingsStep = ({\r\n data,\r\n onDataChange,\r\n error,\r\n}) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n const i18n = useContext(I18nContext);\r\n const legacyI18n = useMemo(() => buildLegacyI18n(i18n, [ValidationStringMap]), [i18n]);\r\n const classes = useDefaultStyles(getStyles);\r\n const serverContext = useContext(ServerContext);\r\n const {\r\n DynamicPermissions,\r\n Permissions,\r\n Token,\r\n CurrentUser: { Market: market },\r\n } = serverContext;\r\n const permissions = useMemo(() => ({ dynamic: { ...DynamicPermissions }, ...Permissions }), [DynamicPermissions, Permissions]);\r\n const { scope } = useContext(ScopeContext);\r\n const {\r\n cid, aid, campaignId, uid, adGroupId,\r\n } = scope.values;\r\n const refreshLocationTargetsTimes = useRef(0);\r\n const {\r\n adGroup,\r\n campaign,\r\n } = data || {};\r\n const selectedLanguages = useRef(adGroup && adGroup.Languages);\r\n selectedLanguages.current = adGroup && adGroup.Languages === 'None' ? campaign && campaign.Languages : adGroup && adGroup.Languages;\r\n\r\n const {\r\n TrackingUrlTemplate, FinalUrlSuffix, UrlCustomParameters,\r\n } = adGroup || {};\r\n\r\n const { IsDSAMixedModeCampaignEnabled } = permissions || {};\r\n\r\n const isExperiment = !!(campaign && campaign.ExperimentId);\r\n const isMixedMode = IsDSAMixedModeCampaignEnabled && !isExperiment;\r\n\r\n const urlOptions = useMemo(() => ({\r\n TrackingUrlTemplate,\r\n FinalUrlSuffix,\r\n UrlCustomParameters,\r\n }), [FinalUrlSuffix, TrackingUrlTemplate, UrlCustomParameters]);\r\n\r\n const urlOptionsDetails = useRef(urlOptions);\r\n urlOptionsDetails.current = urlOptions;\r\n\r\n const { state: { context: { saveFailed: showAllValidationErrors } } } = useFormService();\r\n const [adScheduleView, setAdScheduleView] = useState(null);\r\n const [advancedSettingsSectionExpanded, setAdvancedSettingsSectionExpanded] = useState(false);\r\n const onAdvancedSettingsSectionToggle = useCallback((expanded) => {\r\n setAdvancedSettingsSectionExpanded(expanded);\r\n }, []);\r\n\r\n const [\r\n allSettingsSections,\r\n settingsExpandedSections,\r\n setSettingsExpandedSections,\r\n ] = useCollapseState(\r\n ['adGroup', 'language', 'bid'] /* all sections */,\r\n ['adGroup', 'language', 'bid'] /* initially expanded sections */\r\n );\r\n\r\n const basicSettingsExpand = useMemo(\r\n () => collapseExpander({ setActiveKeys: setSettingsExpandedSections }),\r\n [setSettingsExpandedSections]\r\n );\r\n const [\r\n allBidAdjustmentSections,\r\n bidAdjustmentExpandedSections,\r\n setBidAdjustmentExpandedSections,\r\n flipBidAdjustmentExpandAllState,\r\n expandAllBidAdjustmentSections,\r\n ] = useCollapseState(\r\n ['locations', 'device', 'gender', 'age', 'companyName', 'industry', 'jobFunction'] /* all sections */,\r\n [] /* initially expanded sections */\r\n );\r\n\r\n const allBidAdjustmentExpand = useMemo(\r\n () => collapseExpander({ setActiveKeys: setBidAdjustmentExpandedSections }),\r\n [setBidAdjustmentExpandedSections]\r\n );\r\n\r\n const [bidAdjustmentSectionExpanded, setBidAdjustmentSectionExpanded] = useState(false);\r\n const onBidAdjustmentSectionToggle = useCallback((expanded) => {\r\n setBidAdjustmentSectionExpanded(expanded);\r\n }, []);\r\n\r\n const [\r\n allAdvancedSections,\r\n advancedExpandedSections,\r\n setAdvancedExpandedSections,\r\n flipAdvancedExpandAllState,\r\n expandAllAdvancedSettingsSections,\r\n ] = useCollapseState(\r\n ['ad-schedule', 'start-end-date', 'ad-distribution', 'web-exclusions', 'advanced-url-options', 'multimedia-ad', 'ad-rotation'] /* all sections */,\r\n ['ad-schedule', 'start-end-date', 'web-exclusions'] /* initially expanded sections */\r\n );\r\n\r\n const onValidate = useCallback((result) => {\r\n if (data && data.adGroup) {\r\n let { Age } = result.data;\r\n if (result.data.ageRanges && !isEqual(result.data.ageRanges, data.adGroup.ageRanges)) {\r\n Age = updateAdGroupAgeTargets(result.data.Age || data.adGroup.Age, result.data.ageRanges);\r\n }\r\n const newLanguages = result && result.data && result.data.Languages === 'None' ? data.campaign.Languages : result.data.Languages;\r\n if (!isEmpty(newLanguages) && selectedLanguages.current !== newLanguages) {\r\n selectedLanguages.current = newLanguages;\r\n refreshLocationTargetsTimes.current = (refreshLocationTargetsTimes.current + 1) % 1000;\r\n loadBundleCountries({\r\n cid, aid, serverContext, language: newLanguages,\r\n }).then((bundleCountriesAndLocationCriterions) => {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...data.adGroup,\r\n ...result.data,\r\n ...(Age && { Age }),\r\n },\r\n ...bundleCountriesAndLocationCriterions,\r\n },\r\n isValid: result.isValid,\r\n });\r\n });\r\n } else {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...data.adGroup,\r\n ...result.data,\r\n ...(Age && { Age }),\r\n },\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }\r\n }, [aid, cid, data, onDataChange, serverContext]);\r\n\r\n const webExclusionsError = serverErrors.filter(err => err.property === 'webExclusions');\r\n const setExclusionsCallback = useCallback((exclusionsData, type) => {\r\n if (data) {\r\n const patchedData = {\r\n data: {\r\n ...data,\r\n exclusions: {\r\n ...(data.exclusions || {}),\r\n adgroupExclusions: {\r\n ...(data.exclusions && data.exclusions.adgroupExclusions ? data.exclusions.adgroupExclusions : {}),\r\n [type]: exclusionsData,\r\n },\r\n },\r\n },\r\n };\r\n onDataChange(patchedData);\r\n }\r\n }, [data, onDataChange]);\r\n\r\n const triggerTestUurl = useCallback((fn, originalView) => {\r\n extend(originalView, {\r\n isInline: false,\r\n level: uurlLevels.Campaign,\r\n });\r\n const context = {\r\n customerId: cid,\r\n userId: uid,\r\n accountId: aid,\r\n campaignId,\r\n adGroupId,\r\n };\r\n const params = urlOptionsDetails.current;\r\n const options = {\r\n apiInLog: 'advancedSettingsUrlOptions/uurlTest',\r\n };\r\n testUurl(fn, originalView, params, context, options);\r\n }, [adGroupId, aid, campaignId, cid, uid]);\r\n\r\n const basicSettingsSection = useMemo(() => {\r\n const adGroupPanel = (\r\n \r\n
\r\n \r\n
\r\n \r\n { basicSettingsSection }\r\n { bidAdjustmentSection }\r\n { advancedSettingsSection }\r\n
\r\n \r\n \r\n \r\n {basicSettings}\r\n \r\n
\r\n );\r\n }, [adGroup, isMixedMode, basicSettingsExpand, data, i18n, serverContext.CurrentAccount.CurrencyCode, onValidate, allSettingsSections, settingsExpandedSections, setSettingsExpandedSections]);\r\n\r\n const bidAdjustmentSection = useMemo(() => {\r\n const locationPanel = (\r\n data && data.adGroup &&\r\n \r\n (\r\n <>\r\n \r\n \r\n {i18n.getString(_TL_('Bid adjustments'))}\r\n \r\n \r\n {bidAdjustmentSectionExpanded && bidAdjustmentExpandedSections.length ? i18n.getString(_TL_('Collapse all')) : i18n.getString(_TL_('Expand all'))}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n
\r\n );\r\n }, [adGroup, adGroupId, aid, allBidAdjustmentExpand, allBidAdjustmentSections, basicSettingsExpand, bidAdjustmentExpandedSections, bidAdjustmentSectionExpanded, campaign, campaignId, cid, classes, data, expandAllBidAdjustmentSections, flipBidAdjustmentExpandAllState, i18n, market, onBidAdjustmentSectionToggle, onDataChange, permissions, scope, setBidAdjustmentExpandedSections]);\r\n\r\n const adgroupBiddingScheme = get(adGroup, ['BiddingScheme', 'Type']);\r\n const campaignBiddingSchema = get(campaign, ['BiddingScheme', 'Type']);\r\n const disableOptions = (adgroupBiddingScheme === 'InheritFromParent') && contains(['MaxClicks', 'MaxConversions', 'TargetCpa'], campaignBiddingSchema);\r\n\r\n const advancedSettingsSection = useMemo(() => {\r\n const adScheduleComponent = (\r\n \r\n \r\n {bidAdjustment}\r\n \r\n
\r\n \r\n (\r\n <>\r\n \r\n \r\n {i18n.getString(_TL_('Advanced settings'))}\r\n \r\n \r\n {advancedSettingsSectionExpanded && advancedExpandedSections.length ? i18n.getString(_TL_('Collapse all')) : i18n.getString(_TL_('Expand all'))}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n
\r\n );\r\n }, [FinalUrlSuffix, permissions, Token, TrackingUrlTemplate, UrlCustomParameters, adGroup, adScheduleView, advancedExpandedSections, advancedSettingsSectionExpanded, allAdvancedSections, classes.collapsiblePanel, data, disableOptions, expandAllAdvancedSettingsSections, flipAdvancedExpandAllState, i18n, onAdvancedSettingsSectionToggle, onValidate, setAdvancedExpandedSections, setExclusionsCallback, triggerTestUurl, webExclusionsError]);\r\n\r\n return (\r\n \r\n \r\n {adScheduleComponent}\r\n {dateSettingComponent}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nAdGroupEditSettingsStep.propTypes = {\r\n data: PropTypes.shape({\r\n campaign: PropTypes.shape({\r\n Id: PropTypes.string,\r\n Name: PropTypes.string,\r\n Languages: PropTypes.string,\r\n BiddingScheme: PropTypes.shape({\r\n Type: PropTypes.string,\r\n }),\r\n Age: PropTypes.shape({}),\r\n Gender: PropTypes.shape({}),\r\n Device: PropTypes.shape({}),\r\n companyNameTargets: PropTypes.shape({}),\r\n industry: PropTypes.shape({}),\r\n jobTargets: PropTypes.shape({}),\r\n TimeZone: PropTypes.string,\r\n dayTimeRanges: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n adGroup: PropTypes.shape({\r\n Id: PropTypes.string,\r\n Status: PropTypes.string,\r\n BiddingScheme: PropTypes.shape({\r\n Type: PropTypes.string,\r\n }),\r\n ageRanges: PropTypes.arrayOf(PropTypes.string),\r\n Age: PropTypes.shape({}),\r\n Gender: PropTypes.shape({}),\r\n Device: PropTypes.shape({}),\r\n companyNameTargets: PropTypes.shape({}),\r\n industry: PropTypes.shape({}),\r\n jobTargets: PropTypes.shape({}),\r\n locationTargets: PropTypes.shape({}),\r\n SearchBid: PropTypes.number,\r\n currentSelectedAgeLevel: PropTypes.string,\r\n currentSelectedGenderLevel: PropTypes.string,\r\n currentSelectedDeviceLevel: PropTypes.string,\r\n currentSelectedCompanyNameLevel: PropTypes.string,\r\n currentSelectedIndustryLevel: PropTypes.string,\r\n currentSelectedJobFunctionLevel: PropTypes.string,\r\n dayTimeRanges: PropTypes.arrayOf(PropTypes.shape({})),\r\n StartDate: PropTypes.string,\r\n EndDate: PropTypes.string,\r\n AdScheduleUseSearcherTimeZone: PropTypes.bool,\r\n }),\r\n bundleCountries: PropTypes.arrayOf(PropTypes.shape({})),\r\n bundleLocationCriterions: PropTypes.arrayOf(PropTypes.shape({})),\r\n exclusions: PropTypes.shape({\r\n adgroupExclusions: PropTypes.shape({}),\r\n }),\r\n }).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n};\r\n\r\nAdGroupEditSettingsStep.defaultProps = {\r\n error: null,\r\n};\r\n","import { useCallback, useContext } from 'react';\r\nimport Promise from 'bluebird';\r\nimport _ from 'underscore';\r\nimport { loadCampaign, loadBundleCountries, readAdGroup, readScheduleCriterions, readAdGroupScheduleCriterions, modelToViewModelForAdGroupSetting, saveAdGroup, readTargetCriterion, readAdGroupTargetCriterion, readLocationCriterions, readAdGroupLocationCriterions } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ActivityContext, ScenarioContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { useWizardService, WIZARD_EVENTS } from '@bingads-webui-react/wizard';\r\nimport exclusionRepository from '@bingads-webui-campaign-legacy/advanced-settings/util/exclusion-repository';\r\nimport { ScopeLevel } from '@bingads-webui-campaign-react/constants';\r\nimport { entitySeparator, formatInvalidEntities } from '@bingads-webui-react/web-exclusions';\r\nimport { PermissionsContext } from '@bingads-webui-react/hoc-with-permissions';\r\nimport { globalizationModelSetup } from '@bingads-webui-campaign/ads-globalization';\r\n\r\nexport const useAdGroupEditSettingsRepository = () => {\r\n const { scope } = useContext(ScopeContext) || {};\r\n const scenario = useContext(ScenarioContext);\r\n const activity = useContext(ActivityContext);\r\n const serverContext = useContext(ServerContext);\r\n const {\r\n CurrentLocale: locale,\r\n } = serverContext;\r\n const permissions = useContext(PermissionsContext);\r\n const { state, send } = useWizardService();\r\n const {\r\n cid, aid, campaignId, adGroupId,\r\n } = scope.values;\r\n const i18n = useContext(I18nContext);\r\n const load = useCallback(() => {\r\n const loadPromises = {\r\n campaign: loadCampaign(cid, aid, campaignId),\r\n adGroup: readAdGroup(cid, aid, campaignId, adGroupId, i18n),\r\n campaignScheduleCriterion: readScheduleCriterions(cid, aid, campaignId),\r\n adGroupScheduleCriterion: readAdGroupScheduleCriterions(cid, aid, campaignId, adGroupId),\r\n exclusions: exclusionRepository.load(campaignId, adGroupId, ScopeLevel.AdGroup),\r\n campaignTargetCriterion: readTargetCriterion(cid, aid, campaignId),\r\n adGroupTargetCriterion: readAdGroupTargetCriterion(cid, aid, campaignId, adGroupId),\r\n campaignLocationTargets: readLocationCriterions(cid, aid, campaignId),\r\n adGroupLocationTargets: readAdGroupLocationCriterions(cid, aid, campaignId, adGroupId),\r\n };\r\n\r\n return Promise.props(loadPromises)\r\n .then(async ({\r\n campaign: rawCampaign,\r\n adGroup: rawAdGroup,\r\n campaignScheduleCriterion,\r\n adGroupScheduleCriterion,\r\n exclusions: [campaignExclusions, adgroupExclusions] = [null, null],\r\n campaignTargetCriterion,\r\n adGroupTargetCriterion,\r\n campaignLocationTargets,\r\n adGroupLocationTargets,\r\n }) => {\r\n const bundleCountriesAndLocationCriterions = await loadBundleCountries({\r\n cid, aid, serverContext, language: rawCampaign.Languages,\r\n });\r\n\r\n const { campaignViewModel, adGroupViewModel } = modelToViewModelForAdGroupSetting({\r\n adGroupModel: rawAdGroup,\r\n campaignModel: rawCampaign,\r\n campaignScheduleCriterionModel: campaignScheduleCriterion ? campaignScheduleCriterion.value : null,\r\n adGroupScheduleCriterionModel: adGroupScheduleCriterion ? adGroupScheduleCriterion.value : null,\r\n campaignTargetCriterionModel: campaignTargetCriterion ? campaignTargetCriterion.value : null,\r\n adGroupTargetCriterionModel: adGroupTargetCriterion ? adGroupTargetCriterion.value : null,\r\n bundleCountries: bundleCountriesAndLocationCriterions.bundleCountries,\r\n adGroupLocationTargets: adGroupLocationTargets ? adGroupLocationTargets.value : [],\r\n campaignLocationTargets: campaignLocationTargets ? campaignLocationTargets.value : [],\r\n i18n,\r\n });\r\n\r\n if (permissions && permissions.IsDomesticSimplifiedChineseEnabled) {\r\n const { LANGUAGES: supportedLanguages } = globalizationModelSetup({ permissions, culture: locale });\r\n campaignViewModel.Languages = _.chain(campaignViewModel.Languages)\r\n .filter(language => _.contains(supportedLanguages, language))\r\n .value();\r\n if (!_.contains(supportedLanguages, adGroupViewModel.Language)) {\r\n [adGroupViewModel.Language] = supportedLanguages;\r\n }\r\n }\r\n\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, { exclusions: adgroupExclusions });\r\n return Promise.resolve({\r\n campaign: campaignViewModel,\r\n adGroup: {\r\n ...adGroupViewModel,\r\n allowAdGroupTypeChange: false,\r\n },\r\n ...bundleCountriesAndLocationCriterions,\r\n exclusions: {\r\n campaignExclusions,\r\n adgroupExclusions,\r\n },\r\n });\r\n })\r\n .catch((error) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Load adGroup settings failed: ${error}`);\r\n activity.signal(`onAdGroupSettingsLoadFailed - ${JSON.stringify({\r\n campaignId,\r\n adGroupId,\r\n error,\r\n })}`);\r\n return Promise.reject(error);\r\n });\r\n }, [activity, adGroupId, aid, campaignId, cid, i18n, send, serverContext, permissions, locale]);\r\n\r\n const save = useCallback(({ data }) => {\r\n const {\r\n adGroup,\r\n campaign,\r\n exclusions,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n } = data;\r\n\r\n\r\n return saveAdGroup({\r\n adGroup,\r\n campaign,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n }, {\r\n permissions,\r\n scenario: scenario.name,\r\n i18n,\r\n activityLogger: activity,\r\n })\r\n .then(() => {\r\n const {\r\n exclusions: savedExclusions,\r\n } = state.context.wizardData;\r\n const excludedSites = exclusions.adgroupExclusions.ExcludedSites.replace(entitySeparator, '');\r\n const isExclusionsChanged = !_.isEqual(excludedSites, savedExclusions.ExcludedSites);\r\n if (isExclusionsChanged) {\r\n const saveExclusionsData = {\r\n AdGroupId: adGroupId,\r\n CampaignId: campaignId,\r\n AdvancedSettings: {\r\n ExcludedSites: excludedSites,\r\n },\r\n };\r\n return exclusionRepository.saveExtensions(saveExclusionsData, ScopeLevel.AdGroup);\r\n }\r\n return {};\r\n })\r\n .catch((error) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n let exclusionsAfterSave = exclusions;\r\n // exclusion error\r\n if (error.NegativeSitesResult) {\r\n serverErrors.push({\r\n property: 'webExclusions',\r\n NegativeSitesResult: error.NegativeSitesResult.EntityErrors,\r\n });\r\n exclusionsAfterSave = {\r\n ...exclusionsAfterSave,\r\n adgroupExclusions: {\r\n ExcludedSites: formatInvalidEntities(error.NegativeSitesResult),\r\n },\r\n };\r\n }\r\n\r\n // eslint-disable-next-line no-console\r\n console.error(`Save adGroup settings failed: ${error}`);\r\n activity.signal(`onAdGroupSettingsSaveFailed - ${JSON.stringify({\r\n data,\r\n error,\r\n })}`);\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n data: {\r\n adGroup: error.adGroup || adGroup,\r\n campaign,\r\n exclusions: exclusionsAfterSave,\r\n },\r\n error: {\r\n serverErrors: _.flatten(serverErrors.filter(val => val !== null)),\r\n systemErrors: _.flatten(systemErrors.filter(val => val !== null)),\r\n },\r\n });\r\n });\r\n }, [activity, adGroupId, campaignId, i18n, scenario.name, state.context.wizardData, permissions]);\r\n\r\n return {\r\n load,\r\n save,\r\n };\r\n};\r\n","import { getCollapsiblePanelStyles, getStepStyles } from '../../shared/styles';\r\n\r\nexport const getStyles = (components, theme) => ({\r\n collapsiblePanel: getCollapsiblePanelStyles(components, theme),\r\n adGroupSettingsStep: {\r\n ...getStepStyles(),\r\n },\r\n});\r\n","import React, { useCallback, useContext, useEffect, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport {\r\n Collapse,\r\n TextTitle,\r\n ValidatedFixedPanel,\r\n getPanelErrorProps,\r\n useCollapseState,\r\n collapseExpander,\r\n} from '@bingads-webui-campaign/wizard-jumbo-card';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { AdGroup } from '@bingads-webui/campaign-odata-schemas';\r\nimport { ValidationGroup, ErrorMessages } from '@bingads-webui-react/validation';\r\nimport { ActuationGroup } from '@bingads-webui-campaign-react/actuator';\r\nimport { AttentionBeaconGroup } from '@bingads-webui-campaign-react/attention-beacon';\r\nimport { FormErrorGroup, UnmappedFormErrors, entityIs } from '@bingads-webui-campaign-react/form-error';\r\nimport { ERROR_ENTITY } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport { useFormService } from '@bingads-webui-react/form';\r\nimport { ValidationStringMap } from '@bingads-webui/validation-string-map';\r\nimport { buildLegacyI18n } from '@bingads-webui/build-legacy-i18n';\r\nimport { useWizardService, WIZARD_EVENTS, getFlowFactor } from '@bingads-webui-react/wizard';\r\nimport { SingleLanguageTargetPanel } from '@bingads-webui-campaign-react/wizard-shared-components';\r\nimport {\r\n ValidatedStandardAdGroup, ValidatedDynamicAdGroup,\r\n ValidatedWebsite as WebsiteControl, ValidatedWebsiteTitle,\r\n ValidatedDynamicAdTarget as DynamicAdTarget\r\n} from '@bingads-webui-campaign-react/search-campaign-wizard-controls';\r\n\r\nimport { getStyles } from './styles';\r\nimport { StepHeader } from '../../shared/step-header';\r\nimport { AD_GROUP_TYPES, AD_GROUP_TYPE_STRINGS } from '../step-utils';\r\nimport CampaignNameImg from '../../shared/media/campaign-name.svg';\r\nimport AdGroupImg from '../../shared/media/ad-group.svg';\r\nimport DynamicAdTargetImg from '../../shared/media/dynamic-ad-target.svg';\r\n\r\nconst entityIsDynamicSearchAdTarget = entityIs(ERROR_ENTITY.AdGroupDynamicSearchAdTargetError);\r\n\r\nconst ValidatedWebsite = withControlErrorHandling(withUnvalidatedControlErrors(WebsiteControl));\r\nconst ValidatedDynamicAdTarget = withControlErrorHandling(withUnvalidatedControlErrors(DynamicAdTarget, { filter: entityIsDynamicSearchAdTarget }));\r\n\r\nexport const AdGroupSettingsStep = ({\r\n data,\r\n onDataChange,\r\n error,\r\n}) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n const { campaign, adGroup } = data || {};\r\n const {\r\n [AD_GROUP_TYPES.SearchStandard]: standardAdGroup,\r\n [AD_GROUP_TYPES.SearchDynamic]: dynamicAdGroup,\r\n } = adGroup || {};\r\n\r\n const i18n = useContext(I18nContext);\r\n const legacyI18n = useMemo(() => buildLegacyI18n(i18n, [ValidationStringMap]), [i18n]);\r\n const classes = useDefaultStyles(getStyles);\r\n const activity = useContext(ActivityContext);\r\n\r\n const { state: { context: { saveFailed: showAllValidationErrors } } } = useFormService();\r\n\r\n const serverContext = useContext(ServerContext);\r\n const {\r\n DynamicPermissions,\r\n Permissions,\r\n } = serverContext;\r\n const permissions = useMemo(() => ({ dynamic: { ...DynamicPermissions }, ...Permissions }), [DynamicPermissions, Permissions]);\r\n const { IsDSAMixedModeCampaignEnabled } = permissions || {};\r\n\r\n const isExperiment = !!(campaign && campaign.ExperimentId);\r\n const isMixedMode = IsDSAMixedModeCampaignEnabled && !isExperiment;\r\n\r\n const [\r\n allAdGroupSettingsSections,\r\n adGroupSettingsExpandedSections,\r\n setAdGroupSettingsExpandedSections,\r\n ] = useCollapseState(\r\n ['campaignName', 'adGroup', 'dynamicAdTarget', 'language', 'website'] /* all sections */,\r\n ['campaignName', 'adGroup', 'dynamicAdTarget', 'language'] /* initially expanded sections */\r\n );\r\n\r\n const basicSettingsExpand = useMemo(\r\n () => collapseExpander({ setActiveKeys: setAdGroupSettingsExpandedSections }),\r\n [setAdGroupSettingsExpandedSections]\r\n );\r\n\r\n const { send, state: wizardState } = useWizardService();\r\n const currentAdGroupType = getFlowFactor(wizardState, 'adGroupType') || AD_GROUP_TYPES.SearchStandard;\r\n const onSwitchAdGroupType = useCallback((adGroupType) => {\r\n send(WIZARD_EVENTS.UPDATE_FlOW_FACTORS, {\r\n flowFactors: {\r\n adGroupType,\r\n },\r\n });\r\n activity.signal(`onAdGroupTypeChanged - ${JSON.stringify({\r\n adGroupType,\r\n })}`);\r\n }, [send, activity]);\r\n\r\n if (!isMixedMode && currentAdGroupType === AD_GROUP_TYPES.SearchDynamic) {\r\n onSwitchAdGroupType(AD_GROUP_TYPES.SearchStandard);\r\n }\r\n\r\n const onValidateStandardAdGroup = useCallback((result) => {\r\n if (standardAdGroup) {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...data.adGroup,\r\n [AD_GROUP_TYPES.SearchStandard]: {\r\n ...standardAdGroup,\r\n ...result.data,\r\n },\r\n },\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }, [data, onDataChange, standardAdGroup]);\r\n\r\n const onValidateDynamicAdGroup = useCallback((result) => {\r\n if (dynamicAdGroup) {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...data.adGroup,\r\n [AD_GROUP_TYPES.SearchDynamic]: {\r\n ...dynamicAdGroup,\r\n ...result.data,\r\n },\r\n },\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }, [data, onDataChange, dynamicAdGroup]);\r\n\r\n const standardAdGroupSection = useMemo(() => {\r\n const campaignNamePanel = (\r\n \r\n
\r\n \r\n
\r\n \r\n {basicSettingsSection}\r\n {bidAdjustmentSection}\r\n {advancedSettingsSection}\r\n
\r\n \r\n \r\n \r\n { basicSettings }\r\n \r\n
\r\n );\r\n }, [campaign, currentAdGroupType, onSwitchAdGroupType, basicSettingsExpand, allAdGroupSettingsSections, adGroupSettingsExpandedSections, setAdGroupSettingsExpandedSections, standardAdGroup]);\r\n\r\n const dynamicAdGroupSection = useMemo(() => {\r\n const campaignNamePanel = (\r\n \r\n \r\n { basicSettings }\r\n \r\n
\r\n );\r\n }, [campaign, adGroup, currentAdGroupType, onSwitchAdGroupType, allAdGroupSettingsSections, adGroupSettingsExpandedSections, setAdGroupSettingsExpandedSections, dynamicAdGroup]);\r\n\r\n useEffect(() => {\r\n activity.signal(`onAdGroupTypeRendered - ${JSON.stringify({\r\n adGroupType: currentAdGroupType,\r\n })}`);\r\n }, [currentAdGroupType, activity]);\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nAdGroupSettingsStep.propTypes = {\r\n data: PropTypes.shape({\r\n campaign: PropTypes.shape({}).isRequired,\r\n adGroup: PropTypes.shape({\r\n SearchStandard: PropTypes.shape({}),\r\n SearchDynamic: PropTypes.shape({}),\r\n }).isRequired,\r\n }).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n partialAdGroup: PropTypes.shape({}).isRequired,\r\n};\r\n\r\nAdGroupSettingsStep.defaultProps = {\r\n error: null,\r\n};\r\n","import Promise from 'bluebird';\r\nimport { omit, flatten, first, find, result } from 'underscore';\r\nimport { useCallback, useContext, useMemo } from 'react';\r\nimport { useWizardService, getFlowFactor, WIZARD_EVENTS } from '@bingads-webui-react/wizard';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ActivityContext, ScenarioContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport {\r\n loadCampaign,\r\n loadAdGroup,\r\n loadDsaTargets,\r\n getDsaDefaultWebsiteLanguage,\r\n defaultTargetingSource,\r\n dsaDefaultTextEnabled,\r\n saveCampaign,\r\n saveAdGroup,\r\n readLocationCriterions,\r\n readAdGroupLocationCriterions,\r\n loadBundleCountries,\r\n modelToViewModelForAdgroupLocationTargets,\r\n DSA_TARGET_TYPES,\r\n DSA_TARGET_SUB_TYPES,\r\n insertErrorsByClientIdAndGenerateKey,\r\n} from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport {\r\n useKeywordSuggestion,\r\n} from '@bingads-webui-campaign-react/copilot-keyword-planner';\r\nimport { generateNameSuggestionSuffix } from '@bingads-webui-campaign/audience-campaign-shared';\r\nimport { cloneDeep } from '@bingads-webui-universal/primitive-utilities';\r\nimport { useKeywordPlannerService } from '@bingads-webui-campaign-react/keyword-planner-shared';\r\nimport { handleKeywordSuggestionsWhenChanges, useSetKeywordSuggestionsData } from '../../shared/keyword-suggestion-util';\r\nimport { AD_GROUP_TYPES } from '../step-utils';\r\n\r\nconst defaultWebsites = [];\r\n\r\nconst defaultDsaTargets = {\r\n [DSA_TARGET_TYPES.categoryTargets]: {\r\n disabled: false,\r\n selected: false,\r\n items: [],\r\n savedItems: {},\r\n },\r\n [DSA_TARGET_TYPES.allTargets]: {\r\n disabled: false,\r\n selected: false,\r\n items: [],\r\n savedItems: {},\r\n },\r\n [DSA_TARGET_TYPES.specificTargets]: {\r\n disabled: false,\r\n selected: false,\r\n [DSA_TARGET_SUB_TYPES.exactUrls]: {\r\n items: [],\r\n savedItems: {},\r\n },\r\n [DSA_TARGET_SUB_TYPES.rules]: {\r\n items: [],\r\n savedItems: {},\r\n },\r\n },\r\n [DSA_TARGET_TYPES.customLabelTargets]: {\r\n disabled: false,\r\n selected: false,\r\n items: [],\r\n savedItems: {},\r\n },\r\n};\r\n\r\nconst defaultAdGroupSettings = {\r\n [AD_GROUP_TYPES.SearchStandard]: {\r\n AdGroupType: AD_GROUP_TYPES.SearchStandard,\r\n websites: defaultWebsites,\r\n },\r\n [AD_GROUP_TYPES.SearchDynamic]: {\r\n AdGroupType: AD_GROUP_TYPES.SearchDynamic,\r\n },\r\n};\r\n\r\nexport const useAdGroupSettingsRepository = () => {\r\n const i18n = useContext(I18nContext);\r\n const scenario = useContext(ScenarioContext);\r\n const activity = useContext(ActivityContext);\r\n const { scope } = useContext(ScopeContext) || {};\r\n const serverContext = useContext(ServerContext);\r\n const { cid, aid, campaignId } = scope.values;\r\n\r\n const {\r\n DynamicPermissions,\r\n Permissions,\r\n } = serverContext;\r\n const permissions = useMemo(() => ({ dynamic: { ...DynamicPermissions }, ...Permissions }), [DynamicPermissions, Permissions]);\r\n\r\n const defaultStandardName = generateNameSuggestionSuffix('Search-Standard-AdGroup');\r\n const defaultDynamicName = generateNameSuggestionSuffix('Search-Dynamic-AdGroup');\r\n\r\n const { state, send } = useWizardService();\r\n const { adGroupId, websites: savedWebsites } = state.context.wizardData;\r\n const { onRequest, onSuccess, onFailed } = useSetKeywordSuggestionsData({ send, permissions });\r\n const { getSearchIdea } = useKeywordPlannerService();\r\n\r\n const load = useCallback(() => {\r\n const dsaDefaultWebsiteLanguage = getDsaDefaultWebsiteLanguage(permissions);\r\n\r\n const defaultSearchStandard = {\r\n ...defaultAdGroupSettings[AD_GROUP_TYPES.SearchStandard],\r\n Name: defaultStandardName,\r\n };\r\n\r\n const defaultSearchDynamic = {\r\n ...defaultAdGroupSettings[AD_GROUP_TYPES.SearchDynamic],\r\n Name: defaultDynamicName,\r\n websites: defaultWebsites,\r\n selectedWebsiteLanguage: dsaDefaultWebsiteLanguage,\r\n selectedTargetingSource: defaultTargetingSource,\r\n dynamicTextEnabled: dsaDefaultTextEnabled,\r\n DsaTargets: cloneDeep(defaultDsaTargets),\r\n };\r\n\r\n const loadPromises = {\r\n campaign: loadCampaign(cid, aid, campaignId),\r\n adGroup: adGroupId ? loadAdGroup(cid, aid, campaignId, adGroupId) : Promise.resolve({\r\n ...defaultAdGroupSettings,\r\n [AD_GROUP_TYPES.SearchStandard]: defaultSearchStandard,\r\n [AD_GROUP_TYPES.SearchDynamic]: defaultSearchDynamic,\r\n }),\r\n campaignLocationTargets: readLocationCriterions(cid, aid, campaignId),\r\n adgroupLocationTargets: adGroupId ? readAdGroupLocationCriterions(cid, aid, campaignId, adGroupId) : Promise.resolve({}),\r\n };\r\n\r\n return Promise.props(loadPromises)\r\n .then(async ({\r\n campaign,\r\n adGroup,\r\n campaignLocationTargets,\r\n adgroupLocationTargets,\r\n }) => {\r\n let loadedAdGroup = adGroup;\r\n const bundleCountriesAndLocationCriterions = await loadBundleCountries({\r\n cid, aid, serverContext, language: campaign.Languages,\r\n });\r\n\r\n const { CampaignSettings } = campaign;\r\n const dsaSettings = find(CampaignSettings, setting => setting['@odata.type'] === '#Model.DynamicSearchAdsSetting') || first(CampaignSettings);\r\n const hasDSASettingsInCampaignSettings = result(dsaSettings, 'DomainName') !== undefined;\r\n\r\n if (adGroupId) {\r\n const { AdGroupType } = loadedAdGroup;\r\n if (AdGroupType === AD_GROUP_TYPES.SearchStandard) {\r\n loadedAdGroup = {\r\n [AD_GROUP_TYPES.SearchStandard]: loadedAdGroup,\r\n [AD_GROUP_TYPES.SearchDynamic]: defaultSearchDynamic,\r\n };\r\n } else {\r\n const dsaViewModel = await loadDsaTargets(cid, aid, campaignId, adGroupId);\r\n\r\n loadedAdGroup = {\r\n [AD_GROUP_TYPES.SearchStandard]: defaultSearchStandard,\r\n [AD_GROUP_TYPES.SearchDynamic]: {\r\n ...loadedAdGroup,\r\n DsaTargets: dsaViewModel,\r\n },\r\n };\r\n }\r\n }\r\n\r\n loadedAdGroup = {\r\n ...loadedAdGroup,\r\n [AD_GROUP_TYPES.SearchStandard]: {\r\n ...loadedAdGroup[AD_GROUP_TYPES.SearchStandard],\r\n websites: savedWebsites || defaultWebsites,\r\n allowAdGroupTypeChange: !adGroupId,\r\n },\r\n [AD_GROUP_TYPES.SearchDynamic]: {\r\n ...loadedAdGroup[AD_GROUP_TYPES.SearchDynamic],\r\n showDsaSettings: !hasDSASettingsInCampaignSettings,\r\n allowEditDynamicAdTarget: !adGroupId,\r\n websites: hasDSASettingsInCampaignSettings ? [dsaSettings.DomainName] : defaultWebsites,\r\n selectedWebsiteLanguage: result(dsaSettings, 'Language', dsaDefaultWebsiteLanguage),\r\n selectedTargetingSource: result(dsaSettings, 'Source', defaultTargetingSource),\r\n dynamicTextEnabled: result(dsaSettings, 'DynamicDescriptionEnabled', dsaDefaultTextEnabled),\r\n allowAdGroupTypeChange: !adGroupId,\r\n },\r\n };\r\n\r\n return Promise.resolve({\r\n campaign,\r\n adGroup: loadedAdGroup,\r\n ...(!adGroupId || adGroup.AdGroupType === AD_GROUP_TYPES.SearchStandard ? modelToViewModelForAdgroupLocationTargets({\r\n model: adgroupLocationTargets.value || [],\r\n campaignLocationModel: campaignLocationTargets.value,\r\n bundleCountries: bundleCountriesAndLocationCriterions.bundleCountries,\r\n adGroupId,\r\n campaignId,\r\n }) : {}),\r\n ...bundleCountriesAndLocationCriterions,\r\n });\r\n })\r\n .catch((error) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Load adGroup settings failed: ${error}`);\r\n activity.signal(`onAdGroupSettingsLoadFailed - ${JSON.stringify({\r\n campaignId,\r\n adGroupId,\r\n error,\r\n })}`);\r\n return Promise.reject(error);\r\n });\r\n }, [activity, adGroupId, aid, campaignId, cid, defaultDynamicName, defaultStandardName, permissions, savedWebsites, serverContext]);\r\n\r\n const recommendateRequest = useKeywordSuggestion();\r\n\r\n const save = useCallback(({ data }) => {\r\n const currentAdGroupType = getFlowFactor(state, 'adGroupType') || AD_GROUP_TYPES.SearchStandard;\r\n const subAdGroup = currentAdGroupType === AD_GROUP_TYPES.SearchStandard ? data.adGroup[AD_GROUP_TYPES.SearchStandard] : data.adGroup[AD_GROUP_TYPES.SearchDynamic];\r\n const {\r\n locationTargets,\r\n campaign,\r\n bundleLocationCriterions,\r\n } = data;\r\n\r\n if (currentAdGroupType === AD_GROUP_TYPES.SearchStandard) {\r\n const currentLanguages = subAdGroup.Language === 'None' || !subAdGroup.Language ? campaign.Languages : [subAdGroup.Language];\r\n const currentLocationSettings = locationTargets.useParentLevel ? locationTargets.parentLevelSettings : locationTargets.currentLevelSettings;\r\n handleKeywordSuggestionsWhenChanges({\r\n currentUrl: subAdGroup && first(subAdGroup.websites),\r\n currentLocationSettings,\r\n currentLanguages,\r\n previousUrl: state.context.wizardData.previousUrl || [],\r\n previousLocation: state.context.wizardData.previousLocation || [],\r\n previousLanguages: state.context.wizardData.previousLanguages || [],\r\n activity,\r\n bundleLocationCriterions,\r\n onRequest,\r\n onSuccess,\r\n onFailed,\r\n recommendateRequest,\r\n getSearchIdea,\r\n send,\r\n permissions,\r\n });\r\n }\r\n\r\n if (adGroupId) {\r\n subAdGroup.Id = adGroupId;\r\n }\r\n\r\n const saveAdGroupPromise = () => saveAdGroup({\r\n adGroup: subAdGroup,\r\n campaign: data.campaign,\r\n }, {\r\n permissions,\r\n scenario: scenario.name,\r\n i18n,\r\n activityLogger: activity,\r\n });\r\n\r\n const saveCampaignPromise = () => saveCampaign({\r\n campaign: {\r\n Id: campaignId,\r\n hasDsaSettings: true,\r\n websites: subAdGroup.websites,\r\n selectedWebsiteLanguage: subAdGroup.selectedWebsiteLanguage,\r\n selectedTargetingSource: subAdGroup.selectedTargetingSource,\r\n dynamicTextEnabled: subAdGroup.dynamicTextEnabled,\r\n pageFeeds: subAdGroup.pageFeeds,\r\n },\r\n permissions,\r\n }, {\r\n scenario: scenario.name,\r\n i18n,\r\n activityLogger: activity,\r\n });\r\n\r\n const saveAdGroupPromiseWithErrorHandling = successCampaign => saveAdGroupPromise()\r\n .then((res) => {\r\n const adGroupResult = omit(res.adGroup, 'AdGroups');\r\n\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n adGroupId: Number(adGroupResult.Id),\r\n domain: first(subAdGroup.websites),\r\n websites: subAdGroup.websites,\r\n });\r\n\r\n if (currentAdGroupType === AD_GROUP_TYPES.SearchStandard) {\r\n return Promise.resolve({\r\n adGroup: {\r\n [AD_GROUP_TYPES.SearchStandard]: {\r\n ...adGroupResult,\r\n websites: subAdGroup.websites,\r\n },\r\n [AD_GROUP_TYPES.SearchDynamic]: data.adGroup[AD_GROUP_TYPES.SearchDynamic],\r\n },\r\n });\r\n }\r\n return Promise.resolve({\r\n adGroup: {\r\n [AD_GROUP_TYPES.SearchStandard]: data.adGroup[AD_GROUP_TYPES.SearchStandard],\r\n [AD_GROUP_TYPES.SearchDynamic]: {\r\n websites: subAdGroup.websites,\r\n selectedWebsiteLanguage: subAdGroup.selectedWebsiteLanguage,\r\n ...adGroupResult,\r\n },\r\n },\r\n });\r\n })\r\n .catch((res) => {\r\n const {\r\n adGroup = {},\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = res || {};\r\n\r\n if (adGroup.Id) {\r\n send(WIZARD_EVENTS.UPDATE_WIZARD_DATA, {\r\n adGroupId: Number(adGroup.Id),\r\n });\r\n }\r\n\r\n let partialSuccessAdGroup = data.adGroup;\r\n\r\n if (currentAdGroupType === AD_GROUP_TYPES.SearchDynamic) {\r\n const targetPaths = [\r\n 'categoryTargets',\r\n 'allTargets',\r\n 'specificTargets.exactUrls',\r\n 'specificTargets.rules',\r\n 'customLabelTargets',\r\n ];\r\n insertErrorsByClientIdAndGenerateKey(adGroup.DsaTargets, targetPaths, serverErrors);\r\n\r\n partialSuccessAdGroup = {\r\n ...partialSuccessAdGroup,\r\n [AD_GROUP_TYPES.SearchDynamic]: {\r\n ...partialSuccessAdGroup[AD_GROUP_TYPES.SearchDynamic],\r\n DsaTargets: adGroup.DsaTargets,\r\n },\r\n };\r\n\r\n const hasDSASettingsInCampaignSettings = result(successCampaign, 'DomainName') !== undefined;\r\n if (hasDSASettingsInCampaignSettings) {\r\n partialSuccessAdGroup = {\r\n ...partialSuccessAdGroup,\r\n [AD_GROUP_TYPES.SearchDynamic]: {\r\n ...partialSuccessAdGroup[AD_GROUP_TYPES.SearchDynamic],\r\n disableEditDsaSettings: hasDSASettingsInCampaignSettings,\r\n websites: [successCampaign.DomainName],\r\n selectedWebsiteLanguage: successCampaign.LanguageCode,\r\n selectedTargetingSource: successCampaign.Source,\r\n dynamicTextEnabled: successCampaign.DynamicDescriptionEnabled,\r\n },\r\n };\r\n }\r\n }\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n adGroup: partialSuccessAdGroup,\r\n serverErrors,\r\n systemErrors,\r\n });\r\n });\r\n\r\n const saveCampaignAdGroup = () => {\r\n if (currentAdGroupType === AD_GROUP_TYPES.SearchDynamic && subAdGroup.showDsaSettings) {\r\n // try to save campaign dsa settings first\r\n return saveCampaignPromise()\r\n .then(({ campaign: successCampaign }) => saveAdGroupPromiseWithErrorHandling(successCampaign))\r\n .catch(({ adGroup, serverErrors = [], systemErrors = [] }) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Save campaign settings failed: ${serverErrors} ${systemErrors}`);\r\n activity.signal(`onCampaignSettingsSaveFailed - ${JSON.stringify({\r\n campaignId,\r\n adGroupType: currentAdGroupType,\r\n adGroup: subAdGroup,\r\n serverErrors,\r\n systemErrors,\r\n })}`);\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n data: {\r\n ...data,\r\n adGroup: adGroup || data.adGroup,\r\n },\r\n error: {\r\n serverErrors: flatten(serverErrors.filter(val => val !== null)),\r\n systemErrors: flatten(systemErrors.filter(val => val !== null)),\r\n },\r\n });\r\n });\r\n }\r\n return saveAdGroupPromiseWithErrorHandling()\r\n .catch(({ adGroup, serverErrors = [], systemErrors = [] }) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Save adGroup settings failed: ${serverErrors} ${systemErrors}`);\r\n activity.signal(`onAdGroupSettingsSaveFailed - ${JSON.stringify({\r\n adGroupType: currentAdGroupType,\r\n adGroup: subAdGroup,\r\n serverErrors,\r\n systemErrors,\r\n })}`);\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n data: {\r\n ...data,\r\n adGroup: adGroup || data.adGroup,\r\n },\r\n error: {\r\n serverErrors: flatten(serverErrors.filter(val => val !== null)),\r\n systemErrors: flatten(systemErrors.filter(val => val !== null)),\r\n },\r\n });\r\n });\r\n };\r\n\r\n return saveCampaignAdGroup();\r\n }, [activity, campaignId, i18n, onFailed, onRequest, onSuccess, recommendateRequest, scenario.name, send, state, adGroupId, permissions, getSearchIdea]);\r\n\r\n return {\r\n load,\r\n save,\r\n };\r\n};\r\n","import { getCollapsiblePanelStyles, getStepStyles } from '../../shared/styles';\r\n\r\nexport const getStyles = (components, theme) => ({\r\n collapsiblePanel: {\r\n ...getCollapsiblePanelStyles(components, theme),\r\n '& .jumbo-card-control-all-btn-stack': {\r\n width: '20%',\r\n },\r\n '& .panel-heading': {\r\n padding: 0,\r\n borderBottom: 'none',\r\n marginBottom: 18,\r\n display: 'flex',\r\n\r\n '& .panel-title': {\r\n fontSize: 18,\r\n width: '80%',\r\n '& > a': {\r\n color: theme.palette.themePrimary,\r\n padding: 0,\r\n '&:hover, &:active': {\r\n color: theme.palette.themeDarker,\r\n textDecoration: 'none',\r\n backgroundColor: 'unset',\r\n },\r\n },\r\n\r\n '& > a:after': {\r\n transform: 'rotate(180deg)',\r\n },\r\n\r\n '& > a.collapsed:after': {\r\n transform: 'rotate(90deg)',\r\n },\r\n },\r\n },\r\n },\r\n bidAndTargetStep: {\r\n ...getStepStyles(),\r\n },\r\n});\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport React, { useCallback, useContext, useMemo, useState, useRef } from 'react';\r\nimport { isEmpty, isEqual, map, omit } from 'underscore';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport {\r\n Collapse,\r\n TextTitle,\r\n ValidatedPanel,\r\n getPanelErrorProps,\r\n useCollapseState,\r\n collapseExpander,\r\n ValidatedBootstrapPanel,\r\n} from '@bingads-webui-campaign/wizard-jumbo-card';\r\nimport {\r\n getBidAdjuestmentTitleDetails,\r\n getBidAdjuestmentTitleSummary,\r\n getLocationTargetTitleDetails,\r\n ValidatedBidAdjustment,\r\n ValidatedLocationTargetSetting,\r\n withUseCampaignSettings,\r\n} from '@bingads-webui-campaign-react/search-campaign-wizard-controls';\r\nimport { Link, Stack } from '@bingads-webui-react/fabric-control';\r\nimport { mediumEnum, ScopeLevel } from '@bingads-webui-campaign-react/constants';\r\nimport { Panel as BootstrapPanel } from 'react-bootstrap';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { AdGroup } from '@bingads-webui/campaign-odata-schemas';\r\nimport { ValidationGroup, ErrorMessages } from '@bingads-webui-react/validation';\r\nimport { ActuationGroup } from '@bingads-webui-campaign-react/actuator';\r\nimport { AttentionBeaconGroup } from '@bingads-webui-campaign-react/attention-beacon';\r\nimport { FormErrorGroup, UnmappedFormErrors, andComp, entityIs, propertyIs, orComp, anyComp } from '@bingads-webui-campaign-react/form-error';\r\nimport { withControlErrorHandling, withUnvalidatedControlErrors } from '@bingads-webui-campaign-react/error-handling';\r\nimport { useFormService } from '@bingads-webui-react/form';\r\nimport { ValidationStringMap } from '@bingads-webui/validation-string-map';\r\nimport { buildLegacyI18n } from '@bingads-webui/build-legacy-i18n';\r\nimport { flattenTargetCriterion, loadBundleCountries, updateAdGroupAgeTargets, ERROR_ENTITY } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { MultimediaAdBidAdjustmentSection } from '@bingads-webui-campaign-react/multimedia-ad-adjustment';\r\nimport { ValidatedDefaultBid, isAutoBidding } from '@bingads-webui-campaign-react/default-bid';\r\nimport { formatBidValue } from '@bingads-webui-campaign-react/summary-page';\r\nimport { AdDistributionWithValidationSection } from '@bingads-webui-campaign/ad-distribution';\r\nimport { ValidatedDateSetting, getDateSettingDetails } from '@bingads-webui-campaign-react/date-setting';\r\nimport { ValidatedLegacyAdSchedule, getAdScheduleDetails } from '@bingads-webui-campaign/ad-schedule';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport {\r\n ValidatedCompanyPicker,\r\n ValidatedIndustryPicker,\r\n ValidatedJobFunctionPicker,\r\n} from '@bingads-webui-campaign-react/display-plus-campaigns';\r\n\r\nimport { getStyles } from './styles';\r\nimport { StepHeader } from '../../shared/step-header';\r\nimport BidImg from '../../shared/media/bid.svg';\r\nimport AdDistributionImg from '../../shared/media/ad-distribution.svg';\r\nimport DateSettingImg from '../../shared/media/date-setting.svg';\r\nimport AdScheduleImg from '../../shared/media/ad-schedule.svg';\r\nimport DeviceImg from '../../shared/media/device.svg';\r\nimport GenderImg from '../../shared/media/gender.svg';\r\nimport AgeImg from '../../shared/media/age.svg';\r\nimport LocationImg from '../../shared//media/location.svg';\r\nimport CompanyNameImg from '../../shared/media/company-name.svg';\r\nimport IndustryImg from '../../shared/media/industry.svg';\r\nimport JobFunctionImg from '../../shared/media/job-function.svg';\r\n\r\nconst adgroupLocationCriterions = anyComp(\r\n entityIs(ERROR_ENTITY.AdGroupLocation),\r\n entityIs(ERROR_ENTITY.AdGroupRadius),\r\n entityIs(ERROR_ENTITY.AdGroupNegativeLocation),\r\n entityIs(ERROR_ENTITY.AdGroupLocationIntent)\r\n);\r\nconst entityIsAdGroup = entityIs(ERROR_ENTITY.AdGroup);\r\nconst ServerValidatedDefaultBid = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedDefaultBid, { filter: andComp(entityIsAdGroup, propertyIs('BidAmount')) }));\r\nconst ServerValidatedLegacyDateSetting = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedDateSetting, { filter: andComp(entityIsAdGroup, orComp(propertyIs('StartDate'), propertyIs('EndDate'))) }));\r\nconst ServerValidatedLegacyAdSchedule = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedLegacyAdSchedule, { filter: entityIs(ERROR_ENTITY.AdGroupDayTimeCriterion) }));\r\nconst ServerValidatedDevice = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedBidAdjustment, { filter: entityIs(ERROR_ENTITY.AdGroupDeviceOSCriterion) }));\r\nconst ServerValidatedGender = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedBidAdjustment, { filter: entityIs(ERROR_ENTITY.AdGroupGenderCriterion) }));\r\nconst ServerValidatedAge = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedBidAdjustment, { filter: entityIs(ERROR_ENTITY.AdGroupAgeCriterion) }));\r\nconst ServerValidatedLocationTargetSetting = withControlErrorHandling(withUnvalidatedControlErrors(ValidatedLocationTargetSetting, { filter: adgroupLocationCriterions }));\r\nconst ServerValidatedCompanyName = withControlErrorHandling(withUnvalidatedControlErrors(withUseCampaignSettings(ValidatedCompanyPicker), { filter: entityIs(ERROR_ENTITY.AdGroupCompanyNameCriterion) }));\r\nconst ServerValidatedIndustry = withControlErrorHandling(withUnvalidatedControlErrors(withUseCampaignSettings(ValidatedIndustryPicker), { filter: entityIs(ERROR_ENTITY.AdGroupIndustryCriterion) }));\r\nconst ServerValidatedJobFunction = withControlErrorHandling(withUnvalidatedControlErrors(withUseCampaignSettings(ValidatedJobFunctionPicker), { filter: entityIs(ERROR_ENTITY.AdGroupJobFunctionCriterion) }));\r\n\r\nexport const BidAndTargetStep = ({\r\n data,\r\n onDataChange,\r\n error,\r\n}) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n const i18n = useContext(I18nContext);\r\n const legacyI18n = useMemo(() => buildLegacyI18n(i18n, [ValidationStringMap]), [i18n]);\r\n const classes = useDefaultStyles(getStyles);\r\n const serverContext = useContext(ServerContext);\r\n\r\n const {\r\n DynamicPermissions,\r\n Permissions,\r\n CurrentUser: { Market: market },\r\n } = serverContext;\r\n const permissions = useMemo(() => ({ dynamic: { ...DynamicPermissions }, ...Permissions }), [DynamicPermissions, Permissions]);\r\n const { scope } = useContext(ScopeContext);\r\n const {\r\n cid, aid, campaignId, adGroupId,\r\n } = scope.values;\r\n const refreshLocationTargetsTimes = useRef(0);\r\n const {\r\n adGroup,\r\n campaign,\r\n } = data || {};\r\n const selectedLanguages = useRef(adGroup && adGroup.Languages);\r\n selectedLanguages.current = adGroup && adGroup.Languages === 'None' ? campaign && campaign.Languages : adGroup && adGroup.Languages;\r\n\r\n const { state: { context: { saveFailed: showAllValidationErrors } } } = useFormService();\r\n const [adScheduleView, setAdScheduleView] = useState(null);\r\n const [advancedSettingsSectionExpanded, setAdvancedSettingsSectionExpanded] = useState(false);\r\n const onAdvancedSettingsSectionToggle = useCallback((expanded) => {\r\n setAdvancedSettingsSectionExpanded(expanded);\r\n }, []);\r\n\r\n const [\r\n allBidAndTargetSections,\r\n bidAndTargetExpandedSections,\r\n setBidAndTargetExpandedSections,\r\n ] = useCollapseState(\r\n ['bid', 'locations', 'device', 'gender', 'age', 'companyName', 'industry', 'jobFunction'] /* all sections */,\r\n ['bid', 'locations', 'device', 'gender', 'age']\r\n );\r\n\r\n const basicSettingsExpand = useMemo(\r\n () => collapseExpander({ setActiveKeys: setBidAndTargetExpandedSections }),\r\n [setBidAndTargetExpandedSections]\r\n );\r\n\r\n const [\r\n allAdvancedSections,\r\n advancedExpandedSections,\r\n setAdvancedExpandedSections,\r\n flipAdvancedExpandAllState,\r\n expandAllAdvancedSettingsSections,\r\n ] = useCollapseState(\r\n ['ad-schedule', 'start-end-date', 'ad-distribution', 'multimedia-ad'] /* all sections */,\r\n ['ad-schedule', 'start-end-date'] /* initially expanded sections */\r\n );\r\n\r\n const onDistributionValidate = useCallback((result) => {\r\n if (data && data.adGroup) {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...data.adGroup,\r\n ...result.data,\r\n Medium: mediumEnum.Search,\r\n },\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }, [data, onDataChange]);\r\n\r\n const onValidate = useCallback((result) => {\r\n if (data && data.adGroup) {\r\n let { Age } = result.data;\r\n if (result.data.ageRanges && !isEqual(result.data.ageRanges, data.adGroup.ageRanges)) {\r\n Age = updateAdGroupAgeTargets(result.data.Age || data.adGroup.Age, result.data.ageRanges);\r\n }\r\n const newLanguages = result && result.data && result.data.Languages === 'None' ? data.campaign.Languages : result.data.Languages;\r\n if (!isEmpty(newLanguages) && selectedLanguages.current !== newLanguages) {\r\n selectedLanguages.current = newLanguages;\r\n refreshLocationTargetsTimes.current = (refreshLocationTargetsTimes.current + 1) % 1000;\r\n loadBundleCountries({\r\n cid, aid, serverContext, language: newLanguages,\r\n }).then((bundleCountriesAndLocationCriterions) => {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...data.adGroup,\r\n ...result.data,\r\n ...(Age && { Age }),\r\n },\r\n ...bundleCountriesAndLocationCriterions,\r\n },\r\n isValid: result.isValid,\r\n });\r\n });\r\n } else {\r\n onDataChange({\r\n data: {\r\n ...data,\r\n adGroup: {\r\n ...data.adGroup,\r\n ...result.data,\r\n ...(Age && { Age }),\r\n },\r\n },\r\n isValid: result.isValid,\r\n });\r\n }\r\n }\r\n }, [aid, cid, data, onDataChange, serverContext]);\r\n\r\n const basicSettingsSection = useMemo(() => {\r\n const disableBid = isAutoBidding(data && data.campaign && data.campaign.BiddingScheme && data.campaign.BiddingScheme.Type);\r\n const bidPanel = (\r\n \r\n
\r\n \r\n
\r\n {\r\n currentAdGroupType === AD_GROUP_TYPES.SearchStandard ? (\r\n \r\n { standardAdGroupSection }\r\n
\r\n \r\n ) : (\r\n \r\n { dynamicAdGroupSection }\r\n
\r\n \r\n )\r\n }\r\n \r\n \r\n { basicSettings }\r\n \r\n
\r\n );\r\n }, [adGroup, adGroupId, aid, allBidAndTargetSections, basicSettingsExpand, bidAndTargetExpandedSections, campaign, campaignId, cid, classes, data, i18n, market, onDataChange, onValidate, permissions, scope, serverContext.CurrentAccount.CurrencyCode, setBidAndTargetExpandedSections]);\r\n\r\n const advancedSettingsSection = useMemo(() => {\r\n const adScheduleComponent = (\r\n \r\n (\r\n <>\r\n \r\n \r\n {i18n.getString(_TL_('Advanced settings'))}\r\n \r\n \r\n {advancedSettingsSectionExpanded && advancedExpandedSections.length ? i18n.getString(_TL_('Collapse all')) : i18n.getString(_TL_('Expand all'))}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )}\r\n />\r\n
);\r\n }, [adScheduleView, permissions, advancedExpandedSections, advancedSettingsSectionExpanded, allAdvancedSections, classes.collapsiblePanel, data, expandAllAdvancedSettingsSections, flipAdvancedExpandAllState, i18n, onAdvancedSettingsSectionToggle, onDistributionValidate, onValidate, setAdvancedExpandedSections]);\r\n\r\n\r\n return (\r\n \r\n \r\n { adScheduleComponent}\r\n { dateSettingComponent }\r\n \r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n );\r\n};\r\n\r\nBidAndTargetStep.propTypes = {\r\n data: PropTypes.shape({\r\n adGroup: PropTypes.shape({\r\n Id: PropTypes.number,\r\n Status: PropTypes.string,\r\n AdScheduleUseSearcherTimeZone: PropTypes.bool,\r\n ageRanges: PropTypes.arrayOf(PropTypes.string),\r\n Age: PropTypes.shape({}),\r\n Gender: PropTypes.shape({}),\r\n Device: PropTypes.shape({}),\r\n companyNameTargets: PropTypes.shape({}),\r\n industry: PropTypes.shape({}),\r\n jobTargets: PropTypes.shape({}),\r\n locationTargets: PropTypes.shape({}),\r\n SearchBid: PropTypes.number,\r\n StartDate: PropTypes.string,\r\n EndDate: PropTypes.string,\r\n dayTimeRanges: PropTypes.arrayOf(PropTypes.shape({})),\r\n currentSelectedAgeLevel: PropTypes.string,\r\n currentSelectedGenderLevel: PropTypes.string,\r\n currentSelectedDeviceLevel: PropTypes.string,\r\n currentSelectedCompanyNameLevel: PropTypes.string,\r\n currentSelectedIndustryLevel: PropTypes.string,\r\n currentSelectedJobFunctionLevel: PropTypes.string,\r\n }),\r\n campaign: PropTypes.shape({\r\n BiddingScheme: PropTypes.shape({\r\n Type: PropTypes.string,\r\n }),\r\n Languages: PropTypes.string,\r\n Age: PropTypes.shape({}),\r\n Gender: PropTypes.shape({}),\r\n Device: PropTypes.shape({}),\r\n companyNameTargets: PropTypes.shape({}),\r\n industry: PropTypes.shape({}),\r\n jobTargets: PropTypes.shape({}),\r\n TimeZone: PropTypes.string,\r\n dayTimeRanges: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n bundleCountries: PropTypes.shape({}),\r\n bundleLocationCriterions: PropTypes.shape({}),\r\n }).isRequired,\r\n onDataChange: PropTypes.func.isRequired,\r\n error: PropTypes.shape({\r\n serverErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n systemErrors: PropTypes.arrayOf(PropTypes.shape({})),\r\n }),\r\n};\r\n\r\nBidAndTargetStep.defaultProps = {\r\n error: null,\r\n};\r\n","import { useCallback, useContext } from 'react';\r\nimport Promise from 'bluebird';\r\nimport _ from 'underscore';\r\nimport { useWizardService } from '@bingads-webui-react/wizard';\r\nimport { ServerContext } from '@bingads-webui-campaign-react/server-context';\r\nimport { ActivityContext, ScenarioContext } from '@bingads-webui-react/hoc-with-signal';\r\nimport { loadCampaign, loadBundleCountries, readAdGroup, readScheduleCriterions, readAdGroupScheduleCriterions, modelToViewModelForAdGroupSetting, saveAdGroup, readTargetCriterion, readAdGroupTargetCriterion, readLocationCriterions, readAdGroupLocationCriterions } from '@bingads-webui-campaign-react/search-campaign-data';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { PermissionsContext } from '@bingads-webui-react/hoc-with-permissions';\r\n\r\nconst defaultAdGroupSettings = {\r\n Name: 'Ad Group 1',\r\n AdGroupType: 'SearchStandard',\r\n SearchBid: 5,\r\n Status: 'Draft',\r\n};\r\n\r\nexport const useBidAndTargetRepository = () => {\r\n const { scope } = useContext(ScopeContext) || {};\r\n const {\r\n cid, aid, campaignId,\r\n } = scope.values;\r\n const scenario = useContext(ScenarioContext);\r\n const activity = useContext(ActivityContext);\r\n const serverContext = useContext(ServerContext);\r\n const permissions = useContext(PermissionsContext);\r\n const { state } = useWizardService();\r\n const { adGroupId } = state.context.wizardData;\r\n const i18n = useContext(I18nContext);\r\n const load = useCallback(() => {\r\n const loadPromises = {\r\n campaign: loadCampaign(cid, aid, campaignId),\r\n adGroup: adGroupId ? readAdGroup(cid, aid, campaignId, adGroupId, i18n) : Promise.resolve(defaultAdGroupSettings),\r\n campaignScheduleCriterion: readScheduleCriterions(cid, aid, campaignId),\r\n adGroupScheduleCriterion: adGroupId ? readAdGroupScheduleCriterions(cid, aid, campaignId, adGroupId) : Promise.resolve(null),\r\n campaignTargetCriterion: readTargetCriterion(cid, aid, campaignId),\r\n adGroupTargetCriterion: adGroupId ? readAdGroupTargetCriterion(cid, aid, campaignId, adGroupId) : Promise.resolve(null),\r\n campaignLocationTargets: readLocationCriterions(cid, aid, campaignId),\r\n adGroupLocationTargets: adGroupId ? readAdGroupLocationCriterions(cid, aid, campaignId, adGroupId) : Promise.resolve(null),\r\n };\r\n\r\n return Promise.props(loadPromises)\r\n .then(async ({\r\n campaign: rawCampaign,\r\n adGroup: rawAdGroup,\r\n campaignScheduleCriterion,\r\n adGroupScheduleCriterion,\r\n campaignTargetCriterion,\r\n adGroupTargetCriterion,\r\n adGroupLocationTargets,\r\n campaignLocationTargets,\r\n }) => {\r\n const bundleCountriesAndLocationCriterions = await loadBundleCountries({\r\n cid, aid, serverContext, language: rawCampaign.Languages,\r\n });\r\n const { campaignViewModel, adGroupViewModel } = modelToViewModelForAdGroupSetting({\r\n adGroupModel: rawAdGroup,\r\n campaignModel: rawCampaign,\r\n campaignScheduleCriterionModel: campaignScheduleCriterion ? campaignScheduleCriterion.value : null,\r\n adGroupScheduleCriterionModel: adGroupScheduleCriterion ? adGroupScheduleCriterion.value : null,\r\n campaignTargetCriterionModel: campaignTargetCriterion ? campaignTargetCriterion.value : null,\r\n adGroupTargetCriterionModel: adGroupTargetCriterion ? adGroupTargetCriterion.value : null,\r\n bundleCountries: bundleCountriesAndLocationCriterions.bundleCountries,\r\n adGroupLocationTargets: adGroupLocationTargets ? adGroupLocationTargets.value : [],\r\n campaignLocationTargets: campaignLocationTargets ? campaignLocationTargets.value : [],\r\n i18n,\r\n });\r\n\r\n return Promise.resolve({\r\n campaign: campaignViewModel,\r\n adGroup: adGroupViewModel,\r\n ...bundleCountriesAndLocationCriterions,\r\n });\r\n })\r\n .catch((error) => {\r\n // eslint-disable-next-line no-console\r\n console.error(`Load bid and target settings failed: ${error}`);\r\n activity.signal(`onBidTargetLoadFailed - ${JSON.stringify({\r\n campaignId,\r\n adGroupId,\r\n error,\r\n })}`);\r\n return Promise.reject(error);\r\n });\r\n }, [activity, adGroupId, aid, campaignId, cid, i18n, serverContext]);\r\n\r\n const save = useCallback(({ data }) => {\r\n const {\r\n adGroup,\r\n campaign,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n } = data;\r\n const { isPublishing } = state.context.wizardData;\r\n const adGroupToSave = _.extend(adGroup, { Status: isPublishing ? 'Active' : 'Draft' });\r\n\r\n return saveAdGroup({\r\n adGroup: adGroupToSave,\r\n campaign,\r\n bundleCountries,\r\n bundleLocationCriterions,\r\n }, {\r\n permissions,\r\n scenario: scenario.name,\r\n i18n,\r\n activityLogger: activity,\r\n })\r\n .then(res => Promise.resolve({\r\n campaign,\r\n adGroup: res.adGroup,\r\n }))\r\n .catch((error) => {\r\n const {\r\n serverErrors = [],\r\n systemErrors = [],\r\n } = error || {};\r\n\r\n // eslint-disable-next-line no-console\r\n console.error(`Save bid and target settings failed: ${error}`);\r\n activity.signal(`onBidTargetSaveFailed - ${JSON.stringify({\r\n data,\r\n error,\r\n })}`);\r\n\r\n // eslint-disable-next-line prefer-promise-reject-errors\r\n return Promise.reject({\r\n data: {\r\n adGroup: error.adGroup,\r\n campaign,\r\n },\r\n error: {\r\n serverErrors: _.flatten(serverErrors.filter(val => val !== null)),\r\n systemErrors: _.flatten(systemErrors.filter(val => val !== null)),\r\n },\r\n });\r\n });\r\n }, [activity, i18n, scenario.name, state.context.wizardData]);\r\n\r\n return {\r\n load,\r\n save,\r\n };\r\n};\r\n","import _ from 'underscore';\r\nimport { FORM_STATES } from '@bingads-webui-react/form';\r\nimport { getNeedConfirming } from '@bingads-webui-campaign-react/campaign-settings-utils';\r\n\r\nimport { SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS, SEARCH_CAMPAIGN_EDIT_WIZARD_STEP_PATHS, SEARCH_AD_GROUP_EDIT_WIZARD_STEP_PATHS, SEARCH_AD_GROUP_CREATION_WIZARD_STEP_PATHS } from './step-utils';\r\nimport { CampaignSettingsStep, useCampaignSettingsRepository } from './campaign-settings';\r\nimport { KeywordsStep, useKeywordsRepository } from './keywords';\r\nimport { AddTextStep, useAdsRepository } from './add-text';\r\nimport { ExtensionsStep, useExtensionsRepository } from './extensions';\r\nimport { BudgetAndBidsStep, useBudgetAndBidSettingsRepository } from './budget';\r\nimport { SummaryStep, useSummaryRepository } from './summary';\r\nimport { CampaignEditSettingsStep, useCampaignEditSettingsRepository } from './campaign-edit-settings';\r\nimport { AdGroupEditSettingsStep, useAdGroupEditSettingsRepository } from './adgroup-edit-settings';\r\nimport { AdGroupSettingsStep, useAdGroupSettingsRepository } from './adgroup-settings';\r\nimport { BidAndTargetStep, useBidAndTargetRepository } from './bid-and-target';\r\nimport { StandardAdTypes, DynamicAdTypes } from '../constants/ad-type';\r\n\r\nexport const searchCampaignCreationStepConfigs = permissions => [\r\n {\r\n id: SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.CAMPAIGN_SETTINGS,\r\n view: CampaignSettingsStep,\r\n repository: useCampaignSettingsRepository,\r\n machineOptions: {\r\n initialState: FORM_STATES.FETCHING,\r\n },\r\n },\r\n {\r\n id: SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.KEYWORDS,\r\n view: KeywordsStep,\r\n repository: useKeywordsRepository,\r\n },\r\n {\r\n id: SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.CREATE_AD,\r\n view: AddTextStep,\r\n viewProps: {\r\n enableAdsManagment: false,\r\n confirmWhenSwitchAdType: true,\r\n adTypes: StandardAdTypes,\r\n },\r\n repository: useAdsRepository,\r\n repositoryProps: {\r\n enableAdsManagment: false,\r\n adTypes: StandardAdTypes,\r\n },\r\n },\r\n {\r\n id: SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.ADD_MORE_ASSETS,\r\n view: ExtensionsStep,\r\n repository: useExtensionsRepository,\r\n repositoryProps: { permissions },\r\n },\r\n {\r\n id: SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.BUDGET_AND_BIDS,\r\n view: BudgetAndBidsStep,\r\n repository: useBudgetAndBidSettingsRepository,\r\n },\r\n {\r\n id: SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.SUMMARY,\r\n repository: useSummaryRepository,\r\n view: SummaryStep,\r\n },\r\n];\r\n\r\nconst searchCampaignEditStepConfigs = [\r\n {\r\n id: SEARCH_CAMPAIGN_EDIT_WIZARD_STEP_PATHS.CAMPAIGN_EDIT_SETTINGS,\r\n view: CampaignEditSettingsStep,\r\n repository: useCampaignEditSettingsRepository,\r\n machineOptions: {\r\n initialState: FORM_STATES.FETCHING,\r\n },\r\n },\r\n];\r\n\r\nexport const getSearchCampaignEditStepConfigs = permissions => searchCampaignEditStepConfigs.map((step) => {\r\n if (_.get(permissions, ['dynamic', 'ConversionAssociationWarningP2']) && step.id === SEARCH_CAMPAIGN_EDIT_WIZARD_STEP_PATHS.CAMPAIGN_EDIT_SETTINGS) {\r\n const mapStep = {\r\n ...step,\r\n machineOptions: {\r\n ...step.machineOptions,\r\n guards: {\r\n needsConfirming: context => getNeedConfirming(permissions, context),\r\n },\r\n },\r\n };\r\n return mapStep;\r\n }\r\n return step;\r\n});\r\n\r\nexport const searchAdGroupCreationStepConfigs = [\r\n {\r\n id: SEARCH_AD_GROUP_CREATION_WIZARD_STEP_PATHS.AD_GROUP_SETTINGS,\r\n view: AdGroupSettingsStep,\r\n repository: useAdGroupSettingsRepository,\r\n machineOptions: {\r\n initialState: FORM_STATES.FETCHING,\r\n },\r\n },\r\n {\r\n id: SEARCH_AD_GROUP_CREATION_WIZARD_STEP_PATHS.KEYWORDS,\r\n view: KeywordsStep,\r\n repository: useKeywordsRepository,\r\n },\r\n {\r\n id: SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.CREATE_AD,\r\n view: AddTextStep,\r\n viewProps: {\r\n enableAdsManagment: true,\r\n adTypes: StandardAdTypes,\r\n description: _TL_('Create up to five Multimedia ads and three Responsive Search ads per ad group.'),\r\n },\r\n repository: useAdsRepository,\r\n repositoryProps: {\r\n enableAdsManagment: true,\r\n adTypes: StandardAdTypes,\r\n },\r\n },\r\n {\r\n id: SEARCH_AD_GROUP_CREATION_WIZARD_STEP_PATHS.CREATE_DSA_AD,\r\n view: AddTextStep,\r\n viewProps: {\r\n enableAdsManagment: true,\r\n adTypes: DynamicAdTypes,\r\n description: _TL_('Create a maximum of 100 Dynamic Search ads per ad group.'),\r\n },\r\n repository: useAdsRepository,\r\n repositoryProps: {\r\n enableAdsManagment: true,\r\n adTypes: DynamicAdTypes,\r\n },\r\n },\r\n {\r\n id: SEARCH_AD_GROUP_CREATION_WIZARD_STEP_PATHS.BID_AND_TARGET,\r\n view: BidAndTargetStep,\r\n repository: useBidAndTargetRepository,\r\n },\r\n {\r\n id: SEARCH_AD_GROUP_CREATION_WIZARD_STEP_PATHS.BID_AND_TARGET_DSA,\r\n view: BidAndTargetStep,\r\n repository: useBidAndTargetRepository,\r\n },\r\n];\r\n\r\nexport const searchAdGroupEditStepConfigs = [\r\n {\r\n id: SEARCH_AD_GROUP_EDIT_WIZARD_STEP_PATHS.AD_GROUP_EDIT_SETTINGS,\r\n view: AdGroupEditSettingsStep,\r\n repository: useAdGroupEditSettingsRepository,\r\n machineOptions: {\r\n initialState: FORM_STATES.FETCHING,\r\n },\r\n },\r\n];\r\n","/* eslint-disable jsx-a11y/anchor-is-valid */\r\nimport _ from 'underscore';\r\nimport React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { DismissRegular } from '@fluentui/react-icons';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { Button, Link, Toaster, Toast, ToastTitle, ToastBody, ToastFooter, useId, useToastController } from '@fluentui/react-components';\r\nimport { useWizardService, getCurrentStepId, getWizardData, WIZARD_EVENTS } from '@bingads-webui-react/wizard';\r\nimport { ActivityContext } from '@bingads-webui-react/hoc-with-signal';\r\n\r\nimport { SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS } from '../step-utils';\r\n\r\nconst getStyles = () => ({\r\n toaster: {\r\n '&.fui-ToastTitle': {\r\n alignItems: 'center',\r\n },\r\n },\r\n});\r\n\r\nexport const BackSummaryToast = () => {\r\n const [rootEle, setRootEle] = useState(null);\r\n const i18n = useContext(I18nContext);\r\n const activity = useContext(ActivityContext);\r\n const { state, send } = useWizardService();\r\n const classes = useDefaultStyles(getStyles);\r\n const currentStepId = getCurrentStepId(state);\r\n const toasterId = useId('back-to-summary-toaster');\r\n const { dispatchToast, dismissToast } = useToastController(toasterId);\r\n\r\n const handleSaveAndReturn = useCallback(() => {\r\n if (activity) {\r\n activity.signal(`onSaveAndBackToSummary from ${currentStepId}`);\r\n }\r\n send({\r\n type: WIZARD_EVENTS.SAVE_AND_GOTO,\r\n stepId: SEARCH_CAMPAIGN_CREATION_WIZARD_STEP_PATHS.SUMMARY,\r\n wizardData: {\r\n focusedStepId: '',\r\n },\r\n });\r\n }, [send, activity]);\r\n\r\n const handleDismiss = useCallback(() => {\r\n if (activity) {\r\n activity.signal('onDismissBackToSummaryToast');\r\n }\r\n send({\r\n type: WIZARD_EVENTS.UPDATE_WIZARD_DATA,\r\n focusedStepId: '',\r\n });\r\n dismissToast(toasterId);\r\n }, [send, dismissToast, toasterId, activity]);\r\n\r\n const backToSummaryToast = useMemo(() => {\r\n const toast = (\r\n \r\n
\r\n \r\n
\r\n \r\n { basicSettingsSection }\r\n { advancedSettingsSection }\r\n
\r\n \r\n \r\n {i18n.getString(_TL_('Start typing to search for brands'))}\r\n
\r\n )}\r\n {!isSearchFilterEmpty && _.isEmpty(options) && (\r\n \r\n
\r\n )}\r\n {!_.isEmpty(options) && options.map(brand => (\r\n \r\n ))}\r\n {isMoreOptionsThanLimit && \r\n {i18n.getString(_TL_('No brand found'))}\r\n
\r\n \r\n {i18n.getString(_TL_('You can request a brand to add to your shared library.'))}\r\n
\r\n \r\n {i18n.getString(_TL_('We cannot load the brands at this time. Please try again later.'))}\r\n
\r\n }\r\n \r\n
\r\n ),\r\n }}\r\n >\r\n {text}\r\n \r\n ), [classes.TooltipContent]);\r\n\r\n return (\r\n {`${item.name} (${item.key})`}
\r\n{item.link}
\r\n\r\n {(isAwaysDisplayHeader || !_.isEmpty(selectedOptions)) && (\r\n
\r\n );\r\n};\r\n\r\nSelectedBrandsTags.propTypes = {\r\n className: PropTypes.string,\r\n selectedOptions: PropTypes.arrayOf(PropTypes.shape({\r\n key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n name: PropTypes.string.isRequired,\r\n })).isRequired,\r\n onRemoveAll: PropTypes.func.isRequired,\r\n onRemoveItem: PropTypes.func.isRequired,\r\n isAwaysDisplayHeader: PropTypes.bool,\r\n};\r\n\r\nSelectedBrandsTags.defaultProps = {\r\n className: undefined,\r\n isAwaysDisplayHeader: false,\r\n};\r\n","import React, { useContext, useMemo } from 'react';\r\nimport _ from 'underscore';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { Label } from '@fluentui/react';\r\nimport { ExistingBrandsPicker } from './existing-brands-picker';\r\nimport { SelectedBrandsTags } from './selected-brands-tags';\r\nimport { RequestBrandButton } from './request-brand-button';\r\nimport { useBrandsData } from './brands-data';\r\n\r\nconst getStyles = (_components, { palette }) => ({\r\n SelectedExistingBrandsContainer: {\r\n '& .ms-MessageBar': {\r\n marginBottom: 16,\r\n },\r\n },\r\n SelectedNewBrandsContainer: {\r\n marginTop: 16,\r\n '& p': {\r\n margin: 0,\r\n },\r\n '& hr': {\r\n background: palette.neutralLight,\r\n border: 'none',\r\n height: 1,\r\n },\r\n '& .request-brand-button': {\r\n marginTop: 8,\r\n },\r\n },\r\n});\r\n\r\nexport const BrandsPicker = ({\r\n onRequestBrand,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n const {\r\n selectedOptions,\r\n setSelectedOptions,\r\n } = useBrandsData();\r\n\r\n // The approved brands\r\n const approvedBrands = useMemo(() => selectedOptions.filter(brand => !brand.isUnderReview), [selectedOptions]);\r\n\r\n const onRemoveAllApprovedBrands = () => {\r\n const filteredBrands = selectedOptions.filter(brand => brand.isUnderReview);\r\n setSelectedOptions(filteredBrands);\r\n };\r\n\r\n const onRemoveOneApprovedBrand = (brand) => {\r\n const filteredBrands = selectedOptions.filter(selectedBrand => selectedBrand.key !== brand.key);\r\n setSelectedOptions(filteredBrands);\r\n };\r\n\r\n // The pending brands\r\n const pendingBrands = useMemo(() => selectedOptions.filter(brand => brand.isUnderReview), [selectedOptions]);\r\n\r\n const onRemoveAllPendingBrands = () => {\r\n const filteredBrands = selectedOptions.filter(brand => !brand.isUnderReview);\r\n setSelectedOptions(filteredBrands);\r\n };\r\n\r\n const onRemoveOnePendingBrand = (brand) => {\r\n const filteredBrands = selectedOptions.filter(selectedBrand => selectedBrand.key !== brand.key);\r\n setSelectedOptions(filteredBrands);\r\n };\r\n\r\n return (\r\n <>\r\n \r\n {selectedOptions ? selectedOptions.length : 0} {i18n.getString(_TL_('Brands'))}\r\n {!_.isEmpty(selectedOptions) && (\r\n
\r\n )}\r\n \r\n {!_.isEmpty(selectedOptions) && selectedOptions.map((item, index) => (\r\n onRenderSelectedItemText({ item, text })}\r\n itemIndex={index}\r\n onDelete={() => onRemoveItem(item)}\r\n />\r\n ))}\r\n
\r\n \r\n
\r\n \r\n {!_.isEmpty(pendingBrands) && (\r\n <>\r\n
\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nBrandsPicker.propTypes = {\r\n onRequestBrand: PropTypes.func.isRequired,\r\n};\r\n","import React, { useCallback, useContext, useMemo, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { Link } from 'react-router-dom';\r\nimport _ from 'underscore';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { Label, TextField } from '@fluentui/react';\r\nimport { ReactTemplate } from '@bingads-webui-react/react-template';\r\nimport { HelpPopup } from '@bingads-webui-react/help-popup';\r\nimport { helpbuttonStyle, convertToLocalStyle } from '@bingads-webui-campaign-react/common-styles';\r\nimport { UserContext } from '@bingads-webui-react/user-context';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { siteMapPropType, withSiteMap, findSiteMap, getSiteMapItemRoute, processorSet } from '@bingads-webui-campaign-react/with-site-map';\r\nimport { BrandsPicker } from '../brands-picker';\r\n\r\nconst getStyles = (useless, { palette = {} }) => ({\r\n Form: {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: '8px',\r\n margin: '16px 0',\r\n '& .list-name-length': {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n margin: '2px 0',\r\n },\r\n ...convertToLocalStyle(helpbuttonStyle({ palette })),\r\n },\r\n});\r\n\r\nconst LIST_NAME_MAX_LENGTH = 128;\r\n\r\nexport const ManageBrandListPanelContentImpl = ({\r\n unscopedSiteMap, brandListId, name, onNameChange, isConfirmDialogOn, onOpenRequestBrandPanel,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n const [listName, setListName] = useState(name);\r\n\r\n const onChangeListName = useCallback((e, value) => {\r\n if (value.length <= LIST_NAME_MAX_LENGTH) {\r\n onNameChange(value);\r\n setListName(value);\r\n }\r\n }, [onNameChange]);\r\n\r\n const userContext = useContext(UserContext);\r\n const { scope } = useContext(ScopeContext);\r\n const brandListsPageLink = useMemo(() => {\r\n const siteMapItemId = 'brand-lists';\r\n const siteMapItem = findSiteMap(unscopedSiteMap, item => item.id === siteMapItemId);\r\n return getSiteMapItemRoute({ item: siteMapItem, scope, userContext }).href;\r\n }, [unscopedSiteMap, userContext, scope]);\r\n\r\n return (\r\n \r\n \r\n
\r\n {i18n.getString(_TL_('Once approved, we’ll automatically add these brands to your list.'))}\r\n
\r\n\r\n {!brandListId && (\r\n <>\r\n {isConfirmDialogOn && (\r\n
\r\n );\r\n};\r\n\r\nManageBrandListPanelContentImpl.propTypes = {\r\n unscopedSiteMap: siteMapPropType.isRequired,\r\n brandListId: PropTypes.number,\r\n name: PropTypes.string,\r\n onNameChange: PropTypes.func.isRequired,\r\n isConfirmDialogOn: PropTypes.bool,\r\n onOpenRequestBrandPanel: PropTypes.func.isRequired,\r\n};\r\n\r\nManageBrandListPanelContentImpl.defaultProps = {\r\n name: '',\r\n brandListId: undefined,\r\n isConfirmDialogOn: false,\r\n};\r\n\r\nconst scopeUnawareWithSiteMap = _.partial(withSiteMap, _, processorSet.basic, _, _, 'unscopedSiteMap');\r\nexport const ManageBrandListPanelContent = scopeUnawareWithSiteMap(ManageBrandListPanelContentImpl);\r\n","import React, { useCallback, useContext, useState } from 'react';\r\nimport { noop } from 'underscore';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { DefaultButton, IconButton, Label, MessageBar, Panel, PanelType, PrimaryButton, TextField } from '@fluentui/react';\r\nimport { HelpPopup } from '@bingads-webui-react/help-popup';\r\nimport { helpbuttonStyle, convertToLocalStyle } from '@bingads-webui-campaign-react/common-styles';\r\nimport { createBrandFromProp, GENERIC_ERROR_MESSAGE, getOdataResponseErrors } from '@bingads-webui-campaign-react/brand-lists-data';\r\nimport { useBrandsData } from '../brands-picker/brands-data';\r\n\r\nconst getStyles = (_, { palette = {} }) => ({\r\n RequestBrandPanel: {\r\n '& .brand-description': {\r\n '& .ms-MessageBar': {\r\n background: '#EFF6FC',\r\n marginBottom: 16,\r\n },\r\n },\r\n '& .brand-name-length': {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n margin: '2px 0',\r\n },\r\n '& .ms-Panel-header': {\r\n padding: 0,\r\n },\r\n '& .error-message': {\r\n color: palette.redDark,\r\n marginBottom: 16,\r\n },\r\n ...convertToLocalStyle(helpbuttonStyle({ palette })),\r\n },\r\n BackButton: {\r\n paddingLeft: 32,\r\n paddingRight: 18,\r\n },\r\n Form: {\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: '8px',\r\n margin: '16px 0',\r\n },\r\n FormItem: {\r\n },\r\n SaveButton: {\r\n marginRight: 8,\r\n },\r\n});\r\n\r\nconst BRAND_NAME_MAX_LENGTH = 128;\r\n\r\nexport const RequestBrandPanel = ({\r\n isOpen, onDismiss, cid, aid,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n const {\r\n selectedOptions,\r\n setSelectedOptions,\r\n searchFilter,\r\n } = useBrandsData();\r\n\r\n const [brandName, setBrandName] = useState(searchFilter || '');\r\n const [brandLink, setBrandLink] = useState('');\r\n const [brandReason, setBrandReason] = useState('');\r\n const [errorMsg, setErrorMsg] = useState(null);\r\n\r\n const onRenderHeader = useCallback((props, defaultRender) => (\r\n <>\r\n \r\n ({text}),\r\n }}\r\n template={i18n.getString(_TL_('Once you create a brand list, you can edit it in your {{link}}Brand List{{/link}} shared library.'))}\r\n />\r\n
\r\n )}\r\n \r\n \r\n
\r\n \r\n )}\r\n \r\n {i18n.getString(_TL_('{{count}} characters remaining'), {\r\n count: LIST_NAME_MAX_LENGTH - listName.length,\r\n })}\r\n
\r\n\r\n \r\n
\r\n \r\n \r\n {i18n.getString(_TL_('Submit'))}\r\n \r\n \r\n {i18n.getString(_TL_('Cancel'))}\r\n \r\n
\r\n ), [brandLink, brandName, classes.CancelButton, classes.SaveButton, i18n, onDismiss, onSave]);\r\n\r\n return (\r\n \r\n
\r\n \r\n );\r\n};\r\n\r\nRequestBrandPanel.propTypes = {\r\n isOpen: PropTypes.bool.isRequired,\r\n onDismiss: PropTypes.func.isRequired,\r\n cid: PropTypes.number.isRequired,\r\n aid: PropTypes.number.isRequired,\r\n};\r\n","import React, { useContext, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { Dialog, DialogType, DialogFooter, PrimaryButton, DefaultButton, Checkbox } from '@fluentui/react';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\n\r\nconst modalProps = {\r\n isBlocking: true,\r\n className: 'save-brand-list-dialog',\r\n};\r\n\r\nconst dialogFooterStyles = {\r\n actionsRight: {\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '& .do-not-ask-again-checkbox': {\r\n padding: '5px 0',\r\n },\r\n '& .confirm-button': {\r\n marginRight: 4,\r\n },\r\n },\r\n};\r\n\r\nexport const SaveDialog = (props) => {\r\n const { open, onConfirm, onDismiss } = props;\r\n const i18n = useContext(I18nContext);\r\n const [isDoNotAskAgain, setIsDoNotAskAgain] = useState(false);\r\n\r\n const dialogContentProps = {\r\n type: DialogType.normal,\r\n title: i18n.getString(_TL_('Save brand list')),\r\n closeButtonAriaLabel: i18n.getString(_TL_('Close')),\r\n subText: i18n.getString(_TL_('Once your brand list is saved, it’ll be automatically added to your shared library where you can edit it. Are you sure you want to save your brand list?')),\r\n };\r\n\r\n return (\r\n \r\n \r\n {i18n.getString(_TL_('It takes up to a week to review a brand request. If approved, it’ll be added to your shared library. Please note that you can only apply brand protection or brand exclusion to a brand once it’s approved.'))}\r\n \r\n
\r\n \r\n \r\n {\r\n setBrandName(value && value.length > BRAND_NAME_MAX_LENGTH ? value.slice(0, BRAND_NAME_MAX_LENGTH) : value);\r\n }}\r\n />\r\n
\r\n \r\n {i18n.getString(_TL_('{{count}} characters remaining'), {\r\n count: BRAND_NAME_MAX_LENGTH - brandName.length,\r\n })}\r\n
\r\n\r\n \r\n setBrandLink(value)}\r\n />\r\n
\r\n \r\n \r\n setBrandReason(value)}\r\n multiline\r\n rows={6}\r\n resizable={false}\r\n />\r\n
\r\n {errorMsg && {errorMsg}
}\r\n \r\n onConfirm({ isDoNotAskAgain })} text={i18n.getString(_TL_('Yes, save'))} />\r\n
\r\n \r\n \r\n {i18n.getString(_TL_('Save'))}\r\n \r\n \r\n {i18n.getString(_TL_('Cancel'))}\r\n \r\n
\r\n );\r\n }, [addedBrandIds, brandListId, classes.Cancel, classes.SaveButton, deletedBrandIds, i18n, isConfirmDialogOn, isDoNotAskAgain, listName, onDismiss, onOpenCancelDialog, onOpenSaveDialog, onSave]);\r\n\r\n return isOpen && (\r\n {serverError}
}\r\n \r\n )}\r\n {isRequestBrandPanelOpen && (\r\n \r\n
\r\n )}\r\n {!_.isEmpty(options) && options.map(brand => (\r\n \r\n ))}\r\n \r\n }\r\n {optionsLoadError &&\r\n \r\n {i18n.getString(_TL_('No brand list found'))}\r\n
\r\n \r\n {i18n.getString(_TL_('We cannot load the brand lists at this time. Please try again later.'))}\r\n
\r\n }\r\n \r\n {convertToSubstring(text, BRAND_LIST_NAME_DISPLAY_LIMIT)}\r\n
\r\n \r\n ), [classes.BrandListItem, isDisabled]);\r\n\r\n return (\r\n \r\n
\r\n );\r\n};\r\n\r\nSelectedBrandListsTags.propTypes = {\r\n className: PropTypes.string,\r\n selectedOptions: PropTypes.arrayOf(PropTypes.shape({\r\n key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n name: PropTypes.string,\r\n brandCount: PropTypes.number,\r\n })).isRequired,\r\n setSelectedOptions: PropTypes.func.isRequired,\r\n isDisabled: PropTypes.bool,\r\n};\r\n\r\nSelectedBrandListsTags.defaultProps = {\r\n className: undefined,\r\n isDisabled: false,\r\n};\r\n","import React, { useCallback, useContext, useState, useMemo } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport _ from 'underscore';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { DefaultButton, DirectionalHint, TooltipHost } from '@fluentui/react';\r\nimport { siteMapPropType, withSiteMap, findSiteMap, getSiteMapItemRoute, processorSet } from '@bingads-webui-campaign-react/with-site-map';\r\nimport { Link } from 'react-router-dom';\r\nimport { UserContext } from '@bingads-webui-react/user-context';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { useMultiSelectContext } from '@bingads-webui-campaign-react/multi-selector';\r\nimport { InlineLoading } from '@bingads-webui-campaign-react/loading';\r\nimport { ReactTemplate } from '@bingads-webui-react/react-template';\r\nimport { ManageBrandListPanel } from '../manage-brand-list';\r\nimport { ExistingBrandListsPicker } from './existing-brand-lists-picker';\r\nimport { SelectedBrandListsTags } from './selected-brand-lists-tags';\r\nimport { MaxSelectionAlertForBrandLists, NoInitialDataAlertForBrandLists, SystemErrorAlertForBrandLists } from '../alerts';\r\nimport { ABOUT_BRAND_LISTS_LINK, BRAND_LIST_MAX_COUNT } from '../constants';\r\n\r\nconst getStyles = () => ({\r\n BrandListsPicker: {\r\n '& .ms-MessageBar': {\r\n width: '745px',\r\n marginBottom: '12px',\r\n },\r\n '& .inline-loading': {\r\n width: 'fit-content',\r\n },\r\n },\r\n BrandListsPickerOperations: {\r\n display: 'flex',\r\n gap: '8px',\r\n width: 'max-content',\r\n },\r\n Description: {\r\n marginBottom: 8,\r\n },\r\n});\r\n\r\nconst BrandListsPickerContentImpl = ({\r\n cid,\r\n aid,\r\n brandListId,\r\n className,\r\n disabled,\r\n isConfirmDialogOn,\r\n isBrandListLimitReached,\r\n descriptionTextTemplate,\r\n noInitialDataText,\r\n unscopedSiteMap,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n\r\n const [isCreatePanelOpen, setIsCreatePanelOpen] = useState(false);\r\n\r\n const {\r\n triggerLoadOptions,\r\n selectedOptions,\r\n setSelectedOptions,\r\n selectedOptionsLimit,\r\n isLoadingOptions,\r\n isLoadingSelectedOptions,\r\n isSelectedOptionsLimitReached,\r\n isFirstOptionsLoad,\r\n isNoOptionsAfterFirstLoad,\r\n optionsLoadError,\r\n selectedOptionsLoadError,\r\n } = useMultiSelectContext();\r\n\r\n const isAnyLoading = isLoadingOptions || isLoadingSelectedOptions;\r\n const hasLoadErrors = optionsLoadError || selectedOptionsLoadError;\r\n const showInitialLoading = (isFirstOptionsLoad && !hasLoadErrors) || isLoadingSelectedOptions;\r\n const hasInitialLoadErrors = isFirstOptionsLoad && hasLoadErrors;\r\n const canUserStartOperating = !showInitialLoading && !(hasInitialLoadErrors || selectedOptionsLoadError);\r\n\r\n const onSave = useCallback(({\r\n listId, listName,\r\n }) => {\r\n // refresh options\r\n triggerLoadOptions();\r\n // add the newly created brand list to selected options\r\n const newSelectedOptions = _.clone(selectedOptions);\r\n newSelectedOptions.push({\r\n key: Number(listId),\r\n Id: listId,\r\n Name: listName,\r\n });\r\n setSelectedOptions(newSelectedOptions);\r\n }, [selectedOptions, setSelectedOptions, triggerLoadOptions]);\r\n\r\n const userContext = useContext(UserContext);\r\n const { scope } = useContext(ScopeContext);\r\n const brandListsPageLink = useMemo(() => {\r\n const siteMapItemId = 'brand-lists';\r\n const siteMapItem = findSiteMap(unscopedSiteMap, item => item.id === siteMapItemId);\r\n return getSiteMapItemRoute({ item: siteMapItem, scope, userContext }).href;\r\n }, [unscopedSiteMap, userContext, scope]);\r\n return (\r\n \r\n {!_.isEmpty(selectedOptions) && selectedOptions.map((item, index) => (\r\n onRenderSelectedItemText({ item, text })}\r\n itemIndex={index}\r\n onDelete={isDisabled ? undefined : onRemoveItem}\r\n />\r\n ))}\r\n
\r\n \r\n {descriptionTextTemplate &&\r\n setIsCreatePanelOpen(false)}\r\n onSaveCallback={onSave}\r\n isConfirmDialogOn={isConfirmDialogOn}\r\n />\r\n
\r\n );\r\n};\r\n\r\nBrandListsPickerContentImpl.propTypes = {\r\n unscopedSiteMap: siteMapPropType.isRequired,\r\n cid: PropTypes.number.isRequired,\r\n aid: PropTypes.number.isRequired,\r\n brandListId: PropTypes.number,\r\n className: PropTypes.string,\r\n disabled: PropTypes.bool,\r\n isConfirmDialogOn: PropTypes.bool,\r\n isBrandListLimitReached: PropTypes.bool.isRequired,\r\n descriptionTextTemplate: PropTypes.string,\r\n noInitialDataText: PropTypes.string,\r\n};\r\n\r\nBrandListsPickerContentImpl.defaultProps = {\r\n brandListId: undefined,\r\n className: undefined,\r\n disabled: false,\r\n isConfirmDialogOn: false,\r\n descriptionTextTemplate: '',\r\n noInitialDataText: undefined,\r\n};\r\n\r\nconst scopeUnawareWithSiteMap = _.partial(withSiteMap, _, processorSet.basic, _, _, 'unscopedSiteMap');\r\nexport const BrandListsPickerContent = scopeUnawareWithSiteMap(BrandListsPickerContentImpl);\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport {\r\n MultiSelectorContextProvider,\r\n} from '@bingads-webui-campaign-react/multi-selector';\r\n\r\nexport const BrandListsContextProvider = ({\r\n children, selectedOptionsLimit, optionsDisplayLimit, useOptions, useSelectedOptions, onChange, onSelectedOptionsUpdate, savedAddedSelectedOptionsKeys, savedDeletedSelectedOptionsKeys,\r\n}) => (\r\n \r\n ({text}),\r\n aboutLink: text => ({text}),\r\n count: BRAND_LIST_MAX_COUNT,\r\n }}\r\n template={descriptionTextTemplate}\r\n />\r\n
\r\n }\r\n {isAnyLoading && \r\n \r\n setIsCreatePanelOpen(true)}\r\n disabled={disabled || isAnyLoading || isSelectedOptionsLimitReached}\r\n />\r\n )}\r\n
\r\n )}\r\n \r\n \r\n {submiting ? \r\n \r\n {i18n.getString(_TL_('Cancel'))}\r\n \r\n
\r\n ), [applyAssociation, classes.PanelFooter, i18n, onDismiss, submiting]);\r\n\r\n\r\n const customRenderItems = (items, toggleSelection) => {\r\n if (!items || items.length === 0) {\r\n return null;\r\n }\r\n const typeMap = {\r\n protection: i18n.getString(_TL_('Search')),\r\n exclusion: i18n.getString(_TL_('Performance Max')),\r\n };\r\n return (\r\n | \r\n {i18n.getString(_TL_('Campaign name'))}\r\n | \r\n {i18n.getString(_TL_('Campaign type'))} | \r\n\r\n |
|---|---|---|
| {item.name} | \r\n{typeMap[type]} | \r\n\r\n | \r\n
\r\n
\r\n );\r\n };\r\n\r\n return (\r\n \r\n Campaigns: {totalCampaigns}\r\n
\r\n Select all\r\n \r\n \r\n {\r\n setTotalCampaigns(res['@odata.count']);\r\n getOriginalAssociation();\r\n }}\r\n />\r\n
\r\n \r\n );\r\n};\r\n\r\nApplyBrandListPanel.propTypes = {\r\n className: PropTypes.string,\r\n isOpen: PropTypes.bool.isRequired,\r\n brandLists: PropTypes.arrayOf(PropTypes.shape({\r\n Id: PropTypes.number.isRequired,\r\n })).isRequired,\r\n type: PropTypes.string.isRequired,\r\n onSave: PropTypes.func.isRequired,\r\n onDismiss: PropTypes.func.isRequired,\r\n};\r\n\r\nApplyBrandListPanel.defaultProps = {\r\n className: undefined,\r\n};\r\n","import React, { useContext, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport classNames from 'classnames';\r\nimport { useDefaultStyles } from '@bingads-webui-react/with-default-styles';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { ChoiceGroup } from '@fluentui/react';\r\nimport { BrandListsPicker } from '../brand-lists-picker';\r\n\r\nconst OPTION_KEYS = {\r\n OFF: 'off',\r\n ON: 'on',\r\n};\r\n\r\nconst OPTIONS = [\r\n {\r\n key: OPTION_KEYS.OFF,\r\n text: _TL_('Off: Use exact and phrase keyword matching'),\r\n },\r\n {\r\n key: OPTION_KEYS.ON,\r\n text: 'On: Use broad keyword matching',\r\n },\r\n];\r\n\r\nconst getStyles = () => ({\r\n BroadOnlySetting: {\r\n },\r\n BroadOnlyChoiceGroup: {\r\n '& label': {\r\n padding: 0,\r\n fontWeight: 'normal',\r\n '&::before': {\r\n marginTop: 3,\r\n },\r\n '&::after': {\r\n marginTop: 3,\r\n },\r\n },\r\n },\r\n BrandListsPickerOption: {\r\n marginLeft: 26,\r\n '& .brand-lists-picker-description': {\r\n margin: '12px 0',\r\n fontSize: 14,\r\n },\r\n },\r\n});\r\n\r\nexport const BroadOnlySetting = ({\r\n className,\r\n isBroadMatchOnly,\r\n setIsBroadMatchOnly,\r\n cid,\r\n aid,\r\n campaignId,\r\n onBrandListsChange,\r\n onSelectedBrandListsUpdate,\r\n}) => {\r\n const i18n = useContext(I18nContext);\r\n const classes = useDefaultStyles(getStyles);\r\n const [isOn, setIsOn] = useState(isBroadMatchOnly);\r\n\r\n const options = OPTIONS.map(option => ({\r\n key: option.key,\r\n text: i18n.getString(option.text),\r\n ariaLabel: i18n.getString(option.text),\r\n }));\r\n\r\n const handleChange = (ev, option) => {\r\n setIsBroadMatchOnly(option.key === OPTION_KEYS.ON);\r\n setIsOn(option.key === OPTION_KEYS.ON);\r\n };\r\n\r\n return (\r\n \r\n {type === 'protection' ? i18n.getString(_TL_('You can only select Broad only campaigns to apply brand protection. Brands that are under review cannot have brand protection applied. ')) : i18n.getString(_TL_('Brand exclusions are only available for Performance Max campaigns. Please note that brands pending editorial review cannot have brand exclusion applied. '))}\r\n {i18n.getString(_TL_('Learn more'))}\r\n
\r\n\r\n {i18n.getString(_TL_('{{count}} campaigns'), { count: selectedItems.length })}\r\n {selectedItems && selectedItems.length > 0 && dlbRef.current.setSelectedItems([])}>Remove all}\r\n
\r\n\r\n {!_.isEmpty(selectedItems) && selectedItems.map((item, index) => (\r\n removeSelect(item)}\r\n />\r\n ))}\r\n
\r\n : {error}
}\r\n \r\n
\r\n );\r\n};\r\n\r\nBroadOnlySetting.propTypes = {\r\n className: PropTypes.string,\r\n isBroadMatchOnly: PropTypes.bool.isRequired,\r\n setIsBroadMatchOnly: PropTypes.func.isRequired,\r\n cid: PropTypes.number.isRequired,\r\n aid: PropTypes.number.isRequired,\r\n campaignId: PropTypes.number,\r\n onBrandListsChange: PropTypes.func,\r\n onSelectedBrandListsUpdate: PropTypes.func,\r\n};\r\n\r\nBroadOnlySetting.defaultProps = {\r\n className: '',\r\n campaignId: null,\r\n onBrandListsChange: () => {},\r\n onSelectedBrandListsUpdate: () => {},\r\n};\r\n","import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { ThemeProvider } from 'react-jss';\r\nimport { I18nContext } from '@bingads-webui-react/i18n-context';\r\nimport { PreferenceContext } from '@bingads-webui-react/preference-context';\r\nimport { Router } from '@bingads-webui-campaign-react/router';\r\nimport { ScopeContext } from '@bingads-webui-react/scope-service';\r\nimport { UserContext } from '@bingads-webui-react/user-context';\r\nimport { PermissionsContext } from '@bingads-webui-react/hoc-with-permissions';\r\nimport { BroadOnlySetting } from './index';\r\n\r\n// wrap the required context here for legacy scenarios\r\nexport const WrappedBroadOnlySetting = ({\r\n theme,\r\n i18n,\r\n preferenceService,\r\n scope,\r\n serverContext,\r\n permissions,\r\n ...props\r\n}) => {\r\n if (!theme || !i18n || !preferenceService) {\r\n return null;\r\n }\r\n const userContext = {\r\n CurrentUser: serverContext.CurrentUser,\r\n CurrentCustomer: serverContext.CurrentCustomer,\r\n CurrentAccount: serverContext.CurrentAccount,\r\n };\r\n return (\r\n \r\n
\r\n )\r\n }\r\n