Merge pull request #762 from Ignitus/develop

Master > Develop

.github/workflows/pr-preview.yml

@@ -0,0 +1,24 @@
+name: Generate Preview
+
+on:
+  issue_comment:
+    types: [created]
+
+jobs:
+  deploy_preview:
+    name: Deploy Preview of PR
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/setup-node@v1
+      - uses: actions/checkout@v2
+      - run: npm install yaml -s
+      - run: echo "::set-env name=worker::$( node ./scripts/deploy-preview/verify.js ${{ github.event.comment.user.login }} "${{ github.event.comment.body }}" )"
+      - if: env.worker == 'true'
+        run: |
+          git fetch origin +refs/pull/${{ github.event.issue.number }}/merge
+          git checkout FETCH_HEAD
+          npm install -s
+          CI=false npm run build
+          mv ./build/index.html ./build/200.html
+          npm install randomstring surge @actions/github -s
+          node ./scripts/deploy-preview/deploy.js ${{ github.event.issue.number }} ${{ secrets.SURGE_TOKEN }} ${{ secrets.GITHUB_TOKEN }} ${{ github.event.comment.user.login }}

scripts/deploy-preview/deploy.js

@@ -0,0 +1,24 @@
+// eslint-disable-next-line import/no-unresolved
+const randomstring = require('randomstring');
+const childProcess = require('child_process');
+const botComment = require('./utils');
+
+const [, , issuNumber, SURGE_TOKEN, GITHUB_TOKEN, USER] = process.argv;
+
+const gen = randomstring.generate({
+  length: 6,
+  charset: 'alphabetic',
+  capitalization: 'lowercase',
+});
+
+const domain = `http://ignitus-preview-${gen}.surge.sh`;
+
+childProcess.exec(`./node_modules/.bin/surge ./build ${domain} --token ${SURGE_TOKEN}`, (err) => {
+  if (err) {
+    botComment(GITHUB_TOKEN, issuNumber, `Sorry @${USER}, Deploy Error 😶.`, () => {
+      process.exit(1);
+    });
+  } else {
+    botComment(GITHUB_TOKEN, issuNumber, `Yey @${USER}\n\n Live Preview is ready: ${domain}\n 🚀`);
+  }
+});

scripts/deploy-preview/utils.js

@@ -0,0 +1,13 @@
+// eslint-disable-next-line import/no-unresolved
+const github = require('@actions/github');
+
+const botComment = (token, issueNumber, body, cb = () => { }) => {
+  const octokit = new github.GitHub(token);
+  octokit.issues.createComment({
+    ...github.context.repo,
+    issue_number: issueNumber,
+    body,
+  }).then(cb);
+};
+
+module.exports = botComment;

scripts/deploy-preview/verify.js

@@ -0,0 +1,23 @@
+const fs = require('fs');
+// eslint-disable-next-line import/no-extraneous-dependencies
+const YAML = require('yaml');
+
+const [,, user, command] = process.argv;
+
+const autoAssign = fs.readFileSync('./.github/auto_assign.yml', 'utf8');
+const authorizedUsers = YAML.parse(autoAssign).reviewers;
+
+if (user && command) {
+  const commandFormat = command.split(' ').join('').trim().toLocaleLowerCase();
+  if (commandFormat === 'bottestthis') {
+    const isAuthorized = authorizedUsers.findIndex(
+      assignedUser => assignedUser === user,
+    );
+    if (isAuthorized === -1) process.stdout.write('false');
+    else {
+      process.stdout.write('true');
+    }
+  } else process.stdout.write('false');
+} else {
+  process.stdout.write('false');
+}

src/ignitus-AboutPage/ignitus-About/Components/index.tsx

@@ -0,0 +1,33 @@
+import React, { Fragment } from 'react';
+import { IgnitusIntroduction, AboutImage } from '../constants';
+import { withErrorBoundary } from '../../../ignitus-Shared/ignitus-ErrorHandlingComponents/errorBoundary';
+
+import { CoreTeam } from '../../ignitus-CoreTeam/Components';
+import Team from '../../ignitus-Team';
+import * as S from '../styles';
+
+const About: React.FunctionComponent = withErrorBoundary(() => (
+  <Fragment>
+    <S.AboutSection>
+      <S.AboutContainer>
+        <S.TopSection>
+          <S.PictureContainer>
+            <S.Img src={AboutImage} alt="aboutus" />
+          </S.PictureContainer>
+          <S.ContentContainer>
+            <S.Title> About Us</S.Title>
+            <S.ParagraphContainer>
+              {IgnitusIntroduction.map((x: any) => (
+                <S.Paragraph key={x.title}>{x.title}</S.Paragraph>
+              ))}
+            </S.ParagraphContainer>
+          </S.ContentContainer>
+        </S.TopSection>
+      </S.AboutContainer>
+      <CoreTeam />
+      <Team.containers.TeamContainer />
+    </S.AboutSection>
+  </Fragment>
+));
+
+export {About as default};

src/ignitus-AboutPage/ignitus-About/constants.ts

@@ -1,15 +1,11 @@
-/* eslint-disable eol-last */
 // eslint-disable-next-line import/prefer-default-export
-export const aboutImg: string = 'https://storage.googleapis.com/ignitus_assets/ig-assets/about.png';
 
-interface IntroObj {
-  title: string,
-}
+import { IntroductionType } from "./types";
 
-export const IgnitusIntro: IntroObj[] = [
-  { title: 'Ignitus (A Non-Profit Organization for the welfare of student community) that helps students and professionals get handpicked top- quality global research and industrial internships, for free! The students participate in projects and training programs supervised by our experts.' },
-  { title: 'Our only goal is Skyrocketing a students career by providing best global opportunities. The platform has got exponential growth after successful internship completion by the associated students with researchers from SAIL (Stanford AI Lab) and Oxford University.' },
-  { title: 'Ignitus is working with a non-profit (GirlsScript Foundation), Woo-Tech which is committed to bringing together multiple such initiatives for a grand scale open-source project development program for women. We are honored to have among us more than admirable leaders in the fight for equal opportunities for women at Woo-Tech and GirlScript India and Program Manager of Systers, LEAN IN INDIA , MIT Media Lab.' },
-  { title: 'Ignitus scholar consists of 200+ applicants who have worked at Deep Learning Divison Mercedes-Benz, Harvard Innovation Labs, UC Berkeley etc. Ignitus is made with love from Students, Researchers of Stanford, MIT, Princeton, Georgia Tech, SUNY, Harvard, Oxford, UCB, UCLA, USC etc.' },
-  { title: 'Team Ignitus boasts of a dedicated workforce from Boston, Miami, Pittsburgh, Madrid, Houston, Munich, Princeton, Los Angeles, Vancouver and different parts of India.' }
+export const AboutImage: string = 'https://storage.googleapis.com/ignitus_assets/ig-assets/about.png';
+export const IgnitusIntroduction: IntroductionType[] = [
+  { title: 'Ignitus a non-profit organization that helps students and professionals get handpicked top quality global research and industrial internships, for free!' },
+  { title: 'Our only goal is skyrocketing a students career by providing best global opportunities. The platform has got exponential growth after successful internship completion by the associated students with researchers from SAIL (Stanford AI Lab) and Oxford University.' },
+  { title: 'Ignitus scholar consists of 200+ applicants who have worked at Mercedes-Benz, Harvard Innovation Labs, UC Berkeley etc. Ignitus is made with love from students, researchers & alumni of Stanford University, Massachusetts Institute of Technology, Princeton University, Georgia Tech University, Harvard University, Oxford University, University of California, Berkeley etc. 🎓' },
+  { title: 'Team Ignitus boasts of a dedicated workforce from Pittsburgh, Barcelona, Munich, Berkeley etc.' }
 ];

src/ignitus-AboutPage/ignitus-About/Styles/index.ts → src/ignitus-AboutPage/ignitus-About/styles.ts

@@ -1,7 +1,12 @@
 import styled from '@emotion/styled';
-import * as F from '../../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/fonts';
-import { minimumWidthQuery } from '../../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/media';
-import { Heading3 } from '../../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/typography';
+import * as F from '../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/fonts';
+import {minimumWidthQuery} from '../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/media';
+import {
+  Heading3,
+  Paragraph as P,
+} from '../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/typography';
+import { White } from '../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/colors';
+import { flexibleColDiv } from '../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/atoms';
 
 export const AboutSection = styled.section`
   font-weight: ${F.Normal};
@@ -52,16 +57,20 @@ export const Img = styled.img`
   padding: 3rem;
 `;
 
-export const ContentContainer = styled.section`
+export const ContentContainer = styled(flexibleColDiv)`
   flex: 1;
-  border-radius: 16px;
-  margin-top: 30px;
-  background-color: #fff;
-  padding: 1.5rem;
+  border-radius: 1rem;
+  margin-top: 2rem;
+  background-color: ${White};
+  padding: 0 1.5rem;
 `;
 
 export const Title = styled(Heading3)`
   text-align: center;
 `;
 
 export const ParagraphContainer = styled.div``;
+
+export const Paragraph = styled(P)`
+  margin-bottom: 0.7rem;
+`;

src/ignitus-AboutPage/ignitus-About/types.ts

@@ -0,0 +1,3 @@
+export type IntroductionType = {
+  title: string;
+};

src/ignitus-AboutPage/ignitus-CoreTeam/Components/team.tsx → src/ignitus-AboutPage/ignitus-CoreTeam/Components/index.tsx

@@ -1,20 +1,23 @@
 /* eslint-disable class-methods-use-this */
 /* eslint-disable jsx-a11y/mouse-events-have-key-events */
 import React from 'react';
-import {Data} from '../constants';
-import {withErrorBoundary} from '../../../ignitus-Shared/ignitus-ErrorHandlingComponents/errorBoundary';
-import * as S from '../Styles';
-import * as T from '../../../ignitus-Shared/ignitus-DesignSystem/shared';
-import {Team, TeamItemProps} from '../types';
-import {AppIcon} from '../../../ignitus-Shared/types/iconsTypes/iconEnums';
+
+import { Data } from '../constants';
+import { withErrorBoundary } from '../../../ignitus-Shared/ignitus-ErrorHandlingComponents/errorBoundary';
+import { Team, TeamItemProps } from '../types';
+import { AppIcon } from '../../../ignitus-Shared/types/iconsTypes/iconEnums';
 import { Paragraph } from '../../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/typography';
 
+import * as S from '../styles';
+import * as T from '../../../ignitus-Shared/ignitus-DesignSystem/shared';
+
 const PureCoreTeam = ({team}: any) => (
   <S.PureCoreTeam>
     <T.Title> Our Team </T.Title>
     <S.TeamContainer>{team}</S.TeamContainer>
   </S.PureCoreTeam>
 );
+
 const TeamItem = ({
   item: {title, img, description, linkedin, angellist},
 }: TeamItemProps) => {
@@ -41,11 +44,10 @@ const TeamItem = ({
   );
 };
 
-const CoreTeam = () => {
+export const CoreTeam = withErrorBoundary(() => {
   const team = Data.map((item: Team) => {
     return <TeamItem key={item.title} item={item} />;
   });
   return <PureCoreTeam team={team} />;
-};
+});
 
-export default withErrorBoundary(CoreTeam);

src/ignitus-AboutPage/ignitus-CoreTeam/Styles/index.ts → src/ignitus-AboutPage/ignitus-CoreTeam/styles.ts

@@ -1,10 +1,12 @@
 /* eslint-disable import/prefer-default-export */
 import styled from '@emotion/styled';
-import * as C from '../../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/colors';
-import * as T from '../../../ignitus-Shared/ignitus-DesignSystem/shared';
-import Icon from '../../../ignitus-Shared/ignitus-Utilities/Components/icon';
-import {minimumWidthQuery} from '../../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/media';
-import {Heading6} from '../../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/typography';
+
+import { minimumWidthQuery } from '../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/media';
+import { Heading6 } from '../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/typography';
+
+import * as C from '../../ignitus-Shared/ignitus-DesignSystem/ignitus-Atoms/colors';
+import * as T from '../../ignitus-Shared/ignitus-DesignSystem/shared';
+import Icon from '../../ignitus-Shared/ignitus-Utilities/Components/icon';
 
 type LinkWrapperProps = {
   toggle: boolean;

src/ignitus-AboutPage/ignitus-Team/Components/Team.tsx → src/ignitus-AboutPage/ignitus-Team/Components/index.tsx

@@ -27,12 +27,13 @@ const PureTeam = ({contributors}: any) => (
   </S.Section>
 );
 
-const Team = ({
+export const Team = withErrorBoundary(({
   getContributorsData,
   contributorsData: {presets, isFetching},
 }: TeamPropType) => {
   useEffect(() => {
     getContributorsData();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   if (isFetching) {
@@ -59,5 +60,4 @@ const Team = ({
   ));
 
   return <PureTeam contributors={contributors} />;
-};
-export default withErrorBoundary(Team);
+});

src/ignitus-AboutPage/ignitus-Team/Containers/index.ts

@@ -1,2 +1,14 @@
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
+import { createStructuredSelector } from 'reselect';
 
-export { default as TeamContainer } from './TeamContainer';
+import { getContributorsData } from '../actions';
+import { makeSelectContributorsData } from '../selectors';
+import { Team } from '../Components';
+
+const mapStateToProps = createStructuredSelector({
+  contributorsData: makeSelectContributorsData(),
+});
+
+const mapDispatchToProps = (dispatch: any) => bindActionCreators({ getContributorsData }, dispatch);
+export const TeamContainer = connect(mapStateToProps, mapDispatchToProps)(Team);