sudacode/metrics
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Add new plugin habits

Browse Source
This commit is contained in:
lowlighter
2020-10-13 23:00:05 +02:00
parent e9e23d6028
commit 7ff3a7f46b
16 changed files with 221 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
README.md
View File

@@ -106,6 +106,9 @@ jobs:
# The provided GitHub token will require "repo" permissions
plugin_traffic: no
# Enable or disable coding habits metrics
plugin_habits: no
# Enable debug logs
debug: no
@@ -273,6 +276,17 @@ Open and edit `settings.json` to configure your instance.
//When enabled, pass "?traffic=1" in url to compute total page views in your repositories in last two weeks
//Note that this requires that the passed GitHub API token requires a push access
"enabled":true
},
//Habits plugin
"habits":{
//Enable or disable this plugin
//When enabled, pass "?habits=1" in url to generate coding habits based on your recent activity
//This includes stuff like if you're using tabs or space and the time of the day when you push the most
//Note that this requires that the passed GitHub API token requires a push access
"enabled":true,
//Specify the number of events used to compute coding habits. Capped at 100 by GitHub API
//Defaults to 50
"from":50,
}
}
}
@@ -485,6 +499,44 @@ And pass `?traffic=1` in url when generating metrics.
</details>
#### 💡 Habits
The *habits* plugin allows you to add deduced coding about based on your recent activity.
![Habits plugin](https://github.com/lowlighter/metrics/blob/master/.github/readme/imgs/plugin_habits.png)
<details>
<summary>💬 About</summary>
It will consume an additional GitHub request per event fetched.
##### Setup with GitHub actions
Add the following to your workflow :
```yaml
- uses: lowlighter/metrics@latest
with:
# ... other options
plugin_habits: yes
```
##### Setup in your own instance
Add the following to your `settings.json`
```json
"plugins":{
"habits":{
"enabled":true
}
}
```
And pass `?habits=1` in url when generating metrics.
</details>
### 🗂️ Project structure
* `index.mjs` contains the entry points and the settings instance

2
action.yml
View File

@@ -24,6 +24,8 @@ inputs:
description: Enable repositories lines metrics
plugin_traffic:
description: Enable repositories traffic metrics (due to GitHub API limitations, "token" must have "repo" permissions)
plugin_habits:
description: Enable coding habits metrics
debug:
description: Enable debug logs
runs:

35
action/dist/index.js vendored
View File

File diff suppressed because one or more lines are too long

1
action/index.mjs
View File

@@ -42,6 +42,7 @@
lines:{enabled:core.getInput("plugin_lines", {default:false})},
traffic:{enabled:core.getInput("plugin_traffic", {default:false})},
pagespeed:{enabled:core.getInput("plugin_pagespeed", {default:false})},
habits:{enabled:core.getInput("plugin_habits", {default:false})},
}
if (core.getInput("pagespeed_token")) {
console.log(`Pagespeed token | provided`)

2
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "metrics",
"version": "1.6.0",
"version": "1.7.0",
"description": "Generate an user's GitHub metrics as SVG image format to embed somewhere else",
"main": "index.mjs",
"scripts": {

6
settings.example.json
View File

@@ -16,7 +16,11 @@
"enabled":true, "//":"Enable or disable repositories total page views is last two weeks"
},
"lines":{ "//":"Lines plugin",
"enabled":true, "//":"Enable or disabled repositories total lines added/removed"
"enabled":true, "//":"Enable or disable repositories total lines added/removed"
},
"habits":{ "//":"Habits plugin",
"enabled":true, "//":"Enable or disable coding habits metrics",
"from":50, "//":"Number of activity events to base habits on (up to 100)"
}
}
}

25
src/html/index.html
View File

@@ -11,8 +11,12 @@
<h1><a href="https://github.com/lowlighter/metrics">GitHub metrics</a></h1>
<p>
Enter your GitHub username below to generate your metrics.
</p>
<label>
<input type="text" name="user" placeholder="Your GitHub username" value="">
<input type="text" name="user" placeholder="@username" value="">
</label>
<div id="metrics">
@@ -26,8 +30,8 @@
<div class="code">
![<span class="md-alt">GitHub metrics</span>](https://metrics.lecoq.io/my-github-user)
</div>
<br>
And for even more metrics, setup this <a href="https://github.com/marketplace/actions/github-metrics-as-svg-image">GitHub action</a> on your repository !
For even more metrics (coding habits, PageSpeed performances, number of line of code you wrote, page views, etc.), setup this as a <a href="https://github.com/marketplace/actions/github-metrics-as-svg-image">GitHub action</a> on your repository !<br>
Check out <a href="https://github.com/lowlighter/metrics">lowlighter/metrics</a> for more informations
</aside>
<script>
@@ -50,14 +54,19 @@
if (event.key === "Enter")
metrics(user)
else
timeout = setTimeout(() => metrics(user), 2000)
timeout = setTimeout(() => metrics(user), 1800)
}
//Metrics updater
let current = null
function metrics(user) {
if (!user.trim().length)
return
if (current !== user) {
if (current === user) {
document.querySelector("#metrics .placeholder").style.opacity = 0
document.querySelector("#metrics .generated").style.opacity = 1
document.querySelector("aside").style.opacity = 1
}
else {
current = user
document.querySelector("#metrics .generated").src = `https://metrics.lecoq.io/${user}`
document.querySelector("#metrics .generated").onload = function () {
@@ -86,7 +95,7 @@
overflow-x: hidden;
}
h1 {
margin-top: 4rem
margin: 4rem 0 0;
}
a, a:hover, a:visited {
color: #0366D6;
@@ -117,7 +126,7 @@
position: relative;
max-width: 100%;
width: 480px;
height: 516px;
height: 485px;
}
#metrics img {
position: absolute;
@@ -131,7 +140,7 @@
padding: .25rem;
transition: opacity .4s;
text-align: center;
margin-bottom: 2rem;
margin: 1rem 0 2rem;
}
.code {
font-family: SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;

2
src/html/placeholder.svg
View File

@@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="516">
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="485">
<style>
/* SVG global context */
svg {
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 25 KiB

1
src/metrics.mjs
View File

@@ -28,6 +28,7 @@
Plugins.pagespeed({login, url:data.user.websiteUrl, computed, pending, q}, plugins.pagespeed)
Plugins.lines({login, repositories:data.user.repositories.nodes.map(({name}) => name), rest, computed, pending, q}, plugins.lines)
Plugins.traffic({login, repositories:data.user.repositories.nodes.map(({name}) => name), rest, computed, pending, q}, plugins.traffic)
Plugins.habits({login, rest, computed, pending, q}, plugins.habits)
//Iterate through user's repositories
for (const repository of data.user.repositories.nodes) {

57
src/plugins/habits/index.mjs Normal file
View File

@@ -0,0 +1,57 @@
//Setup
export default function ({login, rest, computed, pending, q}, {enabled = false, from = 50} = {}) {
//Check if plugin is enabled and requirements are met
if (!enabled)
return computed.plugins.habits = null
if (!q.habits)
return computed.plugins.habits = null
console.debug(`metrics/plugins/habits/${login} > started`)
//Plugin execution
pending.push(new Promise(async solve => {
try {
//Initialization
const habits = {commits:{hour:NaN, hours:{}}, indents:{style:"", spaces:0, tabs:0}}
//Get user recent commits from events
const events = await rest.activity.listEventsForAuthenticatedUser({username:login, per_page:from})
const commits = events.data
.filter(({type}) => type === "PushEvent")
.filter(({actor}) => actor.login === login)
//Commit hour
{
//Compute commit hours
const hours = commits.map(({created_at}) => (new Date(created_at)).getHours())
for (const hour of hours)
habits.commits.hours[hour] = (habits.commits.hours[hour] || 0) + 1
//Compute hour with most commits
habits.commits.hour = hours.length ? Object.entries(habits.commits.hours).sort(([an, a], [bn, b]) => b - a).map(([hour, occurence]) => hour)[0] : NaN
}
//Indent style
{
//Retrieve edited files
const edited = await Promise.allSettled(commits
.flatMap(({payload}) => payload.commits).map(commit => commit.url)
.map(async commit => (await rest.request(commit)).data.files)
)
//Attemp to guess whether tabs or spaces are used from patch
edited
.filter(({status}) => status === "fulfilled")
.map(({value}) => value)
.flatMap(files => files.flatMap(file => (file.patch||"").match(/(?<=^[+])((?:\t)|(?: )) /gm)||[]))
.forEach(indent => habits.indents[/^\t/.test(indent) ? "tabs" : "spaces"]++)
//Compute indent style
habits.indents.style = habits.indents.spaces > habits.indents.tabs ? "spaces" : habits.indents.tabs > habits.indents.spaces ? "tabs" : ""
}
//Save results
computed.plugins.habits = habits
console.debug(`metrics/plugins/habits/${login} > ${JSON.stringify(computed.plugins.habits)}`)
solve()
}
catch (error) {
//Generic error
computed.plugins.habits = {error:`An error occured`}
console.debug(error)
solve()
}
}))
}

2
src/plugins/index.mjs
View File

@@ -1,10 +1,12 @@
//Imports
import habits from "./habits/index.mjs"
import lines from "./lines/index.mjs"
import pagespeed from "./pagespeed/index.mjs"
import traffic from "./traffic/index.mjs"
//Exports
export default {
habits,
lines,
pagespeed,
traffic,

7
src/plugins/lines/index.mjs
View File

@@ -16,7 +16,7 @@
console.debug(`metrics/plugins/lines/${login} > started`)
//Plugin execution
pending.push(new Promise(async (solve, reject) => {
pending.push(new Promise(async solve => {
try {
//Get contributors stats from repositories
const lines = {added:0, deleted:0}
@@ -41,7 +41,10 @@
solve()
}
catch (error) {
reject(error)
//Generic error
computed.plugins.pagespeed = {error:`An error occured`}
console.debug(error)
solve()
}
}))
}

11
src/plugins/pagespeed/index.mjs
View File

@@ -15,7 +15,7 @@
console.debug(`metrics/plugins/pagespeed/${login} > started`)
//Plugin execution
pending.push(new Promise(async (solve, reject) => {
pending.push(new Promise(async solve => {
try {
//Format url if needed
if (!/^https?:[/][/]/.test(url))
@@ -36,11 +36,12 @@
if ((error.response)&&(error.response.status)) {
computed.plugins.pagespeed = {url, error:`PageSpeed token error (code ${error.response.status})`}
console.debug(`metrics/plugins/traffic/${login} > ${error.response.status}`)
solve()
return
return solve()
}
console.log(error)
reject(error)
//Generic error
computed.plugins.pagespeed = {error:`An error occured`}
console.debug(error)
solve()
}
}))
}

10
src/plugins/traffic/index.mjs
View File

@@ -16,7 +16,7 @@
console.debug(`metrics/plugins/traffic/${login} > started`)
//Plugin execution
pending.push(new Promise(async (solve, reject) => {
pending.push(new Promise(async solve => {
try {
//Get views stats from repositories
const views = {count:0, uniques:0}
@@ -36,10 +36,12 @@
if (error.status === 403) {
computed.plugins.traffic = {error:`Insufficient token rights`}
console.debug(`metrics/plugins/traffic/${login} > ${error.status}`)
solve()
return
return solve()
}
reject(error)
//Generic error
computed.plugins.traffic = {error:`An error occured`}
console.debug(error)
solve()
}
}))
}

7
src/style.css
View File

@@ -107,6 +107,13 @@
flex-grow: 0;
}
/* Habits */
.habits {
margin: 0;
list-style-type: none;
padding-left: 37px;
}
/* Footer */
footer {
margin-top: 8px;

26
src/template.svg
View File

@@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="${536 + (computed.plugins.pagespeed ? 100 : 0)}">
<svg xmlns="http://www.w3.org/2000/svg" width="480" height="${485 + ((computed.plugins.lines||computed.plugins.traffic) ? 20 : 0) + (computed.plugins.pagespeed ? 130 : 0) + (computed.plugins.habits ? 70 : 0)}">
<style>
${style}
</style>
@@ -274,6 +274,30 @@
</section>` : ""
}
${computed.plugins.habits ? `
<section>
<h2 class="field">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8 1.5c-2.363 0-4 1.69-4 3.75 0 .984.424 1.625.984 2.304l.214.253c.223.264.47.556.673.848.284.411.537.896.621 1.49a.75.75 0 01-1.484.211c-.04-.282-.163-.547-.37-.847a8.695 8.695 0 00-.542-.68c-.084-.1-.173-.205-.268-.32C3.201 7.75 2.5 6.766 2.5 5.25 2.5 2.31 4.863 0 8 0s5.5 2.31 5.5 5.25c0 1.516-.701 2.5-1.328 3.259-.095.115-.184.22-.268.319-.207.245-.383.453-.541.681-.208.3-.33.565-.37.847a.75.75 0 01-1.485-.212c.084-.593.337-1.078.621-1.489.203-.292.45-.584.673-.848.075-.088.147-.173.213-.253.561-.679.985-1.32.985-2.304 0-2.06-1.637-3.75-4-3.75zM6 15.25a.75.75 0 01.75-.75h2.5a.75.75 0 010 1.5h-2.5a.75.75 0 01-.75-.75zM5.75 12a.75.75 0 000 1.5h4.5a.75.75 0 000-1.5h-4.5z"></path></svg>
Coding habits
</h2>
<div class="row">
${computed.plugins.habits.error ? `
<section>
<div class="field error">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M4.47.22A.75.75 0 015 0h6a.75.75 0 01.53.22l4.25 4.25c.141.14.22.331.22.53v6a.75.75 0 01-.22.53l-4.25 4.25A.75.75 0 0111 16H5a.75.75 0 01-.53-.22L.22 11.53A.75.75 0 010 11V5a.75.75 0 01.22-.53L4.47.22zm.84 1.28L1.5 5.31v5.38l3.81 3.81h5.38l3.81-3.81V5.31L10.69 1.5H5.31zM8 4a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 018 4zm0 8a1 1 0 100-2 1 1 0 000 2z"></path></svg>
${computed.plugins.habits.error}
</div>
</section>
` : `
<ul class="habits">
${computed.plugins.habits.indents.style ? `<li>Use ${computed.plugins.habits.indents.style} for indents</li>` : ""}
${!Number.isNaN(computed.plugins.habits.commits.hour) ? `<li>Mostly push code around ${computed.plugins.habits.commits.hour}:00</li>` : ""}
</ul>
`}
</div>
</section>` : ""
}
<footer>
Last updated ${new Date()}
</footer>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 29 KiB

After

Width:  |  Height:  |  Size: 31 KiB