💡 [Feature]: Show some additional setup steps in scaffolding form based on component type

[Adam-it]

🎯 Aim of the feature

The aim of this issue is to show some additional setup options based on component type:

• property pane controls should only be visible for webpart components
• reusable react controls should not be visible for an ACE project
• for extension application customizer we should show an option to install default react libraries as it is not that case but most of the times this is just a placeholder for more UI to the site
• .... other, as part of this issue we should maybe do some more thinking or research among the community

📷 Images (if possible) with expected result

🤔 Additional remarks or comments

parent issue: #185

[Maiconjss]

Hello! I'm going to work on this functionality, is there any other detail you would like?

[Adam-it]

Hello! I'm going to work on this functionality, is there any other detail you would like?

Awesome 👏.
What kind of detail do you expect 😅? Please do ask if anything is not clear 🙏

[Adam-it]

Hi @Maiconjss
Hows the work coming up with this issue?
Do you need any additional help from my side?
This year the SPFx Toolkit repo will participate in hacktoberfest and this issue will count so if you are also planning to join this event please do remember to rise a PR during October (no sooner no later 😉)

[Maiconjss]

Hi,
I will definitely submit a PR in October! Apologies for the delay, and thank you for your trust and patience. Looking forward to contributing to the Hacktoberfest event! 😊

[Adam-it]

Hi, I will definitely submit a PR in October! Apologies for the delay, and thank you for your trust and patience. Looking forward to contributing to the Hacktoberfest event! 😊

@Maiconjss any update on this issue? Do you need any additional help from my side to get you unblocked?
If something changed please and you may not commit to this issue please do let me know so that we may open it up for other 👍

[Adam-it]

@Maiconjss any update on this issue? Do you need any additional help from my side to get you unblocked?
If something changed please and you may not commit to this issue please do let me know so that we may open it up for other 👍

[Adam-it]

@Maiconjss due to lack of response I will open it up so that it may be taken by others.
If anything would change from your side please let me know to get reassign

[ervingayle]

Hi @Adam-it. Can I take this one?
Do you have any additional information on what you expect to see for Extensions in terms of options or anything else?

[Adam-it]

Hi @Adam-it. Can I take this one? Do you have any additional information on what you expect to see for Extensions in terms of options or anything else?

All yours!
Well me brainstorm a bit about it together.
For sure I suggest that Reusable property pane controls should only show for WebPart project type. So I would hide this for Extensions and ACEs
Not so long ago ACEs UI was only defined in JSON (only last updated now provides us with HTML view we may add 🤔) but maybe it makes sense to hide the react reusable controls as those also target either webparts or extensions with some UI rather then ACE project.

Do you suggest any other behavior?

[ervingayle]

This makes sense to me. In the original post for this, you mentioned that we should show an option for installing the default React libraries when the Extension option is selected. Is this still the case?

[Adam-it]

This makes sense to me. In the original post for this, you mentioned that we should show an option for installing the default React libraries when the Extension option is selected. Is this still the case?

yes. Initially I was thinking about it yes. If it's problematic we may avoid it but I was thinking that when we create and extension which is ApplicationCustomizer we would also show an option to install React and React-dom
From my experience ApplciationCustomizer extension often are created to show/render some UI and often React is used for that.
By default it is not possible to scaffold applciationCustomizer with React using yo generator and you need to add in 'manually' by yourself. This creates many problems and many times it is done wrongly.
I noticed many issues around that like this
SharePoint/sp-dev-docs#2192
or
SharePoint/sp-dev-docs#7050

At that time I had a discussion with MS if maybe they should add this support for application customizer as an optional step as part of yeoman SP generator but from what I understood there is suppose to be as little as possible development done in the scaffolding process from their side as it is not the focus currently. So it is a bit of the problem and it was clear to me either the community solves it or no one will and we just would need to prepare good guidance for that.

Soo to sum up. The above is the context as of why I added this idea as well, to solve and target a specific case many us SPFx devs have. But over time maybe this changed 🤔.
What is your take on that? We may avoid it for now and create a follow up issue to add that later on and first to a bit of research and ask around the community if something like this would be helpful

[ervingayle]

Yes, I agree regarding the conditional logic for the options that should be displayed based on the component types. Also, I really like the idea that you mention here and in the original spec about React as a dependency for the Extension type and an update that provides this would provide some ease of use to the community while using the extension. I reviewed the two issues, and it makes sense. My changes are ready and I will check it in shortly. I can remove the install React option if you feel that should be a separate issue. Also, I targeted [email protected] as that is best to be tied to SPFx 1.20.

[Adam-it]

Yes, I agree regarding the conditional logic for the options that should be displayed based on the component types. Also, I really like the idea that you mention here and in the original spec about React as a dependency for the Extension type and an update that provides this would provide some ease of use to the community while using the extension. I reviewed the two issues, and it makes sense. My changes are ready and I will check it in shortly. I can remove the install React option if you feel that should be a separate issue. Also, I targeted [email protected] as that is best to be tied to SPFx 1.20.

Awesome, thanks for update 🚀
You Rock 🤩

[Adam-it]

@ervingayle I merged the changes. This should be out as a new pre-release ASAP 👍 and the part of a new main release later during the week.
Thank You for contributing and helping us make the best SPFx Tooling in the world. You Rock 🤩
BTW did you opt-in our PnP Recognition program?
For this contribution you may obtain an SPFx Toolkit badge