CondoWebAppSetPageActions

Иногда может понадобиться добавить действие мини-приложения в интерфейс основного приложения: кнопку в Action Bar в вебе или иконку в навигации мобильного приложения. Типичные примеры — кнопка для экспорта, значок камеры или удаления: действия, которые должны оставаться на виду при прокрутке страницы. Этот метод позволяет задать, обновить и спрятать действия, которые отрисовывает основное приложение. Использование выглядит так: отправляете список actions, получаете actionIds и используете эти id, чтобы обрабатывать клики в мини‑приложении.

Платформы

  • B2B-Web

Параметры метода

Название параметраТип параметраОбязательныйОписание
actionsAction[]даСписок действий для отображения

Параметры Action

Название параметраТип параметраОбязательныйОписание
labelstringнетТекст кнопки
disabledbooleanнетОтключить кнопку
loadingbooleanнетСостояние загрузки
iconstringнетНазвание иконки (например, 'Download')

Возвращаемое значение

При успехе метод вернет JSON объект со списком идентификаторов действий:
json
{ "actionIds": ["d21ec5e9-aafe-4552-b8ce-825f9c48c7ea", "80eed388-3c10-440a-8683-74e33f0cabed"] }
Хост генерирует внутренние id и возвращает их в том же порядке, что и входной список. При клике на кнопку хост отправляет событие CondoWebAppActionClickEvent как side-effect.

Пример использования

typescript
import React, { useEffect, useMemo, useState } from 'react'

import bridge from '@open-condo/bridge'
import { useSetPageActionsHandlers } from '@open-condo/miniapp-utils'

export default function MiniappPage (): React.ReactNode {
    const [actionIds, setActionIds] = useState<string[]>([])
    const actions = useMemo(() => ([
        { label: 'Save' },
        { label: 'Download', icon: 'Download' },
    ]), [])

    useEffect(() => {
        bridge.send('CondoWebAppSetPageActions', { actions }).then((data) => {
            setActionIds(data.actionIds)
        })
    }, [actions])

    const handlers = useMemo(() => {
        if (!actionIds.length) return {}

        const [saveId, downloadId] = actionIds
        return {
            [saveId]: () => {
                // обработка сохранения
            },
            [downloadId]: () => {
                // обработка скачивания
            },
        }
    }, [actions, actionIds])

    useSetPageActionsHandlers(bridge, handlers)

    return null
}

Жизненный цикл и скрытие действий

Действия остаются видимыми при переходах между страницами внутри мини‑приложения. Если нужно их скрыть, отправьте пустой массив actions.
Если нужно скрыть действия при размонтировании компонента, делайте это в useEffect cleanup:
typescript
import React, { useEffect } from 'react'
import bridge from '@open-condo/bridge'

useEffect(() => {
    bridge.send('CondoWebAppSetPageActions', { actions: [/* ... */] })

    return () => {
        bridge.send('CondoWebAppSetPageActions', { actions: [] })
    }
}, [])

Обновление действий

Чтобы обновить кнопку, отправьте полный обновленный массив actions:
typescript
import bridge from '@open-condo/bridge'

bridge.send('CondoWebAppSetPageActions', {
    actions: [
        { label: 'Save' },
        { label: 'Download', loading: true },
    ],
})
Редактировать эту страницу на Github
Назад: CondoWebAppRedirect
Далее: CondoWebAppShowNotification