0

I am creating a custom widget in ArcGIS experience builder and am trying to get a list of all the widgets currently defined in the setting UI.

I tried using the widget state to transfer the list, as well as create it in a similar way to the one used in the Control the Widget State example, but when I use the same code in setting.tsx I get the widgets that are used to create the settings UI sidebar, and not the current page widgets.

For example, when I run:

import { React, getAppStore } from 'jimu-core'; const { useState, useEffect } = React let state = getAppStore().getState(); const [appWidgets, setAppWidgets] = useState({} as unknown) const [widgetsArray, setWidgetsArray] = useState([] as any[]) // Update the appWidgets property once, on page load useEffect(() => { const widgets = state.appConfig.widgets setAppWidgets(widgets) }, [state]) // Update the widgetsArray and sidebarWidgetsArray properties every time appWidgets changes useEffect(() => { if (appWidgets) { const widgetsArray = Object.values(appWidgets) setWidgetsArray(widgetsArray) } }, [appWidgets])

Then widgetsArray is supposed to contain all of the widgets in the app, which works if run inside widget.tsx, but in setting.tsx I get a list of the setting UI components.

I know the process should be possible, because the MapWidgetSelector component uses it to grab just the map components, but it's code isn't open and I can't find how it's done.

Is there an efficient way to get all of the widgets in a specific appstate page into the settings UI?

Improve this question

1 Answer 1

Reset to default
2

I found the answer in the actions/query-action-setting.tsx file of the message subscriber example.
Apparently the ArcGIS Experience builder seperates between the app you are building and the builder app you are using to build it, but they have some communication between them. It is possible to get the internal app state, and through that its app config, and through it the pages, layouts and widgets through:

getAppStore().getState().appStateInBuilder.appConfig

And after that you can just grab any widget you want by its ID, like shown in the example at the getInitConfig function:

const messageWidgetId = this.props.messageWidgetId const config = getAppStore().getState().appStateInBuilder.appConfig const messageWidgetJson = config.widgets[messageWidgetId]
Improve this answer

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.