Skip to main content

partner.removeAccessoryButton

Removes the accessory button added by partner.addAccessoryButton from the top navigation bar. Typically called as a cleanup step when the screen is unmounted.

Signature​

removeAccessoryButton is exposed as a member of the partner namespace object. It is not imported as a standalone function.

import { partner } from '@apps-in-toss/web-framework';

declare const partner: {
  removeAccessoryButton(): Promise<void>;
};

Parameters​

None.

Returns​

  • Promise<void> — resolves once the button has been removed.

Permission​

No permission required — partner.removeAccessoryButton is not bound to any PermissionName. For how other namespaces handle permissions, see Guides — Permissions pattern.

Examples​

Minimal​

import { partner } from '@apps-in-toss/web-framework';

await partner.removeAccessoryButton();

Realistic — cleanup in useEffect​

import { partner } from '@apps-in-toss/web-framework';
import { useEffect } from 'react';

function ProductDetailPage() {
  useEffect(() => {
    partner.addAccessoryButton({
      id: 'btn-share',
      title: 'Share',
      icon: { name: 'icon-share-mono' },
    });

    return () => {
      // Remove the button when navigating away.
      partner.removeAccessoryButton();
    };
  }, []);

  return <main>{/* page content */}</main>;
}

Try it live​

Run partner.removeAccessoryButton in the Partner page of sdk-example.

Open in sdk-example
  • Guides — Accessory button UX — lifecycle of addAccessoryButton/removeAccessoryButton paired with navigationAccessoryEvent, id routing, multi-button screens, and state toggles in one place.

External references​