Skip to content

Commit b958ebe

Browse files
PrabhaniNPrabhaniN
authored
Merge pull request #2 from PrabhaniN/dev
List org contributors
2 parents e9d24e7 + db4c645 commit b958ebe

17 files changed

+587
-20
lines changed

‎README.md

+29-20
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,54 @@
11
# About Codebadge
2+
3+
[![Online Status](https://img.shields.io/website/http/prabhani.me/Codebadge.svg?down_message=offline&up_message=online)](http://prabhani.me/Codebadge)
4+
[![Build Status](https://travis-ci.com/PrabhaniN/Codebadge.svg?branch=master)](https://travis-ci.com/PrabhaniN/Codebadge)
5+
![Language Count](https://img.shields.io/github/languages/count/PrabhaniN/codebadge.svg)
6+
[![License](https://img.shields.io/github/license/PrabhaniN/codebadge.svg)](https://github.com/PrabhaniN/Codebadge/blob/master/LICENSE)
7+
28
Well we all have been working in Open Source and committing various Pull requests and issues. Many a times it may happen that a mentor is unanle to manage all these activities. So This project is about tracking the contributor as well as its contribution by respective mentors.
39

410
### Features
511

6-
- Easy to monitor the activities of various contributors.
7-
- Visibility of top contributors in various projects.
8-
- Real time tracking of commits, PR's and other contributions.
9-
- Contributors list based on number of PR's, merged pulls and other activities.
10-
- Contribution history of each contributor.
12+
- Easy to monitor the activities of various contributors.
13+
- Visibility of top contributors in various projects.
14+
- Real time tracking of commits, PR's and other contributions.
15+
- Contributors list based on number of PR's, merged pulls and other activities.
16+
- Contribution history of each contributor.
1117

1218
The other part of this project includes the “notifying moderator” since we see sometimes that there are many PRs being sent, or issues being opened by various people across the globe but there are limited numbers of maintainers merging the PRs. This way organisations usually lose their potential contributors due to following things:
1319

14-
- Their PRs are not being merged
15-
- They finds difficulty in understanding the issue
16-
- They could not reach to expectation
17-
So this will help the maintainers get notified when they see these people inactive.
20+
- Their PRs are not being merged
21+
- They finds difficulty in understanding the issue
22+
- They could not reach to expectation
23+
So this will help the maintainers get notified when they see these people inactive.
1824

1925
## How does it work
26+
2027
For instance, suppose a contributor “X” has been quite active within the community by working on various PRs, opening and resolving various issues, active on chat channels but after a month “X” gets disappeared. So by using this dashboard they will have a badge interface. There will be a badge attached in front of the name of the contributor. Let the name of the badge be “Y” so this badge will have a unique color. So as the time passes like “ a day went, 1 week went, 2 weeks went, a month, etc) this badges will get keep on fading. And Every fade color will have a unique reason. For example, when a contributor made a PR, the badge appeared “Red” in color. This badge will remain in the same color as long as he/she is contributing. Assume that contributor stops contributing and has not contributed for a week so his badge will become green in color. And this will keep on notifying mainaters, Admins about their disappearing. This way the organisations will have greater eye on the contributors and can help them sustain with the community.
2128

2229
## Stack used
30+
2331
This will have a dashboard, where these things can be placed. The stack used can be any but since the organisation have fixed stack so its better to stick to Nodejs, Vue, React.
2432

2533
## Benefits to the community
34+
2635
Different communities or programs like “GirlScript Summer of Code, Codeheat, GSOC, etc would be able to track their contributors and this project will help them by not losing potential contributors and select the best from all potential candidates.
2736

2837
## Contributions Best Practices
38+
2939
**Commits**
3040

31-
- Write clear meaningful git commit messages (Do read http://chris.beams.io/posts/git-commit/)
32-
- Make sure your PR's description contains GitHub's special keyword references that automatically close the related issue when the PR is merged. (More info at https://github.com/blog/1506-closing-issues-via-pull-requests )
33-
- When you make very very minor changes to a PR of yours (like for example fixing a failing Travis build or some small style corrections or minor changes requested by reviewers) make sure you squash your commits afterward so that you don't have an absurd number of commits for a very small fix. (Learn how to squash at https://davidwalsh.name/squash-commits-git )
34-
- When you're submitting a PR for a UI-related issue, it would be really awesome if you add a screenshot of your change or a link to a deployment where it can be tested out along with your PR. It makes it very easy for the reviewers and you'll also get reviews quicker.
41+
- Write clear meaningful git commit messages (Do read http://chris.beams.io/posts/git-commit/)
42+
- Make sure your PR's description contains GitHub's special keyword references that automatically close the related issue when the PR is merged. (More info at https://github.com/blog/1506-closing-issues-via-pull-requests )
43+
- When you make very very minor changes to a PR of yours (like for example fixing a failing Travis build or some small style corrections or minor changes requested by reviewers) make sure you squash your commits afterward so that you don't have an absurd number of commits for a very small fix. (Learn how to squash at https://davidwalsh.name/squash-commits-git )
44+
- When you're submitting a PR for a UI-related issue, it would be really awesome if you add a screenshot of your change or a link to a deployment where it can be tested out along with your PR. It makes it very easy for the reviewers and you'll also get reviews quicker.
3545

3646
## Community
37-
All feedback and suggestions are welcome!
38-
39-
- 💬 Join the community on [Slack](https://join.slack.com/t/codeuino/shared_invite/enQtMzcxOTQwNzE4NzcxLWEyNzUxYjI0ZThiNWUyYWI5MzJlMTNmODMxN2NjMTcxODJkZmFhNTVkYmUyOTQ1YzgzNTlmMTVkYzVhMzdmNTQ )
40-
- 📣 Stay up to date on new features and announcements on the following
41-
- [@Mailing List]([email protected]).
42-
- [@Discussion Portal](https://groups.google.com/d/forum/codeuino-devel).
43-
- [@Codeuino Wiki](wiki.codeuino.org).
4447

48+
All feedback and suggestions are welcome!
4549

50+
- 💬 Join the community on [Slack](https://join.slack.com/t/codeuino/shared_invite/enQtMzcxOTQwNzE4NzcxLWEyNzUxYjI0ZThiNWUyYWI5MzJlMTNmODMxN2NjMTcxODJkZmFhNTVkYmUyOTQ1YzgzNTlmMTVkYzVhMzdmNTQ)
51+
- 📣 Stay up to date on new features and announcements on the following
52+
- [@Mailing List]([email protected]).
53+
- [@Discussion Portal](https://groups.google.com/d/forum/codeuino-devel).
54+
- [@Codeuino Wiki](wiki.codeuino.org).

‎src/assets/loaders/bars.svg

+1
Loading

‎src/assets/loaders/block.svg

+17
Loading

‎src/components/auth/Login.vue

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
<template>
2+
<div>
3+
<div>
4+
<v-layout justify-center>
5+
<i class="fab fa-github-square i-github"></i>
6+
</v-layout>
7+
</div>
8+
<v-btn class="btn-login" v-if="!isLoading" outline @click="login">Login with GitHub</v-btn>
9+
<v-btn class="btn-login" v-if="isLoading" outline>
10+
<img src="@/assets/loaders/bars.svg" alt="loading...">
11+
</v-btn>
12+
</div>
13+
</template>
14+
15+
<script>
16+
import axios from 'axios';
17+
import AuthHelper from '../../config/AuthHelper';
18+
import AxiosHelper from '../../config/AxiosHelper';
19+
20+
export default {
21+
name: 'Login',
22+
data() {
23+
return {
24+
isLoading: false
25+
};
26+
},
27+
methods: {
28+
login() {
29+
window.location = `${AxiosHelper.authUrl}?client_id=${
30+
AuthHelper.clientId
31+
}&scope=user%20repo%20read:org`;
32+
}
33+
},
34+
created() {
35+
const code = window.location.href.match(/\?code=(.*)/);
36+
if (code) {
37+
this.isLoading = true;
38+
axios
39+
.get(`${AxiosHelper.gatekeeperUrl}/${code[1].slice(0, 20)}`)
40+
.then(res => {
41+
this.isLoading = false;
42+
localStorage.setItem('token', res.data.token);
43+
window.location = AxiosHelper.homeUrl;
44+
})
45+
.catch(err => {
46+
this.isLoading = false;
47+
console.log(err);
48+
});
49+
}
50+
}
51+
};
52+
</script>
53+
54+
<style lang="scss" scoped>
55+
.i-github {
56+
font-size: 64px;
57+
}
58+
59+
.btn-login {
60+
width: 170px;
61+
}
62+
</style>

‎src/components/home/OrgList.vue

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<template>
2+
<div>
3+
<v-card flat>
4+
<v-list>
5+
<v-list-tile
6+
v-for="org in orgsData"
7+
:key="org.name"
8+
@click="viewOrg(org.name)"
9+
avatar
10+
ripple
11+
>
12+
<v-list-tile-avatar>
13+
<img :src="org.avatar">
14+
</v-list-tile-avatar>
15+
16+
<v-list-tile-content>
17+
<v-list-tile-title v-html="org.name"></v-list-tile-title>
18+
</v-list-tile-content>
19+
</v-list-tile>
20+
</v-list>
21+
</v-card>
22+
</div>
23+
</template>
24+
25+
<script>
26+
export default {
27+
name: 'OrgList',
28+
computed: {
29+
orgsData() {
30+
return this.$store.getters.orgsData;
31+
}
32+
},
33+
methods: {
34+
viewOrg(name) {
35+
this.$router.push({ name: 'orgView', params: { name: name } });
36+
}
37+
}
38+
};
39+
</script>
40+
41+
<style lang="scss" scoped>
42+
</style>

‎src/components/home/UserDetails.vue

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<template>
2+
<div>
3+
<v-card flat ripple>
4+
<v-layout justify-center row>
5+
<v-flex>
6+
<v-avatar size="80">
7+
<img :src="userData.dp">
8+
</v-avatar>
9+
</v-flex>
10+
<v-flex>
11+
<div class="username ml-3">{{userData.username}}</div>
12+
<div class="github-name ml-3">{{userData.githubName}}</div>
13+
</v-flex>
14+
</v-layout>
15+
</v-card>
16+
</div>
17+
</template>
18+
19+
<script>
20+
export default {
21+
name: 'UserDetails',
22+
computed: {
23+
userData() {
24+
return this.$store.getters.userData;
25+
}
26+
}
27+
};
28+
</script>
29+
30+
<style lang="scss" scoped>
31+
.username {
32+
font-size: 20px;
33+
}
34+
.github-name {
35+
color: grey;
36+
font-size: 15px;
37+
}
38+
</style>

‎src/components/org/ContributorItem.vue

+69
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
<template>
2+
<div>
3+
<v-list-tile avatar>
4+
<!-- <div> -->
5+
<v-layout justify-space-between>
6+
<div>
7+
<v-list-tile-title v-html="author"></v-list-tile-title>
8+
</div>
9+
<div class="mx-5">
10+
<div class="badge-simple" :style="{backgroundColor: getColor()}"></div>
11+
</div>
12+
</v-layout>
13+
<!-- </div> -->
14+
<!-- <div>
15+
<v-list-tile-title>{ Total commits: {{total}}, Last commit: {{getLastWeek()}} week(s) ago }</v-list-tile-title>
16+
</div>-->
17+
</v-list-tile>
18+
</div>
19+
</template>
20+
21+
<script>
22+
export default {
23+
name: 'ContributorItem',
24+
props: {
25+
author: {
26+
type: String
27+
},
28+
weeks: {
29+
type: Array
30+
},
31+
total: {
32+
type: Number
33+
}
34+
},
35+
data() {
36+
return {
37+
reversedWeeks: this.weeks.reverse()
38+
};
39+
},
40+
methods: {
41+
getLastWeek() {
42+
return this.reversedWeeks.findIndex(week => week.c != 0);
43+
},
44+
getColor() {
45+
let value = this.getLastWeek();
46+
47+
if (value == 1) return '#1B5E20';
48+
else if (value == 2) return '#2E7D32';
49+
else if (value == 3) return '#66BB6A';
50+
else if (3 < value && value <= 5) return '#A5D6A7';
51+
else if (5 < value && value <= 8) return '#FFF9C4';
52+
else if (8 < value && value <= 16) return '#FFF176';
53+
else if (16 < value && value <= 32) return '#F9A825';
54+
else if (32 < value && value <= 56) return '#FF6F00';
55+
else if (56 < value && value <= 84) return '#E65100';
56+
else if (84 < value && value <= 112) return '#FF3D00';
57+
else if (112 < value) return '#78909C';
58+
}
59+
}
60+
};
61+
</script>
62+
63+
<style lang="scss" scoped>
64+
.badge-simple {
65+
width: 20px;
66+
height: 20px;
67+
border-radius: 4px;
68+
}
69+
</style>

‎src/components/org/Org.vue

+81
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
<template>
2+
<div>
3+
<div v-if="!isLoading">
4+
<v-card flat>
5+
<OrgDetails :dp="org.avatar_url" :name="org.login"/>
6+
<OrgRepos :orgName="org.login" :repos="orgRepos"/>
7+
</v-card>
8+
</div>
9+
10+
<div v-if="isLoading">
11+
<img src="@/assets/loaders/block.svg" alt="loading...">
12+
</div>
13+
</div>
14+
</template>
15+
16+
<script>
17+
import OrgDetails from './OrgDetails';
18+
import OrgRepos from './OrgRepos';
19+
import axios from 'axios';
20+
import AxiosHelper from '../../config/AxiosHelper';
21+
import AuthService from '../../services/authService';
22+
23+
const authService = new AuthService();
24+
25+
export default {
26+
name: 'Org',
27+
data() {
28+
return {
29+
org: [],
30+
orgRepos: [],
31+
isLoading: false
32+
};
33+
},
34+
components: {
35+
OrgDetails,
36+
OrgRepos
37+
},
38+
computed: {
39+
name() {
40+
return this.$route.params.name;
41+
}
42+
},
43+
methods: {
44+
loadOrg() {
45+
axios
46+
.get(`${AxiosHelper.baseUrl}/orgs/${this.name}`, {
47+
headers: {
48+
Authorization: `token ${authService.getToken()}`
49+
}
50+
})
51+
.then(res => {
52+
this.org = res.data;
53+
this.loadOrgRepos();
54+
})
55+
.catch(err => console.log(err));
56+
},
57+
58+
//Can be done in a single call
59+
loadOrgRepos() {
60+
axios
61+
.get(`${AxiosHelper.baseUrl}/orgs/${this.name}/repos`, {
62+
headers: {
63+
Authorization: `token ${authService.getToken()}`
64+
}
65+
})
66+
.then(res => {
67+
this.isLoading = false;
68+
this.orgRepos = res.data;
69+
})
70+
.catch(err => console.log(err));
71+
}
72+
},
73+
created() {
74+
this.isLoading = true;
75+
this.loadOrg();
76+
}
77+
};
78+
</script>
79+
80+
<style lang="scss" scoped>
81+
</style>

0 commit comments

Comments
 (0)