Skip to content

Commit

Permalink
Disable custom data charts when user is not logged in
Browse files Browse the repository at this point in the history
  • Loading branch information
Nelliney committed Sep 19, 2024
1 parent b1a387c commit 623c623
Showing 1 changed file with 157 additions and 115 deletions.
272 changes: 157 additions & 115 deletions src/pages/studyView/addChartButton/AddChartButton.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@ import { CustomChartData } from 'shared/api/session-service/sessionServiceModels
import ReactSelect from 'react-select';
import { GenericAssayMeta } from 'cbioportal-ts-api-client';
import { DataTypeConstants } from 'shared/constants';
import { Else, If, Then } from 'react-if';

export interface IAddChartTabsProps {
store: StudyViewPageStore;
Expand Down Expand Up @@ -629,6 +630,23 @@ class AddChartTabs extends React.Component<IAddChartTabsProps, {}> {

@computed get notificationMessages() {
let notificationMessages: JSX.Element[] = [];
if (!this.props.store.isLoggedIn) {
notificationMessages.push(
<>
<button
className="btn btn-default btn-xs"
onClick={() =>
openSocialAuthWindow(this.props.store.appStore)
}
>
Login
</button>
&nbsp;to add custom data charts to your profile.
</>
);
return notificationMessages;
}

if (this.props.store.customChartSet.size > 0) {
// Notify if there any shared custom data
if (this.existSharedCustomData) {
Expand All @@ -644,28 +662,6 @@ class AddChartTabs extends React.Component<IAddChartTabsProps, {}> {
are shared custom data.
</>
);
}
// Notify that shared and page-session custom data are not saved for non-logged users
if (
!this.props.store.isLoggedIn &&
this.props.store.appStore.isSocialAuthenticated
) {
if (notificationMessages.length > 0) {
notificationMessages.push(<br />);
}
notificationMessages.push(
<>
<button
className="btn btn-default btn-xs"
onClick={() =>
openSocialAuthWindow(this.props.store.appStore)
}
>
Login
</button>
&nbsp;to save custom data charts to your profile.
</>
);
} else if (this.existSharedCustomData) {
// Notify if shared custom data are saved to user profile
if (notificationMessages.length > 0) {
Expand Down Expand Up @@ -911,104 +907,150 @@ class AddChartTabs extends React.Component<IAddChartTabsProps, {}> {
this.getTabsWidth - CONTAINER_PADDING_WIDTH,
}}
>
{this.customChartDataOptions.length > 0 && (
<button
className="btn btn-primary btn-xs"
onClick={this.onToggleAddNewChart}
>
{this.isAddNewChartWindowVisible
? 'Cancel'
: '+ Add new custom data'}
</button>
)}

{this.isAddNewChartWindowVisible && (
<CustomCaseSelection
allSamples={this.props.store.samples.result}
selectedSamples={
this.props.store.selectedSamples.result
}
submitButtonText={'Add Chart'}
queriedStudies={
this.props.store.queriedPhysicalStudyIds
.result
}
isChartNameValid={
this.props.store.isChartNameValid
}
getDefaultChartName={
this.props.store
.getDefaultCustomChartName
}
disableSubmitButton={this.savingCustomData}
onSubmit={(chart: CustomChartData) => {
this.showAddNewChart = false;
this.savingCustomData = true;
this.updateInfoMessage(
`Saving ${chart.displayName}`
);
this.props.store
.addCustomChart(chart)
.then(() => {
this.savingCustomData = false;
this.updateInfoMessage(
`${chart.displayName} has been added.`
);
});
}}
/>
)}

<>
{this.customChartDataOptions.length > 0 && (
<>
<hr
style={{
marginTop: 10,
marginBottom: 10,
}}
/>
<AddChartByType
width={this.getTabsWidth}
options={
this.customChartDataOptions
}
freqPromise={this.dataCount}
onAddAll={this.onAddAll}
onClearAll={this.onClearAll}
onToggleOption={this.onToggleOption}
hideControls={true}
firstColumnHeaderName="Custom data"
shareCharts={
this.props
.openShareCustomDataUrlModal
}
deleteChart={(id: string) => {
this.props.store.toggleCustomChartMarkedForDeletion(
id
);
}}
restoreChart={(id: string) => {
this.props.store.toggleCustomChartMarkedForDeletion(
id
);
}}
markedForDeletion={
this.props.store
.customChartGroupMarkedForDeletion
}
/>
</>
)}
{this.notificationMessages.length > 0 && (
<If condition={!this.props.store.isLoggedIn}>
<Then>
<>
<br />
<span className="text-warning">
Note: {this.notificationMessages}
Please {this.notificationMessages}
</span>
</>
)}
</>
</Then>
<Else>
<div>
{this.customChartDataOptions.length >
0 && (
<button
className="btn btn-primary btn-xs"
onClick={
this.onToggleAddNewChart
}
>
{this.isAddNewChartWindowVisible
? 'Cancel'
: '+ Add new custom data'}
</button>
)}

{this.isAddNewChartWindowVisible && (
<CustomCaseSelection
allSamples={
this.props.store.samples
.result
}
selectedSamples={
this.props.store
.selectedSamples.result
}
submitButtonText={'Add Chart'}
queriedStudies={
this.props.store
.queriedPhysicalStudyIds
.result
}
isChartNameValid={
this.props.store
.isChartNameValid
}
getDefaultChartName={
this.props.store
.getDefaultCustomChartName
}
disableSubmitButton={
this.savingCustomData
}
onSubmit={(
chart: CustomChartData
) => {
this.showAddNewChart = false;
this.savingCustomData = true;
this.updateInfoMessage(
`Saving ${chart.displayName}`
);
this.props.store
.addCustomChart(chart)
.then(() => {
this.savingCustomData = false;
this.updateInfoMessage(
`${chart.displayName} has been added.`
);
});
}}
/>
)}

<>
{this.customChartDataOptions
.length > 0 && (
<>
<hr
style={{
marginTop: 10,
marginBottom: 10,
}}
/>
<AddChartByType
width={
this.getTabsWidth
}
options={
this
.customChartDataOptions
}
freqPromise={
this.dataCount
}
onAddAll={this.onAddAll}
onClearAll={
this.onClearAll
}
onToggleOption={
this.onToggleOption
}
hideControls={true}
firstColumnHeaderName="Custom data"
shareCharts={
this.props
.openShareCustomDataUrlModal
}
deleteChart={(
id: string
) => {
this.props.store.toggleCustomChartMarkedForDeletion(
id
);
}}
restoreChart={(
id: string
) => {
this.props.store.toggleCustomChartMarkedForDeletion(
id
);
}}
markedForDeletion={
this.props.store
.customChartGroupMarkedForDeletion
}
/>
</>
)}
{this.notificationMessages.length >
0 && (
<>
<br />
<span className="text-warning">
Note:{' '}
{
this
.notificationMessages
}
</span>
</>
)}
</>
</div>
</Else>
</If>
</div>
</MSKTab>
<MSKTab
Expand Down

0 comments on commit 623c623

Please sign in to comment.