import React, { Fragment } from 'react';
import { makeStyles, Typography, Divider, useTheme } from '@material-ui/core';
import FUIAppHeader from './FUIAppHeader';
import FUIAppList from './FUIAppList';
import UnityApps from './UnityApps';
import ProductAppList from './ProductAppList';
import { useTranslation } from 'react-i18next';
const useStyles = makeStyles((theme) => ({
    // root: { width: 540 },
    card: { marginRight: theme.spacing(1.5), marginBottom: theme.spacing(1.5) },
    content: {
        padding: theme.spacing(2)
    },
    appList: {
        marginTop: theme.spacing(1)
    },
    list: {
        display: 'flex',
        flexDirection: 'row',
        flexWrap: 'wrap'
    },
    divider: {
        marginTop: theme.spacing(2),
        marginBottom: theme.spacing(2)
    },
    unityBuilders: {},
    title: {
        marginTop: theme.spacing(2)
    },
    column: {
        display: 'flex',
        flexDirection: 'row'
    },
    favorite: {
        display: 'flex',
        flexDirection: 'row',
        marginTop: theme.spacing(-1)
    }
}));
const FUIAppSwitcher = (props) => {
    const { onClose, favoriteMenu, builderMenu, appMenu, unityUrl, user, header } = props;
    const classes = useStyles(props);
    const theme = useTheme();
    const appHintColor = theme.palette.primary.light;
    const appColor = theme.palette.primary.main;
    const { t, i18n } = useTranslation();
    return (React.createElement("div", { className: classes.root }, React.createElement(FUIAppHeader, { onClose: onClose, unityUrl: unityUrl, user: user }), React.createElement("div", { className: classes.content }, React.createElement("div", { className: classes.column }, React.createElement("div", { className: classes.right }, React.createElement("div", { className: classes.appList }, header, (appMenu === null || appMenu === void 0 ? void 0 : appMenu.length) ? (React.createElement(React.Fragment, null, React.createElement(Typography, { variant: "h6", className: classes.title }, t('Unity Apps')), React.createElement(UnityApps, { backgroundColor: appHintColor, children: React.createElement(ProductAppList, { apps: appMenu, color: appColor, user: user }) }), React.createElement(Divider, { className: classes.divider }))) : null, (builderMenu === null || builderMenu === void 0 ? void 0 : builderMenu.length) ? (React.createElement(React.Fragment, null, React.createElement(Typography, { variant: "h6", className: classes.title }, t('Unity Builders')), React.createElement("div", { className: classes.unityBuilders }, React.createElement(FUIAppList, { apps: builderMenu, verticalColor: appColor, closeSwitcher: onClose, user: user })), React.createElement(Divider, { className: classes.divider }), ' ')) : null, (favoriteMenu === null || favoriteMenu === void 0 ? void 0 : favoriteMenu.length) ? (React.createElement(React.Fragment, null, React.createElement(Typography, { variant: "h6", className: classes.title }, t('Favorites')), React.createElement("div", { className: classes.favorite }, React.createElement(FUIAppList, { apps: favoriteMenu, verticalColor: appColor, closeSwitcher: onClose, user: user })))) : null))))));
};
export default FUIAppSwitcher;
//# sourceMappingURL=FUIAppSwitcher.js.map