showed PRs from Technigo and filtered to show only my PRs

Author: Kara Howes

code/chart.js

@@ -13,7 +13,7 @@ const drawChart = (amount) =>{
         ],
         datasets: [{
           label: 'My First Dataset',
-          data: [amount , 24-amount],
+          data: [amount , 20-amount],
           backgroundColor: [
             'rgb(255, 99, 132)',
             'rgb(54, 162, 235)'

code/script.js

@@ -3,17 +3,20 @@ const repoURL = `https://api.github.com/users/${USER}/repos`
 const projectsContainer = document.getElementById('projects')
 const cardsContainer = document.getElementById('cards-container')
 
-const getRepos = ()=>{
 
+
+const getRepos = ()=>{
+    // This function fetches the data from the Githug API
     fetch(repoURL)
     .then(response => response.json())
     .then(data => {
-        console.log(data)
-        //projectsContainer.innerHTML = `The name of your first project was ${data[0].name}`
 
-        const forkedProjects = data.filter(repo => repo.fork && repo.name.startsWith('project-'))
+        //console.log(data)
+      //Here, I filter only the projects forked from Technigo, starting from 2021 (since I have earlier projects also forked from Technigo)  
+        const forkedProjects = data.filter(repo => repo.fork && repo.name.startsWith('project-') && repo.created_at.startsWith('2021-'))
+      // Here I update the projectsContainer.innerHTML to show a list of all forked repos  
         forkedProjects.forEach(repo => projectsContainer.innerHTML += `<h3>${repo.name}</h3>`)
-
+        // Here I update the cards.Container to show cards with data extracted from the GitHUb API
         forkedProjects.forEach(repo => cardsContainer.innerHTML += `
         <section class="js-card">
       <div class="card-projectname" id="cardProjectName">   
@@ -25,26 +28,55 @@ const getRepos = ()=>{
       Name of default branch:  ${repo.default_branch}    
         </div>
          <div class= "URL" id="cardURL">
-      URL: ${repo.url}   
+      URL: <a href="${repo.svn_url} ">Clicky</a> 
         </div>
         <div class= "number-commits" id="cardCommits">
       Number of commit Messages:   
         </div>
-         <div class= "blank-line" id="cardBlank">
-      blank   
+         <div class= "times-forked" id="cardForked">
+      Number of times forked: ${repo.forks}  
         </div>
         <div class= "blank-line" id="cardBlank">
       blank   
         </div>
     
      
     </section>`)
-
+        // Here we store the forkedProjects.length and console.log to make sure it is correct.
         drawChart(forkedProjects.length)
-        console.log('hello', forkedProjects.length)
-    
-    }
-    )
+        //console.log('hello', forkedProjects.length)
+    getPullRequests(forkedProjects)
+    })   
+}
+
+getRepos()
+
+const getPullRequests = (forkedProjects) => {
+   
+    forkedProjects.forEach((repo) => {
+        
+        fetch(`https://api.github.com/repos/technigo/${repo.name}/pulls?per_page=100`)
+        .then((response) => response.json())
+        .then((data) => {
+            //console.log(data)
+            const myPullRequests = data.filter(pull => pull.user.login === repo.owner.login)
+            //console.log(myPullRequests)
+          
+        })
+     getCommits(commits_url)   
+    })
 }
 
-getRepos()
+const getCommits = (commits_url) =>{
+
+    commits_url.forEach((repo)=> {
+
+        fetch(`https://api.github.com/repos/technigo/${repo.name}/pulls/${repo.number}/commits`)
+        .then((response)=> response.json())
+        .then((data)=>{
+            console.log(data)
+        })
+
+    })
+
+}

code/style.css

@@ -34,7 +34,7 @@ body {
   padding: 20px 0 0 0;
   border-bottom: 3px solid pink
 }
-.updated, .branch, .URL, .number-commits, .blank-line {
+.updated, .branch, .URL, .number-commits, .blank-line, .times-forked {
   margin: 6px 0 0 0;
   padding: 6px 0 0 0;
   border-bottom: 1px solid #B2B3B4;