"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const styles_1 = require("@mui/material/styles");
const material_1 = require("@mui/material");
const react_intl_1 = require("react-intl");
const utils_1 = require("@selfcommunity/utils");
const react_core_1 = require("@selfcommunity/react-core");
const UserProfile_1 = require("../../constants/UserProfile");
const Skeleton_1 = tslib_1.__importDefault(require("./Skeleton"));
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const system_1 = require("@mui/system");
const types_1 = require("../../types");
const Errors_1 = require("../../constants/Errors");
const Tags_1 = tslib_1.__importStar(require("../../shared/Tags"));
const constants_1 = require("./constants");
const messages = (0, react_intl_1.defineMessages)({
    realName: {
        id: 'ui.userInfo.realName',
        defaultMessage: 'ui.userInfo.realName'
    },
    dateJoined: {
        id: 'ui.userInfo.dateJoined',
        defaultMessage: 'ui.userInfo.dateJoined'
    },
    bio: {
        id: 'ui.userInfo.bio',
        defaultMessage: 'ui.userInfo.bio'
    },
    location: {
        id: 'ui.userInfo.location',
        defaultMessage: 'ui.userInfo.location'
    },
    dateOfBirth: {
        id: 'ui.userInfo.dateOfBirth',
        defaultMessage: 'ui.userInfo.dateOfBirth'
    },
    description: {
        id: 'ui.userInfo.description',
        defaultMessage: 'ui.userInfo.description'
    },
    gender: {
        id: 'ui.userInfo.gender',
        defaultMessage: 'ui.userInfo.gender'
    },
    website: {
        id: 'ui.userInfo.website',
        defaultMessage: 'ui.userInfo.website'
    },
    tags: {
        id: 'ui.userInfo.website',
        defaultMessage: 'ui.userInfo.website'
    },
    fieldLink: {
        id: 'ui.userInfo.fieldLink',
        defaultMessage: 'ui.userInfo.fieldLink'
    }
});
const classes = {
    root: `${constants_1.PREFIX}-root`,
    field: `${constants_1.PREFIX}-field`
};
const Root = (0, styles_1.styled)(material_1.Box, {
    name: constants_1.PREFIX,
    slot: 'Root'
})(() => ({}));
/**
 * > API documentation for the Community-JS User Info component. Learn about the available props and the CSS API.

 #### Import

 ```jsx
 import {UserInfo} from '@selfcommunity/react-ui';
 ```

 #### Component Name

 The name `SCUserInfo` can be used when providing style overrides in the theme.


 #### CSS

 |Rule Name|Global class|Description|
 |---|---|---|
 |root|.SCUserInfo-root|Styles applied to the root element.|
 |field|.SCUserInfo-field|Styles applied to the field element.|

 * @param inProps
 */
function UserInfo(inProps) {
    // PROPS
    const props = (0, system_1.useThemeProps)({
        props: inProps,
        name: constants_1.PREFIX
    });
    const { className = null, userId = null, user = null, fields = [...UserProfile_1.DEFAULT_FIELDS] } = props, rest = tslib_1.__rest(props, ["className", "userId", "user", "fields"]);
    // STATE
    const { scUser } = (0, react_core_1.useSCFetchUser)({ id: userId, user });
    // INTL
    const intl = (0, react_intl_1.useIntl)();
    // PREFERENCES
    const scPreferences = (0, react_core_1.useSCPreferences)();
    const metadataDefinitions = (0, react_1.useMemo)(() => {
        if (scPreferences.preferences && react_core_1.SCPreferences.CONFIGURATIONS_USER_METADATA_DEFINITIONS in scPreferences.preferences) {
            try {
                return JSON.parse(scPreferences.preferences[react_core_1.SCPreferences.CONFIGURATIONS_USER_METADATA_DEFINITIONS].value);
            }
            catch (e) {
                utils_1.Logger.error(Errors_1.SCOPE_SC_UI, 'Error on parse user metadata.');
                return {};
            }
        }
        return null;
    }, [scPreferences.preferences]);
    // FIELDS
    const _fields = [...fields, ...Object.keys(metadataDefinitions)];
    // RENDER
    const renderField = (user, field) => {
        switch (field) {
            case types_1.SCUserProfileFields.DATE_JOINED:
            case types_1.SCUserProfileFields.DATE_OF_BIRTH:
                return `${intl.formatDate(user[field], { year: 'numeric', month: 'numeric', day: 'numeric' })}`;
            case types_1.SCUserProfileFields.TAGS:
                return ((0, jsx_runtime_1.jsx)(Tags_1.default, { tags: user.tags.filter((t) => t.visible), type: Tags_1.TagsComponentType.LIST, direction: 'row', TagChipProps: { clickable: false, disposable: false } }));
            case types_1.SCUserProfileFields.WEBSITE:
                return ((0, jsx_runtime_1.jsx)("a", Object.assign({ href: user[field], target: '_blank' }, { children: user[field] })));
            default:
                return user[field];
        }
    };
    if (!scUser || !metadataDefinitions) {
        return (0, jsx_runtime_1.jsx)(Skeleton_1.default, {});
    }
    if (_fields.length === 0) {
        return null;
    }
    return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ className: (0, classnames_1.default)(classes.root, className) }, rest, { children: _fields.map((field) => {
            if (scUser[field]) {
                if (field === types_1.SCUserProfileFields.TAGS) {
                    return scUser[field].length > 0 ? ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.field }, { children: renderField(scUser, field) }), field)) : null;
                }
                return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.field }, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "h6" }, { children: metadataDefinitions[field] ? metadataDefinitions[field].label : intl.formatMessage(messages[(0, utils_1.camelCase)(field)]) })), (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "body2" }, { children: renderField(scUser, field) }))] }), field));
            }
            return null;
        }) })));
}
exports.default = UserInfo;
