diff --git a/public/favicon.ico b/public/favicon.ico index a11777cc471a4344702741ab1c8a588998b1311a..19c92e84519a11e9d493f07ae326f694944f171d 100644 Binary files a/public/favicon.ico and b/public/favicon.ico differ diff --git a/public/index.html b/public/index.html index da89b7acd51ea4364d6ddb9fe30857abaa799f71..98ed4b02a0366c0958b7f27660986dd172e4e1c7 100644 --- 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> diff --git a/src/App.tsx b/src/App.tsx index e7ee6f5cf003e09ced35ee56eccec175ddc7fbf3..81eafeb7769529860beeaa713ed49295592dc52c 100644 --- 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> diff --git a/src/assets/gitlab.png b/src/assets/gitlab.png new file mode 100644 index 0000000000000000000000000000000000000000..2543972331f90aee7ea7411c2fc8a1af76451d0c Binary files /dev/null and b/src/assets/gitlab.png differ diff --git a/src/assets/materialui.png b/src/assets/materialui.png new file mode 100644 index 0000000000000000000000000000000000000000..ddec58ba3e7849deb77b9ddecca12bf62fc0bc2b Binary files /dev/null and b/src/assets/materialui.png differ diff --git a/src/assets/react.png b/src/assets/react.png new file mode 100644 index 0000000000000000000000000000000000000000..c36b7b8d2c767a4d497ec9a06ddb35c9e65f23d9 Binary files /dev/null and b/src/assets/react.png differ diff --git a/src/components/NavBar/index.tsx b/src/components/NavBar/index.tsx index 6adb94a628d43e1109fbd9c7ee7471ca536f8900..41cb248bdea5baf5cec214e2fc3c789d545ef1b2 100644 --- 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 diff --git a/src/helpers/api-calls.ts b/src/helpers/api-calls.ts index d7291d2f6e7075ea90a158e928495e41509e9982..c9892bb832def37f0821b95d39fd51ff57e94035 100644 --- 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) => { diff --git a/src/helpers/constants.ts b/src/helpers/constants.ts index 52586bb1363beb12f2f7cba9639a9011e1bd09e3..f477560d35b19729f05ea2e991e327d5ccc244c0 100644 --- 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', diff --git a/src/pages/BarChartPage/index.tsx b/src/pages/BarChartPage/index.tsx deleted file mode 100644 index 3049e246c61e434be069c44530fab340c4523c9e..0000000000000000000000000000000000000000 --- a/src/pages/BarChartPage/index.tsx +++ /dev/null @@ -1,16 +0,0 @@ -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> - ); -} diff --git a/src/pages/FeatsVsFixesPage/index.tsx b/src/pages/FeatsVsFixesPage/index.tsx index 607980aaa94be86f8e011c5ef9bf85e3f91d2554..d23c4db9879cecf5fe7fce8ab92dfe56e2e3f84a 100644 --- 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]; diff --git a/src/pages/Home/index.tsx b/src/pages/Home/index.tsx index 4dfd468130b691a163251aeb318a510f23403e6a..00e2e68ecf73eda9e6dbf49792ca30b62b3aadf8 100644 --- a/src/pages/Home/index.tsx +++ b/src/pages/Home/index.tsx @@ -1,8 +1,28 @@ 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> ); } diff --git a/src/pages/Home/styles.ts b/src/pages/Home/styles.ts new file mode 100644 index 0000000000000000000000000000000000000000..ea464229f03cc6498e47af042a6a6bcf43d5cf4d --- /dev/null +++ b/src/pages/Home/styles.ts @@ -0,0 +1,24 @@ +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;