feat(cdp): add linkedin integration

frontend/src/lib/api.ts

@@ -769,6 +769,21 @@
         return this.integrations(teamId).addPathComponent(id).addPathComponent('channels')
     }
 
+    public integrationLinkedInAdsAccounts(id: IntegrationType['id'], teamId?: TeamType['id']): ApiRequest {
+        return this.integrations(teamId).addPathComponent(id).addPathComponent('linkedin_ads_accessible_accounts')
+    }
+
+    public integrationLinkedInAdsConversionRules(
+        id: IntegrationType['id'],
+        accountId: string,
+        teamId?: TeamType['id']
+    ): ApiRequest {
+        return this.integrations(teamId)
+            .addPathComponent(id)
+            .addPathComponent('linkedin_ads_conversion_rules')
+            .withQueryString({ accountId })
+    }
+
     public media(teamId?: TeamType['id']): ApiRequest {
         return this.projectsDetail(teamId).addPathComponent('uploaded_media')
     }
@@ -2392,6 +2407,15 @@
         async slackChannels(id: IntegrationType['id']): Promise<{ channels: SlackChannelType[] }> {
             return await new ApiRequest().integrationSlackChannels(id).get()
         },
+        async linkedInAdsAccounts(id: IntegrationType['id']): Promise<{ accessibleAccounts: { id: string }[] }> {
+            return await new ApiRequest().integrationLinkedInAdsAccounts(id).get()
+        },
+        async linkedInAdsConversionRules(
+            id: IntegrationType['id'],
+            accountId: string
+        ): Promise<{ conversionRules: LinkedInAdsConversionRuleType[] }> {
+            return await new ApiRequest().integrationLinkedInAdsConversionRules(id, accountId).get()
+        },
     },
 
     resourcePermissions: {

frontend/src/lib/integrations/LinkedInIntegrationHelpers.tsx

@@ -0,0 +1,139 @@
+import { LemonInputSelect, LemonInputSelectOption } from '@posthog/lemon-ui'
+import { useActions, useValues } from 'kea'
+import { useMemo } from 'react'
+
+import { IntegrationType, LinkedInAdsConversionRuleType } from '~/types'
+
+import { linkedInAdsIntegrationLogic } from './linkedInAdsIntegrationLogic'
+
+const getLinkedInAdsAccountOptions = (
+    linkedInAdsAccounts?: { id: string }[] | null
+): LemonInputSelectOption[] | null => {
+    return linkedInAdsAccounts
+        ? linkedInAdsAccounts.map((customerId) => ({
+              key: customerId.id.split('/')[1],
+              labelComponent: (
+                  <span className="flex items-center">
+                      {customerId.id.split('/')[1].replace(/(\d{3})(\d{3})(\d{4})/, '$1-$2-$3')}
+                  </span>
+              ),
+              label: `${customerId.id.split('/')[1].replace(/(\d{3})(\d{3})(\d{4})/, '$1-$2-$3')}`,
+          }))
+        : null
+}
+
+const getLinkedInAdsConversionRuleOptions = (
+    linkedInAdsConversionRules?: LinkedInAdsConversionRuleType[] | null
+): LemonInputSelectOption[] | null => {
+    return linkedInAdsConversionRules
+        ? linkedInAdsConversionRules.map(({ id, name }) => ({
+              key: id,
+              labelComponent: <span className="flex items-center">{name}</span>,
+              label: name,
+          }))
+        : null
+}
+
+export type LinkedInAdsPickerProps = {
+    integration: IntegrationType
+    value?: string
+    onChange?: (value: string | null) => void
+    disabled?: boolean
+    requiresFieldValue?: string
+}
+
+export function LinkedInAdsConversionRulePicker({
+    onChange,
+    value,
+    requiresFieldValue,
+    integration,
+    disabled,
+}: LinkedInAdsPickerProps): JSX.Element {
+    const { linkedInAdsConversionRules, linkedInAdsConversionRulesLoading } = useValues(
+        linkedInAdsIntegrationLogic({ id: integration.id })
+    )
+    const { loadLinkedInAdsConversionRules } = useActions(linkedInAdsIntegrationLogic({ id: integration.id }))
+
+    const linkedInAdsConversionRuleOptions = useMemo(
+        () => getLinkedInAdsConversionRuleOptions(linkedInAdsConversionRules),
+        [linkedInAdsConversionRules]
+    )
+
+    return (
+        <>
+            <LemonInputSelect
+                onChange={(val) => onChange?.(val[0] ?? null)}
+                value={value ? [value] : []}
+                onFocus={() =>
+                    !linkedInAdsConversionRules &&
+                    !linkedInAdsConversionRulesLoading &&
+                    requiresFieldValue &&
+                    loadLinkedInAdsConversionRules(requiresFieldValue)
+                }
+                disabled={disabled}
+                mode="single"
+                data-attr="select-linkedin-ads-conversion-action"
+                placeholder="Select a Conversion Action..."
+                options={
+                    linkedInAdsConversionRuleOptions ??
+                    (value
+                        ? [
+                              {
+                                  key: value,
+                                  label: value,
+                              },
+                          ]
+                        : [])
+                }
+                loading={linkedInAdsConversionRulesLoading}
+            />
+        </>
+    )
+}
+
+export function LinkedInAdsAccountIdPicker({
+    onChange,
+    value,
+    integration,
+    disabled,
+}: LinkedInAdsPickerProps): JSX.Element {
+    const { linkedInAdsAccessibleAccounts, linkedInAdsAccessibleAccountsLoading } = useValues(
+        linkedInAdsIntegrationLogic({ id: integration.id })
+    )
+    const { loadLinkedInAdsAccessibleAccounts } = useActions(linkedInAdsIntegrationLogic({ id: integration.id }))
+
+    const linkedInAdsAccountOptions = useMemo(
+        () => getLinkedInAdsAccountOptions(linkedInAdsAccessibleAccounts),
+        [linkedInAdsAccessibleAccounts]
+    )
+
+    return (
+        <>
+            <LemonInputSelect
+                onChange={(val) => onChange?.(val[0] ?? null)}
+                value={value ? [value] : []}
+                onFocus={() =>
+                    !linkedInAdsAccessibleAccounts &&
+                    !linkedInAdsAccessibleAccountsLoading &&
+                    loadLinkedInAdsAccessibleAccounts()
+                }
+                disabled={disabled}
+                mode="single"
+                data-attr="select-linkedin-ads-customer-id-channel"
+                placeholder="Select a Customer ID..."
+                options={
+                    linkedInAdsAccountOptions ??
+                    (value
+                        ? [
+                              {
+                                  key: value,
+                                  label: value.replace(/(\d{3})(\d{3})(\d{4})/, '$1-$2-$3'),
+                              },
+                          ]
+                        : [])
+                }
+                loading={linkedInAdsAccessibleAccountsLoading}
+            />
+        </>
+    )
+}

frontend/src/lib/integrations/integrationsLogic.ts

@@ -8,6 +8,7 @@ import IconGoogleAds from 'public/services/google-ads.png'
 import IconGoogleCloud from 'public/services/google-cloud.png'
 import IconGoogleCloudStorage from 'public/services/google-cloud-storage.png'
 import IconHubspot from 'public/services/hubspot.png'
+import IconLinkedIn from 'public/services/linkedin.png'
 import IconSalesforce from 'public/services/salesforce.png'
 import IconSlack from 'public/services/slack.png'
 import { preflightLogic } from 'scenes/PreflightCheck/preflightLogic'
@@ -24,6 +25,7 @@ const ICONS: Record<IntegrationKind, any> = {
     'google-pubsub': IconGoogleCloud,
     'google-cloud-storage': IconGoogleCloudStorage,
     'google-ads': IconGoogleAds,
+    'linkedin-ads': IconLinkedIn,
 }
 
 export const integrationsLogic = kea<integrationsLogicType>([

frontend/src/lib/integrations/linkedInAdsIntegrationLogic.ts

@@ -0,0 +1,38 @@
+import { actions, kea, key, path, props } from 'kea'
+import { loaders } from 'kea-loaders'
+import api from 'lib/api'
+
+import { LinkedInAdsConversionActionType } from '~/types'
+
+import type { linkedInAdsIntegrationLogicType } from './linkedInAdsIntegrationLogicType'
+
+export const linkedInAdsIntegrationLogic = kea<linkedInAdsIntegrationLogicType>([
+    props({} as { id: number }),
+    key((props) => props.id),
+    path((key) => ['lib', 'integrations', 'linkedInAdsIntegrationLogic', key]),
+    actions({
+        loadLinkedInAdsConversionActions: (customerId: string) => customerId,
+        loadLinkedInAdsAccessibleAccounts: true,
+    }),
+
+    loaders(({ props }) => ({
+        linkedInAdsConversionActions: [
+            null as LinkedInAdsConversionActionType[] | null,
+            {
+                loadLinkedInAdsConversionActions: async (customerId: string) => {
+                    const res = await api.integrations.linkedInAdsConversionActions(props.id, customerId)
+                    return res.conversionActions
+                },
+            },
+        ],
+        linkedInAdsAccessibleAccounts: [
+            null as { id: string }[] | null,
+            {
+                loadLinkedInAdsAccessibleAccounts: async () => {
+                    const res = await api.integrations.linkedInAdsAccounts(props.id)
+                    return res.accessibleAccounts
+                },
+            },
+        ],
+    })),
+])

frontend/src/scenes/pipeline/hogfunctions/integrations/HogFunctionInputIntegrationField.tsx

@@ -1,6 +1,10 @@
 import { LemonSkeleton } from '@posthog/lemon-ui'
 import { useValues } from 'kea'
 import { integrationsLogic } from 'lib/integrations/integrationsLogic'
+import {
+    LinkedInAdsAccountIdPicker,
+    LinkedInAdsConversionRulePicker,
+} from 'lib/integrations/LinkedInIntegrationHelpers'
 import { SlackChannelPicker } from 'lib/integrations/SlackIntegrationHelpers'
 
 import { HogFunctionInputSchemaType } from '~/types'
@@ -54,6 +58,25 @@
             />
         )
     }
+    if (schema.integration_field === 'linkedin_ads_conversion_rule_id' && requiresFieldValue) {
+        return (
+            <LinkedInAdsConversionRulePicker
+                value={value}
+                requiresFieldValue={requiresFieldValue}
+                onChange={(x) => onChange?.(x?.split('|')[0])}
+                integration={integration}
+            />
+        )
+    }
+    if (schema.integration_field === 'linkedin_ads_account_id') {
+        return (
+            <LinkedInAdsAccountIdPicker
+                value={value}
+                onChange={(x) => onChange?.(x?.split('|')[0])}
+                integration={integration}
+            />
+        )
+    }
     return (
         <div className="text-danger">
             <p>Unsupported integration type: {schema.integration}</p>

frontend/src/types.ts

@@ -3732,6 +3732,7 @@ export type IntegrationKind =
     | 'google-pubsub'
     | 'google-cloud-storage'
     | 'google-ads'
+    | 'linkedin-ads'
 
 export interface IntegrationType {
     id: number

posthog/api/integration.py

@@ -12,7 +12,13 @@
 
 from posthog.api.routing import TeamAndOrgViewSetMixin
 from posthog.api.shared import UserBasicSerializer
-from posthog.models.integration import Integration, OauthIntegration, SlackIntegration, GoogleCloudIntegration
+from posthog.models.integration import (
+    Integration,
+    OauthIntegration,
+    SlackIntegration,
+    GoogleCloudIntegration,
+    LinkedInAdsIntegration,
+)
 
 
 class IntegrationSerializer(serializers.ModelSerializer):
@@ -94,3 +100,34 @@ def channels(self, request: Request, *args: Any, **kwargs: Any) -> Response:
         ]
 
         return Response({"channels": channels})
+
+    @action(methods=["GET"], detail=True, url_path="linkedin_ads_conversion_rules")
+    def conversion_rules(self, request: Request, *args: Any, **kwargs: Any) -> Response:
+        instance = self.get_object()
+        linkedin_ads = LinkedInAdsIntegration(instance)
+        account_id = request.query_params.get("accountId")
+
+        conversion_actions = [
+            {
+                "id": conversionAction["conversionAction"]["id"],
+                "name": conversionAction["conversionAction"]["name"],
+                "resourceName": conversionAction["conversionAction"]["resourceName"],
+            }
+            for conversionAction in linkedin_ads.list_linkedin_ads_conversion_rules(account_id)[0]["results"]
+        ]
+
+        return Response({"conversionActions": conversion_actions})
+
+    @action(methods=["GET"], detail=True, url_path="linkedin_ads_accessible_accounts")
+    def accessible_accounts(self, request: Request, *args: Any, **kwargs: Any) -> Response:
+        instance = self.get_object()
+        linkedin_ads = LinkedInAdsIntegration(instance)
+
+        accessible_accounts = [
+            {
+                "id": accountId,
+            }
+            for accountId in linkedin_ads.list_linkedin_ads_accessible_accounts()["resourceNames"]
+        ]
+
+        return Response({"accessibleAccounts": accessible_accounts})

posthog/cdp/templates/__init__.py

@@ -32,6 +32,7 @@
 from .attio.template_attio import template as attio
 from .mailchimp.template_mailchimp import template as mailchimp
 from .microsoft_teams.template_microsoft_teams import template as microsoft_teams
+from .linkedin_ads.template_linkedin_ads import template as linkedin_ads
 from .klaviyo.template_klaviyo import template_user as klaviyo_user, template_event as klaviyo_event
 from .google_cloud_storage.template_google_cloud_storage import (
     template as google_cloud_storage,
@@ -67,6 +68,7 @@
     klaviyo_event,
     klaviyo_user,
     knock,
+    linkedin_ads,
     loops,
     mailchimp,
     mailgun,