chore: sort() modifies the original array, so clone first (#106)

src/CalculationDetail/CalculationDetail.tsx

@@ -89,7 +89,7 @@ const CalculationDetailMeta = (props: { attributeId: number; attribute: ShipSnap
   const eveData = React.useContext(EveDataContext);
 
   const eveAttribute = eveData.dogmaAttributes?.[props.attributeId];
-  const sortedEffects = props.attribute.effects.sort((a, b) => {
+  const sortedEffects = Object.values(props.attribute.effects).sort((a, b) => {
     const aIndex = Object.keys(EffectOperatorOrder).indexOf(a.operator);
     const bIndex = Object.keys(EffectOperatorOrder).indexOf(b.operator);
     if (aIndex === -1 || bIndex === -1) {

src/HardwareListing/HardwareListing.tsx

@@ -46,7 +46,7 @@ const ModuleGroup = (props: { level: number; group: ListingGroup; hideGroup?: bo
   const getChildren = React.useCallback(() => {
     return (
       <>
-        {props.group.items
+        {Object.values(props.group.items)
           .sort((a, b) => a.meta - b.meta || a.name.localeCompare(b.name))
           .map((item) => {
             if (item.slotType === "charge") {
@@ -386,7 +386,7 @@ export const HardwareListing = () => {
         </span>
       </div>
       <div className={clsx(styles.filter, { [styles.collapsed]: selection !== "charges" })}>
-        {modulesWithCharges
+        {Object.values(modulesWithCharges)
           .sort((a, b) => a.name.localeCompare(b.name))
           .map((chargeGroup) => {
             return (

src/HullListing/HullListing.tsx

@@ -50,7 +50,7 @@ const Hull = (props: { typeId: number; entry: ListingHull }) => {
       let index = 0;
       return (
         <>
-          {props.entry.fits
+          {Object.values(props.entry.fits)
             .sort((a, b) => a.fit.name.localeCompare(b.fit.name))
             .map((fit) => {
               index += 1;