diff --git a/package.json b/package.json index 0cfd6ed..d349e83 100644 --- a/package.json +++ b/package.json @@ -45,6 +45,7 @@ "react-scripts-ts": "2.17.0", "react-select": "^2.0.0", "react-sidebar": "^3.0.2", + "react-twitter-widgets": "^1.7.1", "reactstrap": "^6.4.0", "redux": "4.0.0", "redux-form": "^7.4.2", diff --git a/src/components/TwitterHook/TwitterHook.tsx b/src/components/TwitterHook/TwitterHook.tsx new file mode 100644 index 0000000..c6f8cee --- /dev/null +++ b/src/components/TwitterHook/TwitterHook.tsx @@ -0,0 +1,18 @@ +import * as React from "react"; +import { Timeline } from 'react-twitter-widgets'; + + +export const TwitterHook = () => ( + + + +); +export default TwitterHook; diff --git a/src/components/TwitterHook/index.ts b/src/components/TwitterHook/index.ts new file mode 100644 index 0000000..200b43d --- /dev/null +++ b/src/components/TwitterHook/index.ts @@ -0,0 +1,3 @@ +import TwitterHook from "./TwitterHook"; + +export default TwitterHook; diff --git a/src/routes/Home/components/Home.tsx b/src/routes/Home/components/Home.tsx index 0eed0b5..4dc9839 100644 --- a/src/routes/Home/components/Home.tsx +++ b/src/routes/Home/components/Home.tsx @@ -3,6 +3,7 @@ import { Link } from "react-router-dom"; import FixMeFooter from "../../../components/FixMeFooter/FixMeFooter"; import FixMeMetas from "../../../components/FixMeMetas/FixMeMetas"; import FixMeNavbar from "../../../components/FixMeNavbar/FixMeNavbar"; +import TwitterHook from "../../../components/TwitterHook/TwitterHook"; import { customPageView } from '../../../helpers/helpers'; import "../../../styles/home.css"; import GroupCopy from "./assets/group-copy@2x.png"; @@ -12,16 +13,16 @@ import TellUsAboutYou from "./TellUsAboutYou"; interface IHomeProps { readonly getProjects: () => any; readonly projectLength: number; - readonly updateLanguage: (language: string[]) => any; - readonly updateLevel: (level?:string) => any; + readonly updateLanguage: (language: string[]) => any; + readonly updateLevel: (level?: string) => any; readonly updateType: (type?: string) => any; } -export default class Home extends React.PureComponent{ - public readonly state = { focusSelect: false } + public readonly state = { focusSelect: false } public componentDidMount(): void { this.props.getProjects() @@ -35,80 +36,84 @@ export default class Home extends React.PureComponent { - const scrolltoMid = document.getElementById('tellusaboutyou'); - if(!!scrolltoMid){ - scrolltoMid.scrollIntoView({ block: 'center', behavior: 'smooth' }); - setTimeout(() => { - this.setState(state => ({ focusSelect: !state.focusSelect })); - }, 400); + public handleClick = () => { + const scrolltoMid = document.getElementById('tellusaboutyou'); + if (!!scrolltoMid) { + scrolltoMid.scrollIntoView({ block: 'center', behavior: 'smooth' }); + setTimeout(() => { + this.setState(state => ({ focusSelect: !state.focusSelect })); + }, 400); + } } -} - public render(){ - const {projectLength} = this.props - return ( - - - - - - - - You are a coder. + public render() { + const { projectLength } = this.props + return ( + + + + + + + + You are a coder. Open-source projects need{" "} - your skills. + your skills. We’ll connect you with meaningful contribution opportunities! - LEARN MORE - - - - - - - - - - - - - - - - - {`${projectLength === 1 ? "1 project" :`${projectLength} projects`}`} on board (and counting…) - + LEARN MORE + + + + - - + + + + - - - - - - - - - - @fixmeparser - our latest tweets + + + + + + + {`${projectLength === 1 ? "1 project" : `${projectLength} projects`}`} on board (and counting…) + + + + - - - - - Latest issue to fix for project Bootstrap! HELP! https://fixmeparser.com/issues#1825 - - - - - - ) -}} + + + + + + + + + @fixmeparser + our latest tweets + + + + + + + + {/* Latest issue to fix for project Bootstrap! HELP! https://fixmeparser.com/issues#1825 */} + + + + + + + + ) + } +} diff --git a/yarn.lock b/yarn.lock index 59b949d..aee673f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8108,7 +8108,7 @@ promise@^7.1.1: dependencies: asap "~2.0.3" -prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.7, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@~15.6.1: +prop-types@^15.3.0, prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.7, prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@~15.6.1: version "15.6.2" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102" integrity sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ== @@ -8698,6 +8698,16 @@ react-transition-group@^2.2.1, react-transition-group@^2.3.1: prop-types "^15.6.2" react-lifecycles-compat "^3.0.4" +react-twitter-widgets@^1.7.1: + version "1.7.1" + resolved "https://registry.yarnpkg.com/react-twitter-widgets/-/react-twitter-widgets-1.7.1.tgz#60061f37a8c4f361c27f3d1d7ceba98d3cd80a40" + integrity sha512-bAcR/NKqRbVRJav981bHrm2+xka7NA2nQJB6Urtj9BARqP7aeGHPC0CrrC7wdYIaluOqiF8MiTtURqIJjFs2ZA== + dependencies: + exenv "^1.2.1" + lodash "^4.17.4" + prop-types "^15.3.0" + scriptjs "^2.5.8" + "react@^15.6.2 || ^16.0": version "16.4.2" resolved "https://registry.yarnpkg.com/react/-/react-16.4.2.tgz#2cd90154e3a9d9dd8da2991149fdca3c260e129f" @@ -9440,6 +9450,11 @@ schema-utils@^0.4.5: ajv "^6.1.0" ajv-keywords "^3.1.0" +scriptjs@^2.5.8: + version "2.5.9" + resolved "https://registry.yarnpkg.com/scriptjs/-/scriptjs-2.5.9.tgz#343915cd2ec2ed9bfdde2b9875cd28f59394b35f" + integrity sha512-qGVDoreyYiP1pkQnbnFAUIS5AjenNwwQBdl7zeos9etl+hYKWahjRTfzAZZYBv5xNHx7vNKCmaLDQZ6Fr2AEXg== + scroll-into-view-if-needed@2.2.16, scroll-into-view-if-needed@^2.2.16: version "2.2.16" resolved "https://registry.yarnpkg.com/scroll-into-view-if-needed/-/scroll-into-view-if-needed-2.2.16.tgz#208232f4d7bb531130177b6c02d760d1e1796cbd"