husky hook

.husky/pre-commit

@@ -0,0 +1,3 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+npm run format

.prettierignore

@@ -0,0 +1,4 @@
+.cache
+package.json
+package-lock.json
+public

.prettierrc

@@ -2,7 +2,7 @@
 	"trailingComma": "none",
 	"bracketSpacing": false,
 	"arrowParens": "avoid",
-	"singleQuote": false,
+	"singleQuote": true,
 	"printWidth": 80,
 	"useTabs": false,
 	"tabWidth": 2,

package.json

@@ -53,7 +53,8 @@
     "build": "react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject",
-    "format": "prettier --write \"src/**/*.{js,jsx}\""
+    "format": "prettier --write \"src/**/*.{js,jsx}\"",
+    "prepare": "husky install"
   },
   "eslintConfig": {
     "extends": [
@@ -75,7 +76,8 @@
   },
   "devDependencies": {
     "@types/styled-components": "^5.1.25",
-    "gh-pages": "^3.2.3"
+    "gh-pages": "^3.2.3",
+    "husky": "^7.0.0"
   },
   "description": "### Thanks [ella](https://github.com/eilla1) for design snippets",
   "main": "index.js",

src/Module/General.js → src/Module/General.tsx

@@ -91,6 +91,11 @@ const FOOTER = {
  * Date format : 8-11-2021, 18-11-2021 (without trailing zeros)
  */
 
+const calenderStartingDate = {
+  month: 12,
+  year: 2021
+}
+
 
  const schedule = [
   {
@@ -168,19 +173,19 @@ const Prizeinfo = [
   [
     //Array 1
     {
-      icon: <i class="first fas fa-4x fa-trophy"></i>,
+      icon: <i className="first fas fa-4x fa-trophy"></i>,
       type: "overall First",
       content:
         "First Overall prize will be given to a project that outstands all other submissions"
     },
     {
-      icon: <i class=" second fas fa-4x fa-medal"></i>,
+      icon: <i className=" second fas fa-4x fa-medal"></i>,
       type: "overall Second",
       content:
         "Second Overall prize will be given to the second best project of the hackathon"
     },
     {
-      icon: <i class=" third fas fa-4x fa-skiing-nordic"></i>,
+      icon: <i className=" third fas fa-4x fa-skiing-nordic"></i>,
       type: "Third Second",
       content:
         "Best third overall project of the hackathon will win some awesome prizes"
@@ -189,31 +194,31 @@ const Prizeinfo = [
   [
     //Array 2
     {
-      icon: <i class="fab fourth fa-3x fa-wpbeginner"></i>,
+      icon: <i className="fab fourth fa-3x fa-wpbeginner"></i>,
       type: "Best Solo",
       content:
         "You project will qualify for this prize if you participate alone without a team though we encourage you to participate with a team"
     },
     {
-      icon: <i class="first fas fa-4x fa-trophy"></i>,
+      icon: <i className="first fas fa-4x fa-trophy"></i>,
       type: " Best Beginner",
       content: "Your project will qualify for this category if atleast 50% "
     },
     {
-      icon: <i class=" fifth fa-3x fas fa-book-open"></i>,
+      icon: <i className=" fifth fa-3x fas fa-book-open"></i>,
       type: "Best UI/UX",
       content: "Project with most creative designs will be UI/UX track"
     }
   ],
   [
     //Array 3
     {
-      icon: <i class="fas fa-4x sixth fa-male"></i>,
+      icon: <i className="fas fa-4x sixth fa-male"></i>,
       type: "Best Web App with Qoom",
       content: "Must use qoom in your project to win this category"
     },
     {
-      icon: <i class="fas fa-user-friends seventh fa-3x "></i>,
+      icon: <i className="fas fa-user-friends seventh fa-3x "></i>,
       type: "More prizes",
       content: "More prizes will be revealed later"
     }
@@ -385,5 +390,6 @@ export {
   TeamInfo,
   JudgesInfo,
   frequentlyAskedQuestions,
-  schedule
+  schedule,
+  calenderStartingDate
 };

src/components/Footer/footer.jsx

@@ -17,8 +17,10 @@ function GithubTemplate({hideTemplate}) {
     <div className="template">
       <div className="template-left">
         <p>
-          Join us to  <a href={TOP_SECTION.HACKERS_REGISTRATION_FORM_LINK}>Gear Up</a>, where we will be hosting PUBLIC workshops,
-          tech talks, panel discussions, and career sessions!
+          Join us to{" "}
+          <a href={TOP_SECTION.HACKERS_REGISTRATION_FORM_LINK}>Gear Up</a>,
+          where we will be hosting PUBLIC workshops, tech talks, panel
+          discussions, and career sessions!
         </p>
       </div>
       <img onClick={hideTemplate} src={cross} />
@@ -28,15 +30,14 @@ function GithubTemplate({hideTemplate}) {
 
 export default function Footer() {
   const [template, setTemplate] = useState(false);
-  const [viewTemplate, setViewTemplate] = useState(true)
-
+  const [viewTemplate, setViewTemplate] = useState(true);
 
   useEffect(() => {
     window.addEventListener("scroll", listenScrollEvent);
 
-    return ()=>{
-    window.removeEventListener("scroll", listenScrollEvent);
-    }
+    return () => {
+      window.removeEventListener("scroll", listenScrollEvent);
+    };
   }, []);
 
   const listenScrollEvent = e => {
@@ -119,7 +120,9 @@ export default function Footer() {
           )}
           <p>Made with ❤️</p>
         </div>
-        {template && viewTemplate&& <GithubTemplate hideTemplate={() => setViewTemplate(false)} />}
+        {template && viewTemplate && (
+          <GithubTemplate hideTemplate={() => setViewTemplate(false)} />
+        )}
       </div>
     </div>
   );

src/components/Top-division-components/Top-division-components.jsx

@@ -1,9 +1,8 @@
 import React from "react";
-import { SOCIALS, TOP_SECTION } from "../../Module/General";
+import {SOCIALS, TOP_SECTION} from "../../Module/General";
 import MytypedComponent from "../typing-effect/typing.js";
 import "./top-division-c.css";
 
-
 function Btn(props) {
   return (
     <button className={props.class}>
@@ -41,19 +40,22 @@ function Myinfo() {
         </a>
       </div>
       <div className="buttom-group">
-      <a href={TOP_SECTION.JUDGES_FORM_LINK}>
-        {" "}
-        <Btn class="sponsor_btn" type="Judges" overlay="Fill the form" />
-      </a>
+        <a href={TOP_SECTION.JUDGES_FORM_LINK}>
+          {" "}
+          <Btn class="sponsor_btn" type="Judges" overlay="Fill the form" />
+        </a>
 
-      <a href={TOP_SECTION.HACKERS_REGISTRATION_FORM_LINK}>
-        {" "}
-        <Btn class="register" type="Register " overlay="Hackers registration" />
-      </a>
+        <a href={TOP_SECTION.HACKERS_REGISTRATION_FORM_LINK}>
+          {" "}
+          <Btn
+            class="register"
+            type="Register "
+            overlay="Hackers registration"
+          />
+        </a>
       </div>
     </div>
   );
 }
 
-export { Btn, Myinfo };
-
+export {Btn, Myinfo};

src/containers/Home/HomePage.jsx

@@ -1,10 +1,10 @@
-import { UseMedia } from "hooks/useMedia";
-import React, { useState } from "react";
+import {UseMedia} from "hooks/useMedia";
+import React, {useState} from "react";
 import Col from "react-bootstrap/Col";
 import Container from "react-bootstrap/Container";
 import Row from "react-bootstrap/Row";
 import Birds from "../../components/Birds";
-import { Accordion } from "../../components/FAQ/faq.jsx";
+import {Accordion} from "../../components/FAQ/faq.jsx";
 import Footer from "../../components/Footer/footer.jsx";
 import {
   Logo,
@@ -20,8 +20,8 @@ import {
   SponsorsHead,
   SponsorUS
 } from "../../components/Sponsors/sponsors.jsx";
-import { JoinTeam, Member } from "../../components/team/team";
-import { Myinfo } from "../../components/Top-division-components/Top-division-components.jsx";
+import {JoinTeam, Member} from "../../components/team/team";
+import {Myinfo} from "../../components/Top-division-components/Top-division-components.jsx";
 import {
   FOOTER,
   frequentlyAskedQuestions,
@@ -35,7 +35,6 @@ import MyCalender from "../calender";
 import "./about.css";
 import pattern from "./pattern4.png";
 
-
 function SponsorGroup(props) {
   return (
     <Row>
@@ -91,9 +90,8 @@ function FrequentlyAsked(props) {
 }
 
 export default function HomePage() {
-
   const [media, setMedia] = useState();
-  UseMedia('min-width', 1000, setMedia);
+  UseMedia("min-width", 1000, setMedia);
 
   return (
     <div className="Whole_div" style={{backgroundImage: `url(${pattern})`}}>

src/containers/calender/calender.function.ts

@@ -1,5 +1,5 @@
+import { EventArrayType } from "../../../@types/calenderState.types";
 import { weekDays } from "../../constants";
-import { EventArrayType } from "../../types/calenderState.types";
 
 export const getDatesForMonth = (state: any) => {
   const [firstDay, lastDay, lastDayOfPreviousMonth] = [

src/containers/calender/calender.layout.tsx

@@ -1,27 +1,30 @@
-import React, { useContext } from 'react';
+import React, { useContext } from "react";
 import { months } from "../../constants/index";
-import { calenderContext } from '../../Context/calender.context';
-import { Flexbox } from '../../elements/Flexbox';
-import * as H from './style';
+import { calenderContext } from "../../Context/calender.context";
+import { Flexbox } from "../../elements/Flexbox";
+import * as H from "./style";
 
-
-interface actionTypes{
-    type:string;
-    data?:number|string;
+interface actionTypes {
+  type: string;
+  data?: number | string;
 }
 
 interface CalenderLayoutProps {
-    handleActionProcced?:actionTypes;
-    handleActionBack?:actionTypes
+  handleActionProcced?: actionTypes;
+  handleActionBack?: actionTypes;
 }
 
-export const CalenderLayout:React.FC<CalenderLayoutProps> = ({children,handleActionProcced,handleActionBack})=>{
-    const contextTesting = useContext(calenderContext);
-    // @ts-ignore
-    const [state,dispatch] = contextTesting;
-    return (
-        <H.Container>
-        <Flexbox className="card-top" flexRow >
+export const CalenderLayout: React.FC<CalenderLayoutProps> = ({
+  children,
+  handleActionProcced,
+  handleActionBack
+}) => {
+  const contextTesting = useContext(calenderContext);
+  // @ts-ignore
+  const [state, dispatch] = contextTesting;
+  return (
+    <H.Container>
+      <Flexbox className="card-top" flexRow>
         <h3 style={{fontSize: 20}} color="white">
           Events schedule {months[state.month - 1]} {state.year}
         </h3>
@@ -45,6 +48,6 @@ export const CalenderLayout:React.FC<CalenderLayoutProps> = ({children,handleAct
         </Flexbox>
       </Flexbox>
       {children}
-      </H.Container>
-    )
-}
+    </H.Container>
+  );
+};

src/containers/calender/style.js

@@ -5,7 +5,6 @@ export const Container = styled.div`
   min-height: 450px;
   max-height: 520px;
 
-  
   background-color: white;
   border-radius: 8px;
   box-shadow: 0px 1px 7px #ffd3cc;