From e088498bccbf541c816a708c0277ff0495b2790f Mon Sep 17 00:00:00 2001
From: Birk Gustav Samson Stoveland <bgstovel@stud.ntnu.no>
Date: Sun, 3 Oct 2021 00:50:38 +0200
Subject: [PATCH] fix: remove type assertions, add stylesheet
---
src/pages/CommitsPerBranch/index.tsx | 11 +++++++----
src/pages/CommitsPerBranch/styles.ts | 17 +++++++++++++++++
2 files changed, 24 insertions(+), 4 deletions(-)
create mode 100644 src/pages/CommitsPerBranch/styles.ts
diff --git a/src/pages/CommitsPerBranch/index.tsx b/src/pages/CommitsPerBranch/index.tsx
index 83f6c2b..0c306bf 100644
--- a/src/pages/CommitsPerBranch/index.tsx
+++ b/src/pages/CommitsPerBranch/index.tsx
@@ -7,6 +7,7 @@ import {
import { useEffect, useState } from 'react';
import { Commit } from '../../helpers/types';
import { Switch } from '@material-ui/core/';
+import useStyles from './styles';
export default function CommitsPerBranchPage() {
const [data, setData] = useState<Array<{ barLabel: string; barValue: number }> | null>(null);
@@ -15,6 +16,7 @@ export default function CommitsPerBranchPage() {
);
const commitsByBranch: Array<{ barLabel: string; barValue: number }> = [];
const [activeBranch, setActiveBranch] = useState<Map<string, boolean> | null>(null);
+ const classes = useStyles();
useEffect(() => {
getAllMergeRequestsFromAPI().then((res) => {
if (res) {
@@ -22,15 +24,15 @@ export default function CommitsPerBranchPage() {
if (res2) {
const activeBranches = new Map<string, boolean>();
res2.forEach((value: Array<Commit>, key: number) => {
- activeBranches.set(String(key) as string, true);
+ activeBranches.set(String(key), true);
if (
!commitsByBranch.includes({
- barLabel: String(key) as string,
+ barLabel: String(key),
barValue: value.length,
})
) {
commitsByBranch.push({
- barLabel: String(key) as string,
+ barLabel: String(key),
barValue: value.length,
});
}
@@ -48,7 +50,7 @@ export default function CommitsPerBranchPage() {
<PageContainer>
<header />
{data && <ChartBar data={data} title={'Commits by merge request iid'} />}
- <div>
+ <div className={classes.switchcontainer}>
{trueData &&
activeBranch &&
trueData.map((m, i) => {
@@ -56,6 +58,7 @@ export default function CommitsPerBranchPage() {
return (
<div key={i}>
<Switch
+ className={classes.switch}
checked={activeBranch.get(m.barLabel)}
onChange={() => {
activeBranch.set(m.barLabel, !activeBranch.get(m.barLabel));
diff --git a/src/pages/CommitsPerBranch/styles.ts b/src/pages/CommitsPerBranch/styles.ts
new file mode 100644
index 0000000..d1b8319
--- /dev/null
+++ b/src/pages/CommitsPerBranch/styles.ts
@@ -0,0 +1,17 @@
+import { createStyles, makeStyles, Theme } from '@material-ui/core';
+
+const useStyles = makeStyles((theme: Theme) =>
+ createStyles({
+ switch: {
+ display: 'flex',
+ color: theme.palette.primary.contrastText + '!important',
+ },
+ switchcontainer: {
+ display: 'grid',
+ width: '100%',
+ gridTemplateColumns: '1fr 1fr 1fr 1fr',
+ },
+ }),
+);
+
+export default useStyles;
--
GitLab