import React from 'react';
import i18n from 'ui-i18n';
import { useCollapsibleItems } from '../contexts/CollapsibleItemsContext';
import { MoreItemsLink } from '../MoreItemsLink';
export var CollapsibleActivityRecords = function (_a) {
    var RecordComponent = _a.RecordComponent, items = _a.items, activityUri = _a.activityUri;
    var _b = useCollapsibleItems({
        itemsId: activityUri,
        items: items
    }), onExpand = _b.onExpand, itemsToShow = _b.itemsToShow, collapsedItemsCount = _b.collapsedItemsCount;
    return (React.createElement(React.Fragment, null,
        itemsToShow.map(function (item) { return (React.createElement(RecordComponent, { key: item.id, item: item })); }),
        collapsedItemsCount ? (React.createElement(MoreItemsLink, { itemsCount: collapsedItemsCount, itemsLabel: collapsedItemsCount === 1 ? i18n.text('record') : i18n.text('records'), onClick: onExpand })) : null));
};
