From 800e1e0db089467a4c960a0096c08c1755a97826 Mon Sep 17 00:00:00 2001 From: Tony Yip Date: Sat, 9 Nov 2019 18:24:14 +0800 Subject: [PATCH 1/3] ignore file for JetBrains IDE --- .gitignore | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.gitignore b/.gitignore index 261a0e57..79b9d1f0 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ script/output/* .DS_Store -node_modules \ No newline at end of file +node_modules +.idea \ No newline at end of file From cfe04398a422a22c1cffd68fba5656fa311c6af9 Mon Sep 17 00:00:00 2001 From: Tony Yip Date: Sat, 9 Nov 2019 22:56:02 +0800 Subject: [PATCH 2/3] use dynamic import for code-splitting in page level --- web/package-lock.json | 101 +++++++++++++++++++++++++++++++++--------- web/package.json | 1 + web/src/App.js | 63 +++++++++++++++++++------- 3 files changed, 128 insertions(+), 37 deletions(-) diff --git a/web/package-lock.json b/web/package-lock.json index 3d4559c4..eac7ee2c 100644 --- a/web/package-lock.json +++ b/web/package-lock.json @@ -1436,6 +1436,25 @@ "@types/yargs": "^13.0.0" } }, + "@loadable/component": { + "version": "5.10.3", + "resolved": "https://registry.npmjs.org/@loadable/component/-/component-5.10.3.tgz", + "integrity": "sha512-/aSO+tXw4vFMwZ6fgLaNQgLuEa7bgTpoBE4PxNzf08/ewAjymrCS3J7v3SbGE7IjGmmKL6vVwkpb7S3cYrk+ag==", + "requires": { + "@babel/runtime": "^7.6.0", + "hoist-non-react-statics": "^3.3.0" + }, + "dependencies": { + "@babel/runtime": { + "version": "7.7.2", + "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.7.2.tgz", + "integrity": "sha512-JONRbXbTXc9WQE2mAZd1p0Z3DZ/6vaQIkgYMSTP3KjRCyd7rCZCcfhCyX+YjwcKxcZ82UrxbRD358bpExNgrjw==", + "requires": { + "regenerator-runtime": "^0.13.2" + } + } + } + }, "@material-ui/core": { "version": "4.5.2", "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.5.2.tgz", @@ -11713,7 +11732,8 @@ }, "ansi-regex": { "version": "2.1.1", - "bundled": true + "bundled": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -11731,11 +11751,13 @@ }, "balanced-match": { "version": "1.0.0", - "bundled": true + "bundled": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -11748,15 +11770,18 @@ }, "code-point-at": { "version": "1.1.0", - "bundled": true + "bundled": true, + "optional": true }, "concat-map": { "version": "0.0.1", - "bundled": true + "bundled": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", - "bundled": true + "bundled": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -11859,7 +11884,8 @@ }, "inherits": { "version": "2.0.3", - "bundled": true + "bundled": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -11869,6 +11895,7 @@ "is-fullwidth-code-point": { "version": "1.0.0", "bundled": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -11881,17 +11908,20 @@ "minimatch": { "version": "3.0.4", "bundled": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } }, "minimist": { "version": "0.0.8", - "bundled": true + "bundled": true, + "optional": true }, "minipass": { "version": "2.3.5", "bundled": true, + "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -11908,6 +11938,7 @@ "mkdirp": { "version": "0.5.1", "bundled": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -11980,7 +12011,8 @@ }, "number-is-nan": { "version": "1.0.1", - "bundled": true + "bundled": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -11990,6 +12022,7 @@ "once": { "version": "1.4.0", "bundled": true, + "optional": true, "requires": { "wrappy": "1" } @@ -12065,7 +12098,8 @@ }, "safe-buffer": { "version": "5.1.2", - "bundled": true + "bundled": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -12095,6 +12129,7 @@ "string-width": { "version": "1.0.2", "bundled": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -12112,6 +12147,7 @@ "strip-ansi": { "version": "3.0.1", "bundled": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -12150,11 +12186,13 @@ }, "wrappy": { "version": "1.0.2", - "bundled": true + "bundled": true, + "optional": true }, "yallist": { "version": "3.0.3", - "bundled": true + "bundled": true, + "optional": true } } }, @@ -16919,7 +16957,8 @@ }, "ansi-regex": { "version": "2.1.1", - "bundled": true + "bundled": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -16937,11 +16976,13 @@ }, "balanced-match": { "version": "1.0.0", - "bundled": true + "bundled": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -16954,15 +16995,18 @@ }, "code-point-at": { "version": "1.1.0", - "bundled": true + "bundled": true, + "optional": true }, "concat-map": { "version": "0.0.1", - "bundled": true + "bundled": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", - "bundled": true + "bundled": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -17065,7 +17109,8 @@ }, "inherits": { "version": "2.0.3", - "bundled": true + "bundled": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -17075,6 +17120,7 @@ "is-fullwidth-code-point": { "version": "1.0.0", "bundled": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -17087,17 +17133,20 @@ "minimatch": { "version": "3.0.4", "bundled": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } }, "minimist": { "version": "0.0.8", - "bundled": true + "bundled": true, + "optional": true }, "minipass": { "version": "2.3.5", "bundled": true, + "optional": true, "requires": { "safe-buffer": "^5.1.2", "yallist": "^3.0.0" @@ -17114,6 +17163,7 @@ "mkdirp": { "version": "0.5.1", "bundled": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -17186,7 +17236,8 @@ }, "number-is-nan": { "version": "1.0.1", - "bundled": true + "bundled": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -17196,6 +17247,7 @@ "once": { "version": "1.4.0", "bundled": true, + "optional": true, "requires": { "wrappy": "1" } @@ -17271,7 +17323,8 @@ }, "safe-buffer": { "version": "5.1.2", - "bundled": true + "bundled": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -17301,6 +17354,7 @@ "string-width": { "version": "1.0.2", "bundled": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -17318,6 +17372,7 @@ "strip-ansi": { "version": "3.0.1", "bundled": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -17356,11 +17411,13 @@ }, "wrappy": { "version": "1.0.2", - "bundled": true + "bundled": true, + "optional": true }, "yallist": { "version": "3.0.3", - "bundled": true + "bundled": true, + "optional": true } } }, diff --git a/web/package.json b/web/package.json index 6f722b21..b7883158 100644 --- a/web/package.json +++ b/web/package.json @@ -5,6 +5,7 @@ "dependencies": { "@apollo/react-hooks": "^3.1.3", "@babel/core": "7.2.2", + "@loadable/component": "^5.10.3", "@material-ui/core": "4.5.2", "@material-ui/icons": "^3.0.2", "@material-ui/system": "^4.3.0", diff --git a/web/src/App.js b/web/src/App.js index e451bcd4..b69585dd 100644 --- a/web/src/App.js +++ b/web/src/App.js @@ -2,31 +2,64 @@ import React from 'react' import { Route, Switch, useRouteMatch } from 'react-router-dom' import CssBaseline from '@material-ui/core/CssBaseline' import { ThemeProvider } from '@material-ui/core/styles/' -import IndexPage from 'components/pages/landing' -import ProfilePage from 'components/pages/profile' -import DistrictPage from 'components/pages/district' -import DistrictListPage from 'components/pages/district/list' -import BattleGroundPage from 'components/pages/battleground' -import DisclaimerPage from 'components/pages/disclaimer' -import AboutDCPage from 'components/pages/about/dc' -import NotfoundPage from 'components/pages/notfound' -import SupportUsPage from 'components/pages/support-us' +import loadable from '@loadable/component' import ApolloClient from 'apollo-boost' import { ApolloProvider } from 'react-apollo' import theme from 'ui/theme' import './App.css' import Box from '@material-ui/core/Box' import styled from 'styled-components' -import MobileAppBar from 'components/organisms/MobileAppBar' -import Footer from 'components/organisms/Footer' import { ContextStoreProvider } from 'ContextStore' import withTracker from './WithTracker' -import SearchDrawer from 'components/pages/SearchDrawer' -import DistrictOverviewPage from 'components/pages/district/overview' -import DistrictAllPage from 'components/pages/district/all' -import GlobalDisclaimer from 'components/organisms/GlobalDisclaimer' import i18n from 'i18n' +const IndexPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/landing') +) +const ProfilePage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/profile') +) +const DistrictPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/district') +) +const DistrictListPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/district/list') +) +const BattleGroundPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/battleground') +) +const DisclaimerPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/disclaimer') +) +const AboutDCPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/about/dc') +) +const NotfoundPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/notfound') +) +const SupportUsPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/support-us') +) +const DistrictOverviewPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/district/overview') +) +const DistrictAllPage = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/district/all') +) + +const MobileAppBar = loadable(() => + import(/* webpackPrefetch: true */ 'components/organisms/MobileAppBar') +) +const Footer = loadable(() => + import(/* webpackPrefetch: true */ 'components/organisms/Footer') +) +const SearchDrawer = loadable(() => + import(/* webpackPrefetch: true */ 'components/pages/SearchDrawer') +) +const GlobalDisclaimer = loadable(() => + import(/* webpackPrefetch: true */ 'components/organisms/GlobalDisclaimer') +) + const client = new ApolloClient({ uri: process.env.REACT_APP_GRAPHQL_URI, }) From fbd5977cbc8e3dbd864ce259da131c4a49664c90 Mon Sep 17 00:00:00 2001 From: Tony Yip Date: Mon, 11 Nov 2019 16:21:10 +0800 Subject: [PATCH 3/3] fix fb sdk parse issue --- web/src/components/organisms/Footer.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/web/src/components/organisms/Footer.js b/web/src/components/organisms/Footer.js index 152a8113..08e67f1e 100644 --- a/web/src/components/organisms/Footer.js +++ b/web/src/components/organisms/Footer.js @@ -39,6 +39,9 @@ const LinkBox = styled(Box)` function Footer(props) { const { t } = useTranslation() + React.useEffect(() => { + window.FB.XFBML.parse() + }, []) return ( <>