diff --git a/README.md b/README.md index 8059f1f..c4acca1 100644 --- a/README.md +++ b/README.md @@ -68,6 +68,30 @@ key | required | description y: 0 ``` +## Project Description + +> Show GitLab project info with the description and different layout. + +![Gitlab project](preview/project_description.png) + +### parameters + +key | required | description +----------|----------|-------------------------- +`project` | yes | *ID or NAMESPACE/PROJECT_NAME of a project* + +### usage + +``` yaml +- extension: gitlab + widget: ProjectDescription + project: gitlab-org/gitlab-ce + columns: 1 + rows: 2 + x: 0 + y: 0 +``` + ## Project Members > Show GitLab project members. diff --git a/package.json b/package.json index 53c5c04..0b18202 100644 --- a/package.json +++ b/package.json @@ -55,7 +55,7 @@ "lint-staged": "^7.2.0", "nivo": "^0.12.0", "nock": "^9.0.14", - "prettier": "^1.14.0", + "prettier": "1.18.2", "react": "^16.4.0", "react-dom": "^16.4.0", "react-test-renderer": "^16.4.0", diff --git a/preview/project_description.png b/preview/project_description.png new file mode 100644 index 0000000..0c82f17 Binary files /dev/null and b/preview/project_description.png differ diff --git a/src/components/ProjectDescription.js b/src/components/ProjectDescription.js new file mode 100644 index 0000000..2657515 --- /dev/null +++ b/src/components/ProjectDescription.js @@ -0,0 +1,101 @@ +import React, { Component } from 'react' +import PropTypes from 'prop-types' +import styled from 'styled-components' +import { + TrapApiError, + Widget, + WidgetBody, + WidgetLoader, + typography, + WidgetAvatar, +} from '@mozaik/ui' + +const AVATAR_SIZE = '12vmin' + +const Container = styled.div` + display: flex; + flex-direction: column; + height: 100%; +` + +const Header = styled.div` + flex: 1; + display: flex; + align-items: center; + justify-content: center; +` + +const AvatarPlaceholder = styled.span` + width: ${AVATAR_SIZE}; + height: ${AVATAR_SIZE}; + display: flex; + align-items: center; + justify-content: center; + text-transform: uppercase; + color: ${props => props.theme.colors.textHighlight}; + background: ${props => props.theme.colors.unknown}; + ${props => typography(props.theme, 'display')} font-size: 6vmin; +` + +const Description = styled.div` + display: flex; + align-items: center; + justify-content: center; + white-space: pre; + color: ${props => props.theme.colors.textHighlight}; + margin: 1vmin 0 3vmin; + ${props => typography(props.theme, 'default', 'strong')}; +` + +export default class Project extends Component { + static propTypes = { + project: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired, + apiData: PropTypes.shape({ + name: PropTypes.string.isRequired, + description: PropTypes.string.isRequired, + name_with_namespace: PropTypes.string.isRequired, + visibility: PropTypes.string.isRequired, + avatar_url: PropTypes.string, + }), + apiError: PropTypes.object, + theme: PropTypes.object.isRequired, + } + + static getApiRequest({ project }) { + return { + id: `gitlab.project.${project}`, + params: { project }, + } + } + + render() { + const { apiData: project, apiError } = this.props + + let body = + if (project) { + let avatar + if (project.avatar_url !== null) { + avatar = {project.name_with_namespace} + } else { + avatar = {project.name[0]} + } + + body = ( + +
+ {avatar} +
+ {project.description} +
+ ) + } + + return ( + + + {body} + + + ) + } +} diff --git a/src/components/index.js b/src/components/index.js index 9287bd1..7e925db 100644 --- a/src/components/index.js +++ b/src/components/index.js @@ -1,4 +1,5 @@ import Project from './Project' +import ProjectDescription from './ProjectDescription' import ProjectMembers from './ProjectMembers' import ProjectContributors from './ProjectContributors' import JobHistory from './JobHistory' @@ -11,6 +12,7 @@ import * as labels from './labels' export default { Project, + ProjectDescription, ProjectMembers, ProjectContributors, JobHistory, diff --git a/test/components/__snapshots__/Branches.test.js.snap b/test/components/__snapshots__/Branches.test.js.snap index eea2bd1..bad7d02 100644 --- a/test/components/__snapshots__/Branches.test.js.snap +++ b/test/components/__snapshots__/Branches.test.js.snap @@ -155,7 +155,7 @@ exports[`should render as expected 1`] = ` />   - 3 years ago + 4 years ago @@ -244,7 +244,7 @@ exports[`should render as expected 1`] = ` />   - 3 years ago + 4 years ago @@ -333,7 +333,7 @@ exports[`should render as expected 1`] = ` />   - 2 years ago + 3 years ago @@ -422,7 +422,7 @@ exports[`should render as expected 1`] = ` />   - 2 years ago + 3 years ago @@ -511,7 +511,7 @@ exports[`should render as expected 1`] = ` />   - a year ago + 2 years ago @@ -600,7 +600,7 @@ exports[`should render as expected 1`] = ` />   - a year ago + 2 years ago @@ -689,7 +689,7 @@ exports[`should render as expected 1`] = ` />   - 2 years ago + 3 years ago @@ -778,7 +778,7 @@ exports[`should render as expected 1`] = ` />   - 2 years ago + 3 years ago @@ -867,7 +867,7 @@ exports[`should render as expected 1`] = ` />   - 2 years ago + 3 years ago @@ -956,7 +956,7 @@ exports[`should render as expected 1`] = ` />   - 2 years ago + 3 years ago @@ -1045,7 +1045,7 @@ exports[`should render as expected 1`] = ` />   - 2 years ago + 3 years ago @@ -1223,7 +1223,7 @@ exports[`should render as expected 1`] = ` />   - a year ago + 2 years ago @@ -1312,7 +1312,7 @@ exports[`should render as expected 1`] = ` />   - a year ago + 2 years ago @@ -1401,7 +1401,7 @@ exports[`should render as expected 1`] = ` />   - 10 months ago + 2 years ago @@ -1490,7 +1490,7 @@ exports[`should render as expected 1`] = ` />   - 6 months ago + a year ago @@ -1579,7 +1579,7 @@ exports[`should render as expected 1`] = ` />   - 6 months ago + a year ago @@ -1668,7 +1668,7 @@ exports[`should render as expected 1`] = ` />   - 6 months ago + a year ago @@ -1757,7 +1757,7 @@ exports[`should render as expected 1`] = ` />   - 6 months ago + a year ago @@ -1846,7 +1846,7 @@ exports[`should render as expected 1`] = ` />   - 5 months ago + a year ago diff --git a/yarn.lock b/yarn.lock index cd60ea5..9211410 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4761,9 +4761,10 @@ preserve@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b" -prettier@^1.14.0: - version "1.14.0" - resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.14.0.tgz#847c235522035fd988100f1f43cf20a7d24f9372" +prettier@1.18.2: + version "1.18.2" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.18.2.tgz#6823e7c5900017b4bd3acf46fe9ac4b4d7bda9ea" + integrity sha512-OeHeMc0JhFE9idD4ZdtNibzY0+TPHSpSSb9h8FqtP+YnoZZ1sl8Vc9b1sasjfymH3SonAF4QcA2+mzHPhMvIiw== pretty-format@^23.2.0: version "23.2.0"