Bug: Dynamic Assignment Demo Page Not Loading #2252

Activity

1. crayolakat

   added

   C-bugType: BugType: Bug

   on Dec 24, 2022
2. zachblume commented on Jan 4, 2023

   

   zachblume

   on Jan 4, 2023

   Last edited by zachblume

   More actions

   I checked out the current version 2e8c479ef7e4071bc903bdf882334488b50f2910 yesterday. /demo/dyn is not rendering anything as you said and there are console errors. I inserted console.debugs through the code of /syc/components/assignmenttexter/controls and prevented undefined variables being called until I got the page to render. DemoTexterDynAssign is assigned test data "d" and preventing undefined variable object access got most of the way but adding testData.d.contact={} let the page render (it rendered a page as if there was no contact properly loaded). Then I realized there was no siodebar rendering, and even more none of the 4 sidebar tests mentioned in HOWTO-use-texter-sideboxes.md (/demo/text.../demo/reply...etc) render a sidebar.

   I checked out commit d6f228d42b5ca08e76048760b7bfa2852d19c532 because that is the first commit of the how-to file we have been referencing so I figured it must've worked then, and the sidebars are present in /demo/text, /demo/reply, and /demo/reply2 but /demo/dyn is not loading as far as I can tell. However, this commit was issuing "webpack: Failed to compile." errors on initial "yarn dev" -- running the home page at localhost:3000 only gave a few dozen errors but running any of the demos was churning out thousands of errors. But those seem like potentially commit-specific issues that have been fixed. /demo/dyn fails on this commit with:

   Uncaught TypeError: Cannot read properties of undefined (reading 'roles')
       at Object.showSidebox (react-component.js:24:17)
       at components.js:58:35
       at Array.filter (<anonymous>)
       at getSideboxes (components.js:51:6)
       at ContactController.render (ContactController.jsx:520:30)
       at ContactController.<anonymous> (makeAssimilatePrototype.js:15:1)
       at ReactCompositeComponent.js:793:1
       at measureLifeCyclePerf (ReactCompositeComponent.js:73:1)
       at ReactCompositeComponentWrapper._renderValidatedComponentWithoutOwnerOrContext (ReactCompositeComponent.js:792:1)
       at ReactCompositeComponentWrapper._renderValidatedComponent (ReactCompositeComponent.js:819:1)
   

   The investigation continues...

   This is my first open source contribution! Bear with me...
3. zachblume commented on Jan 4, 2023

   

   zachblume

   on Jan 4, 2023

   Last edited by zachblume

   More actions

   < AssignmentTexterContactControls > expects a prop passed from parent as props.enabledSideboxes, but it's undefined

   In these current demos, the only parent components of Controls is AssignmentTexterContactControls,DemoTexterTest,main,TexterDashboard, and the theme+context+app+router+apollo providers. Seems like the right prop isn't being passed and perhaps a previous refactor requires a new parent to be rendered around AssignmentTexterContactControls?

   Or perhaps for these demos we just have to manually give this value
4. zachblume commented on Jan 4, 2023

   

   zachblume

   on Jan 4, 2023

   More actions

   OK. I got the sideboxes to render in /demo/text, /demo/reply, and /demo/reply2 by injecting most of the code that prepares const enabledSideboxes = getSideboxes(...) from < ContactController >.render ... into Demo.generateDemoTexterContact.DemoTexterTest ... but this makes it seem like we should be rendering ContactController instead of AssignmentTexterContactControls in Demo.

   Possible that there's similar missing context from /demo/dyn that is preventing dynamic loading or a simulated version from happening?
5. zachblume commented on Jan 4, 2023

   

   zachblume

   on Jan 4, 2023

   More actions

   By (1) providing enabledSideboxes as mentioned above and (2) more thoroughly tracing and preventing undefined variables from throwing fatal errors, I got rendering to finish on /demo/dyn. Then I realized I don't know the exact expected correct result that is actually being demonstrated here so I may be stuck, but I'll go check documentation etc.

   
6. zachblume commented on Jan 4, 2023

   

   zachblume

   on Jan 4, 2023

   Last edited by zachblume

   More actions

   One more quick note as I think, I don't see any way around either (1) making these undefined variables go gracefully for demo purposes or (2) changing the toplevel component being rendered. Demo.jsx renders < AssignmentTexterContactControls > and its Constructor directly calls props.contact.questionResponseValues.forEach even though the testData.d leaves .contact which gets passed as props.contact undefined. When I pull up the actual development build and create a dynamic campaign and run out of contacts, in fact < AssignmentTexterContactControls > is not rendered at all, but just TexterSidebox inside ContactController, making me think that rendering < AssignmentTexterContactControls > with null contacts is now a bad demo.

   

   
7. zachblume commented on Jan 4, 2023

   

   zachblume

   on Jan 4, 2023

   Last edited by zachblume

   More actions

   By doing a conditional render of < ContactController > instead of < AssignmentTexterContactControls > for just /demo/dyn, the demo returns the production-style full screen "sidebox list" that presents the user with a request for new batch of texts. So I'm pretty sure that solves the remaining issue here as long as the following screen should also be the correct behavior for /demo/dyn ?

   
8. mau11

   added

   SV-follow-up

   on Jul 17, 2024