You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@apisix.apache.org by ju...@apache.org on 2021/11/22 02:20:44 UTC
[apisix-website] branch contribute-page created (now db639a9)
This is an automated email from the ASF dual-hosted git repository.
juzhiyuan pushed a change to branch contribute-page
in repository https://gitbox.apache.org/repos/asf/apisix-website.git.
at db639a9 chore: use config files
This branch includes the following new commits:
new db639a9 chore: use config files
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
[apisix-website] 01/01: chore: use config files
Posted by ju...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
juzhiyuan pushed a commit to branch contribute-page
in repository https://gitbox.apache.org/repos/asf/apisix-website.git
commit db639a9d7273780f5acfb233a2b88fbd2e7acdc4
Author: juzhiyuan <ju...@apache.org>
AuthorDate: Mon Nov 22 10:20:23 2021 +0800
chore: use config files
---
website/src/pages/contribute/ContributeCard.js | 162 ++++++++++++-------------
website/src/pages/contribute/index.js | 2 +-
2 files changed, 82 insertions(+), 82 deletions(-)
diff --git a/website/src/pages/contribute/ContributeCard.js b/website/src/pages/contribute/ContributeCard.js
index c39aeff..de9b33c 100644
--- a/website/src/pages/contribute/ContributeCard.js
+++ b/website/src/pages/contribute/ContributeCard.js
@@ -3,118 +3,118 @@ import styled from "styled-components";
import IconComment from "../../assets/icons/comment.svg";
const Card = styled.div`
- @media (max-width: 700px) {
- width: 100%;
- }
- width: 80%;
- border: 1px solid rgb(232, 67, 62);
- border-radius: 5px;
- margin-bottom: 1rem;
- padding: 0.75rem 1.25rem;
+ @media (max-width: 700px) {
+ width: 100%;
+ }
+ width: 80%;
+ border: 1px solid rgb(232, 67, 62);
+ border-radius: 5px;
+ margin-bottom: 1rem;
+ padding: 0.75rem 1.25rem;
- &:hover {
- background-color: rgb(255,241,240,0.2);
- cursor: pointer;
- p{
- color: rgb(232, 67, 62);
- }
+ &:hover {
+ background-color: rgb(255,241,240,0.2);
+ cursor: pointer;
+ p{
+ color: rgb(232, 67, 62);
}
- background-color: ${(props) => (props.isShow ? "rgb(255,241,240,0.2)" : "")}
+ }
+ background-color: ${(props) => (props.isShow ? "rgb(255,241,240,0.2)" : "")};
`;
const ProjectTitle = styled.div`
- display:flex;
- justify-content: space-between;
- align-items: center;
- margin-left: 1.25 rem;
- margin-right: 1.25 rem;
+ display:flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-left: 1.25 rem;
+ margin-right: 1.25 rem;
`;
const Title = styled.p`
margin: 0;
font-size: 1.5rem;
- color: ${(props) => (props.isShow ? "rgb(232, 67, 62)" : "")}
+ color: ${(props) => (props.isShow ? "rgb(232, 67, 62)" : "")};
`;
const Issue = styled.div`
- @media (max-width: 700px) {
- min-width: 5rem;
- }
- border: 1px solid rgb(232, 67, 62);
- border-radius: 0.5rem;
- padding: 0.25rem 0.5rem;
- font-size: .875rem;
+ @media (max-width: 700px) {
+ min-width: 5rem;
+ }
+ border: 1px solid rgb(232, 67, 62);
+ border-radius: 0.5rem;
+ padding: 0.25rem 0.5rem;
+ font-size: .875rem;
`;
const ProjectDesc = styled.div`
- display: flex;
- color: ${(props) => (props.isShow ? "rgb(232, 67, 62)" : "")}
+ display: flex;
+ color: ${(props) => (props.isShow ? "rgb(232, 67, 62)" : "")};
`;
const List = styled.div`
display: ${(props) => (props.isShow ? "block" : "none")};
`;
const ListItem = styled.li`
- list-style: none;
- display: flex;
+ list-style: none;
+ display: flex;
`;
const ContributeCard = (props) => {
- const { repoName } = props;
- const [isShow, setisShow] = useState(false);
- const [repoInfo, setRepoInfo] = useState({ description: '', Star: '', Watch: '', Fork: ''});
- const [issues, setIssues] = useState([]);
+ const { repoName } = props;
+ const [isShow, setisShow] = useState(false);
+ const [repoInfo, setRepoInfo] = useState({ description: '', Star: '', Watch: '', Fork: '' });
+ const [issues, setIssues] = useState([]);
- useEffect(() => {
- getGitHubIssuesInfo(repoName).then((result) => {
- setIssues(result);
- });
- getGitHubRepoInfo(repoName).then((result) => {
- setRepoInfo({ description: result.description, Star: result.stargazers_count, Watch: result.subscribers_count, Fork: result.forks_count })
- })
- }, []);
- return (
- <Card onClick={() => setisShow(!isShow)} isShow={isShow}>
- <ProjectTitle>
- <Title isShow={isShow}>{repoName}</Title>
- <Issue isShow={isShow}>{issues.length} issues</Issue>
- </ProjectTitle>
- <div>{repoInfo.description}</div>
- <ProjectDesc isShow={isShow}>
- <div style={{ marginRight: '1rem' }}>Star: {repoInfo.Star}</div>
- <div style={{ marginRight: '1rem' }}>Watch: {repoInfo.Watch}</div>
- <div style={{ marginRight: '1rem' }}>Fork: {repoInfo.Fork}</div>
- </ProjectDesc>
- <List isShow={isShow}>
- <ul style={{ paddingLeft: 0 }}>
- {issues.map(item => (
- <ListItem key={item.number}>
- <div style={{ minWidth: '4rem' }}>#{item.number}</div>
- <a target="_blank" href={item.html_url} style={{ flex: '1 1 auto', textDecoration: 'none',overflow: 'hidden' }}>{item.title} </a>
- {item.comments > 0 ? <div style={{display: "flex", justifyContent: 'center',alignItems: 'center'}}><IconComment></IconComment><div style={{marginLeft:'0.25rem', fontSize:'0.5rem', color:'#333'}}>{item.comments}</div></div> : ''}
- </ListItem>
- ))}
- </ul></List>
- </Card>
- );
+ useEffect(() => {
+ getGitHubIssuesInfo(repoName).then((result) => {
+ setIssues(result);
+ });
+ getGitHubRepoInfo(repoName).then((result) => {
+ setRepoInfo({ description: result.description, Star: result.stargazers_count, Watch: result.subscribers_count, Fork: result.forks_count })
+ })
+ }, []);
+ return (
+ <Card onClick={() => setisShow(!isShow)} isShow={isShow}>
+ <ProjectTitle>
+ <Title isShow={isShow}>{repoName}</Title>
+ <Issue isShow={isShow}>{issues.length} issues</Issue>
+ </ProjectTitle>
+ <div>{repoInfo.description}</div>
+ <ProjectDesc isShow={isShow}>
+ <div style={{ marginRight: '1rem' }}>Star: {repoInfo.Star}</div>
+ <div style={{ marginRight: '1rem' }}>Watch: {repoInfo.Watch}</div>
+ <div style={{ marginRight: '1rem' }}>Fork: {repoInfo.Fork}</div>
+ </ProjectDesc>
+ <List isShow={isShow}>
+ <ul style={{ paddingLeft: 0 }}>
+ {issues.map(item => (
+ <ListItem key={item.number}>
+ <div style={{ minWidth: '4rem' }}>#{item.number}</div>
+ <a target="_blank" href={item.html_url} style={{ flex: '1 1 auto', textDecoration: 'none', overflow: 'hidden' }}>{item.title} </a>
+ {item.comments > 0 ? <div style={{ display: "flex", justifyContent: 'center', alignItems: 'center' }}><IconComment></IconComment><div style={{ marginLeft: '0.25rem', fontSize: '0.5rem', color: '#333' }}>{item.comments}</div></div> : ''}
+ </ListItem>
+ ))}
+ </ul></List>
+ </Card>
+ );
};
const getGitHubIssuesInfo = (repo) => {
- return fetch(`https://api.github.com/repos/${repo}/issues?state=open&labels=good%20first%20issue`, {
- headers: {
- "content-type": "application/json",
- Accept: "application / vnd.github.v3 + json",
- },
- }).then((response) => response.json()
- );
+ return fetch(`https://api.github.com/repos/${repo}/issues?state=open&labels=good%20first%20issue`, {
+ headers: {
+ "content-type": "application/json",
+ Accept: "application / vnd.github.v3 + json",
+ },
+ }).then((response) => response.json()
+ );
};
const getGitHubRepoInfo = (repo) => {
- return fetch(`https://api.github.com/repos/${repo}`, {
- headers: {
- "content-type": "application/json",
- Accept: "application / vnd.github.v3 + json",
- },
- }).then((response) => response.json());
+ return fetch(`https://api.github.com/repos/${repo}`, {
+ headers: {
+ "content-type": "application/json",
+ Accept: "application / vnd.github.v3 + json",
+ },
+ }).then((response) => response.json());
};
export default ContributeCard;
diff --git a/website/src/pages/contribute/index.js b/website/src/pages/contribute/index.js
index b5f080a..970d11a 100644
--- a/website/src/pages/contribute/index.js
+++ b/website/src/pages/contribute/index.js
@@ -25,7 +25,7 @@ const PageDesc = styled.div`
`;
const Contribute = () => {
- const repoList = [{ repoName: 'apache/apisix' }, { repoName: 'apache/apisix-dashboard' }, { repoName: 'apache/apisix-website' }, { repoName: 'apache/apisix-ingress-controller' }]
+ const repoList = require("../../../config/docs").map(item => ({ repoName: item.githubRepo }));
const repos = repoList.map((repo) => {
return <ContributeCard key={repo.repoName} {...repo} />;