fixed decimal participants and ui fix

Author: samratmiddha

README.md

@@ -44,7 +44,7 @@ You can reset all your bookmarks by clicking the Reset Bookmarks button, which i
 
 - Clone the repo
 - cd into the repo directory
-- Run: `npm install`
+- Run: `npm install --force`
 - Run: `npm start`
 
 # Contributing :
@@ -60,7 +60,7 @@ You can reset all your bookmarks by clicking the Reset Bookmarks button, which i
 - In `./scrape.py` replace 2023 with the {year}+1
 - Run: `python scrape.py`
 - Replace the data in ./data/finalData.json with the new data in ./data.json(produced after successfully running scrape script)
-- Identify duplicate entries of organizations in data obtained through scraping (produced due to slightly different name in various year of gsoc)
-- for each duplicate org Run : `python merge.py`
+- Identify duplicate entries of organisations in data obtained through scraping (produced due to slightly different name in various year of gsoc)
+- for each duplicate organisation Run : `python merge.py`
 - add {year} to labels in `./components/OrganisationCard.js`
-- for charts in `./components/launcher/` add {year} to the labels and add the data for the year
+- for charts in `./components/launcher/` add {year} to the labels and add data for the year

src/components/Home.js

@@ -1,26 +1,30 @@
-import React, { useRef, useState, useEffect } from 'react';
-import { Container, Header } from 'semantic-ui-react';
-import '../css/mainpagecss.css';
-import data from '../data/finalData.json';
-import OrganisationCard from './OrganisationCard';
-import AdvancedSearch from './AdvancedSearch';
-import Footer from './Footer';
-import { VerticleButton as ScrollUpButton } from 'react-scroll-up-button';
-import LaunchingComponent from './LaunchingComponent';
-import { Link } from 'react-router-dom'
-import { sortAppearances, sortTotalProjects, sortAverageProjects } from './SortFunctions';
+import React, { useRef, useState, useEffect } from "react";
+import { Container, Header } from "semantic-ui-react";
+import "../css/mainpagecss.css";
+import data from "../data/finalData.json";
+import OrganisationCard from "./OrganisationCard";
+import AdvancedSearch from "./AdvancedSearch";
+import Footer from "./Footer";
+import { VerticleButton as ScrollUpButton } from "react-scroll-up-button";
+import LaunchingComponent from "./LaunchingComponent";
+import { Link } from "react-router-dom";
+import {
+  sortAppearances,
+  sortTotalProjects,
+  sortAverageProjects,
+} from "./SortFunctions";
 
-const descendingSortByYear = (resultList) =>{
-  return resultList.sort( (a,b) => { 
-      return (b.year.length - a.year.length)
-    });
-}
+const descendingSortByYear = (resultList) => {
+  return resultList.sort((a, b) => {
+    return b.year.length - a.year.length;
+  });
+};
 
-const Home = ({bookmarked, setBookmarked}) => {
+const Home = ({ bookmarked, setBookmarked }) => {
   const [validList, setValidList] = useState([]);
   const [results, setResults] = useState(validList);
-  const [sortParameter, setSortParameter] = useState(0)
-  const [sortAscendingOrder, setSortAscendingOrder] = useState(false)
+  const [sortParameter, setSortParameter] = useState(0);
+  const [sortAscendingOrder, setSortAscendingOrder] = useState(false);
   const [displayLauncher, setDisplayLauncher] = useState(true);
 
   const reRenderLauncher = () => {
@@ -32,25 +36,23 @@ const Home = ({bookmarked, setBookmarked}) => {
   useEffect(() => {
     // setSortAscendingOrder(false);
     var res = [];
-    switch(sortParameter) {
-      case 0: 
+    switch (sortParameter) {
+      case 0:
         res = validList.sort(sortAppearances);
         break;
-      case 1: 
+      case 1:
         res = validList.sort(sortTotalProjects);
         break;
-      case 2: 
+      case 2:
         res = validList.sort(sortAverageProjects);
         break;
     }
-    if(!sortAscendingOrder) {
-      setResults([...res])
-    }
-    else {
-      setResults([...res.reverse()])
+    if (!sortAscendingOrder) {
+      setResults([...res]);
+    } else {
+      setResults([...res.reverse()]);
     }
-  }, [sortParameter, validList, sortAscendingOrder])
-
+  }, [sortParameter, validList, sortAscendingOrder]);
 
   const buildSearchList = (search, filter) => {
     setDisplayLauncher(false);
@@ -70,7 +72,6 @@ const Home = ({bookmarked, setBookmarked}) => {
           return false;
         })
       );
-      
     } else if (filter === 1) {
       setValidList(
         data.filter((org) => org.name.toLowerCase().includes(sanitisedSearch))
@@ -99,31 +100,48 @@ const Home = ({bookmarked, setBookmarked}) => {
 
   return (
     <React.Fragment>
-      <Container id='mainContainer' fluid>
-        <Header textAlign='center'>
-          <h1 id = 'mainHeader' onClick={reRenderLauncher}> GSoC Analyser </h1>
+      <Container id="mainContainer" fluid>
+        <Header textAlign="center">
+          <h1 id="mainHeader" onClick={reRenderLauncher}>
+            {" "}
+            GSoC Analzser{" "}
+          </h1>
         </Header>
-        <Link to="/bookmarks" className="nav-button">Bookmarks</Link>
-        
-        <AdvancedSearch ref={AdvancedSearchRef} buildSearchList={buildSearchList} sortParameter={sortParameter} setSortParameter={setSortParameter} sortAscendingOrder={sortAscendingOrder} setSortAscendingOrder={setSortAscendingOrder}/>
+        <Link to="/bookmarks" className="nav-button">
+          Bookmarks
+        </Link>
+
+        <AdvancedSearch
+          ref={AdvancedSearchRef}
+          buildSearchList={buildSearchList}
+          sortParameter={sortParameter}
+          setSortParameter={setSortParameter}
+          sortAscendingOrder={sortAscendingOrder}
+          setSortAscendingOrder={setSortAscendingOrder}
+        />
         {displayLauncher && <LaunchingComponent />}
         {!displayLauncher && (
           <Container fluid style={{ paddingTop: 50 }}>
             <Header
-              style={{ color: 'white', fontSize: 50 }}
-              textAlign='center'
-              as='h1'
+              style={{ color: "white", fontSize: 50 }}
+              textAlign="center"
+              as="h1"
             >
               Search Results: {validList.length}
             </Header>
             <br />
             <br />
             {results.map((org, index) => (
-              <OrganisationCard key={index} orgData={org} bookmarked={bookmarked} setBookmarked={setBookmarked} />
+              <OrganisationCard
+                key={index}
+                orgData={org}
+                bookmarked={bookmarked}
+                setBookmarked={setBookmarked}
+              />
             ))}
           </Container>
         )}
-        <ScrollUpButton style={{ color: 'white' }} />
+        <ScrollUpButton style={{ color: "white" }} />
         <Footer />
       </Container>
     </React.Fragment>

src/components/Launcher/ParticipantChart.js

@@ -51,8 +51,8 @@ const ParticipantChart = (props) => {
             {
               label: "Sucessful participants",
               data: [
-                328, 516.6, 733.05, 935, 850, 913.14, 981, 1073, 1060, 1172,
-                927, 1032, 1136, 1090, 1136, 1106, 1205, 1054,
+                328, 516, 733, 935, 850, 913, 981, 1073, 1060, 1172, 927, 1032,
+                1136, 1090, 1136, 1106, 1205, 1054,
               ],
               backgroundColor: "orange",
               borderColor: "red",

src/components/OrganisationCard.js

@@ -90,6 +90,11 @@ const OrganisationCard = ({ key, orgData, bookmarked, setBookmarked }) => {
               height={isMobile ? 300 : 250}
               options={{
                 maintainAspectRatio: false,
+                plugins: {
+                  legend: {
+                    position: "bottom",
+                  },
+                },
                 scales: {
                   y: {
                     ticks: {