Multiple Component Instances - Circular Reference Error

[james_hathaway]

I have been experimenting with Components in order to make some very useful reusable controls.

I have created a Component that is basically a Gallery of Buttons - it has input Parameters of "Items" (Single column Table of Text values) and "Default" (Text) - and an Output Parameter "Selected" (Text) to show the selected Gallery Item - This is a common pattern used to create Menu Components that can be re-used on multiple screens.

I am using 2 instances of this Component to make a Menu -> Sub-Menu arragement, with the Sub-Menu showing a filtered list of sub-menu Items that are applicable to the Selected Menu Item - (I have a Collection that describes the 1:N relationship)

Component_Instance_1.Items = ["New", "In Progress", "Complete"]

(So the Component_Instance_1.Selected will be something like "New")

RelationshipCollection = [

     {Stage: "New", SubStage: "Investigating"},

     {Stage: "New", SubStage: "Validating"},

     {Stage: "In Progress", SubStage: "Step 1"},

     {Stage: "In Progress", SubStage: "Step 2"},

    .... etc

]

ComponentInstance_2.Items =

   RenameColumns(

     ShowColumns(

         Filter(RelationshipCollection, Stage=Component_Instance_1.Selected),

     "SubStage"),

   "Result","Value")

You should be able to ignore the RenameColumns and ShowColumns aspect - this just turns the filtered list into a single columns of text values - plus, I have tried MANY different methods of creating this table for the SubStage component - the only issue is the Filter Formula - I am getting a Circular Reference Error, even though there is NOT any circular reference.

I believe it must be a limitation of the components functionality, as the only real reason I can think of that a circular reference is created is within the Root Component, as I am setting the "Items" input parameter to the "Selected" output parameter - even thought I am doing this accross 2 seperate instances of the component, PowerApps is throwing this circular reference error.

I have tried all sorts of workarounds, like using an intermediate textbox or label to hold the selected value of the first component instance, but when that new control is referenced in the 2nd component instance, the same circuilar reference error pops up)

Has anyone else had issues with this behaviour?

Does anyone know a viable workaround that I might not have tried yet?

Can someone from MS confirm if this is a Bug in the Components functionality?

And if So, can you let us know when it might be fixed?

Thanks in Advance.

James.

[mdevaney]

@james_hathaway 

Components are still considered an experimental feature and this is likely a bug.  To make matters more confusing there are currently some widespread issues with components + global variables.  Suggest you raise a support ticket.

---
Please click "Accept as Solution" if my post answered your question so that others may find it more quickly. If you found this post helpful consider giving it a "Thumbs Up."

[ShantanuP]

@james_hathaway This looks like a bug in component. More investigation is needed. But you are correct. There should not be any circular reference between different instances. The only work around is to have duplicate component definitions and use those.

[dave-jorgensen]

Any idea when this bug will be fixed?

[ShantanuP]

I think this should be fixed in latest release v3.20052. You will need to re-import the component in your scenario. Are you still seeing the issue?

[dave-jorgensen]

I came across this error today. Only started building the components last week. So that would be a yes, this is still a bug in Components. Have you tried testing to replicate the bug at Microsoft?

[RandyHayes]

@ShantanuP 
Well,  v3.20052 came and went.   Now into v3.21xxx and still this problem exists.  Pretty much makes components worthless if you need more than one....but then if you only need one instance, why create a component??

Giving up hope on components!! 

Please update on status of this bug if you are able to.

[BeamMeUpScottyT]

There are still similar issues with components - setting an input property on one instance sets the same value across all instances. See the headers below, they are the same component with input properties to set the image and text and even though they have different values only one set of values "wins".

[RandyHayes]

@BeamMeUpScottyT 

Yes, components are VERY useful but EXTREMELY problematic. 

You should not be seeing that particular issue.  I use many instances of components with each having their own input property settings and they all work fine. 

The problems start to come in if you have any sort of variables in use in the components.  

So, in general, all of our components are designed to never need variables be used in them.  They all work great then.

HOWEVER....here is one that I noticed yesterday in an app that sounds like something you might be seeing.

I had a screen with about 12 instances of a component.  Each had unique input properties and they all displayed just fine.  I decided to rename them all in the screen in order to reference them better.  As soon as I renamed one of them, ALL of them then changed to reflect the values of the component I just renamed.  YET, if I looked at the component that was now incorrect - it's properties were all fine still, but it was showing the values in it that were from the component I just renamed.  I scratched my head for a while and then chalked it up to "yet another component oddity".  So, I continued to rename them.  Each one that I renamed, then became what all the others changed to.  Once done, I saved and closed the app, then reopened....and...everything was back to normal and they were all renamed and acting properly.

Moral of the story is, with components, there are a lot of times that you need to save and then close and get back in.

In fact, another horror story was that an app with a component worked fine.  Was able to design and save the app in general.  I made one change to one component (removed a property that was no longer needed or used), went to save and it failed to save!!  It would not even allow to save to computer!!  There was no recourse except to lose all changed and exit.  I then found that if I duplicated the component, then deleted the original, then renamed the duplicate back to the original, then made the property change...everything saved just fine!  Go figure!

Moral of this story - if you've made other changes in your app and then want to make some component changes...SAVE your app before you do as you might lose all the other changes.

Components are just so powerful and useful that it is hard to just walk away from them even though they are so darn quirky!

[dave-jorgensen]

I've noticed that the same issue you're seeing with renaming the components happens when you add another copy of the component. IE, Add Component, works fine. Add second component of the same type, both will show the same values. Close app and re-open, both work fine. Add 3rd copy of same component, all show same values. Save and close app, re-open, all work fine