mirror of
https://github.com/nickzuber/meteorite.git
synced 2024-09-11 11:36:03 +03:00
Auth configuration
This commit is contained in:
parent
18f88ce4da
commit
883982a7c7
183
package-lock.json
generated
183
package-lock.json
generated
@ -799,6 +799,70 @@
|
||||
"resolved": "https://registry.npmjs.org/@csstools/convert-colors/-/convert-colors-1.4.0.tgz",
|
||||
"integrity": "sha512-5a6wqoJV/xEdbRNKVo6I4hO3VjyDq//8q2f9I6PBAvMesJHFauXDorcNCsr9RzvsZnaWi5NYCcfyqP1QeFHFbw=="
|
||||
},
|
||||
"@emotion/babel-utils": {
|
||||
"version": "0.6.10",
|
||||
"resolved": "https://registry.npmjs.org/@emotion/babel-utils/-/babel-utils-0.6.10.tgz",
|
||||
"integrity": "sha512-/fnkM/LTEp3jKe++T0KyTszVGWNKPNOUJfjNKLO17BzQ6QPxgbg3whayom1Qr2oLFH3V92tDymU+dT5q676uow==",
|
||||
"requires": {
|
||||
"@emotion/hash": "^0.6.6",
|
||||
"@emotion/memoize": "^0.6.6",
|
||||
"@emotion/serialize": "^0.9.1",
|
||||
"convert-source-map": "^1.5.1",
|
||||
"find-root": "^1.1.0",
|
||||
"source-map": "^0.7.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"source-map": {
|
||||
"version": "0.7.3",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.3.tgz",
|
||||
"integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"@emotion/hash": {
|
||||
"version": "0.6.6",
|
||||
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.6.6.tgz",
|
||||
"integrity": "sha512-ojhgxzUHZ7am3D2jHkMzPpsBAiB005GF5YU4ea+8DNPybMk01JJUM9V9YRlF/GE95tcOm8DxQvWA2jq19bGalQ=="
|
||||
},
|
||||
"@emotion/is-prop-valid": {
|
||||
"version": "0.6.8",
|
||||
"resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-0.6.8.tgz",
|
||||
"integrity": "sha512-IMSL7ekYhmFlILXcouA6ket3vV7u9BqStlXzbKOF9HBtpUPMMlHU+bBxrLOa2NvleVwNIxeq/zL8LafLbeUXcA==",
|
||||
"requires": {
|
||||
"@emotion/memoize": "^0.6.6"
|
||||
}
|
||||
},
|
||||
"@emotion/memoize": {
|
||||
"version": "0.6.6",
|
||||
"resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.6.6.tgz",
|
||||
"integrity": "sha512-h4t4jFjtm1YV7UirAFuSuFGyLa+NNxjdkq6DpFLANNQY5rHueFZHVY+8Cu1HYVP6DrheB0kv4m5xPjo7eKT7yQ=="
|
||||
},
|
||||
"@emotion/serialize": {
|
||||
"version": "0.9.1",
|
||||
"resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-0.9.1.tgz",
|
||||
"integrity": "sha512-zTuAFtyPvCctHBEL8KZ5lJuwBanGSutFEncqLn/m9T1a6a93smBStK+bZzcNPgj4QS8Rkw9VTwJGhRIUVO8zsQ==",
|
||||
"requires": {
|
||||
"@emotion/hash": "^0.6.6",
|
||||
"@emotion/memoize": "^0.6.6",
|
||||
"@emotion/unitless": "^0.6.7",
|
||||
"@emotion/utils": "^0.8.2"
|
||||
}
|
||||
},
|
||||
"@emotion/stylis": {
|
||||
"version": "0.7.1",
|
||||
"resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.7.1.tgz",
|
||||
"integrity": "sha512-/SLmSIkN13M//53TtNxgxo57mcJk/UJIDFRKwOiLIBEyBHEcipgR6hNMQ/59Sl4VjCJ0Z/3zeAZyvnSLPG/1HQ=="
|
||||
},
|
||||
"@emotion/unitless": {
|
||||
"version": "0.6.7",
|
||||
"resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.6.7.tgz",
|
||||
"integrity": "sha512-Arj1hncvEVqQ2p7Ega08uHLr1JuRYBuO5cIvcA+WWEQ5+VmkOE3ZXzl04NbQxeQpWX78G7u6MqxKuNX3wvYZxg=="
|
||||
},
|
||||
"@emotion/utils": {
|
||||
"version": "0.8.2",
|
||||
"resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.8.2.tgz",
|
||||
"integrity": "sha512-rLu3wcBWH4P5q1CGoSSH/i9hrXs7SlbRLkoq9IGuoPYNGQvDJ3pt/wmOM+XgYjIDRMVIdkUWt0RsfzF50JfnCw=="
|
||||
},
|
||||
"@reach/router": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@reach/router/-/router-1.2.1.tgz",
|
||||
@ -1017,6 +1081,11 @@
|
||||
"resolved": "https://registry.npmjs.org/abab/-/abab-2.0.0.tgz",
|
||||
"integrity": "sha512-sY5AXXVZv4Y1VACTtR11UJCPHHudgY5i26Qj5TypE6DKlIApbwb5uqhXcJ5UUGbvZNRh7EeIoW+LrJumBsKp7w=="
|
||||
},
|
||||
"abbrev": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
|
||||
"integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q=="
|
||||
},
|
||||
"accepts": {
|
||||
"version": "1.3.5",
|
||||
"resolved": "https://registry.npmjs.org/accepts/-/accepts-1.3.5.tgz",
|
||||
@ -1779,6 +1848,25 @@
|
||||
"object.assign": "^4.1.0"
|
||||
}
|
||||
},
|
||||
"babel-plugin-emotion": {
|
||||
"version": "9.2.11",
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-emotion/-/babel-plugin-emotion-9.2.11.tgz",
|
||||
"integrity": "sha512-dgCImifnOPPSeXod2znAmgc64NhaaOjGEHROR/M+lmStb3841yK1sgaDYAYMnlvWNz8GnpwIPN0VmNpbWYZ+VQ==",
|
||||
"requires": {
|
||||
"@babel/helper-module-imports": "^7.0.0",
|
||||
"@emotion/babel-utils": "^0.6.4",
|
||||
"@emotion/hash": "^0.6.2",
|
||||
"@emotion/memoize": "^0.6.1",
|
||||
"@emotion/stylis": "^0.7.0",
|
||||
"babel-plugin-macros": "^2.0.0",
|
||||
"babel-plugin-syntax-jsx": "^6.18.0",
|
||||
"convert-source-map": "^1.5.0",
|
||||
"find-root": "^1.1.0",
|
||||
"mkdirp": "^0.5.1",
|
||||
"source-map": "^0.5.7",
|
||||
"touch": "^2.0.1"
|
||||
}
|
||||
},
|
||||
"babel-plugin-istanbul": {
|
||||
"version": "4.1.6",
|
||||
"resolved": "http://registry.npmjs.org/babel-plugin-istanbul/-/babel-plugin-istanbul-4.1.6.tgz",
|
||||
@ -1809,6 +1897,11 @@
|
||||
"resolved": "https://registry.npmjs.org/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.2.2.tgz",
|
||||
"integrity": "sha512-NtESBqk8LZuNhBd1BMLxDOh0JPytMs88LwAZFmHg1ZyuGrIAO40dw7p624w+flj0uuhfKTNY8tYKsUEAZGRRFA=="
|
||||
},
|
||||
"babel-plugin-syntax-jsx": {
|
||||
"version": "6.18.0",
|
||||
"resolved": "http://registry.npmjs.org/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz",
|
||||
"integrity": "sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY="
|
||||
},
|
||||
"babel-plugin-syntax-object-rest-spread": {
|
||||
"version": "6.13.0",
|
||||
"resolved": "http://registry.npmjs.org/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz",
|
||||
@ -2957,6 +3050,28 @@
|
||||
"elliptic": "^6.0.0"
|
||||
}
|
||||
},
|
||||
"create-emotion": {
|
||||
"version": "9.2.12",
|
||||
"resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-9.2.12.tgz",
|
||||
"integrity": "sha512-P57uOF9NL2y98Xrbl2OuiDQUZ30GVmASsv5fbsjF4Hlraip2kyAvMm+2PoYUvFFw03Fhgtxk3RqZSm2/qHL9hA==",
|
||||
"requires": {
|
||||
"@emotion/hash": "^0.6.2",
|
||||
"@emotion/memoize": "^0.6.1",
|
||||
"@emotion/stylis": "^0.7.0",
|
||||
"@emotion/unitless": "^0.6.2",
|
||||
"csstype": "^2.5.2",
|
||||
"stylis": "^3.5.0",
|
||||
"stylis-rule-sheet": "^0.0.10"
|
||||
}
|
||||
},
|
||||
"create-emotion-styled": {
|
||||
"version": "9.2.8",
|
||||
"resolved": "https://registry.npmjs.org/create-emotion-styled/-/create-emotion-styled-9.2.8.tgz",
|
||||
"integrity": "sha512-2LrNM5MREWzI5hZK+LyiBHglwE18WE3AEbBQgpHQ1+zmyLSm/dJsUZBeFAwuIMb+TjNZP0KsMZlV776ufOtFdg==",
|
||||
"requires": {
|
||||
"@emotion/is-prop-valid": "^0.6.1"
|
||||
}
|
||||
},
|
||||
"create-hash": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "http://registry.npmjs.org/create-hash/-/create-hash-1.2.0.tgz",
|
||||
@ -3315,6 +3430,11 @@
|
||||
"cssom": "0.3.x"
|
||||
}
|
||||
},
|
||||
"csstype": {
|
||||
"version": "2.5.7",
|
||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-2.5.7.tgz",
|
||||
"integrity": "sha512-Nt5VDyOTIIV4/nRFswoCKps1R5CD1hkiyjBE9/thNaNZILLEviVw9yWQw15+O+CpNjQKB/uvdcxFFOrSflY3Yw=="
|
||||
},
|
||||
"cyclist": {
|
||||
"version": "0.2.2",
|
||||
"resolved": "https://registry.npmjs.org/cyclist/-/cyclist-0.2.2.tgz",
|
||||
@ -3744,6 +3864,15 @@
|
||||
"resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
|
||||
"integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k="
|
||||
},
|
||||
"emotion": {
|
||||
"version": "9.2.12",
|
||||
"resolved": "https://registry.npmjs.org/emotion/-/emotion-9.2.12.tgz",
|
||||
"integrity": "sha512-hcx7jppaI8VoXxIWEhxpDW7I+B4kq9RNzQLmsrF6LY8BGKqe2N+gFAQr0EfuFucFlPs2A9HM4+xNj4NeqEWIOQ==",
|
||||
"requires": {
|
||||
"babel-plugin-emotion": "^9.2.11",
|
||||
"create-emotion": "^9.2.12"
|
||||
}
|
||||
},
|
||||
"encodeurl": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
|
||||
@ -4611,6 +4740,11 @@
|
||||
"pkg-dir": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"find-root": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz",
|
||||
"integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng=="
|
||||
},
|
||||
"find-up": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/find-up/-/find-up-2.1.0.tgz",
|
||||
@ -8096,6 +8230,14 @@
|
||||
"semver": "^5.3.0"
|
||||
}
|
||||
},
|
||||
"nopt": {
|
||||
"version": "1.0.10",
|
||||
"resolved": "https://registry.npmjs.org/nopt/-/nopt-1.0.10.tgz",
|
||||
"integrity": "sha1-bd0hvSoxQXuScn3Vhfim83YI6+4=",
|
||||
"requires": {
|
||||
"abbrev": "1"
|
||||
}
|
||||
},
|
||||
"normalize-package-data": {
|
||||
"version": "2.4.0",
|
||||
"resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-2.4.0.tgz",
|
||||
@ -10521,6 +10663,15 @@
|
||||
"resolved": "https://registry.npmjs.org/qs/-/qs-6.5.2.tgz",
|
||||
"integrity": "sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA=="
|
||||
},
|
||||
"query-string": {
|
||||
"version": "6.2.0",
|
||||
"resolved": "https://registry.npmjs.org/query-string/-/query-string-6.2.0.tgz",
|
||||
"integrity": "sha512-5wupExkIt8RYL4h/FE+WTg3JHk62e6fFPWtAZA9J5IWK1PfTfKkMS93HBUHcFpeYi9KsY5pFbh+ldvEyaz5MyA==",
|
||||
"requires": {
|
||||
"decode-uri-component": "^0.2.0",
|
||||
"strict-uri-encode": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"querystring": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz",
|
||||
@ -10735,6 +10886,15 @@
|
||||
"scheduler": "^0.10.0"
|
||||
}
|
||||
},
|
||||
"react-emotion": {
|
||||
"version": "9.2.12",
|
||||
"resolved": "https://registry.npmjs.org/react-emotion/-/react-emotion-9.2.12.tgz",
|
||||
"integrity": "sha512-qt7XbxnEKX5sZ73rERJ92JMbEOoyOwG3BuCRFRkXrsJhEe+rFBRTljRw7yOLHZUCQC4GBObZhjXIduQ8S0ZpYw==",
|
||||
"requires": {
|
||||
"babel-plugin-emotion": "^9.2.11",
|
||||
"create-emotion-styled": "^9.2.8"
|
||||
}
|
||||
},
|
||||
"react-error-overlay": {
|
||||
"version": "5.0.5",
|
||||
"resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-5.0.5.tgz",
|
||||
@ -12597,6 +12757,11 @@
|
||||
"resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz",
|
||||
"integrity": "sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI="
|
||||
},
|
||||
"strict-uri-encode": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz",
|
||||
"integrity": "sha1-ucczDHBChi9rFC3CdLvMWGbONUY="
|
||||
},
|
||||
"string-length": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/string-length/-/string-length-2.0.0.tgz",
|
||||
@ -12773,6 +12938,16 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"stylis": {
|
||||
"version": "3.5.3",
|
||||
"resolved": "https://registry.npmjs.org/stylis/-/stylis-3.5.3.tgz",
|
||||
"integrity": "sha512-TxU0aAscJghF9I3V9q601xcK3Uw1JbXvpsBGj/HULqexKOKlOEzzlIpLFRbKkCK990ccuxfXUqmPbIIo7Fq/cQ=="
|
||||
},
|
||||
"stylis-rule-sheet": {
|
||||
"version": "0.0.10",
|
||||
"resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz",
|
||||
"integrity": "sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw=="
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "5.5.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
|
||||
@ -13104,6 +13279,14 @@
|
||||
"hoek": "4.x.x"
|
||||
}
|
||||
},
|
||||
"touch": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/touch/-/touch-2.0.2.tgz",
|
||||
"integrity": "sha512-qjNtvsFXTRq7IuMLweVgFxmEuQ6gLbRs2jQxL80TtZ31dEKWYIxRXquij6w6VimyDek5hD3PytljHmEtAs2u0A==",
|
||||
"requires": {
|
||||
"nopt": "~1.0.10"
|
||||
}
|
||||
},
|
||||
"tough-cookie": {
|
||||
"version": "2.4.3",
|
||||
"resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.4.3.tgz",
|
||||
|
@ -5,8 +5,11 @@
|
||||
"dependencies": {
|
||||
"@reach/router": "^1.2.1",
|
||||
"axios": "^0.18.0",
|
||||
"emotion": "^9.2.12",
|
||||
"query-string": "^6.2.0",
|
||||
"react": "^16.6.0",
|
||||
"react-dom": "^16.6.0",
|
||||
"react-emotion": "^9.2.12",
|
||||
"react-scripts": "2.0.5"
|
||||
},
|
||||
"scripts": {
|
||||
|
15
src/App.js
15
src/App.js
@ -1,22 +1,23 @@
|
||||
import React, { Component } from 'react';
|
||||
import { Router } from "@reach/router";
|
||||
import { Routes } from './constants';
|
||||
import { AuthProvider } from './providers/Auth';
|
||||
import {
|
||||
Home,
|
||||
Login,
|
||||
Inbox,
|
||||
} from './pages';
|
||||
|
||||
const Dash = () => <div>Dash</div>
|
||||
|
||||
class App extends Component {
|
||||
render() {
|
||||
return (
|
||||
<Router>
|
||||
<Home path={Routes.HOME} />
|
||||
<Login path={Routes.LOGIN} />
|
||||
<Inbox path={Routes.INBOX} />
|
||||
</Router>
|
||||
<AuthProvider>
|
||||
<Router>
|
||||
<Home path={Routes.HOME} />
|
||||
<Login path={Routes.LOGIN} />
|
||||
<Inbox path={Routes.INBOX} />
|
||||
</Router>
|
||||
</AuthProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
13
src/components/buttons/AuthenticationButton.js
Normal file
13
src/components/buttons/AuthenticationButton.js
Normal file
@ -0,0 +1,13 @@
|
||||
import React from 'react';
|
||||
|
||||
const CLIENT_ID = '9478c90e57ef3d546ef0';
|
||||
const REDIRECT_URI = 'http://localhost:3000/login';
|
||||
const SCOPES = 'notifications';
|
||||
|
||||
const AuthenticationButton = () => (
|
||||
<a href={`https://github.com/login/oauth/authorize?client_id=${CLIENT_ID}&scope=${SCOPES}&redirect_uri=${REDIRECT_URI}`}>
|
||||
Login with GitHub
|
||||
</a>
|
||||
);
|
||||
|
||||
export default AuthenticationButton;
|
1
src/components/buttons/index.js
Normal file
1
src/components/buttons/index.js
Normal file
@ -0,0 +1 @@
|
||||
export {default as AuthenticationButton} from './AuthenticationButton';
|
@ -1,10 +0,0 @@
|
||||
import React from 'react';
|
||||
import { Link } from "@reach/router";
|
||||
import { Routes } from '../constants';
|
||||
|
||||
export default props => (
|
||||
<div>
|
||||
Login
|
||||
<Link to={Routes.HOME}>home</Link>
|
||||
</div>
|
||||
);
|
33
src/pages/Login/Scene.js
Normal file
33
src/pages/Login/Scene.js
Normal file
@ -0,0 +1,33 @@
|
||||
import React from 'react';
|
||||
import { Link } from "@reach/router";
|
||||
import styled from 'react-emotion';
|
||||
import { Routes } from '../../constants';
|
||||
import { AuthenticationButton } from '../../components/buttons';
|
||||
|
||||
const Container = styled.div({
|
||||
background: 'red',
|
||||
width: '100%',
|
||||
height: 100
|
||||
});
|
||||
|
||||
export default function Scene ({ loading, error, loggedOut, ...props }) {
|
||||
return (
|
||||
<Container>
|
||||
<Link to={Routes.HOME}>home</Link>
|
||||
<p>
|
||||
{error ? (
|
||||
<div>
|
||||
error, try again?
|
||||
<AuthenticationButton />
|
||||
</div>
|
||||
) : loading ? (
|
||||
<span>loading...</span>
|
||||
) : loggedOut ? (
|
||||
<AuthenticationButton />
|
||||
) : (
|
||||
<span>logged in!!</span>
|
||||
)}
|
||||
</p>
|
||||
</Container>
|
||||
);
|
||||
}
|
29
src/pages/Login/TokenHandler.js
Normal file
29
src/pages/Login/TokenHandler.js
Normal file
@ -0,0 +1,29 @@
|
||||
import React from 'react';
|
||||
import qs from 'query-string';
|
||||
import { Routes } from '../../constants';
|
||||
import { AuthenticationButton } from '../../components/buttons';
|
||||
import { AuthConsumer } from '../../providers/Auth';
|
||||
|
||||
export default class TokenHandler extends React.Component {
|
||||
componentDidMount() {
|
||||
const params = qs.parse(document.location.search);
|
||||
const code = params.code;
|
||||
if (code) {
|
||||
this.props.onSetLoading(true);
|
||||
fetch(`https://meteorite-gatekeeper.herokuapp.com/authenticate/${code}`)
|
||||
.then(response => response.json())
|
||||
.then(({ token, error }) => {
|
||||
this.props.onSetLoading(false);
|
||||
if (error) {
|
||||
this.props.onSetError(true);
|
||||
} else {
|
||||
this.props.setToken(token);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
render () {
|
||||
return null;
|
||||
}
|
||||
}
|
38
src/pages/Login/index.js
Normal file
38
src/pages/Login/index.js
Normal file
@ -0,0 +1,38 @@
|
||||
import React from 'react';
|
||||
import { Link } from "@reach/router";
|
||||
import { Routes } from '../../constants';
|
||||
import { AuthenticationButton } from '../../components/buttons';
|
||||
import { AuthConsumer } from '../../providers/Auth';
|
||||
import TokenHandler from './TokenHandler';
|
||||
import Scene from './Scene';
|
||||
|
||||
export default class LoginPage extends React.Component {
|
||||
state = {
|
||||
loading: false,
|
||||
error: null
|
||||
}
|
||||
|
||||
onSetLoading = loading => this.setState({ loading });
|
||||
onSetError = error => this.setState({ error });
|
||||
|
||||
render () {
|
||||
return (
|
||||
<AuthConsumer>
|
||||
{({ token, setToken }) => (
|
||||
<React.Fragment>
|
||||
<TokenHandler
|
||||
setToken={setToken}
|
||||
onSetLoading={this.onSetLoading}
|
||||
onSetError={this.onSetError}
|
||||
/>
|
||||
<Scene
|
||||
loading={this.state.loading}
|
||||
error={this.state.error}
|
||||
loggedOut={!token}
|
||||
/>
|
||||
</React.Fragment>
|
||||
)}
|
||||
</AuthConsumer>
|
||||
);
|
||||
}
|
||||
}
|
29
src/providers/Auth.js
Normal file
29
src/providers/Auth.js
Normal file
@ -0,0 +1,29 @@
|
||||
import React from 'react';
|
||||
|
||||
const {Provider, Consumer} = React.createContext('foo');
|
||||
|
||||
class AuthProvider extends React.Component {
|
||||
state = {
|
||||
token: null
|
||||
}
|
||||
|
||||
setToken = token => {
|
||||
this.setState({ token });
|
||||
}
|
||||
|
||||
render () {
|
||||
return (
|
||||
<Provider value={{
|
||||
token: this.state.token,
|
||||
setToken: this.setToken
|
||||
}}>
|
||||
{this.props.children}
|
||||
</Provider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export {
|
||||
AuthProvider,
|
||||
Consumer as AuthConsumer
|
||||
};
|
Loading…
Reference in New Issue
Block a user