An interesting strategy for passing properties via raw template plugin outlets

Development

AI-generated summary

The discussion revolves around passing properties via raw template plugin outlets in Discourse. merefield noticed a pattern in the Discourse code where model properties are passed down without being explicitly defined in the template. david explained that this is a Discourse-specific feature and is safe to use. He also mentioned that raw outlets don’t support passing args, so context is the only way to go.

JQ331 struggled with passing arguments through plugin outlets and attempted to use {{~raw-plugin-outlet name="cool-outlet" args=(hash model=model)}}, but encountered an error. david clarified that raw-plugin-outlet can only be used in raw templates (ending in .hbr).

JQ331 then asked about passing arguments into a plugin outlet, specifically how to access the actions of a component within a plugin outlet. They provided an example of a composer-action-title component and wanted to add a plugin outlet with the same code. However, using {{plugin-outlet name="cool-outlet" args=(hash model=model)}} didn’t work.

1

A quick question on this.

I noticed something interesting in TLT:

There is no passing of the model here.

Yet you manage to do this:

I can only assume this is a stable strategy for passing down the model properties because it’s being employed here - any caveats?

One of the reasons I was finding these available plugin outlets less useful was because they don’t often explicitly pass down the relevant model.

Is this pattern documented anywhere? I haven’t seen it in the Ember guides …

2

The ‘raw’ system is a discourse-specific thing, so you won’t find anything about it in the Ember guides.

It looks like it’s pretty deliberate in the core code, so I think it’s safe to use it:

In fact, it doesn’t look like raw outlets have the ability to pass anything like the ‘args’ you find in regular plugin-outlets. So context is the only way to go.

Please do feel free to make core PRs if you feel any useful data is missing in regular plugin outlets. Adding new arguments to outlets is relatively safe, backwards compatible, and has negligable performance impact, so it’s unlikely we’ll refuse.

3

I’ve also struggled with passing arguments through to plugin outlets. My goal has been to put a plugin outlet on a page and have the outlet get access to all the information the other component references get on that page.

I tried this in a theme component I am coding:

{{~raw-plugin-outlet name="cool-outlet" args=(hash model=model)}}

But get the error: Compile Error: raw-plugin-outlet is not a helper

Anything else I need to do to get this working?

4

raw-plugin-outlet can only be used within ‘raw’ templates (those ending in .hbr). For regular ember templates, you should use {{plugin-outlet ...}}

5

EDIT: I realized the below is probably better for its own topic. I also realized that the main issue I have is importing the actions of a component into a plugin outlet. I’ve asked a question about it here:

Is there a simpler/standard way to successfully pass arguments into a plugin outlet?

For example:

If in a template there is the following reference to the composer-action-title component, like this:
composer.hbs:

 {{composer-action-title
       model=model
        openComposer=(action "openComposer")
        closeComposer=(action "closeComposer")
        canWhisper=canWhisper
        tabindex=8
  }}

and I wanted to add a plugin outlet that–in that plugin outlet–had the same code, like:

connectors/cool-outlet/cool-outlet.hbs:

 {{composer-action-title
       model=model
        openComposer=(action "openComposer")
        closeComposer=(action "closeComposer")
        canWhisper=canWhisper
        tabindex=8
  }}

What do I need to do to allow my cool-outlet plugin outlet the ability to successfully reference the composer-action-title component?

Using a reference like:
{{plugin-outlet name="cool-outlet" args=(hash model=model)}}
in composer.hbs does not seem to work.