Skip to content

Sriamsh - Added sorting functionality for Bought, Used, Available, and Wasted columns. #4460

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
one-community merged 1 commit into from
Feb 13, 2026
Merged

Sriamsh - Added sorting functionality for Bought, Used, Available, and Wasted columns. #4460

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
78 changes: 75 additions & 3 deletions src/components/BMDashboard/ItemList/ItemsTable.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,13 @@
sortOrder: 'default',
});

const [boughtCol, setBoughtCol] = useState({ iconsToDisplay: faSort, sortOrder: 'default' });
const [usedCol, setUsedCol] = useState({ iconsToDisplay: faSort, sortOrder: 'default' });
const [availableCol, setAvailableCol] = useState({
iconsToDisplay: faSort,
});
const [wastedCol, setWastedCol] = useState({ iconsToDisplay: faSort, sortOrder: 'default' });

useEffect(() => {
setData(filteredItems);
}, [filteredItems]);
Expand All @@ -50,7 +57,7 @@
setRecordType(type);
};

const sortData = columnName => {

Check failure on line 60 in src/components/BMDashboard/ItemList/ItemsTable.jsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

Refactor this function to reduce its Cognitive Complexity from 24 to the 15 allowed. 


See more on https://sonarcloud.io/project/issues?id=OneCommunityGlobal_HighestGoodNetworkApp&issues=AZrCLF4HI7FfbRtxg4dM&open=AZrCLF4HI7FfbRtxg4dM&pullRequest=4460
const newSortedData = [...sortedData];

if (columnName === 'ProjectName') {
Expand Down Expand Up @@ -79,14 +86,67 @@
}
setProjectNameCol({ iconsToDisplay: faSort, sortOrder: 'default' });
}
// Sorting for Bought
if (columnName === 'Bought') {
if (boughtCol.sortOrder === 'default' || boughtCol.sortOrder === 'desc') {
newSortedData.sort((a, b) => (a.stockBought || 0) - (b.stockBought || 0));
setBoughtCol({ iconsToDisplay: faSortUp, sortOrder: 'asc' });
} else {
newSortedData.sort((a, b) => (b.stockBought || 0) - (a.stockBought || 0));
setBoughtCol({ iconsToDisplay: faSortDown, sortOrder: 'desc' });
}
resetOtherDynamicColumns('Bought');
}

// Sorting for Used
if (columnName === 'Used') {
if (usedCol.sortOrder === 'default' || usedCol.sortOrder === 'desc') {
newSortedData.sort((a, b) => (a.stockUsed || 0) - (b.stockUsed || 0));
setUsedCol({ iconsToDisplay: faSortUp, sortOrder: 'asc' });
} else {
newSortedData.sort((a, b) => (b.stockUsed || 0) - (a.stockUsed || 0));
setUsedCol({ iconsToDisplay: faSortDown, sortOrder: 'desc' });
}
resetOtherDynamicColumns('Used');
}

// Sorting for Available
if (columnName === 'Available') {
if (availableCol.sortOrder === 'default' || availableCol.sortOrder === 'desc') {
newSortedData.sort((a, b) => (a.stockAvailable || 0) - (b.stockAvailable || 0));
setAvailableCol({ iconsToDisplay: faSortUp, sortOrder: 'asc' });
} else {
newSortedData.sort((a, b) => (b.stockAvailable || 0) - (a.stockAvailable || 0));
setAvailableCol({ iconsToDisplay: faSortDown, sortOrder: 'desc' });
}
resetOtherDynamicColumns('Available');
}

// Sorting for Wasted
if (columnName === 'Wasted') {
if (wastedCol.sortOrder === 'default' || wastedCol.sortOrder === 'desc') {
newSortedData.sort((a, b) => (a.stockWasted || 0) - (b.stockWasted || 0));
setWastedCol({ iconsToDisplay: faSortUp, sortOrder: 'asc' });
} else {
newSortedData.sort((a, b) => (b.stockWasted || 0) - (a.stockWasted || 0));
setWastedCol({ iconsToDisplay: faSortDown, sortOrder: 'desc' });
}
resetOtherDynamicColumns('Wasted');
}
setData(newSortedData);
};

const getNestedValue = (obj, path) => {
return path.split('.').reduce((acc, part) => (acc ? acc[part] : null), obj);
};

const resetOtherDynamicColumns = active => {
if (active !== 'Bought') setBoughtCol({ iconsToDisplay: faSort, sortOrder: 'default' });
if (active !== 'Used') setUsedCol({ iconsToDisplay: faSort, sortOrder: 'default' });
if (active !== 'Available') setAvailableCol({ iconsToDisplay: faSort, sortOrder: 'default' });
if (active !== 'Wasted') setWastedCol({ iconsToDisplay: faSort, sortOrder: 'default' });
};

return (
<>
<RecordsModal
Expand Down Expand Up @@ -115,9 +175,21 @@
) : (
<th>Name</th>
)}
{dynamicColumns.map(({ label }) => (
<th key={label}>{label}</th>
))}
{dynamicColumns.map(({ label }) => {

Check warning on line 178 in src/components/BMDashboard/ItemList/ItemsTable.jsx

View check run for this annotation

SonarQubeCloud / SonarCloud Code Analysis

'dynamicColumns.map' is missing in props validation 


See more on https://sonarcloud.io/project/issues?id=OneCommunityGlobal_HighestGoodNetworkApp&issues=AZrCLF4HI7FfbRtxg4dN&open=AZrCLF4HI7FfbRtxg4dN&pullRequest=4460
const stateMap = {
Bought: boughtCol,
Used: usedCol,
Available: availableCol,
Wasted: wastedCol,
};

return (
<th key={label} onClick={() => sortData(label)}>
{label}{' '}
<FontAwesomeIcon icon={stateMap[label]?.iconsToDisplay || faSort} size="lg" />
</th>
);
})}
<th>Usage Record</th>
<th>Updates</th>
<th>Purchases</th>
Expand Down
Loading