/**
 * React Component for displaying a list of the player's installed Augmentations
 * on the Augmentations UI
 */
import * as React from "react";

import { Player } from "../../Player";
import { Augmentations } from "../../Augmentation/Augmentations";
import { AugmentationNames } from "../../Augmentation/data/AugmentationNames";
import { Settings } from "../../Settings/Settings";
import { OwnedAugmentationsOrderSetting } from "../../Settings/SettingEnums";

import { AugmentationAccordion } from "../../ui/React/AugmentationAccordion";

export function InstalledAugmentations(): React.ReactElement {
    const sourceAugs = Player.augmentations.slice();

    if (Settings.OwnedAugmentationsOrder === OwnedAugmentationsOrderSetting.Alphabetically) {
        sourceAugs.sort((aug1, aug2) => {
            return aug1.name <= aug2.name ? -1 : 1;
        });
    }

    const augs = sourceAugs.map((e) => {
        const aug = Augmentations[e.name];

        let level = null;
        if (e.name === AugmentationNames.NeuroFluxGovernor) {
            level = e.level;
        }

        return (
            <li key={e.name}>
                <AugmentationAccordion aug={aug} level={level} />
            </li>
        )
    });

    return (
        <>{augs}</>
    )
}