@immobiliarelabs/backstage-plugin-gitlab/dist/components/widgets/PeopleCard/PeopleCard.esm.js

<p align="center"> <img src="https://avatars.githubusercontent.com/u/10090828?s=200&v=4" width="200px" alt="logo"/> </p> <h1 align="center">Backstage Plugin GitLab</h1>

import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import Alert from '@material-ui/lab/Alert';
import { Progress, InfoCard } from '@backstage/core-components';
import { GitlabCIApiRef } from '../../../api/GitlabCIApi.esm.js';
import '../../utils.esm.js';
import '@gitbeaker/rest';
import 'dayjs';
import { useApi } from '@backstage/core-plugin-api';
import { useAsync } from 'react-use';
import { gitlabProjectId, gitlabProjectSlug, gitlabInstance, gitlabCodeOwnerPath } from '../../gitlabAppData.esm.js';
import { PeopleList } from './components/PeopleList/PeopleList.esm.js';
import { MembersList } from './components/MembersList/MembersList.esm.js';
import { Divider } from '@material-ui/core';
import { useTranslationRef } from '@backstage/core-plugin-api/alpha';
import { gitlabTranslationRef } from '../../../translation.esm.js';

const useStyles = makeStyles((theme) => ({
  infoCard: {
    marginBottom: theme.spacing(3),
    "& + .MuiAlert-root": {
      marginTop: theme.spacing(3)
    }
  },
  subTitle: {
    marginTop: theme.spacing(0)
  },
  divider: {
    marginTop: theme.spacing(2),
    marginBottom: theme.spacing(2)
  }
}));
const PeopleCard = (props) => {
  const classes = useStyles();
  const project_id = gitlabProjectId();
  const project_slug = gitlabProjectSlug();
  const gitlab_instance = gitlabInstance();
  const codeowners_path = gitlabCodeOwnerPath();
  const { t } = useTranslationRef(gitlabTranslationRef);
  const GitlabCIAPI = useApi(GitlabCIApiRef).build(
    gitlab_instance || "gitlab.com"
  );
  const { value, loading, error } = useAsync(async () => {
    const projectDetails = await GitlabCIAPI.getProjectDetails(
      project_slug || project_id
    );
    if (!projectDetails)
      throw new Error("wrong project_slug or project_id");
    const contributorData = await GitlabCIAPI.getContributorsSummary(
      projectDetails.id
    );
    const memberData = await GitlabCIAPI.getMembersSummary(
      projectDetails.id
    );
    let codeOwners = [];
    try {
      codeOwners = await GitlabCIAPI.getCodeOwners(
        projectDetails.id,
        projectDetails?.default_branch,
        codeowners_path
      );
    } catch (error2) {
      codeOwners = undefined;
    }
    return {
      contributors: contributorData,
      members: memberData,
      owners: codeOwners,
      projectDetails
    };
  }, []);
  const project_web_url = value?.projectDetails?.web_url;
  const project_default_branch = value?.projectDetails?.default_branch;
  let contributorsDeepLink;
  let membersDeepLink;
  let ownersDeepLink;
  if (project_web_url && project_default_branch) {
    const contributorsLink = GitlabCIAPI.getContributorsLink(
      project_web_url,
      project_default_branch
    );
    contributorsDeepLink = {
      link: contributorsLink,
      title: t("peopleCard.contributorList.deepLinkTitle"),
      onClick: (e) => {
        e.preventDefault();
        window.open(contributorsLink);
      }
    };
    const membersLink = GitlabCIAPI.getMembersLink(project_web_url);
    membersDeepLink = {
      link: membersLink,
      title: t("peopleCard.memberList.deepLinkTitle"),
      onClick: (e) => {
        e.preventDefault();
        window.open(membersLink);
      }
    };
    const ownersLink = GitlabCIAPI.getOwnersLink(
      project_web_url,
      project_default_branch,
      codeowners_path
    );
    ownersDeepLink = {
      link: ownersLink,
      title: t("peopleCard.ownerList.deepLinkTitle"),
      onClick: (e) => {
        e.preventDefault();
        window.open(ownersLink);
      }
    };
  }
  if (loading) {
    return /* @__PURE__ */ React.createElement(Progress, null);
  } else if (error) {
    return /* @__PURE__ */ React.createElement(Alert, { severity: "error", className: classes.infoCard }, error.message);
  }
  return /* @__PURE__ */ React.createElement(
    InfoCard,
    {
      title: t("peopleCard.title"),
      className: classes.infoCard,
      variant: props.variant
    },
    value?.owners && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
      PeopleList,
      {
        title: t("peopleCard.ownerList.title"),
        peopleObj: value?.owners,
        deepLink: ownersDeepLink
      }
    ), /* @__PURE__ */ React.createElement(Divider, { className: classes.divider })),
    /* @__PURE__ */ React.createElement(
      PeopleList,
      {
        title: t("peopleCard.contributorList.title"),
        peopleObj: value?.contributors || [],
        deepLink: contributorsDeepLink
      }
    ),
    props.disableMembersList || /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Divider, { className: classes.divider }), /* @__PURE__ */ React.createElement(
      MembersList,
      {
        title: t("peopleCard.memberList.title"),
        memberObj: value?.members || [],
        deepLink: membersDeepLink
      }
    ))
  );
};

export { PeopleCard };
//# sourceMappingURL=PeopleCard.esm.js.map