getLayout()

Returns which dashboard your extension was loaded into: the desktop dashboard or the mobile dashboard. This reflects the host environment, not screen size, so you can decide to render a different component tree, skip a fetch, or swap a data-dense view for a simpler one based on where your extension is running.

The dashboard sets this once when it loads your extension, based on the device, and it stays fixed while your extension is open. It doesn't change when the user resizes the window or rotates their device, so call getLayout() once when your extension renders. You don't need to poll it or listen for changes.

For UI that should respond to live window resizing, use CSS media queries or resize listeners instead.

Note: This method doesn't yet work when developing sites or building apps with Blocks.

Method declaration

Copy

Parameters

This method takes no parameters.

Returns

A PageLayout object describing the layout the dashboard used to render your extension.

PageLayout object

NameTypeDescription
type'mobile' | 'desktop'The layout the dashboard used to render your extension.

Note: A LayoutType enum is also exported (LayoutType.Mobile, LayoutType.Desktop) for developers who prefer it over the string-literal union.

Examples

Note: To call this method in self-hosted apps, you need to create a client. See the setup guide for more details.

Read the current layout

Copy

Branch your UI based on the layout

Copy
Did this help?