Custom Component action framework

  • 3
  • Question
  • Updated 1 year ago
  • Answered
I have a custom component that dynamically creates its own model. I'd like to be able to add model actions to that dynamic model through my component's properties in the ui.

Any thoughts on the best way to go about this?
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb

Posted 3 years ago

  • 3
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
... ?
Photo of mB Andréas K.LeF

mB Andréas K.LeF

  • 1,244 Points 1k badge 2x thumb
I made a video for ya:


Hope this helps! 
(Edited)
Photo of Mubeena

Mubeena

  • 278 Points 250 badge 2x thumb
It is not working Please provide me information about custom component
Photo of Karen Waldschmitt

Karen Waldschmitt, Official Rep

  • 8,210 Points 5k badge 2x thumb
Matt~

Does what mB Andréas work put together for your situation? If not, let us know!

Thanks!
Karen
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
Thanks, mB Andréas

That's what I'm intending to do conceptually. I was looking for sample builder (and runtime?) code to make the action framework work with my custom component. Does that exist somewhere?
Photo of mB Andréas K.LeF

mB Andréas K.LeF

  • 1,244 Points 1k badge 2x thumb
No, not to my knowledge. So far the only two people I've seen accomplish this were Barry and myself, and we've both had to reverse-engineer the skuid CoreComponents to get the code we need to make this work.

I can only suggest you do the same, both the runtime.js and builders.js have good info. You can also look at some of Barry's stuff and see how he's doing it.

We're not necessarily at liberty (yet?) to release the source for making that functionality happen though. This is not an official skuid api, generally undocumented and may be subject to change in the future so YMMV

If you can get a hold of my skype (through Pat perhaps), I'd be glad to point you in the right direction.
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
Thanks. I'll do my best to reverse engineer. Unless skuid wants to share more? Karen?
Photo of Ben Hubbard

Ben Hubbard, Employee

  • 12,470 Points 10k badge 2x thumb
Documenting a stable api for building components with all the goodness that we use in our Skuid core components is something we really want to do. I don't have a timeframe on that yet though. In the mean-time Andreas and Barry's approach should work fine. If there are any changes to those undocumented APIs they should be pretty minor.
Photo of Thimo

Thimo

  • 1,280 Points 1k badge 2x thumb
If you are writing a custom component to install, you can access the Action Framework using skuid.builder.core.getActionsCategory().

That means, in the Builder.js push this property to your properties:

skuid.builder.core.getActionsCategory({			   	label: "My Actions",
   customNodeId: "myactions",
   linkedComponent: component,
   props: [{
  type: "helptext",
  html: "Here my helptext"
   }]
});

To run all the Actions specified in the Action Framework in the Runtime.js use this code.

skuid.actions.runActionsNode(xmlDef.children("myactions"), this.component, {});

Maybe there are way more properties you could set or write cleaner code, but since it's not documented this was all I could find out by analyzing the Skuid Code. 
It worked for me when I wrote a custom file upload component.
(Edited)
Photo of Shmuel Kamensky

Shmuel Kamensky, Champion

  • 4,328 Points 4k badge 2x thumb
Is there a way to arbitrarily call action notes without component or context awareness?

For example, when doing model.loadAllRemainingRecords I only want to perform the after query model actions in the finishCallback. 

So combining branch logic and snippets, I only have the after model query actions run when loadAllRemainingRecords isn't processing.

Noe I can either implement runActionsNode in the finishCallback [ :-) ] or duplicate the logic inside the snippet and maintain both [ :-( ].

How would I go about calling runActionsNode on a model given its action node (accessible through
skuid.model.getModel('modelname').actions[0].actions
)