Merge branch 'master' of https://github.com/lowlighter/metrics
This commit is contained in:
@@ -188,9 +188,17 @@ export default async function({mock, nosettings} = {}) {
|
||||
"activity.limit":100,
|
||||
"activity.days":0,
|
||||
notable:true,
|
||||
followup:true,
|
||||
"followup.sections":"repositories, user",
|
||||
habits:true,
|
||||
"habits.from":100,
|
||||
"habits.days":7,
|
||||
"habits.facts":false,
|
||||
"habits.charts":true,
|
||||
introduction:true
|
||||
},
|
||||
},
|
||||
{graphql, rest, plugins:{achievements:{enabled:true}, isocalendar:{enabled:true}, languages:{enabled:true}, activity:{enabled:true, markdown:"extended"}, notable:{enabled:true}}, conf, convert:"json"},
|
||||
{graphql, rest, plugins:{achievements:{enabled:true}, isocalendar:{enabled:true}, languages:{enabled:true}, activity:{enabled:true, markdown:"extended"}, notable:{enabled:true}, followup:{enabled:true}, habits:{enabled:true}, introduction:{enabled:true}}, conf, convert:"json"},
|
||||
{Plugins, Templates},
|
||||
)
|
||||
//Cache
|
||||
|
||||
@@ -76,6 +76,10 @@
|
||||
</a>
|
||||
</section>
|
||||
|
||||
<section class="container text-center">
|
||||
{{ introduction }}
|
||||
</section>
|
||||
|
||||
<div class="rankeds">
|
||||
<div v-for="{icon, title, text, rank, progress, value, leaderboard = null} in ranked" class="ranked" :class="{[rank.charAt(0).toLocaleLowerCase()]:rank !== '$', secret:rank === '$'}">
|
||||
<div class="icon">
|
||||
@@ -165,6 +169,56 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="container" v-if="followup">
|
||||
<h2>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M1.5 8a6.5 6.5 0 0110.65-5.003.75.75 0 00.959-1.153 8 8 0 102.592 8.33.75.75 0 10-1.444-.407A6.5 6.5 0 011.5 8zM8 12a1 1 0 100-2 1 1 0 000 2zm0-8a.75.75 0 01.75.75v3.5a.75.75 0 11-1.5 0v-3.5A.75.75 0 018 4zm4.78 4.28l3-3a.75.75 0 00-1.06-1.06l-2.47 2.47-.97-.97a.749.749 0 10-1.06 1.06l1.5 1.5a.75.75 0 001.06 0z"></path></svg>
|
||||
Overall status of related issues and pull requests
|
||||
</h2>
|
||||
<div class="followup">
|
||||
<template v-for="{type, section} in [{type:'repositories', section:followup}, {type:'user', section:followup.user||{}}]">
|
||||
<div class="followup-section" v-if="section.issues">
|
||||
<h3>Issues {{ {repositories:`opened on ${account.login}'${[...account.login].pop() === "s" ? "" : "s"} repositories`, user:`opened by ${account.login}`}[type] || "" }}</h3>
|
||||
<div class="progress-bars">
|
||||
<div class="progress" :style="{width:`${100*section.issues.open/section.issues.count}%`, backgroundColor:'#28a745'}"></div>
|
||||
<div class="progress" :style="{width:`${100*section.issues.closed/section.issues.count}%`, backgroundColor:'#d73a49'}"></div>
|
||||
</div>
|
||||
<div class="legend">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#28a745" fill-rule="evenodd" d="M8 1.5a6.5 6.5 0 100 13 6.5 6.5 0 000-13zM0 8a8 8 0 1116 0A8 8 0 010 8zm9 3a1 1 0 11-2 0 1 1 0 012 0zm-.25-6.25a.75.75 0 00-1.5 0v3.5a.75.75 0 001.5 0v-3.5z"></path></svg>
|
||||
{{ section.issues.open }} open
|
||||
</div>
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#d73a49" fill-rule="evenodd" d="M1.5 8a6.5 6.5 0 0110.65-5.003.75.75 0 00.959-1.153 8 8 0 102.592 8.33.75.75 0 10-1.444-.407A6.5 6.5 0 011.5 8zM8 12a1 1 0 100-2 1 1 0 000 2zm0-8a.75.75 0 01.75.75v3.5a.75.75 0 11-1.5 0v-3.5A.75.75 0 018 4zm4.78 4.28l3-3a.75.75 0 00-1.06-1.06l-2.47 2.47-.97-.97a.749.749 0 10-1.06 1.06l1.5 1.5a.75.75 0 001.06 0z"></path></svg>
|
||||
{{ section.issues.closed }} closed
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="followup-section" v-if="section.pr">
|
||||
<h3>Pull requests {{ {repositories:`opened on ${account.login}'${[...account.login].pop() === "s" ? "" : "s"} repositories`, user:`opened by ${account.login}`}[type] || "" }}</h3>
|
||||
<div class="progress-bars">
|
||||
<div class="progress" :style="{width:`${100*section.pr.open/section.pr.count}%`, backgroundColor:'#28a745'}"></div>
|
||||
<div class="progress" :style="{width:`${100*section.pr.closed/section.pr.count}%`, backgroundColor:'#d73a49'}"></div>
|
||||
<div class="progress" :style="{width:`${100*section.pr.merged/section.pr.merged}%`, backgroundColor:'#6f42c1'}"></div>
|
||||
</div>
|
||||
<div class="legend">
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#28a745" fill-rule="evenodd" d="M7.177 3.073L9.573.677A.25.25 0 0110 .854v4.792a.25.25 0 01-.427.177L7.177 3.427a.25.25 0 010-.354zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm-2.25.75a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM11 2.5h-1V4h1a1 1 0 011 1v5.628a2.251 2.251 0 101.5 0V5A2.5 2.5 0 0011 2.5zm1 10.25a.75.75 0 111.5 0 .75.75 0 01-1.5 0zM3.75 12a.75.75 0 100 1.5.75.75 0 000-1.5z"></path></svg>
|
||||
{{ section.pr.open }} open
|
||||
</div>
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#d73a49" fill-rule="evenodd" d="M7.177 3.073L9.573.677A.25.25 0 0110 .854v4.792a.25.25 0 01-.427.177L7.177 3.427a.25.25 0 010-.354zM3.75 2.5a.75.75 0 100 1.5.75.75 0 000-1.5zm-2.25.75a2.25 2.25 0 113 2.122v5.256a2.251 2.251 0 11-1.5 0V5.372A2.25 2.25 0 011.5 3.25zM11 2.5h-1V4h1a1 1 0 011 1v5.628a2.251 2.251 0 101.5 0V5A2.5 2.5 0 0011 2.5zm1 10.25a.75.75 0 111.5 0 .75.75 0 01-1.5 0zM3.75 12a.75.75 0 100 1.5.75.75 0 000-1.5z"></path></svg>
|
||||
{{ section.pr.closed }} closed
|
||||
</div>
|
||||
<div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill="#6f42c1" fill-rule="evenodd" d="M5 3.254V3.25v.005a.75.75 0 110-.005v.004zm.45 1.9a2.25 2.25 0 10-1.95.218v5.256a2.25 2.25 0 101.5 0V7.123A5.735 5.735 0 009.25 9h1.378a2.251 2.251 0 100-1.5H9.25a4.25 4.25 0 01-3.8-2.346zM12.75 9a.75.75 0 100-1.5.75.75 0 000 1.5zm-8.5 4.5a.75.75 0 100-1.5.75.75 0 000 1.5z"></path></svg>
|
||||
{{ section.pr.merged }} merged
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="container" v-if="account.type === 'user'">
|
||||
<div class="isocalendar">
|
||||
<h2>
|
||||
@@ -175,6 +229,20 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="container" v-if="(account.type === 'user')&&(habits)">
|
||||
<h2>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M6 2a.75.75 0 01.696.471L10 10.731l1.304-3.26A.75.75 0 0112 7h3.25a.75.75 0 010 1.5h-2.742l-1.812 4.528a.75.75 0 01-1.392 0L6 4.77 4.696 8.03A.75.75 0 014 8.5H.75a.75.75 0 010-1.5h2.742l1.812-4.529A.75.75 0 016 2z"></path></svg>
|
||||
Average commits per day over the last week
|
||||
</h2>
|
||||
<div class="chart-bars">
|
||||
<div class="entry" v-for="h in 24">
|
||||
<span class="value">{{ habits[h] }}</span>
|
||||
<div class="bar" :style="{height:(habits[h]/habits.max)*150, backgroundColor:`var(--color-calendar-graph-day-L${Math.ceil((habits[h]/habits.max)/0.25)}-bg)`}"></div>
|
||||
<span class="label">{{ `${h}`.padStart(2, 0) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="container">
|
||||
<div class="activity">
|
||||
<h2>
|
||||
|
||||
@@ -98,6 +98,15 @@
|
||||
achievements() {
|
||||
return this.metrics?.rendered.plugins.achievements.list?.filter(({ leaderboard }) => !leaderboard).filter(({ title }) => !/(?:automater|octonaut|infographile)/i.test(title)) ?? []
|
||||
},
|
||||
introduction() {
|
||||
return this.metrics?.rendered.plugins.introduction?.text ?? ""
|
||||
},
|
||||
followup() {
|
||||
return this.metrics?.rendered.plugins.followup ?? null
|
||||
},
|
||||
habits() {
|
||||
return this.metrics?.rendered.plugins.habits.commits.hours ?? null
|
||||
},
|
||||
isocalendar() {
|
||||
return (this.metrics?.rendered.plugins.isocalendar.svg ?? "")
|
||||
.replace(/#ebedf0/gi, "var(--color-calendar-graph-day-bg)")
|
||||
|
||||
@@ -11,6 +11,9 @@
|
||||
align-items: center;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Search */
|
||||
.search {
|
||||
@@ -82,6 +85,33 @@
|
||||
box-shadow: 0 0 0 1px var(--color-avatar-border);
|
||||
}
|
||||
|
||||
/** Progress bars */
|
||||
.progress-bars {
|
||||
display: flex;
|
||||
margin: .5rem 0;
|
||||
}
|
||||
.progress {
|
||||
height: 8px;
|
||||
border-radius: 6px;
|
||||
outline: 1px solid transparent;
|
||||
}
|
||||
.progress:not(:last-child) {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
.progress:not(:first-child) {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
.legend {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.legend > * {
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
/* Languages */
|
||||
.languages .list {
|
||||
display: flex;
|
||||
@@ -99,10 +129,16 @@
|
||||
font-size: .8rem;
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
.progress {
|
||||
height: 8px;
|
||||
border-radius: 6px;
|
||||
outline: 1px solid transparent;
|
||||
|
||||
/* Followup */
|
||||
.followup {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: row;
|
||||
}
|
||||
.followup .followup-section {
|
||||
width: 100%;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
|
||||
/* Isocalendar */
|
||||
@@ -240,6 +276,32 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Charts */
|
||||
.chart-bars {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-end;
|
||||
width: 100%;
|
||||
height: 12rem;
|
||||
overflow: auto;
|
||||
}
|
||||
.chart-bars .entry {
|
||||
flex: 1 1 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.chart-bars .entry .value {
|
||||
color: var(--color-text-secondary);
|
||||
font-size: .8rem;
|
||||
}
|
||||
.chart-bars .entry .label {
|
||||
margin: 0 .25rem;
|
||||
}
|
||||
.chart-bars .bar {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Icon gauges */
|
||||
.gauge {
|
||||
stroke-linecap: round;
|
||||
@@ -387,6 +449,10 @@
|
||||
.languages .language {
|
||||
width: 25%;
|
||||
}
|
||||
.followup .followup-section {
|
||||
width: calc(50% - 1rem);
|
||||
margin-right: 1rem;
|
||||
}
|
||||
.search {
|
||||
width: 520px;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user