PageCustomContentListView

Renders a list of custom content created within a page.

Example of a PageCustomContentListView component

Usage notes

PageCustomContentListView component is available for confluence:contentAction, confluence:contentBylineItem and confluence:contextMenu modules.

Import statement

1
2
import ForgeUI, { PageCustomContentListView } from '@forge/ui';

Props

Name	Type	Required	Description
`contentId`	`sting`	Yes	The content ID for which the list is displayed.
`spaceKey`	`sting`	Yes	The key for the space for which the list is displayed.
`type`	`string`	Yes	The custom content type for which the list is displayed. Use the following format for the type: `forge:[APP_ID]:[ENVIRONMENT_ID]:[MODULE_KEY]`. Where: `forge`: The prefix for content type created with Forge. `APP_ID`: The identifier for your Forge app. `ENVIRONMENT_ID`: The environment ID where the app was deployed. For more details, see Environments and versions. `MODULE_KEY`: `confluence:customContent` module key.

Example

1
2
import ForgeUI, {render, useState, useProductContext, ContentAction, ModalDialog, PageCustomContentListView} from '@forge/ui';

const App = () => {
    const [isOpen, setOpen] = useState(true);
    const {contentId, spaceKey, localId, environmentType} = useProductContext();
    
    // extractAppId implementation omitted
    const type = `forge:${extractAppId(localId)}:${environmentType}:note`;
    
    if (!isOpen) {
        return null;
    }
    
    return (
      <ModalDialog header={`List of notes`} width="x-large" onClose={() => setOpen(false)}>
          <PageCustomContentListView
            contentId={contentId}
            spaceKey={spaceKey}
            type={type}
          />
      </ModalDialog>
    );
};

export const run = render(
    <ContentAction>
        <App/>
    </ContentAction>
);