Skip to content

Commit

Permalink
made-seperate-export-function
Browse files Browse the repository at this point in the history
  • Loading branch information
@SURAJ-SHARMA27
SURAJ-SHARMA27 committed Aug 9, 2024
1 parent eb6d505 commit 659c4ad
Show file tree
Hide file tree
Showing 3 changed files with 53 additions and 80 deletions.
44 changes: 9 additions & 35 deletions src/pages/groupComparison/MultipleCategoryBarPlot.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ import {
makePlotData,
makeBarSpecs,
sortDataByCategory,
getSortedMajorCategories,
} from '../../shared/components/plots/MultipleCategoryBarPlotUtils';
import * as ReactDOM from 'react-dom';
import { Popover } from 'react-bootstrap';
Expand Down Expand Up @@ -58,7 +59,7 @@ export interface IMultipleCategoryBarPlotProps {
svgRef?: (svgContainer: SVGElement | null) => void;
pValue: number | null;
qValue: number | null;
SortByDropDownOptions?: { value: string; label: string }[];
sortByDropDownOptions?: { value: string; label: string }[];
updateDropDownOptions?: (
option: { value: string; label: string }[]
) => void;
Expand Down Expand Up @@ -430,43 +431,16 @@ export default class MultipleCategoryBarPlot extends React.Component<

@computed get labels() {
if (this.data.length > 0) {
if (this.props.sortByOption == 'SortByTotalSum') {
const majorCategoryCounts: any = {};

this.data.forEach(item => {
item.counts.forEach(countItem => {
const { majorCategory, count } = countItem;
if (!majorCategoryCounts[majorCategory]) {
majorCategoryCounts[majorCategory] = 0;
}
majorCategoryCounts[majorCategory] += count;
});
});
const sortedMajorCategories = Object.keys(
majorCategoryCounts
).sort(
(a, b) => majorCategoryCounts[b] - majorCategoryCounts[a]
);
return sortedMajorCategories;
} else if (
this.props.sortByOption != '' &&
this.props.sortByOption != 'alphabetically'
if (
this.props.sortByOption === 'SortByTotalSum' ||
(this.props.sortByOption !== '' &&
this.props.sortByOption !== 'alphabetically')
) {
const sortedEntityData = this.data.find(
item => item.minorCategory === this.props.sortByOption
return getSortedMajorCategories(
this.data,
this.props.sortByOption
);
if (sortedEntityData) {
// Sorting the counts array of the sortedEntity
sortedEntityData.counts.sort((a, b) => b.count - a.count);

// Get the sorted order of major categories
const sortedMajorCategories = sortedEntityData.counts.map(
item => item.majorCategory
);
return sortedMajorCategories;
}
}

return sortDataByCategory(
this.data[0].counts.map(c => c.majorCategory),
x => x,
Expand Down
71 changes: 35 additions & 36 deletions src/shared/components/plots/MultipleCategoryBarPlotUtils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,11 +98,11 @@ export function sortDataByCategory<D>(
}
});
}
function sortDataByOption(
export function getSortedMajorCategories(
data: IMultipleCategoryBarPlotData[],
sortByOption: string
): IMultipleCategoryBarPlotData[] {
if (sortByOption == 'SortByTotalSum') {
sortByOption: string | undefined
): string[] {
if (sortByOption === 'SortByTotalSum') {
const majorCategoryCounts: any = {};

data.forEach(item => {
Expand All @@ -114,10 +114,30 @@ function sortDataByOption(
majorCategoryCounts[majorCategory] += count;
});
});
const sortedMajorCategories = Object.keys(majorCategoryCounts).sort(

return Object.keys(majorCategoryCounts).sort(
(a, b) => majorCategoryCounts[b] - majorCategoryCounts[a]
);
} else if (sortByOption !== '' && sortByOption !== 'alphabetically') {
const sortedEntityData = data.find(
item => item.minorCategory === sortByOption
);
if (sortedEntityData) {
sortedEntityData.counts.sort((a, b) => b.count - a.count);

return sortedEntityData.counts.map(item => item.majorCategory);
}
}

return [];
}
export function sortDataByOption(
data: IMultipleCategoryBarPlotData[],
sortByOption: string
): IMultipleCategoryBarPlotData[] {
const sortedMajorCategories = getSortedMajorCategories(data, sortByOption);

if (sortByOption === 'SortByTotalSum' || sortedMajorCategories.length > 0) {
const reorderCounts = (counts: any) => {
return sortedMajorCategories.map(category => {
return counts.find(
Expand All @@ -129,37 +149,16 @@ function sortDataByOption(
data.forEach(item => {
item.counts = reorderCounts(item.counts);
});
return data;
}

const sortedEntityData = data.find(
item => item.minorCategory === sortByOption
);
if (sortedEntityData) {
sortedEntityData.counts.sort((a, b) => b.count - a.count);
const sortedMajorCategories = sortedEntityData.counts.map(
item => item.majorCategory
);
data.forEach(item => {
if (item.minorCategory !== sortByOption) {
const countMap: { [key: string]: any } = {};
item.counts.forEach(count => {
countMap[count.majorCategory] = count;
});
item.counts = sortedMajorCategories.map(
category =>
countMap[category] || {
majorCategory: category,
count: 0,
percentage: 0,
}
);
if (sortByOption !== 'SortByTotalSum') {
const sortedEntityData = data.find(
item => item.minorCategory === sortByOption
);
if (sortedEntityData) {
data = data.filter(item => item.minorCategory !== sortByOption);
data.unshift(sortedEntityData);
}
});

// Move the sortedEntityData to the front
data = data.filter(item => item.minorCategory !== sortByOption);
data.unshift(sortedEntityData);
}
}

return data;
Expand Down Expand Up @@ -188,8 +187,8 @@ export function makeBarSpecs(
}[] {
if (
sortByOption &&
sortByOption != '' &&
sortByOption != 'alphabetically'
sortByOption !== '' &&
sortByOption !== 'alphabetically'
) {
data = sortDataByOption(data, sortByOption);
} else {
Expand Down
18 changes: 9 additions & 9 deletions src/shared/components/plots/PlotsTab.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -440,8 +440,8 @@ export default class PlotsTab extends React.Component<IPlotsTabProps, {}> {
private dummyScrollPane: HTMLDivElement;
private scrollingDummyPane = false;
@observable plotElementWidth = 0;
@observable SortByDropDownOptions: { value: string; label: string }[] = [];
@observable sortByOption: string = '';
@observable sortByDropDownOptions: { value: string; label: string }[] = [];
@observable sortByOption: string = 'alphabetically';
@observable boxPlotSortByMedian = false;
@observable.ref searchCaseInput: string;
@observable.ref searchMutationInput: string;
Expand All @@ -465,13 +465,13 @@ export default class PlotsTab extends React.Component<IPlotsTabProps, {}> {
@observable _vertGenericAssaySearchText: string = '';

private defaultOptions = [
{ value: 'SortByTotalSum', label: '# samples' },
{ value: 'alphabetically', label: 'Alphabetically' },
{ value: 'SortByTotalSum', label: 'Number of samples' },
];

@action.bound
private updateDropDownOptions(option: { value: string; label: string }[]) {
this.SortByDropDownOptions = [...this.defaultOptions, ...option];
this.sortByDropDownOptions = [...this.defaultOptions, ...option];
}

@action.bound
Expand Down Expand Up @@ -4457,7 +4457,7 @@ export default class PlotsTab extends React.Component<IPlotsTabProps, {}> {
name="Sort By"
value={this.sortByOption}
onChange={this.handleSortByChange}
options={this.SortByDropDownOptions}
options={this.sortByDropDownOptions}
clearable={false}
searchable={true}
placeholder="Sort by..."
Expand Down Expand Up @@ -5432,13 +5432,13 @@ export default class PlotsTab extends React.Component<IPlotsTabProps, {}> {
horizontalBars={this.horizontalBars}
percentage={isPercentage}
stacked={isStacked}
SortByDropDownOptions={
this?.SortByDropDownOptions
sortByDropDownOptions={
this.sortByDropDownOptions
}
updateDropDownOptions={
this?.updateDropDownOptions
this.updateDropDownOptions
}
sortByOption={this?.sortByOption}
sortByOption={this.sortByOption}
/>
);
}
Expand Down

0 comments on commit 659c4ad

Please sign in to comment.