@immobiliarelabs/backstage-plugin-gitlab
Version:
<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>
261 lines (253 loc) • 9.83 kB
JavaScript
import React from 'react';
import { Progress, Table, StatusAborted, StatusError, StatusOK, StatusRunning, StatusPending, Avatar } from '@backstage/core-components';
import Alert from '@material-ui/lab/Alert';
import { useAsync } from 'react-use';
import { g as getStatusIconType, a as gitlabProjectId, b as gitlabProjectSlug, c as gitlabInstance, G as GitlabCIApiRef, d as getElapsedTime, e as getDuration } from './index-b46369c9.esm.js';
import { useApi } from '@backstage/core-plugin-api';
import { Typography, Box, Link as Link$1 } from '@material-ui/core';
import Link from '@material-ui/core/Link';
function createTitleColumn() {
return {
title: "Title",
field: "title",
highlight: true,
render: (row) => /* @__PURE__ */ React.createElement(Typography, { variant: "body2", noWrap: true }, getStatusIconType(row), /* @__PURE__ */ React.createElement(Box, { ml: 1, component: "span" }, /* @__PURE__ */ React.createElement(Link, { href: row.web_url, target: "_blank" }, row.title)))
};
}
const DenseTable$2 = ({ mergeRequests }) => {
var _a;
const columns = [
{ title: "ID", field: "id" },
createTitleColumn(),
{ title: "Creator", field: "author" },
{ title: "State", field: "state" },
{ title: "Created At", field: "created_date" },
{ title: "Duration", field: "duration" }
];
const title = "Gitlab Merge Request Status: " + (mergeRequests == null ? void 0 : mergeRequests.project_name);
const data = (_a = mergeRequests == null ? void 0 : mergeRequests.data) == null ? void 0 : _a.map((mergeRequest) => {
return {
id: mergeRequest.id,
state: mergeRequest.state,
author: mergeRequest.author.username,
title: mergeRequest.title,
web_url: mergeRequest.web_url,
created_date: getElapsedTime(mergeRequest.created_at),
duration: getDuration(
mergeRequest.created_at,
mergeRequest.updated_at
)
};
});
return /* @__PURE__ */ React.createElement(
Table,
{
title,
options: { search: true, paging: true },
columns,
data: data || []
}
);
};
const MergeRequestsTable = ({}) => {
const project_id = gitlabProjectId();
const project_slug = gitlabProjectSlug();
const gitlab_instance = gitlabInstance();
const GitlabCIAPI = useApi(GitlabCIApiRef).build(gitlab_instance || "0");
const { value, loading, error } = useAsync(async () => {
const projectDetails = await GitlabCIAPI.getProjectDetails(
project_slug
);
const projectId = project_id || (projectDetails == null ? void 0 : projectDetails.id);
const gitlabObj = await GitlabCIAPI.getMergeRequestsSummary(projectId);
const data = gitlabObj == null ? void 0 : gitlabObj.getMergeRequestsData;
const renderData = { data };
renderData.project_name = await GitlabCIAPI.getProjectName(projectId);
return renderData;
}, []);
if (loading) {
return /* @__PURE__ */ React.createElement(Progress, null);
} else if (error) {
return /* @__PURE__ */ React.createElement(Alert, { severity: "error" }, error.message);
}
return /* @__PURE__ */ React.createElement(DenseTable$2, { mergeRequests: value || [] });
};
const GitlabCIStateIndicator = ({
state
}) => {
switch (state) {
case "pending":
return /* @__PURE__ */ React.createElement(StatusPending, null);
case "in_progress":
return /* @__PURE__ */ React.createElement(StatusRunning, null);
case "success":
return /* @__PURE__ */ React.createElement(StatusOK, null);
case "ERROR":
case "failed":
return /* @__PURE__ */ React.createElement(StatusError, null);
default:
return /* @__PURE__ */ React.createElement(StatusAborted, null);
}
};
function createStatusColumn() {
return {
title: "Status",
render: (row) => /* @__PURE__ */ React.createElement(Box, { display: "flex", alignItems: "center" }, /* @__PURE__ */ React.createElement(GitlabCIStateIndicator, { state: row.status }), /* @__PURE__ */ React.createElement(Typography, { variant: "caption" }, row.status))
};
}
function createWebURLColumn() {
return {
title: "Web URL",
render: (row) => /* @__PURE__ */ React.createElement(
Link$1,
{
href: `${row.web_url}`,
target: "_blank",
rel: "noopener noreferrer"
},
row.web_url
)
};
}
const DenseTable$1 = ({ pipelineObjects }) => {
var _a;
const columns = [
{ title: "Pipeline_ID", field: "id" },
createStatusColumn(),
{ title: "Branch", field: "ref" },
createWebURLColumn(),
{ title: "Created At", field: "created_date" },
{ title: "Duration", field: "duration" }
];
const title = "Gitlab Pipelines: " + (pipelineObjects == null ? void 0 : pipelineObjects.project_name);
const data = (_a = pipelineObjects == null ? void 0 : pipelineObjects.data) == null ? void 0 : _a.map(
(pipelineObject) => {
return {
id: pipelineObject.id,
status: pipelineObject.status,
ref: pipelineObject.ref,
web_url: pipelineObject.web_url,
created_date: getElapsedTime(pipelineObject.created_at),
duration: getDuration(
pipelineObject.created_at,
pipelineObject.updated_at
)
};
}
);
return /* @__PURE__ */ React.createElement(
Table,
{
title,
options: { search: true, paging: true },
columns,
data: data || []
}
);
};
const PipelinesTable = ({}) => {
const project_id = gitlabProjectId();
const project_slug = gitlabProjectSlug();
const gitlab_instance = gitlabInstance();
const GitlabCIAPI = useApi(GitlabCIApiRef).build(gitlab_instance || "0");
const { value, loading, error } = useAsync(async () => {
const projectDetails = await GitlabCIAPI.getProjectDetails(
project_slug
);
const projectId = project_id || (projectDetails == null ? void 0 : projectDetails.id);
const gitlabObj = await GitlabCIAPI.getPipelineSummary(projectId);
const data = gitlabObj == null ? void 0 : gitlabObj.getPipelinesData;
const renderData = { data };
renderData.project_name = await GitlabCIAPI.getProjectName(projectId);
return renderData;
}, []);
if (loading) {
return /* @__PURE__ */ React.createElement(Progress, null);
} else if (error) {
return /* @__PURE__ */ React.createElement(Alert, { severity: "error" }, error.message);
}
return /* @__PURE__ */ React.createElement(DenseTable$1, { pipelineObjects: value || [] });
};
const IssueStateIndicator = (issueObject) => {
switch (issueObject.state) {
case "opened":
return /* @__PURE__ */ React.createElement(StatusPending, null, "open");
case "closed":
return /* @__PURE__ */ React.createElement(StatusOK, null, "close");
default:
return /* @__PURE__ */ React.createElement(StatusAborted, null);
}
};
function IssueTitle(issueObject) {
return /* @__PURE__ */ React.createElement(Typography, { variant: "body2", noWrap: true }, /* @__PURE__ */ React.createElement(Box, { ml: 1, component: "span" }, /* @__PURE__ */ React.createElement(Link, { href: issueObject.web_url, target: "_blank" }, issueObject.title)));
}
function AuthorColumn(issueObject) {
return /* @__PURE__ */ React.createElement(Box, { sx: { display: "flex", alignItems: "center" } }, /* @__PURE__ */ React.createElement(
Avatar,
{
customStyles: { width: 32, height: 32 },
picture: issueObject.author.avatar_url,
displayName: issueObject.author.username
}
), /* @__PURE__ */ React.createElement(Typography, { variant: "body2", noWrap: true }, /* @__PURE__ */ React.createElement(Box, { ml: 1, component: "span" }, /* @__PURE__ */ React.createElement(Link, { href: issueObject.author.web_url, target: "_blank" }, issueObject.author.username))));
}
const DenseTable = ({
issuesObjects,
projectName
}) => {
const columns = [
{ title: "Issue ID", field: "id" },
{ title: "Title", render: IssueTitle },
{ title: "Author", render: AuthorColumn },
{ title: "Created At", field: "created_at" },
{ title: "Issue Type", field: "type" },
{ title: "Issue Status", render: IssueStateIndicator }
];
const title = "Gitlab Issues: " + projectName;
const data = issuesObjects.map((issue) => ({
...issue,
created_at: getElapsedTime(issue.created_at)
}));
return /* @__PURE__ */ React.createElement(
Table,
{
title,
options: { search: true, paging: true },
columns,
data
}
);
};
const IssuesTable = ({}) => {
const project_id = gitlabProjectId();
const project_slug = gitlabProjectSlug();
const gitlab_instance = gitlabInstance();
const GitlabCIAPI = useApi(GitlabCIApiRef).build(gitlab_instance || "0");
const { value, loading, error } = useAsync(async () => {
const projectDetails = await GitlabCIAPI.getProjectDetails(
project_slug
);
const projectId = project_id || (projectDetails == null ? void 0 : projectDetails.id);
const projectName = await GitlabCIAPI.getProjectName(projectId);
const gitlabIssuesObject = await GitlabCIAPI.getIssuesSummary(
projectId
);
const data = gitlabIssuesObject == null ? void 0 : gitlabIssuesObject.getIssuesData;
const renderData = { data, projectName };
return renderData;
}, []);
if (loading) {
return /* @__PURE__ */ React.createElement(Progress, null);
} else if (error) {
return /* @__PURE__ */ React.createElement(Alert, { severity: "error" }, error.message);
}
return /* @__PURE__ */ React.createElement(
DenseTable,
{
issuesObjects: (value == null ? void 0 : value.data) || [],
projectName: value == null ? void 0 : value.projectName
}
);
};
export { IssuesTable as I, MergeRequestsTable as M, PipelinesTable as P };
//# sourceMappingURL=IssuesTable-b727440f.esm.js.map