"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 react_intl_1 = require("react-intl");
const material_1 = require("@mui/material");
const InfiniteScroll_1 = tslib_1.__importDefault(require("../../../../../shared/InfiniteScroll"));
const Typography_1 = tslib_1.__importDefault(require("@mui/material/Typography"));
const api_services_1 = require("@selfcommunity/api-services");
const utils_1 = require("@selfcommunity/utils");
const react_core_1 = require("@selfcommunity/react-core");
const types_1 = require("@selfcommunity/types");
const Errors_1 = require("../../../../../constants/Errors");
const BaseDialog_1 = tslib_1.__importDefault(require("../../../../../shared/BaseDialog"));
const CentralProgress_1 = tslib_1.__importDefault(require("../../../../../shared/CentralProgress"));
const User_1 = tslib_1.__importDefault(require("../../../../User"));
function SharesDialog(props) {
    // PROPS
    const { id = null, feedObject = null, feedObjectType = feedObject ? feedObject.type : types_1.SCContributionType.POST, open = false, onClose = null } = props, rest = tslib_1.__rest(props, ["id", "feedObject", "feedObjectType", "open", "onClose"]);
    // STATE
    const { obj, setObj } = (0, react_core_1.useSCFetchFeedObject)({ id, feedObject, feedObjectType });
    const [isLoading, setIsLoading] = (0, react_1.useState)(Boolean((id && feedObjectType) || feedObject));
    const [shares, setShares] = (0, react_1.useState)([]);
    const [next, setNext] = (0, react_1.useState)(id && feedObjectType
        ? `${api_services_1.Endpoints.ShareUsersList.url({ type: feedObjectType, id: id })}`
        : feedObject && feedObjectType
            ? `${api_services_1.Endpoints.ShareUsersList.url({ type: feedObjectType, id: feedObject.id })}`
            : null);
    /**
     * On mount, fetches shares
     */
    (0, react_1.useEffect)(() => {
        if (obj && next) {
            fetchShares();
        }
    }, [`${obj}`]);
    /**
     * Fetches shares
     */
    function fetchShares() {
        setIsLoading(true);
        api_services_1.http
            .request({
            url: next,
            method: api_services_1.Endpoints.ShareUsersList.method
        })
            .then((res) => {
            const data = res.data;
            setShares([...shares, ...data.results]);
            setIsLoading(false);
            setNext(data.next !== null ? data.next : null);
        })
            .catch((error) => {
            utils_1.Logger.error(Errors_1.SCOPE_SC_UI, error);
        });
    }
    /**
     * Renders shares dialog
     */
    return ((0, jsx_runtime_1.jsx)(BaseDialog_1.default, Object.assign({ title: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.feedObject.sharesDialog.title", id: "ui.feedObject.sharesDialog.title" }), onClose: onClose, open: open }, rest, { children: isLoading ? ((0, jsx_runtime_1.jsx)(CentralProgress_1.default, { size: 50 })) : ((0, jsx_runtime_1.jsx)(InfiniteScroll_1.default, Object.assign({ dataLength: shares.length, next: fetchShares, hasMoreNext: next !== null, loaderNext: (0, jsx_runtime_1.jsx)(CentralProgress_1.default, { size: 30 }), height: 400, endMessage: (0, jsx_runtime_1.jsx)(Typography_1.default, Object.assign({ variant: "body2", align: "center", fontWeight: "bold" }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.feedObject.sharesDialog.noOtherLikes", defaultMessage: "ui.feedObject.sharesDialog.noOtherLikes" }) })) }, { children: (0, jsx_runtime_1.jsx)(material_1.List, { children: shares.slice(0, 4).map((user, index) => ((0, jsx_runtime_1.jsx)(material_1.ListItem, { children: (0, jsx_runtime_1.jsx)(User_1.default, { elevation: 0, user: user }, index) }, user.id))) }) }))) })));
}
exports.default = SharesDialog;
