App flow bindings to linked page

[mebeingken]

Wappler Version : 4.8.1
Operating System : mac
Server Model: node
Database Type:
Hosting Type:

Expected behavior

After linking an App flow to a layout or content page, I should be able to select actions available on that page

Actual behavior

Actions list is always empty

How to reproduce

Create a content page:

<!-- Wappler include head-page="layouts/main" is="dmx-app" id="flow_test" appConnect="local" bootstrap5="local" fontawesome_5pro="cdn" components="{dmxBrowser:{},dmxNotifications:{}}" -->
<meta name="ac:route" content="/flow_test">
<div is="dmx-browser" id="browser1">

</div>
<dmx-notifications id="notifies1"></dmx-notifications>

and an App flow:

{
  meta: {
    options: {linkedFile: "/views/flow_test.ejs"}
  },
  exec: {
    steps: {
      run: {}
    }
  }
}

I should see the browser and notifies actions here:

[Antony]

Hi there @mebeingken…

I’m curious about this topic… I read somewhere that it should work as you have described in this bug report, yet the bug has never been fixed, and Teodor tells me it shouldn’t work the way you are expecting.

Do you have any workaround for this?

Otherwise I’m struggling to see the usefulness of App Flows…

[mebeingken]

Hey Antony, I haven’t looked at App flows recently so not sure what the expectations of the feature are currently.

[Antony]

Fair enough…

You were expecting to link an app flow to a page so you could use the data binding options from that page, and you reported it as a bug which was never fixed… but clearly life has moved on!

@George, could you clarify this topic for me please?

Is this post a bug as @mebeingken reported, or is this feature not part of Wappler’s design as @teodor told me in the post below?

Having this feature would be amazing for building a new part of my app!

Thanks!
Antony.

Issue Linking App Flow to a Page

That is not possible, as this is not how App Flows work and @kfawcett already explained you how the things work.

[George]

Antony,

to use App Flows on a page you just have to add the App Flow component on that page and then point it to the right app flow.

Then all bindings from that App Flow will be available on the page.

[Antony]

Thanks @George!

I couldn’t believe this wasn’t possible…

I’ve created a sizeable page flow which I’d like to convert to an app flow for ease of management… is there an easy way to do this conversion, or should I just copy it to an empty app flow and fiddle with the JS formatting till I get it right?

[Teodor]

@Antony

I couldn’t believe this wasn’t possible…

Antony, i think you both are talking about different things with George.

You asked if:

@Antony

You were expecting to link an app flow to a page so you could use the data binding options from that page

And that is not possible.
You can’t access page components from an app flow.

It’s the other way around:

@George

to use App Flows on a page you just have to add the App Flow component on that page and then point it to the right app flow.

Then all bindings from that App Flow will be available on the page.

As George explained - you can access the App Flow components FROM the page it is added on, not the other way around.

[Antony]

@Teodor

As George explained - you can access the App Flow components FROM the page it is added on, not the other way around.

Oh… yes, that makes sense now I read the words carefully…

I’m therefore struggling to understand what use an app flow is if it can’t access anything on any page…

If I want to be able to access bindings to elements on a page from an app flow, do I need to create a Feature Request?

Is this bug report actually not a bug but reference to a non-existent feature?

[Teodor]

@Antony

I’m therefore struggling to understand what use an app flow is if it can’t access anything on any page…

Well the use is that you can define it once per project and reuse it across different pages, instead of defining page flows on each of your pages.

[Teodor]

@Antony

If I want to be able to access bindings to elements on a page from an app flow, do I need to create a Feature Request?

Is this bug report actually not a bug but reference to a non-existent feature?

I think i already explained you in another topic that this is not possible, not a bug and never been available.

[Antony]

@Teodor

Well the use is that you can define it once per project and reuse it across different pages, instead of defining page flows on each of your pages.

I understand that, but I’m not clear what I would want to put in an app flow that can’t access any information on any page!

I mainly use flows for managing data stores, which are defined on a page…

[Teodor]

@Antony

that can’t access any information on any page!

You can send dynamic values from your pages to the App Flows via params. You can define different actions that use dynamic parameters. On each of your pages you can load the App Flow with a different dynamic value, very similar to what library actions in Server Connect are doing.

[Antony]

Thanks @teodor…

So is it true to say that an App Flow can:

• Read/write to the database via its own server connect
• Read a variable’s value on a page as it can be passed as a parameter

But it cannot:

• Write to a page variable (this_variable.setValue(X))
• Read or write to a Datastore
• Pass any values back to the calling page?

[George]

App Flows are actually pretty much similar to Server Connect actions but executed client side only. For the rest they are blackboxed in their own output.

Page flows only can access page components

[Antony]

Thanks for that @george!

And am I right in saying that a Data Store can only be defined on a page, and not for a whole project?

[famousmag]

@Antony

• Write to a page variable (this_variable.setValue(X))
• Read or write to a Datastore
• Pass any values back to the calling page?

I think All these can be done:

• You can use Run Javascript in your App Flow to run functions and there call dmx-parse() to write page variables
• You can read a Datastore by passing it as a $param to your App Flow
• Any value that has output enabled in your App Flow, then its bindings are available to your calling main page under the Appflow component

[Antony]

Thanks for that @famousmag!

Some thoughts…

@famousmag

You can use Run Javascript in your App Flow to run functions and there call dmx-parse() to write page variables

Genius!
But… I guess I need to code it all by hand, which kinda makes things more work.

@famousmag

You can read a Datastore by passing it as a $param to your App Flow

I tried this after you posted about it, but couldn’t make it work…

@famousmag

Any value that has output enabled in your App Flow, then its bindings are available to your calling main page under the Appflow component

Aha, that is useful to know!

[kfawcett]

Think of an App Flow as a process that runs locally on the client (i.e. Browser) vs a Server Connect that runs on the server. They are similar, but run from different locations.

For instance, I use them for making 3rd-party API calls in my mobile project (I don’t want this data being processed via the server for data security). You can define parameters in the App Flow and then pass values from the page into the App Flow.

I normally trigger them on button clicks, from Server Connect Success events, or from other Page Flows.

[famousmag]

Sorry for posting random tests that maybe don’t make sense but you can understand the logic…

From an inline flow calling the AppFlow and pass a Datastore as an argument ($param)

The actual AppFlow

Back to the same inline flow, getting the data (repeat with some values) and assign their value to a QueryManager parameter