Previously, InviteScholarshipCollaborator was "technically" it's own component. What I mean is that it was in it's own file. What this should've meant was that I'd be able to reuse that component. in ScholarshipAddEdit. However, this wasn't really possible because of the coupling between the InviteScholarshipCollaborator component and it's only use in ScholarhshipManage.
This kind of defeated the point of having it as it's own component if it wasn't reusable.
This also means that just because you move something to a new file, that doesn't mean you have made it a modular component.
To solve this, replaced some bad props and added callback props so that the client of the InviteScholarshipCollaborator decides what to pass in.
Key takeaways
InviteScholarshipCollaboratorwas "technically" it's own component. What I mean is that it was in it's own file. What this should've meant was that I'd be able to reuse that component. inScholarshipAddEdit. However, this wasn't really possible because of the coupling between theInviteScholarshipCollaboratorcomponent and it's only use inScholarhshipManage.InviteScholarshipCollaboratordecides what to pass in.Screenshots