@redocly/theme
Version:
Shared UI components lib
60 lines • 4.36 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.CatalogEntityTeamRelations = CatalogEntityTeamRelations;
const react_1 = __importDefault(require("react"));
const styled_components_1 = __importDefault(require("styled-components"));
const Tabs_1 = require("../../../../markdoc/components/Tabs/Tabs");
const PeopleIcon_1 = require("../../../../icons/PeopleIcon/PeopleIcon");
const EntityTypeIcon_1 = require("../../../../icons/EntityTypeIcon/EntityTypeIcon");
const Tag_1 = require("../../../../components/Tag/Tag");
const CatalogEntityRelationsTable_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityRelations/CatalogEntityRelationsTable");
const CatalogUserEntityCell_1 = require("../../../../components/Catalog/CatalogTableView/CatalogUserEntityCell");
const CatalogEntityDefaultRelations_1 = require("../../../../components/Catalog/CatalogEntity/CatalogEntityRelations/CatalogEntityDefaultRelations");
const teamColumns = [
{
key: 'entity',
title: 'User name',
render: (entity) => {
var _a;
return (react_1.default.createElement(CatalogUserEntityCell_1.CatalogUserEntityCell, { name: entity.title, email: (_a = entity.metadata) === null || _a === void 0 ? void 0 : _a.email }));
},
width: '2fr',
sortable: true,
sortKey: 'title',
},
{
key: 'metadata',
title: 'Role',
render: (entity) => { var _a, _b; return (((_a = entity.metadata) === null || _a === void 0 ? void 0 : _a.role) ? react_1.default.createElement(Tag_1.Tag, null, (_b = entity.metadata) === null || _b === void 0 ? void 0 : _b.role) : null); },
width: '2fr',
},
{
key: 'description',
title: 'Description',
render: (entity) => react_1.default.createElement(EntityDescription, null, entity.summary),
width: '3fr',
},
];
function CatalogEntityTeamRelations({ entity, relations, query, searchQuery, setSearchQuery, setFilter, entitiesCatalogConfig, catalogConfig, sortOption, setSortOption, handleSortClick, isColumnSorted, shouldShowLoadMore, }) {
return (react_1.default.createElement("div", { "data-component-name": "Catalog/CatalogEntity/CatalogEntityRelations/CatalogEntityTeamRelations" },
react_1.default.createElement(Tabs_1.Tabs, { size: Tabs_1.TabsSize.MEDIUM },
react_1.default.createElement(TabItem, { label: "Members", icon: react_1.default.createElement(PeopleIcon_1.PeopleIcon, null), onClick: () => setFilter('type:user') },
react_1.default.createElement(CatalogEntityRelationsTable_1.CatalogEntityRelationsTable, { key: "members-table", entity: entity, entitiesCatalogConfig: entitiesCatalogConfig, catalogConfig: catalogConfig, relations: relations, query: query, searchQuery: searchQuery, setSearchQuery: setSearchQuery, columns: teamColumns, sortOption: sortOption, setSortOption: setSortOption, handleSortClick: handleSortClick, isColumnSorted: isColumnSorted, shouldShowLoadMore: shouldShowLoadMore, listType: "team" })),
react_1.default.createElement(TabItem, { label: "Related entities", icon: react_1.default.createElement(EntityTypeIcon_1.EntityTypeIcon, null), onClick: () => setFilter('-type:user') },
react_1.default.createElement(CatalogEntityDefaultRelations_1.CatalogEntityDefaultRelations, { key: "related-entities-table", entity: entity, relations: relations, query: query, searchQuery: searchQuery, setSearchQuery: setSearchQuery, entitiesCatalogConfig: entitiesCatalogConfig, catalogConfig: catalogConfig, sortOption: sortOption, setSortOption: setSortOption, handleSortClick: handleSortClick, isColumnSorted: isColumnSorted, shouldShowLoadMore: shouldShowLoadMore, shouldShowHeading: false })))));
}
const TabItem = styled_components_1.default.div `
padding: var(--spacing-sm);
`;
const EntityDescription = styled_components_1.default.div `
font-size: var(--catalog-table-entity-summary-font-size);
line-height: var(--catalog-table-entity-summary-line-height);
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
`;
//# sourceMappingURL=CatalogEntityTeamRelations.js.map