Querying Attio data

The App SDK provides a GraphQL API for querying data within Attio. You can use this API to retrieve Attio’s standard and custom records, information about the current user, and other relevant data.

Example: Get a person’s contact details

First, create a new .graphql file within your application and include the following GraphQL query:
get-person-contact-details.graphql
query getPersonContactDetails($recordId: String!) {
    person(id: $recordId) {
        name {
            full_name
        }
        email_addresses
        phone_numbers
        company {
            name
        }
    }
}
This query retrieves person’s full name, email addresses, phone numbers, and associated company name. After defining the query, you can import and run it within your app:
import {showToast, runQuery, RecordAction} from "attio/client"
import getPersonContactDetails from "./get-person-contact-details.graphql"

export const recordAction: RecordAction = {
    id: "add-to-sequence",
    label: "Add to Sequence",
    onTrigger: async ({recordId}) => {
        const {person} = await runQuery(getPersonContactDetails, {recordId})

        if (!person) {
            showToast({
                variant: "error",
                title: "Person not found",
            })
            return
        }

        // process the retrieved contact details
    },
}
The App SDK includes useQuery hook for querying within React components.
Once you’ve fetched the contact details, you can send the data to external service or use it as a starting point to prefill form fields.

Example: Get a text attributes value on a company record

First, create a new .graphql file within your application and include the following GraphQL query:
get-text-attribute-value.graphql
query getTextAttributeValue($recordId: String!, $slug: String!) {
    company(id: $recordId) {
        attribute(slug: $slug) {
            __typename
            ... on TextValue {
                value
            }
        }
    }
}
After defining the query, you can import and run it within your app, be sure to pass the slug of the attribute you’d like to access.
You can find the slug of an attribute in Settings > Data > Objects > Attributes > three dots menu > Copy slug.
import {showToast, runQuery, RecordAction} from "attio/client"
import getTextAttributeValue from "./get-text-attribute-value.graphql"

export const recordAction: RecordAction = {
    id: "get-stock-price",
    label: "Get Stock Price",
    onTrigger: async ({recordId}) => {
        const values = await runQuery(getTextAttributeValue, {recordId, "ticker"})
        const ticker = (values.company?.attribute as { value: string }).value

        if (!ticker) {
            showToast({
                variant: "error",
                title: "Ticker not found",
            })
            return
        }

        // process the retrieved ticker details and fetch stock price
    },
}

Exploring the GraphQL schema

To inspect the App SDK’s GraphQL schema, run npx attio dev and press o. This opens a local GraphiQL instance in read-only mode, where you can browse available types and operations.
Query execution against workspace data is not yet supported in the playground.
If you need access to data that isn’t available in the GraphQL schema, you can use the Attio REST API by calling attioFetch from within your server functions.