[reposense#1726] Use respective icons for known repository types (rep…

…osense#1800)

Currently, 'database' is used as the generic icon for all repository 
types.

As we allow more repository types, it will be clearer to the user if 
the icon reflects the repository used. Currently we are supporting 
'GitHub', 'GitLab', and 'BitBucket'. 'database' icon is kept as the 
default icon for repositories that does not belong to any of the above 
mentioned.

Let's use the respective icons for known repository types.

frontend/src/components/v-summary-charts.vue

@@ -41,7 +41,7 @@
         v-bind:href="getRepoLink(repo[0])", target="_blank"
       )
         .tooltip
-          font-awesome-icon.icon-button(:icon="['fas', 'database']")
+          font-awesome-icon.icon-button(:icon="getRepoIcon(repo[0])")
           span.tooltip-text Click to view group's repo
       a(
         v-else-if="filterGroupSelection === 'groupByAuthors'",
@@ -104,7 +104,7 @@
           v-bind:href="getRepoLink(repo[j])", target="_blank"
         )
           .tooltip
-            font-awesome-icon.icon-button(:icon="['fas', 'database']")
+            font-awesome-icon.icon-button(:icon="getRepoIcon(repo[0])")
             span.tooltip-text Click to view repo
         a(
           v-if="filterGroupSelection !== 'groupByAuthors'",
@@ -316,6 +316,21 @@ export default {
       return repo.location;
     },
 
+    getRepoIcon(repo) {
+      const domainName = window.REPOS[repo.repoId].location.domainName;
+
+      switch (domainName) {
+      case 'github':
+        return ['fab', 'github'];
+      case 'gitlab':
+        return ['fab', 'gitlab'];
+      case 'bitbucket':
+        return ['fab', 'bitbucket'];
+      default:
+        return ['fas', 'database'];
+      }
+    },
+
     // triggering opening of tabs //
     openTabAuthorship(user, repo, index, isMerged) {
       const {

frontend/src/utils/load-font-awesome-icons.js

@@ -7,6 +7,10 @@ import {
   faDatabase,
 } from '@fortawesome/free-solid-svg-icons';
 
+import {
+  faGithub, faGitlab, faBitbucket,
+} from '@fortawesome/free-brands-svg-icons';
+
 // app
 library.add(faExclamation, faSpinner, faCode, faListUl);
 
@@ -17,7 +21,8 @@ library.add(faCaretRight);
 library.add(faExclamation);
 
 // v-summary-charts
-library.add(faChevronUp, faChevronDown, faDatabase, faUser, faCode, faListUl, faCircle);
+library.add(faChevronUp, faChevronDown, faDatabase, faUser, faCode, faListUl, faCircle, faGithub, faGitlab,
+    faBitbucket);
 
 // v-zoom
 library.add(faTags, faEllipsisH);