feat(workflows): open the email domain wizard from channels, configure and broadcasts

frontend/src/lib/api.ts

@@ -38,7 +38,6 @@ import {
     DashboardFilter,
     DatabaseSerializedFieldType,
     DataWarehouseManagedViewsetKind,
-    DomainConnectProviderName,
     EndpointLastExecutionTimesRequest,
     EndpointRequest,
     EndpointRunRequest,
@@ -219,6 +218,7 @@ import type { SymbolSetOrder } from 'products/error_tracking/frontend/scenes/Err
 import type { ErrorTrackingRecommendation } from 'products/error_tracking/frontend/scenes/ErrorTrackingScene/tabs/recommendations/types'
 import type { CopyFlagsResponseApi } from 'products/feature_flags/frontend/generated/api.schemas'
 import type {
+    EmailDomainConnectCheckApi,
     GitHubBranchesResponseApi,
     GitHubReposResponseApi,
 } from 'products/integrations/frontend/generated/api.schemas'
@@ -6080,14 +6080,7 @@ const api = {
         ): Promise<IntegrationType> {
             return await new ApiRequest().integrationEmail(integrationId).update({ data })
         },
-        async domainConnectCheck(domain: string): Promise<{
-            supported: boolean
-            provider_name: DomainConnectProviderName | null
-            available_providers: {
-                endpoint: string
-                name: DomainConnectProviderName
-            }[]
-        }> {
+        async domainConnectCheck(domain: string): Promise<EmailDomainConnectCheckApi> {
             return await new ApiRequest()
                 .integrationsDomainConnectCheck()
                 .withQueryString(`domain=${encodeURIComponent(domain)}`)

frontend/src/lib/components/DomainConnect/domainConnectLogic.ts

@@ -7,16 +7,14 @@ import { lemonToast } from 'lib/lemon-ui/LemonToast'
 
 import { DomainConnectProviderName } from '~/queries/schema/schema-general'
 
+import type { EmailDomainConnectCheckApi } from 'products/integrations/frontend/generated/api.schemas'
+
 export interface DomainConnectProvider {
     endpoint: string
     name: DomainConnectProviderName
 }
 
-export interface DomainConnectInfo {
-    supported: boolean
-    provider_name: DomainConnectProviderName | null
-    available_providers: DomainConnectProvider[]
-}
+export type DomainConnectInfo = EmailDomainConnectCheckApi
 
 export interface DomainConnectLogicProps {
     /** Unique key to prevent state sharing between instances (not `key` because React strips it) */
@@ -115,13 +113,13 @@ export const domainConnectLogic = kea<domainConnectLogicType>([
         providerName: [
             (s) => [s.domainConnectInfo],
             (info: DomainConnectInfo | null): DomainConnectProviderName | null => {
-                return info?.provider_name ?? null
+                return (info?.provider_name as DomainConnectProviderName | null) ?? null
             },
         ],
         availableProviders: [
             (s) => [s.domainConnectInfo],
             (info: DomainConnectInfo | null): DomainConnectProvider[] => {
-                return info?.available_providers ?? []
+                return (info?.available_providers as DomainConnectProvider[] | undefined) ?? []
             },
         ],
         hasAnyOption: [

frontend/src/lib/constants.tsx

@@ -620,6 +620,8 @@ export const FEATURE_FLAGS = {
     WORKFLOW_RUN_SCOUT_ACTION: 'workflow-run-scout-action', // owner: #team-workflows
     WORKFLOWS_AI_FIRST_NEW: 'workflows-ai-first-new', // owner: @mayteio #team-workflows
     WORKFLOWS_DELAY_UNTIL_DATE: 'workflows-delay-until-date', // owner: @dmarchuk #team-workflows
+    WORKFLOWS_EMAIL_DOMAIN_AGENT_SETUP: 'workflows-email-domain-agent-setup', // owner: @silthus #team-workflows
+    WORKFLOWS_EMAIL_DOMAIN_WIZARD: 'workflows-email-domain-wizard', // owner: @silthus #team-workflows
     WORKFLOWS_EMAIL_REPUTATION: 'workflows-email-reputation', // owner: #team-workflows
     WORKFLOWS_EMAIL_SENDER_ROTATION: 'workflows-email-sender-rotation', // owner: @arthurdedeus #team-workflows
     WORKFLOWS_INTERNAL_EVENT_FILTERS: 'workflows-internal-event-filters', // owner: @haven #team-workflows

frontend/src/lib/integrations/IntegrationEmailDomainView.tsx

@@ -1,9 +1,15 @@
-import { useActions } from 'kea'
+import { useActions, useValues } from 'kea'
+import { router } from 'kea-router'
+import posthog from 'posthog-js'
 import { useState } from 'react'
 
 import { IconCollapse, IconExpand, IconGear, IconLetter, IconTrash } from '@posthog/icons'
 import { LemonButton, LemonTag, Tooltip } from '@posthog/lemon-ui'
 
+import { FEATURE_FLAGS } from 'lib/constants'
+import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
+import { urls } from 'scenes/urls'
+
 import { EmailIntegrationDomainGroupedType, IntegrationType } from '~/types'
 
 import { ChannelType } from 'products/workflows/frontend/Channels/MessageChannels'
@@ -29,7 +35,17 @@ export function IntegrationEmailDomainView({
     integration: EmailIntegrationDomainGroupedType
 }): JSX.Element {
     const { openSetupModal, deleteIntegration } = useActions(integrationsLogic)
+    const { featureFlags } = useValues(featureFlagLogic)
     const { domain, integrations } = integration
+    const configure = (sender: IntegrationType): void => {
+        if (featureFlags[FEATURE_FLAGS.WORKFLOWS_EMAIL_DOMAIN_WIZARD]) {
+            // pinned: analytics event name
+            posthog.capture('email domain setup started', { entry: 'configure' })
+            router.actions.push(urls.workflowsEmailDomain(sender.id))
+            return
+        }
+        openSetupModal(sender, sender.kind as ChannelType)
+    }
     const verified = integrations.every(isVerified)
     const verificationRequired = integrations.some(isVerificationRequired)
     const [isExpanded, setIsExpanded] = useState(false)
@@ -81,9 +97,7 @@ export function IntegrationEmailDomainView({
                             <LemonButton
                                 type="primary"
                                 size="small"
-                                onClick={() => {
-                                    openSetupModal(integration, integration.kind as ChannelType)
-                                }}
+                                onClick={() => configure(integration)}
                                 icon={<IconGear />}
                             >
                                 Configure

frontend/src/productScenes.tsx

@@ -207,4 +207,5 @@ export const productScenes: Record<string, () => Promise<any>> = {
     WorkflowsLibraryTemplate: () => import('../../products/workflows/frontend/TemplateLibrary/MessageTemplate'),
     Broadcasts: () => import('../../products/workflows/frontend/Broadcasts/BroadcastsScene'),
     Broadcast: () => import('../../products/workflows/frontend/Broadcasts/BroadcastScene'),
+    WorkflowsEmailDomain: () => import('../../products/workflows/frontend/Channels/EmailDomain/EmailDomainScene'),
 }

frontend/src/scenes/sceneTypes.ts

@@ -219,6 +219,7 @@ export enum Scene {
     Broadcasts = 'Broadcasts',
     Workflows = 'Workflows',
     Broadcast = 'Broadcast',
+    WorkflowsEmailDomain = 'WorkflowsEmailDomain',
     Wizard = 'Wizard',
     EarlyAccessFeature = 'EarlyAccessFeature',
     EndpointsScene = 'EndpointsScene',
@@ -452,6 +453,7 @@ export const sceneToAccessControlResourceType: Partial<
     [Scene.Broadcasts]: AccessControlResourceType.Workflow,
     [Scene.Workflows]: AccessControlResourceType.Workflow,
     [Scene.Broadcast]: AccessControlResourceType.Workflow,
+    [Scene.WorkflowsEmailDomain]: AccessControlResourceType.Workflow,
 
     // Product Tours
     [Scene.ProductTour]: AccessControlResourceType.ProductTour,