expose component renderers for legacy project #89
Conversation
| } | ||
| } | ||
| }; | ||
| }; |
There was a problem hiding this comment.
Why is this file prefixed with "MSK?"
There was a problem hiding this comment.
Good point. No great reason.
|
|
||
| interface IPatientViewPageProps { | ||
| store?: RootState; | ||
| } | ||
|
|
||
| @MSKPageDecorator |
There was a problem hiding this comment.
This might be a little too fancy, but what this decorator does is disable the page components render function when we detect that we are in the legacy site context. In this context, it's then at the discretion of the legacy code to invoke the renderers which we expose on the window object.
What I like about this solution is that we still have page specific bundles which include all the components for a given page. In dev context, we can render these as per nomal in the page component. But in legacy project, that may not be appropriate because we want to render the components on various places in the page and at various times. This solution allows this freedom.
| @@ -0,0 +1,13 @@ | |||
| import * as React from 'react'; | |||
|
|
|||
| export default function (component: typeof React.Component): any { | |||
There was a problem hiding this comment.
@adufilie , I believe return type of this should be React.Component but when I put that in, I get a weird error that I don't understand. Generic type 'Component<P, S>' requires 2 type argument(s).
There was a problem hiding this comment.
It doesn't matter much. The current decorator type restrictions are a little inconvenient. It wants the return type to be exactly the same as the parameter type.
| @@ -43,7 +44,7 @@ export default class ClinicalInformationContainer extends React.Component<IClini | |||
| return <div>{ this.buildTabs() }</div>; | |||
|
|
|||
| case 'error': | |||
| return <div>There was an error.</div>; | |||
| return <div>There was an loading error. Please try refreshing your browser.</div>; | |||
Added LollipopPlotControlsConfig
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
…vements improvements to custom track options
FixNullErrorInGnomad
What? Why?
As we build components in the new project, we need a good way for code in the legacy project to mount the components in various places on the page. We tried doing this from within the new project, but I realized this isn't sufficient. For example, if we need to mount a component inside a jqueryUI tab in the legacy site. We don't want to do that on page load, but when the tab is shown. That's a key optimization and it would be a step backward to do otherwise. So the legacy project needs to be able to control the mounting of the new components in some cases. Be exposing render functions (which take the target node as arg) on the window object we can grant control to the legacy code.
Checks
can be automatically added by git if you run the
git-commitcommand withthe
-soption)Any screenshots or GIFs?
If this is a new visual feature please add a before/after screenshot or gif
here with e.g. GifGrabber.
Notify reviewers
Read our Pull request merging
policy. If you are part of the
cBioPortal organization, notify the approprate team (remove inappropriate):
@cBioPortal/frontend
If you are not part of the cBioPortal organization look at who worked on the
file before you. Please use
git blame <filename>to determine thatand notify them here: