Appearance
Function: useAdmin()
useAdmin():
object
API methods available in the CatalogIQ Admin.
You can store the API object in a variable and call the methods directly.
Most methods have a snake_case and camelCase version of their name available.
ts
import { useAdmin } from '@pitcher/js-api'
const adminApi = useAdmin()Returns
object
on()
on: (
type,handler) =>Promise<() =>void>
Subscribe to a given event type by its key.
Parameters
| Parameter | Type | Description |
|---|---|---|
type | "admin_env_changed" | The event type/key to subscribe to. |
handler | (data) => Promise<void> | The handler function to call when the event is emitted. |
Returns
Promise<() => void>
A Promise resolving to a cleanup function to unsubscribe from the event.
toast()
toast: (
payload) =>Promise<void>
Show a toast message to the user. Compatible with the UI API version of this method.
Parameters
| Parameter | Type |
|---|---|
payload | AdminToastRequest |
Returns
Promise<void>
Example
ts
useAdmin().toast({ type: 'info', message: 'Hello, world!' })captureAppError()
Send an app error to Pitcher sentry instance.
Parameters
| Parameter | Type | Description |
|---|---|---|
payload | AdminCaptureAppErrorRequest | error object to send to Pitcher sentry instance |
Returns
Promise<void>
Example
ts
try {
throw new Error('This is an error')
} catch (error) {
useAdmin().captureAppError({
error,
message: 'This is an app error',
})
}close()
Closes the already open file that was opened via api or by the user.
Returns
Promise<void>
Example
ts
adminApi.close()createCanvas()
Creates a new canvas.
Parameters
| Parameter | Type |
|---|---|
payload | CanvasCreateRequest |
Returns
Example
ts
adminApi.createCanvas({
name: 'my new canvas';
})getAppConfig()
Get the metadata object of an app with a given name.
Parameters
| Parameter | Type | Description |
|---|---|---|
payload | { app_name: string; } | The payload object. |
payload.app_name | string | name value from app.json of the app you want to get the metadata of. |
Returns
Example
ts
useAdmin().getAppConfig({ app_name: 'my-app' })getCanvas()
Fetches a canvas by id with the defined fields or all of them.
Parameters
| Parameter | Type |
|---|---|
payload | { fields: string; id: string; } |
payload.fields? | string |
payload.id | string |
Returns
Example
ts
// The `filters` object is a reserved payload key to transfer the metadata dict over the wire.
adminApi.getCanvas({
fields: 'id,name,metadata',
})getCanvases()
Fetches a list of canvases to use in your app.
Parameters
| Parameter | Type |
|---|---|
payload | GetCanvasesParams & object |
Returns
Promise<PaginatedData<CanvasRetrieve>>
Example
ts
// The `filters` object is a reserved payload key to transfer the metadata dict over the wire.
adminApi.getCanvases({
search: 'my search query',
ordering: '-created_at',
filters: {
metadata__mydaterangefiltername__range: ['2023-12-10', '2023-12-22'],
metadata__mymultiselectfiltername: ['optionAValue', 'optionCValue'],
},
fields: 'id,name,metadata',
})getEnv()
Fetches the necessary info for the app to know where it is embedded.
Check out usePitcherApi().getEnv() for more information.
Returns
Example
ts
adminApi.getEnv()getFile()
Fetches a file by ID.
Parameters
| Parameter | Type |
|---|---|
payload | { id: string; } |
payload.id | string |
Returns
Example
ts
adminApi.getFile({ id: 'my-file-id' })getFiles()
Lists available files.
Parameters
| Parameter | Type |
|---|---|
payload | Record<string, any> |
Returns
Example
ts
adminApi.getFiles()getInstanceMetadataTemplates()
Fetches a list of metadata templates to use in your app. Instance is auto-injected by admin app if in instance scope.
Parameters
| Parameter | Type |
|---|---|
payload? | GetInstanceMetadataTemplatesPayload |
Returns
Promise<PaginatedMetadataTemplateList>
Example
ts
adminApi.getInstanceMetadataTemplates()getUsers()
Fetches a list of users from the admin API.
Parameters
| Parameter | Type | Description |
|---|---|---|
payload? | GetUsersParams | Optional parameters for filtering users |
Returns
Promise resolving to a paginated list of users
Example
ts
const adminApi = useAdmin()
const users = await adminApi.getUsers({ page_size: 100 })open()
Opens a file by id.
Parameters
| Parameter | Type |
|---|---|
payload | { id: string; } |
payload.id | string |
Returns
Promise<void>
Example
ts
adminApi.open({ id: 'my-file-id' })openCanvasOverlay()
Opens a modal to view a canvas by ID.
onMounted(() => {
adminApi.openCanvasOverlay({
id: '01HH4RCBH631K4JDHWAQB0RPR6',
edit_mode: false,
fullscreen: true,
})
})You can also specify a position for the canvas overlay:
adminApi.openCanvasOverlay({
id: '01HH4RCBH631K4JDHWAQB0RPR6',
position: {
top: '10px',
left: '20px',
right: '20px',
bottom: '10px'
}
})Parameters
| Parameter | Type |
|---|---|
payload | { component_id: string; edit_mode: boolean; fullscreen: boolean; id: string; position: { bottom: string | number; left: string | number; right: string | number; top: string | number; }; section_id: string; } |
payload.component_id? | string |
payload.edit_mode? | boolean |
payload.fullscreen? | boolean |
payload.id | string |
payload.position? | { bottom: string | number; left: string | number; right: string | number; top: string | number; } |
payload.position.bottom? | string | number |
payload.position.left? | string | number |
payload.position.right? | string | number |
payload.position.top? | string | number |
payload.section_id? | string |
Returns
Promise<void>
openCollectionPlayerOverlay()
Opens a modal to display collection player content.
Parameters
| Parameter | Type |
|---|---|
payload | AdminOpenCollectionPlayerOverlayRequest |
Returns
Promise<void>
Example
ts
adminApi.openCollectionPlayerOverlay({
name: 'My Collection',
groups: [
{
id: 'file-id-1',
name: 'Group 1',
},
{
id: 'group-2',
name: 'Group 2',
slides: [
{ file_id: 'file-id-2', slide_index: 0 },
{ file_id: 'file-id-3', slide_index: 1 },
],
},
],
})selectAgendaContent()
Opens the agenda selector modal to allow the user to select agenda content and handle the outcome.
const api = useApi() // or useAdmin() if you know that you 're in Admin context
adminApi.selectAgendaContent({
// optional payload
initial_agenda: {
name: 'test',
groups: []
}
})Parameters
| Parameter | Type |
|---|---|
payload | AdminSelectAgendaRequest |
Returns
Promise<AdminSelectAgendaResponse>
selectCanvases()
Allows the user to select (and preselect) canvases from the instance.
This method allows you to prompt the user to select canvases from the CatalogIQ instance and use that canvas selection in your application.
Parameters
| Parameter | Type | Description |
|---|---|---|
payload | AdminSelectCanvasesRequest | optional payload to preselect specific canvases |
Returns
Promise<AdminSelectCanvasesResponse>
Promise with the user action and selected canvases
Example
ts
const api = useApi() // or useAdmin() if you know that you 're in Admin context
api
.selectCanvases({
allowed_types: ['canvas','canvas-template','section','section-template'] // default ['canvas']
selections: [
{ id: "01HCZ623YYRFJQ0F7B69VWE510" },
{ id: "02HCZ623YYRFJQ0F7B69VWE510" },
], // default []
})selectCollectionContent()
Opens the collection player selector modal to allow the user to select collection player content and handle the outcome.
const api = useApi() // or useAdmin() if you know that you 're in Admin context
adminApi.selectCollectionContent({
// optional payload
initial_data: {
name: 'test',
groups: []
}
})Parameters
| Parameter | Type |
|---|---|
payload | AdminSelectCollectionPlayerRequest |
Returns
Promise<AdminSelectCollectionPlayerResponse>
selectContent()
Opens a selector that allows you to select (and preselect) from your Pitcher uploaded content.
Parameters
| Parameter | Type |
|---|---|
payload | AdminSelectContentRequest |
Returns
Promise<AdminSelectContentResponse>
Example
ts
const api = useApi() // or useAdmin() if you know that you 're in Admin app context
api
.select_content({
selections: [
{ fileId: "01HCZ623YYRFJQ0F7B69VWE510", type: "file" },
{
fileId: "01HD3XGZ5FN90QJGK7CH8TBZDF",
type: "page",
pageIndex: 2,
},
],
})updateCanvas()
Updates a canvas by ID and returns the defined fields or all of them.
Parameters
| Parameter | Type |
|---|---|
payload | PatchedCanvasUpdateRequest & object |
Returns
Example
ts
// The fields param is appended to the URL as a query param.
onMounted(() => {
adminApi.updateCanvas({
id: '01HH4RCBH631K4JDHWAQB0RPR6',
fields: 'id,name',
name: 'To 3!',
}).then((res) => {
console.log(res) // logs: { id: '01HH4RCBH631K4JDHWAQB0RPR6', name: 'To 3!' }
})
})