Skip to content

Commit

Permalink
Merge pull request #1244 from CBIIT/bugfix/icdc-3778
Browse files Browse the repository at this point in the history
sample profile x-axis fix
  • Loading branch information
ty-esi authored Dec 13, 2024
2 parents fc5ecda + 259ad5f commit f5572ef
Show file tree
Hide file tree
Showing 4 changed files with 32 additions and 12 deletions.
12 changes: 9 additions & 3 deletions src/bento/studyDetailsData.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -36,16 +36,22 @@ export const sampleProfile = {
{
index: 0,
label: <div style={sampleProfileTabTextStyle}>SITE</div>,
xAxisLabel: 'Sample site',
yAxisLabel: 'Sample count',
value: 'studySampleSiteCount',
},
{
index: 1,
label: <div style={sampleProfileTabTextStyle}>TYPE</div>,
xAxisLabel: 'Sample type',
yAxisLabel: 'Sample count',
value: 'studySampleTypeCount',
},
{
index: 2,
label: <div style={sampleProfileTabTextStyle}>PATHOLOGY</div>,
xAxisLabel: 'Sample pathology',
yAxisLabel: 'Sample count',
value: 'studySamplePathologyCount',
},
],
Expand Down Expand Up @@ -74,13 +80,13 @@ export const palette = [
'#02ad0f',
];

export const argumentConfiguration = {
export const argumentConfiguration = (text: string) => ({
field: 'group',
visible: false,
position: 'inside',
size: 12,
title: {
text: 'Sample site',
text,
size: 14,
family: 'Inter',
weight: '500',
Expand All @@ -91,7 +97,7 @@ export const argumentConfiguration = {
position: 'inside',
staggeringSpacing: 10,
},
};
});
export const valueConfiguration = {
field: 'count',
size: 12,
Expand Down
2 changes: 1 addition & 1 deletion src/pages/study/views/SampleProfile.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -149,7 +149,7 @@ const SampleProfile: React.FC<SampleProfileProps> = ({ data }) => {
data={data[item.value as keyof StudyQuery]}
palette={palette}
tooltipContent={tooltipContent}
argument={argumentConfiguration}
argument={argumentConfiguration(item.xAxisLabel)}
value={valueConfiguration}
/>
</div>
Expand Down
19 changes: 12 additions & 7 deletions src/pages/study/views/sample-profile-madal.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
/* eslint-disable @typescript-eslint/no-misused-promises */
import React from 'react';
import { BarChartV2 } from '../../../components/BarChartV2';
Expand Down Expand Up @@ -39,13 +40,17 @@ const SampleProfileModal: React.FC<SampleProfileModalProps> = ({
studyCode,
accessionId,
}) => {
const [{ isModalOpen }, { setIsModalOpen }] = useSampleProfileModal();
const [value, setValue] = React.useState('1');
const [{ isModalOpen, currentTab }, { setIsModalOpen, setCurrentTab }] =
useSampleProfileModal();

const [, actions] = useDashboardTabs();
const filterStudy = `${studyCode} (${accessionId})`;

const handleTabChange = (event: React.SyntheticEvent, newValue: string) => {
setValue(newValue);
const handleTabChange = async (
event: React.SyntheticEvent,
newValue: string
) => {
await setCurrentTab(newValue);
};

const showModal = async () => {
Expand Down Expand Up @@ -87,7 +92,7 @@ const SampleProfileModal: React.FC<SampleProfileModalProps> = ({
</IconButton>
</StyledDialogTitle>
<StyledDialogContent>
<TabContext value={value}>
<TabContext value={currentTab}>
<Box sx={{ height: '100%' }}>
<Box
sx={{
Expand Down Expand Up @@ -198,8 +203,8 @@ const SampleProfileModal: React.FC<SampleProfileModalProps> = ({
<BarChartV2
chartData={data[item.value as keyof StudyQuery]}
palette={palette}
yAxisLabel="Sample count"
xAxisLabel="Sample site"
yAxisLabel={item.yAxisLabel}
xAxisLabel={item.xAxisLabel}
/>
</StyledTabPanel>
);
Expand Down
11 changes: 10 additions & 1 deletion src/pages/study/views/sample-profile-modal-store.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,27 @@ import { createStore, createHook, Action } from 'react-sweet-state';

type State = {
isModalOpen: boolean;
currentTab: string;
};

const initialState: State = {
isModalOpen: false,
currentTab: '1',
};

const actions = {
setIsModalOpen:
(isModalOpen: boolean): Action<State> =>
({ setState }) => {
setState({
isModalOpen: isModalOpen,
isModalOpen,
});
},
setCurrentTab:
(currentTab: string): Action<State> =>
({ setState }) => {
setState({
currentTab,
});
},
};
Expand Down

0 comments on commit f5572ef

Please sign in to comment.