Merge branch 'master' of...

Merge branch 'master' of https://gitlab.stud.idi.ntnu.no/it2810-h21/team-24/project2-it2810 into 13-create-page-for-visualizing-commits-per-branch Conflicts: src/App.tsx src/components/NavBar/index.tsx

Merge branch 'master' of...
2af07887 · Birk Gustav Samson Stoveland · c251525e · 11e193cf · c251525e · 2af07887
Verified Commit 2af07887 authored 3 years ago by Birk Gustav Samson Stoveland
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/index.html
+++ b/public/index.html
@@ -26,7 +26,7 @@
      href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
    />

-    <title>React App</title>
+    <title>Gitlab data visualization</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>

--- a/src/App.tsx
+++ b/src/App.tsx
@@ -6,7 +6,6 @@ import CommonLogic from './components/CommonLogic/index';
 import NavBar from './components/NavBar';
 import { OpenSettingsContext } from './helpers/context';
 import { themes } from './helpers/themes';
-import BarChartPage from './pages/BarChartPage';
 import Home from './pages/Home/index';
 import SettingsPage from './pages/SettingsPage/index';
 import FeatsVsFixesPage from './pages/FeatsVsFixesPage';
@@ -38,7 +37,7 @@ function App() {
            themeName={themeName}
            setThemeName={setThemeName}
          />
-          <NavBar title="CoolWebsiteName" />
+          <NavBar title="Gitlab data visualization" />
          <Router>
            <CommonLogic />
            <Switch>
@@ -48,9 +47,6 @@ function App() {
              <Route exact path={'/commits'}>
                <FeatsVsFixesPage />
              </Route>
-              <Route exact path={'/bar'}>
-                <BarChartPage />
-              </Route>
              <Route exact path={'/mergerequests'}>
                <CommitsPerBranchPage />
              </Route>

--- a/src/assets/gitlab.png
+++ b/src/assets/gitlab.png
--- a/src/assets/materialui.png
+++ b/src/assets/materialui.png
--- a/src/assets/react.png
+++ b/src/assets/react.png
--- a/src/components/NavBar/index.tsx
+++ b/src/components/NavBar/index.tsx
@@ -65,9 +65,6 @@ export default function NavBar(props: MenuProps) {
                <Link underline="none" href={'/commits'}>
                  <MenuItem className={classes.menuItem}>Commits</MenuItem>
                </Link>
-                <Link underline="none" href={'/bar'}>
-                  <MenuItem className={classes.menuItem}>Bar</MenuItem>
-                </Link>
                <Link underline="none" href={'/mergerequests'}>
                  <MenuItem className={classes.menuItem}>Merge Requests</MenuItem>
                </Link>
@@ -82,7 +79,6 @@ export default function NavBar(props: MenuProps) {
          ) : (
            <div className={classes.linkContainer}>
              <IconLink url={'commits'} title={'Commits'} icon={<ChartPieIcon />} />
-              <IconLink url={'bar'} title={'Bar'} icon={<ChartBarIcon />} />
              <IconLink url={'timeperissuelabel'} title={'Issue-label'} icon={<ChartBarIcon />} />
              <IconLink url={'mergerequests'} title={'Merge requests'} icon={<InboxInIcon />} />
              <IconLink

--- a/src/helpers/api-calls.ts
+++ b/src/helpers/api-calls.ts
@@ -31,7 +31,7 @@ export const fromAPI = async (
 };

 export const getIssuesFromAPI = async (): Promise<APIResponse<Issue[]>> => {
-  return fromAPI('/issues', 'GET') as Promise<APIResponse<Issue[]>>;
+  return fromAPI('/issues?per_page=100', 'GET') as Promise<APIResponse<Issue[]>>;
 };

 const getCommitsFromAPIRecursive = async (data: Array<Commit>, page: number) => {

--- a/src/helpers/constants.ts
+++ b/src/helpers/constants.ts
@@ -10,7 +10,7 @@ export enum Label {
  DOING = 'Doing',
  IMPORTANT = 'Important',
  API = 'API',
-  POSSIBLY_IMPOSSIBLE = 'Possibly Impossible',
+  POSSIBLY_IMPOSSIBLE = 'Possibly impossible',
  EASY = 'Easy',
  GOOD_FIRST = 'Good first issue',
  SET_UP = 'Set-up',

--- a/src/pages/BarChartPage/index.tsx
+++ b/src/pages/BarChartPage/index.tsx
-import PageContainer from '../../components/PageContainer/index';
-import ChartBar from '../../components/ChartBar';
-
-const data = [
-  { barValue: 4119626293, barLabel: 'Petter' },
-  { barValue: 1012956064, barLabel: 'Ole' },
-];
-
-export default function BarChartPage() {
-  return (
-    <PageContainer title="BarChart">
-      <div>This is Bar Chart</div>
-      <ChartBar data={data} title={'Ole og petter'} />
-    </PageContainer>
-  );
-}
--- a/src/pages/FeatsVsFixesPage/index.tsx
+++ b/src/pages/FeatsVsFixesPage/index.tsx
@@ -39,7 +39,9 @@ export default function FeatsVsFixesPage() {
  useEffect(() => {
    getAllCommitsFromAPI().then((res) => {
      if (res) {
-        setAuthorData(parseCommitData(res));
+        const parsedData = parseCommitData(res);
+        setAuthorData(parsedData);
+        if (!selectedAuthors.length) setSelectedAuthors(new Array(parsedData.length).fill(true));
      }
    });
  }, []);
@@ -57,7 +59,7 @@ export default function FeatsVsFixesPage() {
              Person {i + 1}
              <Checkbox
                className={classes.checkbox}
-                checked={selectedAuthors[i]}
+                checked={selectedAuthors[i] || false}
                onChange={() => {
                  if (!selectedAuthors) return; // selectedAuthors will never be undefined
                  const tempList = [...selectedAuthors];

--- a/src/pages/Home/index.tsx
+++ b/src/pages/Home/index.tsx
 import PageContainer from '../../components/PageContainer/index';
+import reactLogo from '../../assets/react.png';
+import gitlabLogo from '../../assets/gitlab.png';
+import materialUI from '../../assets/materialui.png';
+import useStyles from './styles';
 export default function Home() {
+  const classes = useStyles();
  return (
-    <PageContainer title="Home">
-      <div>This is text</div>
+    <PageContainer title="Intro">
+      <div>
+        In this project we visualize gitlab data about the repository used when developing this
+        website. We use react and material UI for most of the layout, and use devexpress graphs for
+        the base graph components.
+      </div>
+      <div className={classes.imgContainer}>
+        <div>
+          <img src={reactLogo} alt={'react'} />
+        </div>
+        <div>
+          <img src={gitlabLogo} alt={'react'} />
+        </div>
+        <div>
+          <img className={classes.materialUILogo} src={materialUI} alt={'react'} />
+        </div>
+      </div>
    </PageContainer>
  );
 }
--- a/src/pages/Home/styles.ts
+++ b/src/pages/Home/styles.ts
+import { createStyles, makeStyles } from '@material-ui/core';
+
+const useStyles = makeStyles(() =>
+  createStyles({
+    imgContainer: {
+      display: 'grid',
+      gridGap: '1rem',
+      gridTemplateColumns: '1fr 1fr 1fr',
+      width: '100%',
+      '& *': {
+        maxWidth: '100%',
+        display: 'flex',
+        justifyContent: 'center',
+      },
+      alignItems: 'center',
+      marginTop: '2rem',
+    },
+    materialUILogo: {
+      maxWidth: '50%',
+    },
+  }),
+);
+
+export default useStyles;