import { SvgIcon } from "@mui/material";
import { styled } from "@mui/material/styles";

import FtsoIcon from "../../assets/tokens/FTSO.svg?react";
import StnkIcon from "../../assets/tokens/STNK.svg?react";
import GhstIcon from "../../assets/tokens/GHST.svg?react";
import DaiIcon from "../../assets/tokens/DAI.svg?react";
import WethIcon from "../../assets/tokens/wETH.svg?react";
import UnknownIcon from "../../assets/tokens/Unknown.svg?react";

const PREFIX = "Token";

const classes = {
    root: `${PREFIX}-root`,
};

const StyledSvgIcon = styled(SvgIcon)(() => ({
    [`&.${classes.root}`]: {
        display: "flex",
        justifyContent: "space-between",
        flexDirection: "row",
        margin: "12px 0px",
    },
}));

const Token = ({ name, viewBox = "0 0 260 260", fontSize = "large", ...props }) => {
    const parseKnownToken = (name) => {
        let icon;
        switch (name?.toUpperCase()) {
            case "FTSO":
                icon = FtsoIcon;
                break;
            case "ECSPR":
                icon = FtsoIcon;
                break;
            case "STNK":
                icon = StnkIcon;
                break;
            case "SCSPR":
                icon = StnkIcon;
                break;
            case "GHST":
                icon = GhstIcon;
                break;
            case "CSPR":
                icon = GhstIcon;
                break;
            case "GDAI":
                icon = DaiIcon;
                break;
            case "DAI":
                icon = DaiIcon;
                break;
            case "ETH":
                icon = WethIcon;
                break;
            case "WETH":
                icon = WethIcon;
                break;
            case "METC":
                icon = WethIcon;
                break;
            default:
                icon = UnknownIcon;
        }
        return icon;
    }

    return (
        <StyledSvgIcon
            viewBox={viewBox}
            fontSize={fontSize}
            component={parseKnownToken(name)}
            {...props}
        ></StyledSvgIcon>
    );
};

export default Token;