i am slowly descending into madness

2022-01-23 23:23:09 +01:00 · 2022-01-23 23:23:09 +01:00 · f01c616a44
commit f01c616a44
parent 0885bf9c6a
13 changed files with 370 additions and 18 deletions
--- a/api/src/index.ts
+++ b/api/src/index.ts
@ -21,6 +21,7 @@ export { logger, app, db, PORT, SESSION_LIFETIME }
    await Promise.all([
        import('./middlewares/log'),
        import('./middlewares/updateTokenExpiry'),
+        import('./middlewares/cors'),
        import('./routes/internal/ws'),
        import('./routes/root'),
        import('./routes/login'),
--- a/api/src/middlewares/cors.ts
+++ b/api/src/middlewares/cors.ts
@ -0,0 +1,8 @@
+import { Request, Response } from "express";
+import { app, logger } from "..";
+
+app.use('*', (req: Request, res: Response, next: () => void) => {
+    res.header('Access-Control-Allow-Origin', '*');
+    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, x-auth-user, x-auth-token");
+    next();
+});
--- a/api/src/routes/login.ts
+++ b/api/src/routes/login.ts
@ -22,7 +22,7 @@ app.post('/login/begin', async (req: Request, res: Response) => {

    if (!r.success) return res.status(r.statusCode ?? 500).send(JSON.stringify({ error: r.error }, null, 4));

-    res.status(200).send({ success: true, nonce: r.nonce, code: r.code });
+    res.status(200).send({ success: true, nonce: r.nonce, code: r.code, uid: r.uid });
 });

 app.post('/login/complete', async (req: Request, res: Response) => {
--- a/bot/src/bot/commands/login.ts
+++ b/bot/src/bot/commands/login.ts
@ -51,7 +51,7 @@ export default {

            await Promise.all([
                message.reply(`Successfully logged in.\n\n` +
-                    `If this wasn't you, ~~run \`${DEFAULT_PREFIX}logout ${code}\` immediately~~ pray.`),
+                    `If this wasn't you, run \`${DEFAULT_PREFIX}logout ${code}\` immediately.`),
                client.db.get('pending_logins').update({ _id: login._id }, { $set: { confirmed: true } }),
            ]);
        } catch(e) {
--- a/bot/src/bot/modules/api_communication.ts
+++ b/bot/src/bot/modules/api_communication.ts
@ -97,7 +97,7 @@ wsEvents.on('req:requestLogin', async (data: any, cb: (data: any) => void) => {
        const user = await parseUser(data.user);
        if (!user)
            return cb({ success: false, statusCode: 404, error: `The specified user could not be found` });
-        
+
        let code: string|null = null;
        while (!code) {
            const c = crypto.randomBytes(8).toString('hex');
--- a/web/index.html
+++ b/web/index.html
@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" class="dark">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/src/favicon.svg" />
--- a/web/package.json
+++ b/web/package.json
@ -7,9 +7,17 @@
    "preview": "vite preview"
  },
  "dependencies": {
+    "@revoltchat/ui": "^1.0.24",
+    "@types/axios": "^0.14.0",
+    "@types/core-js": "^2.5.5",
+    "@types/styled-components": "^5.1.21",
+    "axios": "^0.25.0",
+    "core-js": "^3.20.3",
+    "localforage": "^1.10.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
-    "react-router-dom": "^6.2.1"
+    "react-router-dom": "^6.2.1",
+    "styled-components": "^5.3.3"
  },
  "devDependencies": {
    "@types/react": "^17.0.33",
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@ -1,20 +1,22 @@
 import { Route, BrowserRouter, Routes } from 'react-router-dom';
+import Home from './pages/Home';
 import './App.css';
+import '@revoltchat/ui/src/styles/dark.css';
+import '@revoltchat/ui/src/styles/common.css';
+import RequireAuth from './components/RequireAuth';
+
+const API_URL = 'http://localhost:9000';

 function App() {
  return (
    <BrowserRouter>
      <Routes>
-        <Route path='/' element={(
-          <div>
-            <h1>todo: web design</h1>
-            <a href='/dashboard'>sign in</a>
-          </div>
-        )} />
-        <Route path='/dashboard' element={<span>todo</span>} />
+        <Route path='/' element={<Home />} />
+        <Route path='/dashboard' element={<RequireAuth><a>among us</a></RequireAuth>} />
      </Routes>
    </BrowserRouter>
  );
 }

-export default App
+export default App;
+export { API_URL }
--- a/web/src/components/RequireAuth.tsx
+++ b/web/src/components/RequireAuth.tsx
@ -0,0 +1,15 @@
+import { FunctionComponent, useState, useEffect } from "react";
+import Login from "../pages/Login";
+import { getAuth } from "../utils";
+
+const RequireAuth: FunctionComponent = (props) => {
+    const [loggedIn, setLoggedIn] = useState(true);
+
+    useEffect(() => {
+        getAuth().then(res => setLoggedIn(!!res));
+    });
+
+    return loggedIn ? <>{props.children}</> : <Login />
+}
+
+export default RequireAuth;
--- a/web/src/pages/Home.tsx
+++ b/web/src/pages/Home.tsx
@ -0,0 +1,12 @@
+import { FunctionComponent } from "react";
+
+const Home: FunctionComponent = () => {
+    return (
+        <div>
+            <h1>todo: web design</h1>
+            <a href='/dashboard'>sign in</a>
+        </div>
+    );
+}
+
+export default Home;
--- a/web/src/pages/Login.tsx
+++ b/web/src/pages/Login.tsx
@ -0,0 +1,79 @@
+import localforage from "localforage";
+import axios from 'axios';
+import { FunctionComponent, useCallback, useState } from "react";
+import { Button } from '@revoltchat/ui/lib/components/atoms/inputs/Button';
+import { InputBox } from '@revoltchat/ui/lib/components/atoms/inputs/InputBox';
+import { H1 } from '@revoltchat/ui/lib/components/atoms/heading/H1';
+import { H2 } from '@revoltchat/ui/lib/components/atoms/heading/H2';
+import { API_URL } from "../App";
+
+const Login: FunctionComponent = () => {
+    const [username, setUsername] = useState('');
+    const [showInitial, setShowInitial] = useState(true);
+    const [showSecond, setShowSecond] = useState(false);
+    const [statusMsg, setStatusMsg] = useState('');
+    const [code, setCode] = useState('');
+    const [nonce, setNonce] = useState('');
+
+    const getCode = useCallback(async () => {
+        if (!username) return;
+        setShowInitial(false);
+
+        try {
+            const res = await axios.post(`${API_URL}/login/begin`, { user: username });
+            setShowSecond(true);
+            setCode(res.data.code);
+            setNonce(res.data.nonce);
+            setUsername(res.data.uid);
+        } catch(e: any) {
+            setStatusMsg(e?.message || e);
+            setShowInitial(true);
+            setShowSecond(false);
+        }
+    }, [ username ]);
+
+    const getSession = useCallback(async () => {
+        try {
+            const res = await axios.post(`${API_URL}/login/complete`, {
+                nonce, code, user: username
+            });
+
+            await localforage.setItem('auth', { user: res.data.user, token: res.data.token });
+
+            setShowSecond(false);
+            window.location.reload();
+        } catch(e: any) {
+            setStatusMsg(e?.message || e);
+        }
+    }, [ nonce, code, username ]);
+
+    return (
+        <div>
+            <H1>log in</H1>
+            {statusMsg.length ? <a>{statusMsg}</a> : <br/>}
+            <div hidden={!showInitial}>
+                <InputBox
+                    onChange={e => {
+                        setUsername(e.target.value);
+                        setStatusMsg('');
+                    }}
+                    placeholder="Enter your user ID..."
+                    style={{ width: "200px", float: "left" }}
+                />
+                <Button onClick={getCode} disabled={username.length == 0}>Continue</Button>
+            </div>
+            <div hidden={!showSecond}>
+                <H2>Your code: <a>{code}</a></H2>
+                <p style={{ color: "var(--foreground)" }}>
+                    Run <code style={{ userSelect: 'all' }}>
+                        /login {code}
+                    </code> in any server using AutoMod, then <a
+                        onClick={getSession}
+                        style={{ cursor: 'pointer' }}
+                    >click here</a>.</p>
+            </div>
+        </div>
+    );
+}
+
+export default Login;
--- a/web/src/utils.tsx
+++ b/web/src/utils.tsx
@ -0,0 +1,22 @@
+import axios from "axios";
+import localforage from "localforage";
+import { API_URL } from "./App";
+
+async function getAuth(): Promise<false|{ user: string, token: string }> {
+    const auth: any = await localforage.getItem('auth');
+    if (!auth) return false;
+
+    try {
+        const res = await axios.get(API_URL, {
+            headers: {
+                'x-auth-user': auth.user,
+                'x-auth-token': auth.token,
+            }
+        });
+
+        if (res.data?.authenticated) return { user: auth.user ?? '', token: auth.token ?? '' }
+        else return false;
+    } catch(e) { return false } // todo: dont assume we're logged out if death
+}
+
+export { getAuth }
--- a/web/yarn.lock
+++ b/web/yarn.lock
@ -44,7 +44,7 @@
    jsesc "^2.5.1"
    source-map "^0.5.0"

-"@babel/helper-annotate-as-pure@^7.16.7":
+"@babel/helper-annotate-as-pure@^7.16.0", "@babel/helper-annotate-as-pure@^7.16.7":
  version "7.16.7"
  resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.16.7.tgz#bb2339a7534a9c128e3102024c60760a3a7f3862"
  integrity sha512-s6t2w/IPQVTAET1HitoowRGXooX8mCgtuP5195wD/QJPV6wYjpujCGF7JuMODVX2ZAJOf1GT6DT9MHEZvLOFSw==
@ -91,7 +91,7 @@
  dependencies:
    "@babel/types" "^7.16.7"

-"@babel/helper-module-imports@^7.16.7":
+"@babel/helper-module-imports@^7.0.0", "@babel/helper-module-imports@^7.16.0", "@babel/helper-module-imports@^7.16.7":
  version "7.16.7"
  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.16.7.tgz#25612a8091a999704461c8a222d0efec5d091437"
  integrity sha512-LVtS6TqjJHFc+nYeITRo6VLXve70xmq7wPhWTqDJusJEgGmkAACWwMiTNrvfoQo6hEhFwAIixNkvB0jPXDL8Wg==
@ -203,7 +203,7 @@
    "@babel/plugin-syntax-jsx" "^7.16.7"
    "@babel/types" "^7.16.7"

-"@babel/runtime@^7.7.6":
+"@babel/runtime@^7.10.5", "@babel/runtime@^7.15.3", "@babel/runtime@^7.7.6":
  version "7.16.7"
  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.16.7.tgz#03ff99f64106588c9c403c6ecb8c3bafbbdff1fa"
  integrity sha512-9E9FJowqAsytyOY6LG+1KuueckRL+aQW+mKvXRXnuFGyRAyepJPmEo9vgMfXUA6O9u3IeEdv9MAkppFcaQwogQ==
@ -219,7 +219,7 @@
    "@babel/parser" "^7.16.7"
    "@babel/types" "^7.16.7"

-"@babel/traverse@^7.16.10", "@babel/traverse@^7.16.7":
+"@babel/traverse@^7.16.10", "@babel/traverse@^7.16.7", "@babel/traverse@^7.4.5":
  version "7.16.10"
  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.16.10.tgz#448f940defbe95b5a8029975b051f75993e8239f"
  integrity sha512-yzuaYXoRJBGMlBhsMJoUW7G1UmSb/eXr/JHYM/MsOJgavJibLwASijW7oXBdw3NQ6T0bW7Ty5P/VarOs9cHmqw==
@ -243,6 +243,37 @@
    "@babel/helper-validator-identifier" "^7.16.7"
    to-fast-properties "^2.0.0"

+"@emotion/is-prop-valid@^0.8.7", "@emotion/is-prop-valid@^0.8.8":
+  version "0.8.8"
+  resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz#db28b1c4368a259b60a97311d6a952d4fd01ac1a"
+  integrity sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==
+  dependencies:
+    "@emotion/memoize" "0.7.4"
+
+"@emotion/memoize@0.7.4":
+  version "0.7.4"
+  resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb"
+  integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==
+
+"@emotion/stylis@^0.8.4":
+  version "0.8.5"
+  resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.5.tgz#deacb389bd6ee77d1e7fcaccce9e16c5c7e78e04"
+  integrity sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==
+
+"@emotion/unitless@^0.7.4":
+  version "0.7.5"
+  resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed"
+  integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==
+
+"@revoltchat/ui@^1.0.24":
+  version "1.0.24"
+  resolved "https://registry.yarnpkg.com/@revoltchat/ui/-/ui-1.0.24.tgz#ce55cc225ec92eb07dd5865b9255d1f160d06ce2"
+  integrity sha512-3CPnfWtEN0IE5ERy4QBhLzjQGGPE0OKLlFrBw7VZzuaQDoAsUo9/CjHnCY1Cc0HQlT6scbrNXyvInjOKggds1g==
+  dependencies:
+    "@styled-icons/boxicons-logos" "^10.38.0"
+    "@styled-icons/boxicons-regular" "^10.38.0"
+    "@styled-icons/boxicons-solid" "^10.38.0"
+
 "@rollup/pluginutils@^4.1.2":
  version "4.1.2"
  resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-4.1.2.tgz#ed5821c15e5e05e32816f5fb9ec607cdf5a75751"
@ -251,6 +282,58 @@
    estree-walker "^2.0.1"
    picomatch "^2.2.2"

+"@styled-icons/boxicons-logos@^10.38.0":
+  version "10.38.0"
+  resolved "https://registry.yarnpkg.com/@styled-icons/boxicons-logos/-/boxicons-logos-10.38.0.tgz#f51442c49f1a28c61927d6d2f8c1e2d7946faf46"
+  integrity sha512-DpkUi9qV76RsyuzihQhfCho142WCxK/2oUfjcqo6BsP92qxV+4rtS5nfVsmqfnSEef4av+qSeg33fJWDyURyKg==
+  dependencies:
+    "@babel/runtime" "^7.15.3"
+    "@styled-icons/styled-icon" "^10.6.3"
+
+"@styled-icons/boxicons-regular@^10.38.0":
+  version "10.38.0"
+  resolved "https://registry.yarnpkg.com/@styled-icons/boxicons-regular/-/boxicons-regular-10.38.0.tgz#1eb80b4f94a18a9b77b11dee5204aa23378d37ec"
+  integrity sha512-xjhafoa0/EeYtQOyTw+ohuSlBx599t8l8++JH1tQlM0l73dP4icTpF4znYL+HhZeaUe3D+UhrkfWuBBua2w2Qw==
+  dependencies:
+    "@babel/runtime" "^7.15.3"
+    "@styled-icons/styled-icon" "^10.6.3"
+
+"@styled-icons/boxicons-solid@^10.38.0":
+  version "10.38.0"
+  resolved "https://registry.yarnpkg.com/@styled-icons/boxicons-solid/-/boxicons-solid-10.38.0.tgz#bb2a6e21f3412c97ae8029396e3ca9fb107c7658"
+  integrity sha512-uuMtF1R61smQT5r6HIYMHvpVD0XSErXXNQYl5d6lCtMyefd0gIE5Rw+iD9i/RxHFUHNHbvL69LvitCLtNWrSqw==
+  dependencies:
+    "@babel/runtime" "^7.15.3"
+    "@styled-icons/styled-icon" "^10.6.3"
+
+"@styled-icons/styled-icon@^10.6.3":
+  version "10.6.3"
+  resolved "https://registry.yarnpkg.com/@styled-icons/styled-icon/-/styled-icon-10.6.3.tgz#eae0e5e18fd601ac47e821bb9c2e099810e86403"
+  integrity sha512-/A95L3peioLoWFiy+/eKRhoQ9r/oRrN/qzbSX4hXU1nGP2rUXcX3LWUhoBNAOp9Rw38ucc/4ralY427UUNtcGQ==
+  dependencies:
+    "@babel/runtime" "^7.10.5"
+    "@emotion/is-prop-valid" "^0.8.7"
+
+"@types/axios@^0.14.0":
+  version "0.14.0"
+  resolved "https://registry.yarnpkg.com/@types/axios/-/axios-0.14.0.tgz#ec2300fbe7d7dddd7eb9d3abf87999964cafce46"
+  integrity sha1-7CMA++fX3d1+udOr+HmZlkyvzkY=
+  dependencies:
+    axios "*"
+
+"@types/core-js@^2.5.5":
+  version "2.5.5"
+  resolved "https://registry.yarnpkg.com/@types/core-js/-/core-js-2.5.5.tgz#dc5a013ee0b23bd5ac126403854fadabb4f24f75"
+  integrity sha512-C4vwOHrhsvxn7UFyk4NDQNUpgNKdWsT/bL39UWyD75KSEOObZSKa9mYDOCM5FGeJG2qtbG0XiEbUKND2+j0WOg==
+
+"@types/hoist-non-react-statics@*":
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
+  integrity sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==
+  dependencies:
+    "@types/react" "*"
+    hoist-non-react-statics "^3.3.0"
+
 "@types/prop-types@*":
  version "15.7.4"
  resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.4.tgz#fcf7205c25dff795ee79af1e30da2c9790808f11"
@ -277,6 +360,15 @@
  resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39"
  integrity sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==

+"@types/styled-components@^5.1.21":
+  version "5.1.21"
+  resolved "https://registry.yarnpkg.com/@types/styled-components/-/styled-components-5.1.21.tgz#39f6bdc4103254d899531ef099dae5619b039cdb"
+  integrity sha512-lQzA0T6CaLXoeiOkSe2US2JfFgJV2/yJ8W1BaJubQQh2wdq7H+qScQQfbjURyLkgI1Ig+S/jRHCrWikfMHC6zA==
+  dependencies:
+    "@types/hoist-non-react-statics" "*"
+    "@types/react" "*"
+    csstype "^3.0.2"
+
 "@vitejs/plugin-react@^1.0.7":
  version "1.1.4"
  resolved "https://registry.yarnpkg.com/@vitejs/plugin-react/-/plugin-react-1.1.4.tgz#a3f3f49d11890bf73bc64d545ce8fe7f5d506e85"
@ -298,6 +390,28 @@ ansi-styles@^3.2.1:
  dependencies:
    color-convert "^1.9.0"

+axios@*, axios@^0.25.0:
+  version "0.25.0"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.25.0.tgz#349cfbb31331a9b4453190791760a8d35b093e0a"
+  integrity sha512-cD8FOb0tRH3uuEe6+evtAbgJtfxr7ly3fQjYcMcuPlgkwVS9xboaVIpcDV+cYQe+yGykgwZCs1pzjntcGa6l5g==
+  dependencies:
+    follow-redirects "^1.14.7"
+
+"babel-plugin-styled-components@>= 1.12.0":
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-2.0.2.tgz#0fac11402dc9db73698b55847ab1dc73f5197c54"
+  integrity sha512-7eG5NE8rChnNTDxa6LQfynwgHTVOYYaHJbUYSlOhk8QBXIQiMBKq4gyfHBBKPrxUcVBXVJL61ihduCpCQbuNbw==
+  dependencies:
+    "@babel/helper-annotate-as-pure" "^7.16.0"
+    "@babel/helper-module-imports" "^7.16.0"
+    babel-plugin-syntax-jsx "^6.18.0"
+    lodash "^4.17.11"
+
+babel-plugin-syntax-jsx@^6.18.0:
+  version "6.18.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
+  integrity sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=
+
 browserslist@^4.17.5:
  version "4.19.1"
  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.19.1.tgz#4ac0435b35ab655896c31d53018b6dd5e9e4c9a3"
@ -309,6 +423,11 @@ browserslist@^4.17.5:
    node-releases "^2.0.1"
    picocolors "^1.0.0"

+camelize@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/camelize/-/camelize-1.0.0.tgz#164a5483e630fa4321e5af07020e531831b2609b"
+  integrity sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=
+
 caniuse-lite@^1.0.30001286:
  version "1.0.30001301"
  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001301.tgz#ebc9086026534cab0dab99425d9c3b4425e5f450"
@ -342,6 +461,25 @@ convert-source-map@^1.7.0:
  dependencies:
    safe-buffer "~5.1.1"

+core-js@^3.20.3:
+  version "3.20.3"
+  resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.20.3.tgz#c710d0a676e684522f3db4ee84e5e18a9d11d69a"
+  integrity sha512-vVl8j8ph6tRS3B8qir40H7yw7voy17xL0piAjlbBUsH7WIfzoedL/ZOr1OV9FyZQLWXsayOJyV4tnRyXR85/ag==
+
+css-color-keywords@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05"
+  integrity sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=
+
+css-to-react-native@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/css-to-react-native/-/css-to-react-native-3.0.0.tgz#62dbe678072a824a689bcfee011fc96e02a7d756"
+  integrity sha512-Ro1yETZA813eoyUp2GDBhG2j+YggidUmzO1/v9eYBKR2EHVEniE2MI/NqpTQ954BMpTPZFsGNPm46qFB9dpaPQ==
+  dependencies:
+    camelize "^1.0.0"
+    css-color-keywords "^1.0.0"
+    postcss-value-parser "^4.0.2"
+
 csstype@^3.0.2:
  version "3.0.10"
  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.10.tgz#2ad3a7bed70f35b965707c092e5f30b327c290e5"
@ -482,6 +620,11 @@ estree-walker@^2.0.1:
  resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-2.0.2.tgz#52f010178c2a4c117a7757cfe942adb7d2da4cac"
  integrity sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==

+follow-redirects@^1.14.7:
+  version "1.14.7"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.14.7.tgz#2004c02eb9436eee9a21446a6477debf17e81685"
+  integrity sha512-+hbxoLbFMbRKDwohX8GkTataGqO6Jb7jGwpAlwgy2bIz25XtRm7KEzJM76R1WiNT5SwZkX4Y75SwBolkpmE7iQ==
+
 fsevents@~2.3.2:
  version "2.3.2"
  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
@ -521,6 +664,18 @@ history@^5.2.0:
  dependencies:
    "@babel/runtime" "^7.7.6"

+hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.0:
+  version "3.3.2"
+  resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
+  integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
+  dependencies:
+    react-is "^16.7.0"
+
+immediate@~3.0.5:
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/immediate/-/immediate-3.0.6.tgz#9db1dbd0faf8de6fbe0f5dd5e56bb606280de69b"
+  integrity sha1-nbHb0Pr43m++D13V5Wu2BigN5ps=
+
 is-core-module@^2.8.1:
  version "2.8.1"
  resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.8.1.tgz#f59fdfca701d5879d0a6b100a40aa1560ce27211"
@ -545,6 +700,25 @@ json5@^2.1.2:
  dependencies:
    minimist "^1.2.5"

+lie@3.1.1:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/lie/-/lie-3.1.1.tgz#9a436b2cc7746ca59de7a41fa469b3efb76bd87e"
+  integrity sha1-mkNrLMd0bKWd56QfpGmz77dr2H4=
+  dependencies:
+    immediate "~3.0.5"
+
+localforage@^1.10.0:
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/localforage/-/localforage-1.10.0.tgz#5c465dc5f62b2807c3a84c0c6a1b1b3212781dd4"
+  integrity sha512-14/H1aX7hzBBmmh7sGPd+AOMkkIrHM3Z1PAyGgZigA1H1p5O5ANnMyWzvpAETtG68/dC4pC0ncy3+PPGzXZHPg==
+  dependencies:
+    lie "3.1.1"
+
+lodash@^4.17.11:
+  version "4.17.21"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
+  integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
+
 loose-envify@^1.1.0:
  version "1.4.0"
  resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
@ -592,6 +766,11 @@ picomatch@^2.2.2:
  resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42"
  integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==

+postcss-value-parser@^4.0.2:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
+  integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
+
 postcss@^8.4.5:
  version "8.4.5"
  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.5.tgz#bae665764dfd4c6fcc24dc0fdf7e7aa00cc77f95"
@ -610,6 +789,11 @@ react-dom@^17.0.2:
    object-assign "^4.1.1"
    scheduler "^0.20.2"

+react-is@^16.7.0:
+  version "16.13.1"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
+  integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
+
 react-refresh@^0.11.0:
  version "0.11.0"
  resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.11.0.tgz#77198b944733f0f1f1a90e791de4541f9f074046"
@ -677,6 +861,11 @@ semver@^6.3.0:
  resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
  integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==

+shallowequal@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
+  integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
+
 source-map-js@^1.0.1:
  version "1.0.2"
  resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
@ -687,7 +876,23 @@ source-map@^0.5.0:
  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
  integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=

-supports-color@^5.3.0:
+styled-components@^5.3.3:
+  version "5.3.3"
+  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.3.3.tgz#312a3d9a549f4708f0fb0edc829eb34bde032743"
+  integrity sha512-++4iHwBM7ZN+x6DtPPWkCI4vdtwumQ+inA/DdAsqYd4SVgUKJie5vXyzotA00ttcFdQkCng7zc6grwlfIfw+lw==
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@babel/traverse" "^7.4.5"
+    "@emotion/is-prop-valid" "^0.8.8"
+    "@emotion/stylis" "^0.8.4"
+    "@emotion/unitless" "^0.7.4"
+    babel-plugin-styled-components ">= 1.12.0"
+    css-to-react-native "^3.0.0"
+    hoist-non-react-statics "^3.0.0"
+    shallowequal "^1.1.0"
+    supports-color "^5.5.0"
+
+supports-color@^5.3.0, supports-color@^5.5.0:
  version "5.5.0"
  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
  integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==