Skip to content

CRM Integration

Pitcher CatalogIQ can integrate with different CRM systems. This guide explains how to integrate with Salesforce and Microsoft Dynamics.

Salesforce Integration

When the instance is configured to have CRM integration enabled and the user is logged in with Salesforce, your app will have access to the Salesforce API token.

Using this token, you can make requests to the Salesforce API to get data from Salesforce. We recommend using the official jsforce library to make requests to the Salesforce API.

On rare occasions it may happen your requests will fail because the token has expired. In this case, you can use the refreshServiceToken method to get the refreshed token.

Using jsforce directly

typescript
import { usePitcherApi } from '@pitcher/canvas-ui'
import jsforce from 'jsforce'

const setupSalesforceConnection = async () => {
  const env = await usePitcherApi().getEnv()
  
  // Find Salesforce service
  const salesforceService = env.pitcher.user.connected_services.find(
    service => service.type === 'crm' && service.provider === 'salesforce'
  )
  
  if (!salesforceService) {
    return null
  }
  
  // Create jsforce connection
  const connection = new jsforce.Connection({
    instanceUrl: salesforceService.urls.custom_domain,
    accessToken: salesforceService.access_token
  })
  
  return connection
}

// Query data with jsforce
const queryAccounts = async () => {
  const connection = await setupSalesforceConnection()
  if (!connection) return []
  
  const result = await connection.query('SELECT Id, Name FROM Account LIMIT 10')
  return result.records
}

Store-Based Approach

The recommended pattern is to create a Salesforce authentication store that manages the CRM connection:

typescript
// Example of a minimal sf-auth store
export const useSFAuth = defineStore('sfAuth', () => {
  const { env } = storeToRefs(useAppStore())
  const connection = ref(null)
  
  const init = async () => {
    // Find CRM service in connected_services
    const crmService = env.value?.pitcher.user.connected_services
      .find(service => service.type === 'crm')
    
    if (crmService) {
      // Create connection clients for query, sobject, etc.
      connection.value = {
        query: createSfdcQueryClient(crmService.access_token, crmService.urls.query),
        sobject: createSfdcEntityClient(crmService.access_token, crmService.urls.sobjects)
      }
    }
  }
  
  return { connection, init }
})

Using the Connection

With the store initialized, you can use it to query Salesforce data:

typescript
// In your component
const { connection } = storeToRefs(useSFAuth())

// Execute a SOQL query
const fetchAccounts = async () => {
  const result = await connection.value?.query('SELECT Id, Name FROM Account LIMIT 10')
  return result?.records || []
}

// Create a record
const createContact = async (data) => {
  return await connection.value?.sobject('Contact', { data })
}

Using the crmQuery API

For simple queries, you can use the built-in crmQuery method:

typescript
import { usePitcherApi } from '@pitcher/canvas-ui'

// Execute a CRM query
const accounts = await usePitcherApi().crmQuery({
  query: 'SELECT Id, Name FROM Account LIMIT 10',
  service: 'salesforce' // Optional, defaults to primary CRM service
})

Microsoft Dynamics Integration

When the instance is configured to have CRM integration enabled and user is logged in with Microsoft Dynamics, the app will have access to the Dynamics API token.

The approach to access the Dynamics token is similar to Salesforce:

typescript
// Get Dynamics service
const dynamicsService = env.pitcher.user.connected_services.find(
  service => service.provider === 'dynamics' && service.type === 'crm'
)

if (dynamicsService) {
  // Access token for API calls
  const accessToken = dynamicsService.access_token
  
  // URLs for Dynamics endpoints
  const apiUrl = dynamicsService.urls.api
}

For more detailed information on integrating with Microsoft Dynamics, please refer to our Microsoft Dynamics Integration Guide.

Detecting CRM Availability

You can check if CRM integration is available in your app:

typescript
// Check if user has any CRM connection
const isCrmAvailable = computed(() => 
  env.value?.pitcher.user.connected_services.some(service => service.type === 'crm')
)