feat: added ability to hide specific stats (#3) (61626af2) · Commits · 郑智淋 / github-readme-stats

api/index.js

+79 −24

Original line number	Diff line number	Diff line
		@@ -19,6 +19,9 @@ async function fetchStats(username) {
		pullRequests(first: 100) {
		totalCount
		}
		issues(first: 100) {
		totalCount
		}
		repositories(first: 100) {
		nodes {
		stargazers {
		@@ -35,42 +38,94 @@ async function fetchStats(username) {
		},
		});

		const stats = { totalStars: 0, contributedTo: 0, name: "", totalPRs: 0 };
		const stats = {
		name: "",
		totalPRs: 0,
		totalIssues: 0,
		totalStars: 0,
		contributedTo: 0,
		};
		if (res.data.error) return stats;

		const user = res.data.data.user;

		stats.name = user.name;
		stats.totalIssues = user.issues.totalCount;
		stats.totalPRs = user.pullRequests.totalCount;
		stats.contributedTo = user.repositoriesContributedTo.totalCount;

		stats.totalStars = user.repositories.nodes.reduce((prev, curr) => {
		return prev + curr.stargazers.totalCount;
		}, 0);

		stats.totalPRs = user.pullRequests.totalCount;
		stats.contributedTo = user.repositoriesContributedTo.totalCount;
		stats.name = user.name;
		return stats;
		}

		module.exports = async (req, res) => {
		const username = req.query.username;
		let { name, totalStars, totalPRs, contributedTo } = await fetchStats(
		username
		);
		const renderSVG = (stats, options) => {
		const { name, totalStars, totalIssues, totalPRs, contributedTo } = stats;
		const { hide } = options \|\| {};
		const height = 150 - hide.length * 20;

		res.setHeader("Content-Type", "image/svg+xml");
		res.send(`
		<svg width="495" height="130" viewBox="0 0 495 130" fill="none" xmlns="http://www.w3.org/2000/svg">
		const STAT_MAP = {
		stars: `
		<tspan x="25" dy="20" class="stat bold"> Total Stars:</tspan>
		<tspan x="135" dy="0" class="stat">${totalStars}</tspan>
		`,
		prs: `
		<tspan x="25" dy="20" class="stat bold">Total PRs:</tspan>
		<tspan x="135" dy="0" class="stat">${totalPRs}</tspan>
		`,
		issues: `
		<tspan x="25" dy="20" class="stat bold">Total Issues:</tspan>
		<tspan x="135" dy="0" class="stat">${totalIssues}</tspan>
		`,
		contribs: `
		<tspan x="25" dy="20" class="stat bold">Contributed to:</tspan>
		<tspan x="135" dy="0" class="stat">${contributedTo} repos</tspan>
		`,
		};

		return `
		<svg width="495" height="${height}" viewBox="0 0 495 ${height}" fill="none" xmlns="http://www.w3.org/2000/svg">
		<style>
		.header { font: 600 18px 'Segoe UI', Ubuntu, Sans-Serif; fill: #2F80ED }
		.stat { font: 600 14px 'Segoe UI', Ubuntu, Sans-Serif; fill: #333 }
		.bold { font-weight: 700 }
		</style>
		<rect x="0.5" y="0.5" width="494" height="99%" rx="4.5" fill="#FFFEFE" stroke="#E4E2E2"/>

		<text x="25" y="35" class="header">${name}'s github stats</text>
		<text x="25" y="70" class="stat bold">Total Stars:</text>
		<text x="135" y="70" class="stat">${totalStars}</text>
		<text x="25" y="90" class="stat bold">Total PRs:</text>
		<text x="135" y="90" class="stat">${totalPRs}</text>
		<text x="25" y="110" class="stat bold">Contributed to:</text>
		<text x="135" y="110" class="stat">${contributedTo} repos</text>
		<text y="45">
		${Object.keys(STAT_MAP)
		.filter((key) => !hide.includes(key))
		.map((key) => STAT_MAP[key])}
		</text>
		</svg>
		`);
		`;
		};

		module.exports = async (req, res) => {
		const username = req.query.username;
		const hide = req.query.hide;
		let {
		name,
		totalPRs,
		totalStars,
		totalIssues,
		contributedTo,
		} = await fetchStats(username);

		res.setHeader("Content-Type", "image/svg+xml");
		res.send(
		renderSVG(
		{
		name,
		totalStars,
		totalIssues,
		totalPRs,
		contributedTo,
		},
		{ hide: JSON.parse(hide \|\| "[]") }
		)
		);
		};

readme.md

+14 −0

Original line number	Diff line number	Diff line
		@@ -12,10 +12,24 @@ change the `?username=` value to your GitHubs's username
		![Anurag's github stats](https://github-readme-stats.vercel.app/api?username=anuraghazra)
		```

		### Hiding certain stats

		To hide any specific stats you can pass a query parameter `?hide=` with an array of items you wanna hide.

		> Options: `&hide=["stars","prs","issues","contribs"]`

		```md
		![Anurag's github stats](https://github-readme-stats.vercel.app/api?username=anuraghazra&hide=["contribs","prs"])
		```

		## Demo

		![Anurag's github stats](https://github-readme-stats.vercel.app/api?username=anuraghazra)

		- Hiding specific stats

		![Anurag's github stats](https://github-readme-stats.vercel.app/api?username=anuraghazra&hide=["contribs","issues"])

		Contributions are welcomed! <3

		Made with :heart: and javascript.

Admin message