Commit cadfe8c8 authored by Live Jortveit Sagebakken's avatar Live Jortveit Sagebakken
Browse files

Merge branch '3-filter-commits'

parents 9cc9c0db 45d98dd7
import { useEffect, useState } from "react";
import Commit from "./commit";
function commitView() {
// eslint-disable-next-line react-hooks/rules-of-hooks
function CommitView() {
const [commits, setCommits] = useState([]);
let token = "3Nhst8cnMWx5puz8KEzR";
// eslint-disable-next-line react-hooks/rules-of-hooks
const [filterParam, setFilterParam] = useState("all");
useEffect(() => {
// Kode hentet fra https://www.freecodecamp.org/news/fetch-data-react/
fetch(
......@@ -24,35 +24,161 @@ function commitView() {
throw response;
})
.then((data) => {
console.log(data);
setCommits(data);
})
.catch((error) => {
console.error("Error fetching data: ", error);
});
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
function getCurrentDate() {
var dateObject = new Date();
var day = dateObject.getDate();
var month = dateObject.getMonth() + 1; // Must add 1 as January is equal to 0 if not
var correctFormatMonth = month < 10 ? "0" + month : month; // Must have 0 if month earlier than october to get correct dateformat
var year = dateObject.getFullYear();
var separator = "-";
var displayDate = year + separator + correctFormatMonth + separator + day;
return displayDate;
}
function getCurrentDay(){
return getCurrentDate().substring(8,10);
}
function getCurrentMonth(){
return getCurrentDate().substring(5,7);
}
function getCurrentYear(){
return getCurrentDate().substring(0,4);
}
function getDay(date: string){
return date.substring(8,10);
}
function getMonth(date: string){
return date.substring(5,7);
}
function getYear(date: string){
return date.substring(0,4);
}
function getStartDate(){
var separator = "-";
if(filterParam === "lastWeek"){
return getCurrentYear() + separator + getCurrentMonth() + separator + (parseInt(getCurrentDay()) - 7);
}
else if(filterParam === "lastTwoWeeks") {
return getCurrentYear() + separator + getCurrentMonth() + separator + (parseInt(getCurrentDay()) - 14);
}
else if(filterParam === "lastThreeWeeks" ) {
return getCurrentYear() + separator + getCurrentMonth() + separator + (parseInt(getCurrentDay()) - 21);
}
else if(filterParam === "thisMonth") {
return getCurrentYear() + separator + getCurrentMonth() + separator + "01";
}
else {
return "No commits"
}
}
function getMonthLength(month: number) {
if(month === 2){
return 28; // Dont care for leap year right now
}
else if(month === 4 || month === 6 || month === 9 || month === 12) {
return 30;
}
else {
return 31;
}
}
function getDayDifference(month: number) {
if(filterParam === "lastWeek"){
return 7;
}
else if (filterParam === "lastTwoWeeks"){
return 14;
}
else if(filterParam === "lastThreeWeeks") {
return 21;
}
else if(filterParam === "thisMonth"){
return getMonthLength(month);
}
else {
return 0;
}
}
// TODO: Fikse sånn at det ikke blir krøll ved månedskifte + displaye "Ingen commits" dersom det ikke er noen commits, spesielt viktig for today...
function filterOnWeeks(){
var startDate = getStartDate();
var startDay = parseInt(getDay(startDate.toString()));
var month = parseInt(getMonth(startDate.toString()));
var year = getYear(startDate.toString());
var separator = "-";
var commitsList: any = [];
var dayDifference = getDayDifference(month);
var dateFormat = "";
for(var i = 0; i <= dayDifference; i++) {
dateFormat = (year + separator + (month < 10 ? "0" + (month) : (month)) + separator + (startDay < 10 ? "0" + (startDay) : (startDay)));
commitsList.push(commits.filter((issue: {committed_date: string}) =>
issue.committed_date.includes(dateFormat)).map(
(commit: { message: string; created_at: number }, index: React.Key) => (
<Commit
key={index}
title={commit.message}
date={commit.created_at} id={0} />)))
startDay += 1;
}
return commitsList;
}
function displayCommits(){
if(filterParam === "all"){
return commits.map(
(commit: { message: string; created_at: number }, index: React.Key) => (
<Commit
key={index}
title={commit.message}
date={commit.created_at} id={0} />))}
else if(filterParam === "today"){
return commits.filter((issue: {committed_date: string}) =>
issue.committed_date.includes(getCurrentDate())).map(
(commit: { message: string; created_at: number }, index: React.Key) => (
<Commit
key={index}
title={commit.message}
date={commit.created_at} id={0} />))
}
else {
return filterOnWeeks();
}
}
return (
<div className="commits">
<h3>Commits</h3>
{commits
? commits.map(
(
commit: { title: string; committed_date: any; short_id: number },
index
) => (
<Commit
key={index}
title={commit.title}
date={commit.committed_date}
id={commit.short_id}
/>
)
)
: "Nothing to show"}
<label>Filters:
<select onChange = {(e) => {
setFilterParam(e.target.value);}} >
<option value="all">All commits</option>
<option value="today">Today</option>
<option value="lastWeek">Last week</option>
<option value="lastTwoWeeks">Two weeks ago</option>
<option value="lastThreeWeeks">Three weeks ago</option>
<option value="thisMonth">This month</option>
</select>
</label>
{displayCommits()}
</div>
);
}
export default commitView;
export default CommitView;
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment