From 071ed94cc4c5bc828eb25a6411b92947a97d0738 Mon Sep 17 00:00:00 2001 From: PiyushPawar17 Date: Sat, 5 Jan 2019 18:17:35 +0530 Subject: [PATCH 1/2] Major Refactor --- .eslintrc.json | 3 +- ...serPhoneReducer.js => userPhoneActions.js} | 0 src/components/About.js | 51 ++++++ src/components/Countdown.js | 36 ++++ src/components/Countdown/index.js | 45 ----- src/components/Countdown/style.css | 45 ----- .../{dashboard/index.js => Dashboard.js} | 23 +-- src/components/{event/index.js => Event.js} | 34 ++-- .../{eventList/index.js => EventList.js} | 32 ++-- src/components/Footer.js | 111 ++++++++++++ src/components/{header/index.js => Header.js} | 18 +- src/components/{Panel/index.js => Panel.js} | 35 ++-- src/components/Panel/styles.css | 90 ---------- src/components/Selector.js | 7 + src/components/Selector/index.js | 13 -- .../{Selectors/index.js => Selectors.js} | 2 +- src/components/{signIn/index.js => SignIn.js} | 5 +- src/components/Team.js | 49 ++++++ .../{timeline/index.js => Timeline.js} | 4 +- src/components/about/index.js | 50 ------ src/components/about/styles.css | 17 -- src/components/footer/index.js | 121 ------------- src/components/footer/styles.css | 134 -------------- src/components/header/styles.css | 58 ------ src/components/index.js | 2 +- src/components/team/index.js | 56 ------ src/components/team/team.css | 11 -- src/components/timeline/timeline.css | 66 ------- src/css/Event.css | 121 ------------- src/css/EventDetail.css | 102 ----------- src/css/index.css | 155 ---------------- src/index.js | 20 ++- src/reducers/authReducer.js | 17 +- src/reducers/eventReducer.js | 16 +- src/reducers/teamReducer.js | 9 +- src/reducers/userPhoneReducer.js | 11 +- src/styles/About.css | 15 ++ src/styles/Countdown.css | 46 +++++ .../dashboard.css => styles/Dashboard.css} | 4 +- src/styles/Event.css | 122 +++++++++++++ src/styles/EventDetail.css | 108 ++++++++++++ .../styles.css => styles/EventList.css} | 32 ++-- src/styles/Footer.css | 132 ++++++++++++++ src/styles/Header.css | 61 +++++++ src/styles/Panel.css | 90 ++++++++++ src/styles/Team.css | 18 ++ src/styles/Timeline.css | 54 ++++++ src/styles/index.css | 165 ++++++++++++++++++ 48 files changed, 1209 insertions(+), 1207 deletions(-) rename src/actions/{userPhoneReducer.js => userPhoneActions.js} (100%) create mode 100644 src/components/About.js create mode 100644 src/components/Countdown.js delete mode 100644 src/components/Countdown/index.js delete mode 100644 src/components/Countdown/style.css rename src/components/{dashboard/index.js => Dashboard.js} (85%) rename src/components/{event/index.js => Event.js} (75%) rename src/components/{eventList/index.js => EventList.js} (58%) create mode 100644 src/components/Footer.js rename src/components/{header/index.js => Header.js} (86%) rename src/components/{Panel/index.js => Panel.js} (51%) delete mode 100644 src/components/Panel/styles.css create mode 100644 src/components/Selector.js delete mode 100644 src/components/Selector/index.js rename src/components/{Selectors/index.js => Selectors.js} (94%) rename src/components/{signIn/index.js => SignIn.js} (84%) create mode 100644 src/components/Team.js rename src/components/{timeline/index.js => Timeline.js} (97%) delete mode 100644 src/components/about/index.js delete mode 100644 src/components/about/styles.css delete mode 100644 src/components/footer/index.js delete mode 100644 src/components/footer/styles.css delete mode 100644 src/components/header/styles.css delete mode 100644 src/components/team/index.js delete mode 100644 src/components/team/team.css delete mode 100644 src/components/timeline/timeline.css delete mode 100644 src/css/Event.css delete mode 100644 src/css/EventDetail.css delete mode 100644 src/css/index.css create mode 100644 src/styles/About.css create mode 100644 src/styles/Countdown.css rename src/{components/dashboard/dashboard.css => styles/Dashboard.css} (53%) create mode 100644 src/styles/Event.css create mode 100644 src/styles/EventDetail.css rename src/{components/eventList/styles.css => styles/EventList.css} (72%) create mode 100644 src/styles/Footer.css create mode 100644 src/styles/Header.css create mode 100644 src/styles/Panel.css create mode 100644 src/styles/Team.css create mode 100644 src/styles/Timeline.css create mode 100644 src/styles/index.css diff --git a/.eslintrc.json b/.eslintrc.json index 6ccf772..5beebb0 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -4,11 +4,10 @@ "extends": ["prettier", "plugin:react/recommended"], "rules": { "indent": ["error", "tab", { "SwitchCase": 1 }], - "react/jsx-no-bind": "error", + "react/jsx-no-bind": "warn", "react/require-default-props": "error", "react/forbid-component-props": ["error", { "forbid": ["style"] }], "react/forbid-dom-props": ["error", { "forbid": ["style"] }], - "react/no-danger": "error", "react/no-this-in-sfc": "error", "react/no-unused-prop-types": "warn", "react/no-unused-state": "warn", diff --git a/src/actions/userPhoneReducer.js b/src/actions/userPhoneActions.js similarity index 100% rename from src/actions/userPhoneReducer.js rename to src/actions/userPhoneActions.js diff --git a/src/components/About.js b/src/components/About.js new file mode 100644 index 0000000..511f1d3 --- /dev/null +++ b/src/components/About.js @@ -0,0 +1,51 @@ +import React from 'react'; +import { connect } from 'react-redux'; + +import Team from './Team'; + +import '../styles/About.css'; + +class About extends React.Component { + componentDidMount() { + document.body.scrollTop = 0; + } + render() { + return ( +
+
+
About Fest
+

+ Indian Institution of Information Technology, Vadodara (IIIT-V) is + one of the newly formed IIIT by the Ministry of Human Resource Development ( + MHRD) , Government of India under Public Private Partnership (PPP) + model. The partners in this project are Government of India, Government of Gujarat, Gujarat Energy Research + and Management Institute, Gujarat State Fertilizers and Chemicals Ltd. and Tata Consultancy Services. +

+

+ Cerebro is the{' '} + Annual Technical Festival of Indian Institute of Information + Technology, Vadodara held in March. It is entirely organized by the{' '} + Technical Society of IIIT, Vadodara and serves as a platform for + technophiles to showcase their creativity and intelligence. The festival aims to bring together great minds + through various activities like Technical Workshops, events, talks{' '} + and exhibitions. +

+
+
+
Team
+ {this.props.team.map((team, idx) => ( + + ))} +
+
+ ); + } +} + +const mapStateToProps = state => { + return { + team: state.team.team + }; +}; + +export default connect(mapStateToProps)(About); diff --git a/src/components/Countdown.js b/src/components/Countdown.js new file mode 100644 index 0000000..ab94cba --- /dev/null +++ b/src/components/Countdown.js @@ -0,0 +1,36 @@ +import React from 'react'; + +import '../styles/Countdown.css'; + +const Countdown = props => ( +
+ Logo +
+
+
+
DAYS
+
+
:
+
+
+
HRS
+
+
:
+
+
+
MINS
+
+
:
+
+
+
SECS
+
+
+
+); + +export default Countdown; diff --git a/src/components/Countdown/index.js b/src/components/Countdown/index.js deleted file mode 100644 index 0ed7a8e..0000000 --- a/src/components/Countdown/index.js +++ /dev/null @@ -1,45 +0,0 @@ -import React, { Component } from 'react'; -import './style.css'; - -class Countdown extends Component { - handleStartClick() { - document.querySelector('.event-list').scrollIntoView(true); - } - render() { - return ( -
- - {/*
- LIVE NOW*/} -
-
-
-
DAYS
-
-
:
-
-
-
HRS
-
-
:
-
-
-
MINS
-
-
:
-
-
-
SECS
-
-
- {/*
SEE YOU NEXT YEAR!
*/} -
- ); - } -} - -export default Countdown; diff --git a/src/components/Countdown/style.css b/src/components/Countdown/style.css deleted file mode 100644 index 5491898..0000000 --- a/src/components/Countdown/style.css +++ /dev/null @@ -1,45 +0,0 @@ -.countdown { - display: flex; - height: calc(100vh - 72px); - align-items: center; - justify-content: center; - flex-direction: column; - font-family: Vidaloka; -} - -.cerebro-hero { - height: 200px; -} - -.uk-countdown-number { - font-size: 35px; - color: #FF6E2C; -} - -.uk-countdown-number { - font-size: 35px; -} - -.countdown-header { - margin-top: -35px; - padding: 4px 16px; - background-color: black; -} -@media screen and (max-width: 560px) and (min-width: 320px) { - .firebaseui-idp-button.mdl-button.mdl-js-button.mdl-button--raised.firebaseui-idp-google.firebaseui-id-idp-button { - position: fixed; - left: 95%; - } - .countdown{ - height: calc(100vh - 175px); - } - .cerebro-hero { - height: auto; - width: 275px; - } -} - -.next-year { - font-family: 'Roboto Mono', monospace; - font-size: 20px; -} diff --git a/src/components/dashboard/index.js b/src/components/Dashboard.js similarity index 85% rename from src/components/dashboard/index.js rename to src/components/Dashboard.js index 2408b9c..2c60774 100644 --- a/src/components/dashboard/index.js +++ b/src/components/Dashboard.js @@ -3,10 +3,11 @@ import { connect } from 'react-redux'; import { Redirect } from 'react-router-dom'; import _ from 'lodash'; import * as firebase from 'firebase'; -import './dashboard.css'; -import { unregisterFromEvent } from '../../actions/eventActions'; -import { saveUserPhone } from '../../actions/userPhoneReducer'; +import { unregisterFromEvent } from '../actions/eventActions'; +import { saveUserPhone } from '../actions/userPhoneActions'; + +import '../styles/Dashboard.css'; class Dashboard extends React.Component { componentDidMount() { @@ -29,7 +30,7 @@ class Dashboard extends React.Component { render() { if (!this.props.user) { - return ; + return ; } let userRegisteredEvents = this.props.events.filter(event => _.some(Object.keys(event.participants), uid => uid === this.props.user.uid) @@ -39,13 +40,13 @@ class Dashboard extends React.Component {
-
+
{this.props.user && ( - {'User'} + User )} -
+
{this.props.user ? this.props.user.displayName : 'human.'}
-
+
Mobile: {this.props.userPhone}
@@ -53,7 +54,7 @@ class Dashboard extends React.Component {
-
+
@@ -93,8 +94,8 @@ class Dashboard extends React.Component { ref={ref => (this.mobileInput = ref)} className="uk-input uk-form-width-medium" type="tel" - id={'phone-input'} - placeholder={'Mobile'} + id="phone-input" + placeholder="Mobile" />
-
-
{event.name}
-
+
+
{event.name}
+
PRIZE WORTH: {event['prize-worth']}
-
+
TEAM SIZE: {event['team-size']}
-
+
VENUE: {event['venue']}
-
+
DATE: {event['start-time'].slice(0, 11)}
-
+
TIME:{' '} {event['start-time'].slice(11)} - {event['end-time'].slice(11)}
-
+
Contacts: -
+
{Object.keys(event.contact).map(role => ( -
+
{event.contact[role].name} ({event.contact[role].role})
@@ -82,10 +84,10 @@ class Event extends React.Component { ))}
-

{event.description}

+

{event.description}

Rules
-
    +
      {event.rules.map((rule, idx) => (
    • a !== undefined) - // listEvents.push(arr) - // } - - // const listEventsLength = listEvents.length - listEventsJsx = events.map(event => { return (
    • @@ -28,33 +19,30 @@ class EventList extends React.Component { ); }); } + return ( -
      +
        {listEventsJsx}
      -
        +
      ); diff --git a/src/components/Footer.js b/src/components/Footer.js new file mode 100644 index 0000000..d7c5683 --- /dev/null +++ b/src/components/Footer.js @@ -0,0 +1,111 @@ +import React from 'react'; +import { connect } from 'react-redux'; +import { Link } from 'react-router-dom'; +import { FaFacebook, FaGithub, FaInstagram, FaTwitter } from 'react-icons/fa'; + +import '../styles/Footer.css'; + +const Footer = props => ( +
      + +); + +const mapStateToProps = state => { + return { + user: state.auth.user + }; +}; + +export default connect(mapStateToProps)(Footer); diff --git a/src/components/header/index.js b/src/components/Header.js similarity index 86% rename from src/components/header/index.js rename to src/components/Header.js index 03e9c0a..779acf1 100644 --- a/src/components/header/index.js +++ b/src/components/Header.js @@ -3,12 +3,14 @@ import { connect } from 'react-redux'; import { Link, withRouter } from 'react-router-dom'; import * as firebase from 'firebase'; -import SignIn from '../signIn'; -import { signedIn, signedOut } from '../../actions/authActions'; -import { loadEvents } from '../../actions/eventActions'; -import { loadUserPhone } from '../../actions/userPhoneReducer'; -import { setTeam } from '../../actions/teamActions'; -import './styles.css'; +import { signedIn, signedOut } from '../actions/authActions'; +import { loadEvents } from '../actions/eventActions'; +import { loadUserPhone } from '../actions/userPhoneActions'; +import { setTeam } from '../actions/teamActions'; + +import SignIn from './SignIn'; + +import '../styles/Header.css'; class Header extends React.Component { componentDidMount() { @@ -64,7 +66,7 @@ class Header extends React.Component { render() { return ( -