diff --git a/frontend/src/Editor/Editor.jsx b/frontend/src/Editor/Editor.jsx
index 040ea7cf08..d59596cc40 100644
--- a/frontend/src/Editor/Editor.jsx
+++ b/frontend/src/Editor/Editor.jsx
@@ -76,6 +76,7 @@ class Editor extends React.Component {
urlparams: JSON.parse(JSON.stringify(queryString.parse(props.location.search)))
}
},
+ apps: [],
dataQueriesDefaultText: 'You haven\'t created queries yet.',
showQuerySearchField: false
};
@@ -83,6 +84,7 @@ class Editor extends React.Component {
componentDidMount() {
const appId = this.props.match.params.id;
+ this.fetchApps(0);
appService.getApp(appId).then((data) => this.setState(
{
@@ -177,6 +179,13 @@ class Editor extends React.Component {
);
};
+ fetchApps = (page) => {
+ appService.getAll(page).then((data) => this.setState({
+ apps: data.apps,
+ isLoading: false
+ }));
+ }
+
computeComponentState = (components) => {
let componentState = {};
const currentComponents = this.state.currentState.components;
@@ -455,7 +464,8 @@ class Editor extends React.Component {
deviceWindowWidth,
scaleValue,
dataQueriesDefaultText,
- showQuerySearchField
+ showQuerySearchField,
+ apps
} = this.state;
const appLink = slug ? `/applications/${slug}` : '';
@@ -880,6 +890,7 @@ class Editor extends React.Component {
currentState={currentState}
allComponents={appDefinition.components}
key={selectedComponent.id}
+ apps={apps}
>
) : (
Please select a component to inspect
diff --git a/frontend/src/Editor/Inspector/EventSelector.jsx b/frontend/src/Editor/Inspector/EventSelector.jsx
index 5e496f1660..13d9b24c71 100644
--- a/frontend/src/Editor/Inspector/EventSelector.jsx
+++ b/frontend/src/Editor/Inspector/EventSelector.jsx
@@ -13,7 +13,8 @@ export const EventSelector = ({
extraData,
eventMeta,
currentState,
- components
+ components,
+ apps
}) => {
const [open, setOpen] = useState(false);
@@ -48,6 +49,17 @@ export const EventSelector = ({
return modalOptions;
}
+ function getAllApps() {
+ let appsOptionsList = [];
+ apps.map((item) => {
+ appsOptionsList.push({
+ name: item.name,
+ value: item.id
+ })
+ })
+ return appsOptionsList;
+ }
+
function eventChanged(param, value, extraData) {
if(value === 'none') {
eventUpdated(param, null, null);
@@ -115,10 +127,15 @@ export const EventSelector = ({
{definition.actionId === 'go-to-app' && (
- eventOptionUpdated(param, 'appId', value, extraData)}
+ {
+ eventOptionUpdated(param, 'slug', value, extraData);
+ }}
+ filterOptions={fuzzySearch}
+ placeholder="Select.."
/>
)}
diff --git a/frontend/src/Editor/Inspector/Inspector.jsx b/frontend/src/Editor/Inspector/Inspector.jsx
index 446d6461ad..1c8381d563 100644
--- a/frontend/src/Editor/Inspector/Inspector.jsx
+++ b/frontend/src/Editor/Inspector/Inspector.jsx
@@ -16,7 +16,8 @@ export const Inspector = ({
removeComponent,
allComponents,
componentChanged,
- currentState
+ currentState,
+ apps
}) => {
const selectedComponent = { id: selectedComponentId, component: allComponents[selectedComponentId].component, layouts: allComponents[selectedComponentId].layouts}
@@ -229,7 +230,7 @@ export const Inspector = ({
Style
{Object.keys(componentMeta.styles).map((style) => renderElement(component, componentMeta, paramUpdated, dataQueries, style, 'styles', currentState, components))}
Events
- {Object.keys(componentMeta.events).map((eventName) => renderEvent(component, eventUpdated, dataQueries, eventOptionUpdated, eventName, componentMeta.events[eventName], currentState, components))}
+ {Object.keys(componentMeta.events).map((eventName) => renderEvent(component, eventUpdated, dataQueries, eventOptionUpdated, eventName, componentMeta.events[eventName], currentState, components, apps))}
diff --git a/frontend/src/Editor/Inspector/Utils.js b/frontend/src/Editor/Inspector/Utils.js
index 6864f1492a..915a360d8d 100644
--- a/frontend/src/Editor/Inspector/Utils.js
+++ b/frontend/src/Editor/Inspector/Utils.js
@@ -51,7 +51,7 @@ export function renderElement(component, componentMeta, paramUpdated, dataQuerie
);
}
-export function renderEvent(component, eventUpdated, dataQueries, eventOptionUpdated, eventName, eventMeta, currentState, components) {
+export function renderEvent(component, eventUpdated, dataQueries, eventOptionUpdated, eventName, eventMeta, currentState, components, apps) {
let definition = component.component.definition.events[eventName];
definition = definition || { };
@@ -65,6 +65,7 @@ export function renderEvent(component, eventUpdated, dataQueries, eventOptionUpd
eventOptionUpdated={eventOptionUpdated}
currentState={currentState}
components={components}
+ apps={apps}
/>
);
}
diff --git a/frontend/src/_helpers/appUtils.js b/frontend/src/_helpers/appUtils.js
index f0d39a49dd..ee545d114a 100644
--- a/frontend/src/_helpers/appUtils.js
+++ b/frontend/src/_helpers/appUtils.js
@@ -99,9 +99,9 @@ function executeAction(_ref, event, mode) {
}
if (event.actionId === 'go-to-app') {
- const appId = resolveReferences(event.options.appId, _ref.state.currentState);
+ const slug = resolveReferences(event.options.slug, _ref.state.currentState);
- const url = `/applications/${appId}`;
+ const url = `/applications/${slug}`;
if(mode === 'view') {
_ref.props.history.push(url);