Skip to main content

​
npm SDK Examples

​
Get Template URL for a Document

import { getTemplateUrl } from '@artosai/sdk'

async function fetchTemplateInfo(documentId) {
    try {
        const result = await getTemplateUrl({
            documentId: documentId,
            accessToken: process.env.ARTOS_ACCESS_TOKEN,
            baseUrl: 'https://api.artosai.com'
        })

        if (result.templateUrl) {
            console.log('Template found!')
            console.log('  URL:', result.templateUrl)
            console.log('  Template ID:', result.templateId)
            console.log('  Document Name:', result.documentName)
        } else {
            console.log('No template associated with this document')
        }

        return result
    } catch (error) {
        console.error('Failed to fetch template:', error.message)
        throw error
    }
}

fetchTemplateInfo('507f1f77bcf86cd799439011')

​
Display a Template in a Web Application

import { getTemplateUrl } from '@artosai/sdk'

async function displayTemplate(documentId) {
    const result = await getTemplateUrl({
        documentId,
        accessToken: process.env.ARTOS_ACCESS_TOKEN,
        baseUrl: 'https://api.artosai.com'
    })

    if (result.templateUrl) {
        // Use the presigned URL directly in an iframe, download link, or document viewer
        document.getElementById('template-viewer').src = result.templateUrl

        // Or create a download link
        const link = document.createElement('a')
        link.href = result.templateUrl
        link.download = result.documentName || 'template.docx'
        link.click()
    }
}

​
Using the API Client for Multiple Requests

import { createApiClient, getTemplateUrl } from '@artosai/sdk'

const artosClient = createApiClient({
    baseUrl: 'https://api.artosai.com'
})

async function getMultipleTemplates(documentIds, accessToken) {
    const results = await Promise.all(
        documentIds.map(id => getTemplateUrl({
            documentId: id,
            accessToken,
            apiClient: artosClient
        }))
    )
    return results
}

const templates = await getMultipleTemplates(
    ['doc-1', 'doc-2', 'doc-3'],
    process.env.ARTOS_ACCESS_TOKEN
)

​
React Integration

import React, { useState, useEffect } from 'react'
import { getTemplateUrl } from '@artosai/sdk'

function TemplateViewer({ documentId, accessToken }) {
    const [templateUrl, setTemplateUrl] = useState(null)
    const [loading, setLoading] = useState(true)
    const [error, setError] = useState(null)

    useEffect(() => {
        async function loadTemplate() {
            try {
                setLoading(true)
                const result = await getTemplateUrl({
                    documentId,
                    accessToken,
                    baseUrl: process.env.REACT_APP_ARTOS_API_URL
                })
                setTemplateUrl(result.templateUrl)
            } catch (err) {
                setError(err.message)
            } finally {
                setLoading(false)
            }
        }

        loadTemplate()
    }, [documentId, accessToken])

    if (loading) return <div>Loading template...</div>
    if (error) return <div>Error: {error}</div>
    if (!templateUrl) return <div>No template found</div>

    return (
        <iframe
            src={templateUrl}
            title="Template Viewer"
            width="100%"
            height="600px"
            frameBorder="0"
        />
    )
}

export default TemplateViewer

​
Node.js/Express Backend Integration

import express from 'express'
import { getTemplateUrl, ArtosAPIError } from '@artosai/sdk'

const app = express()

const getAccessToken = (req) => {
    return req.headers.authorization?.replace('Bearer ', '')
}

app.get('/api/documents/:id/template', async (req, res) => {
    try {
        const result = await getTemplateUrl({
            documentId: req.params.id,
            accessToken: getAccessToken(req),
            baseUrl: process.env.ARTOS_API_URL
        })

        res.json({
            success: true,
            data: {
                templateUrl: result.templateUrl,
                templateId: result.templateId,
                documentName: result.documentName
            }
        })
    } catch (error) {
        const status = error instanceof ArtosAPIError ? error.status : 500
        res.status(status).json({
            success: false,
            error: error.message
        })
    }
})

app.listen(3000, () => {
    console.log('Server running on port 3000')
})

​
Get Sources for a Document Section

import { getDocumentSources } from '@artosai/sdk'

async function fetchSources(documentId, sectionId) {
    try {
        const result = await getDocumentSources({
            documentId,
            sectionId,
            accessToken: process.env.ARTOS_ACCESS_TOKEN,
            baseUrl: 'https://api.artosai.com'
        })

        console.log(`Found ${result.sources.length} sources:`)
        result.sources.forEach(source => {
            console.log(`  - ${source.documentSourceName}`)
            console.log(`    Text: ${source.referencedText?.substring(0, 100)}...`)
        })

        return result.sources
    } catch (error) {
        console.error('Failed to fetch sources:', error.message)
        throw error
    }
}

​
Full Source Viewing Workflow

This example shows the complete flow: user highlights text, the SDK resolves the section, fetches sources, and generates a preview URL. 
import {
    getSectionFromText,
    getDocumentSources,
    getDocumentSourceUrl
} from '@artosai/sdk'

async function handleTextSelection(documentId, selectedText) {
    const accessToken = process.env.ARTOS_ACCESS_TOKEN
    const baseUrl = 'https://api.artosai.com'

    // Step 1: Resolve the section from highlighted text
    const section = await getSectionFromText({
        documentId,
        highlightedText: selectedText,
        accessToken,
        baseUrl
    })

    if (!section.sectionId) {
        console.log('No matching section found for the selected text')
        return null
    }

    // Step 2: Get all sources for that section
    const { sources } = await getDocumentSources({
        documentId,
        sectionId: section.sectionId,
        accessToken,
        baseUrl
    })

    // Step 3: Get presigned URLs for each source
    const sourcesWithUrls = await Promise.all(
        sources.map(async (source) => {
            const { documentSourceUrl } = await getDocumentSourceUrl({
                documentSourceId: source.documentSourceId,
                accessToken,
                baseUrl
            })
            return { ...source, url: documentSourceUrl }
        })
    )

    return sourcesWithUrls
}

const sources = await handleTextSelection(
    'doc-123',
    'The competitive landscape has shifted significantly...'
)

​
List All Sections in a Document

import { getDocumentSections } from '@artosai/sdk'

async function listSections(documentId) {
    try {
        const result = await getDocumentSections({
            documentId,
            accessToken: process.env.ARTOS_ACCESS_TOKEN,
            baseUrl: 'https://api.artosai.com'
        })

        console.log(`Found ${result.sections.length} sections:`)
        result.sections.forEach(section => {
            console.log(`  ${section.sectionOrder}. ${section.sectionTitle} (${section.sectionId})`)
        })

        return result.sections
    } catch (error) {
        console.error('Failed to fetch sections:', error.message)
        throw error
    }
}

​
Stream a Source File Through the Proxy

import { getDocumentSourceUrl, generateProxyUrl } from '@artosai/sdk'

async function previewSourceFile(documentSourceId) {
    const baseUrl = 'https://api.artosai.com'
    const accessToken = process.env.ARTOS_ACCESS_TOKEN

    // Step 1: Get the presigned URL for the source
    const { documentSourceUrl } = await getDocumentSourceUrl({
        documentSourceId,
        accessToken,
        baseUrl
    })

    if (!documentSourceUrl) {
        console.log('No URL available for this source')
        return null
    }

    // Step 2: Stream the file through the proxy
    const { blob, contentType } = await generateProxyUrl({
        presignedUrl: documentSourceUrl,
        baseUrl
    })

    console.log(`Fetched ${contentType} file (${blob.size} bytes)`)

    // Display in the browser
    const objectUrl = URL.createObjectURL(blob)
    window.open(objectUrl, '_blank')

    return { blob, contentType }
}

​
React Source Panel Component

import React, { useState, useCallback } from 'react'
import {
    getSectionFromText,
    getDocumentSources,
    getDocumentSourceUrl
} from '@artosai/sdk'

function SourcePanel({ documentId, accessToken }) {
    const [sources, setSources] = useState([])
    const [loading, setLoading] = useState(false)

    const onTextSelected = useCallback(async (selectedText) => {
        setLoading(true)
        try {
            const { sectionId } = await getSectionFromText({
                documentId,
                highlightedText: selectedText,
                accessToken,
                baseUrl: process.env.REACT_APP_ARTOS_API_URL
            })

            if (!sectionId) {
                setSources([])
                return
            }

            const { sources } = await getDocumentSources({
                documentId,
                sectionId,
                accessToken,
                baseUrl: process.env.REACT_APP_ARTOS_API_URL
            })

            setSources(sources)
        } catch (err) {
            console.error('Error loading sources:', err.message)
        } finally {
            setLoading(false)
        }
    }, [documentId, accessToken])

    const openSource = async (documentSourceId) => {
        const { documentSourceUrl } = await getDocumentSourceUrl({
            documentSourceId,
            accessToken,
            baseUrl: process.env.REACT_APP_ARTOS_API_URL
        })

        if (documentSourceUrl) {
            window.open(documentSourceUrl, '_blank')
        }
    }

    if (loading) return <div>Loading sources...</div>

    return (
        <div className="source-panel">
            <h3>Sources ({sources.length})</h3>
            {sources.map(source => (
                <div key={source.documentSourceId} className="source-item">
                    <strong>{source.documentSourceName}</strong>
                    <p>{source.referencedText}</p>
                    <button onClick={() => openSource(source.documentSourceId)}>
                        View Original
                    </button>
                </div>
            ))}
        </div>
    )
}

export default SourcePanel