add frontend files

2021-08-04 00:08:22 -03:00
parent 72e4c29612
commit 8d089c0b7a
32 changed files with 4850 additions and 91 deletions
--- a/.env
+++ b/.env
@@ -0,0 +1,3 @@
+AUTH_DOMAIN=dev-l56jkgi4.us.auth0.com
+AUTH_CLIENT_ID=xuG9f6l8ewKSXdJozsT2Ps8bABtlLbRb
+AUTH_AUDIENCE=https://xstake.com.br/
--- a/4
+++ b/4
@@ -23,7 +23,6 @@ gem "graphql"
 gem "tailwindcss-rails"

 group :development, :test do
-  gem "graphql_playground-rails"
  gem "pry-byebug", platforms: [:mri, :mingw, :x64_mingw]
  gem "capybara"
  gem "rspec-rails"
@@ -34,11 +33,10 @@ group :development, :test do
 end

 group :development do
+  gem "dotenv-rails"
  gem "graphql_playground-rails"
  gem "web-console", ">= 4.1.0"

  gem "listen", "~> 3.3"
-  # gem "rack-mini-profiler", "~> b2.0"
-
  gem "spring"
 end
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -102,6 +102,10 @@ GEM
    devise-i18n (1.10.0)
      devise (>= 4.8.0)
    diff-lcs (1.4.4)
+    dotenv (2.7.6)
+    dotenv-rails (2.7.6)
+      dotenv (= 2.7.6)
+      railties (>= 3.2)
    erubi (1.10.0)
    ffi (1.15.3)
    globalid (0.5.2)
@@ -302,6 +306,7 @@ DEPENDENCIES
  devise
  devise-bootstrap-views (~> 1.0)
  devise-i18n
+  dotenv-rails
  graphql
  graphql_playground-rails
  jbuilder (~> 2.7)
--- a/app/javascript/modules.d.ts
+++ b/app/javascript/modules.d.ts
@@ -0,0 +1,8 @@
+declare module "@rails/ujs"
+declare module "turbolinks"
+declare module "@rails/activestorage"
+
+declare module '*.png' {
+  const png: string
+  export default png
+}
--- a/app/javascript/packs/application.ts
+++ b/app/javascript/packs/application.ts
@@ -13,4 +13,3 @@
 // ActiveStorage.start()

 import "stylesheets/application"
-import './src/index'
--- a/app/javascript/packs/react.ts
+++ b/app/javascript/packs/react.ts
@@ -0,0 +1 @@
+import '../src/index'
--- a/app/javascript/packs/src/App.tsx
+++ b/app/javascript/packs/src/App.tsx
@@ -1,19 +0,0 @@
-import React from "react"
-import {
-  BrowserRouter as Router,
-  Switch,
-  Route,
-} from "react-router-dom";
-
-export const App = () => (
-  <Router>
-    <Switch>
-      <Route path="/about">
-        <div>About!</div>
-      </Route>
-      <Route path="/">
-        <div className="bg-gray-600">Hello World!</div>
-      </Route>
-    </Switch>
-  </Router>
-)
--- a/app/javascript/src/App.tsx
+++ b/app/javascript/src/App.tsx
@@ -0,0 +1,30 @@
+import React from "react"
+import {
+  BrowserRouter as Router,
+  Switch,
+  Route,
+} from "react-router-dom";
+import { AppContext } from "./contexts/AppContext";
+import { AuthProvider } from "./contexts/AuthProvider";
+import { Home } from "./pages";
+
+export const App = () => {
+  return (
+    <AuthProvider>
+      <AppContext>
+        <main className="min-h-screen w-full bg-gray-50 flex flex-col">
+          <Router>
+            <Switch>
+              <Route path="/hello_about">
+                <div className="bg-gray-600">Hello World!</div>
+              </Route>
+              <Route path="/">
+                <Home />
+              </Route>
+            </Switch>
+          </Router>
+        </main>
+      </AppContext>
+    </AuthProvider>
+  )
+}
--- a/app/javascript/src/components/Container.tsx
+++ b/app/javascript/src/components/Container.tsx
@@ -0,0 +1,17 @@
+import * as React from "react";
+import cx from "classnames";
+
+export type ContainerProps = {
+  className?: string;
+};
+
+export const Container = ({
+  children,
+  className,
+}: React.PropsWithChildren<ContainerProps>) => {
+  return (
+    <div className="w-full flex items-center justify-center px-8 py-2 2xl:p-0">
+      <div className={cx("max-w-5xl w-full flex", className)}>{children}</div>
+    </div>
+  );
+};
--- a/app/javascript/src/components/Header.tsx
+++ b/app/javascript/src/components/Header.tsx
@@ -0,0 +1,11 @@
+import * as React from "react";
+
+export type HeaderProps = {};
+
+export const Header = ({ children }: React.PropsWithChildren<HeaderProps>) => {
+  return (
+    <div className="w-full h-64 bg-gradient-to-br from-green-300 to-green-400 grid place-items-center">
+      {children}
+    </div>
+  );
+};
--- a/app/javascript/src/components/Navbar.tsx
+++ b/app/javascript/src/components/Navbar.tsx
@@ -0,0 +1,62 @@
+import * as React from "react";
+import { useAuth0 } from "@auth0/auth0-react";
+import XStakeLogo from '../images/logo.png'
+import { useAppContext } from "../contexts/AppContext";
+
+export const Navbar = () => {
+  const { setSideNavExpanded } = useAppContext()
+
+  const handleExpandSideNav = () => {
+    setSideNavExpanded((prevState) => !prevState);
+  };
+
+  const { loginWithRedirect, logout, isAuthenticated } = useAuth0();
+
+  return (
+    <nav className="fixed w-full h-16 flex bg-white shadow items-center px-4 space-x-2 z-50">
+      <button
+        className="w-10 h-10 xl:hidden"
+        onClick={() => handleExpandSideNav()}
+      >
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          className="h-full w-full"
+          fill="none"
+          viewBox="0 0 24 24"
+          stroke="currentColor"
+        >
+          <path
+            strokeLinecap="round"
+            strokeLinejoin="round"
+            strokeWidth={2}
+            d="M4 6h16M4 12h16M4 18h16"
+          />
+        </svg>
+      </button>
+      <img
+        src={XStakeLogo}
+        alt={"XStake Logo"}
+        width={64}
+        placeholder={"blurred"}
+      />
+      <h1 className="text-2xl font-bold">XStake</h1>
+      <div className="w-full h-full flex items-center justify-end">
+        {isAuthenticated ? (
+          <button
+            className="cursor-pointer hover:bg-gray-100 h-full px-4 font-bold"
+            onClick={() => logout({ returnTo: window.location.origin })}
+          >
+            Sair
+          </button>
+        ) : (
+          <button
+            className="cursor-pointer hover:bg-gray-100 h-full px-4 font-bold"
+            onClick={loginWithRedirect}
+          >
+            Entrar
+          </button>
+        )}
+      </div>
+    </nav>
+  );
+};
--- a/app/javascript/src/components/PoolListing.tsx
+++ b/app/javascript/src/components/PoolListing.tsx
@@ -0,0 +1,50 @@
+import React from "react";
+
+import { pools } from "../constants/Pools";
+
+export const PoolListing = () => {
+  return (
+    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 place-items-center w-full gap-8 py-4 -mt-16 overflow-x-hidden">
+      {pools
+        .filter((pool) => !pool.isFinished)
+        .sort((a, b) => (a.sortOrder ?? 0) - (b.sortOrder ?? 0))
+        .map((pool) => (
+          <div
+            key={pool.sousId}
+            id={pool.sousId.toString()}
+            className="flex items-center w-full h-auto bg-white px-16 p-4 rounded-xl shadow flex-col relative z-0 overflow-hidden hover:shadow-lg transition-all duration-300 cursor-pointer"
+          >
+            <div
+              className="box-border h-full w-full absolute left-0 top-0 rounded-xl opacity-20 filter blur-2xl bg-cover"
+              style={{
+                backgroundImage: `url('https://pancakeswap.finance/images/tokens/${pool.earningToken.address["56"]}.svg')`,
+                backgroundPositionX: "50%",
+                backgroundPositionY: "50%",
+                backgroundSize: "125%",
+                zIndex: -1,
+              }}
+            />
+            <img
+              className="shadow-xl rounded-full w-24"
+              src={`https://pancakeswap.finance/images/tokens/${pool.earningToken.address["56"]}.svg`}
+              alt={`${pool.earningToken.symbol} icon`}
+            />
+            <div className="mt-4 p-2">
+              <p>
+                <span className="font-medium">Investir:</span>{" "}
+                {pool.stakingToken.symbol}
+              </p>
+              <p>
+                <span className="font-medium">Receber:</span>{" "}
+                {pool.earningToken.symbol}
+              </p>
+              <div className="flex items-center">
+                <span className="font-medium mr-1">Rendimento:</span>
+                <div className="w-10 h-5 inline-block animate-pulse bg-gray-300 rounded" />
+              </div>
+            </div>
+          </div>
+        ))}
+    </div>
+  );
+};
--- a/app/javascript/src/components/SideNav.tsx
+++ b/app/javascript/src/components/SideNav.tsx
@@ -0,0 +1,57 @@
+import * as React from "react";
+import cx from "classnames";
+import { useAppContext } from "../contexts/AppContext";
+
+type MenuItem = {
+  label: string;
+};
+
+const MenuItems: MenuItem[] = [
+  {
+    label: "Início",
+  },
+  {
+    label: "Stake",
+  },
+  {
+    label: "Carteira",
+  },
+];
+
+
+export const SideNav = () => {
+  const { sideNavExpanded, setSideNavExpanded } = useAppContext()
+
+  const handleCloseSideNav = () => {
+    setSideNavExpanded(false);
+  };
+
+  return (
+    <div className="fixed left-0 right-0 bottom-0 mt-16 top-0 z-40 xl:static xl:w-72">
+      <div
+        role="row"
+        onClick={() => handleCloseSideNav()}
+        className={cx(
+          "xl:hidden absolute w-full h-full bg-black bg-opacity-60 backdrop-filter backdrop-blur-sm z-30 transition-all duration-500",
+          !sideNavExpanded && "opacity-0"
+        )}
+      />
+      <aside
+        className={`bg-white w-5/6 md:w-2/6 overflow-hidden absolute h-full drop-shadow-xl drop border-r border-gray-200 z-40 transition-all duration-500 xl:transition-none xl:mx-0 xl:static xl:w-full ${
+          sideNavExpanded ? "mx-0" : "-mx-full"
+        }`}
+      >
+        <ul>
+          {MenuItems.map((item) => (
+            <li
+              key={item.label}
+              className="text-xl p-4 px-8 hover:bg-gray-100 cursor-pointer"
+            >
+              <a href="#">{item.label}</a>
+            </li>
+          ))}
+        </ul>
+      </aside>
+    </div>
+  );
+};
--- a/app/javascript/src/constants/Pools.ts
+++ b/app/javascript/src/constants/Pools.ts
--- a/app/javascript/src/constants/pancake/Tokens.ts
+++ b/app/javascript/src/constants/pancake/Tokens.ts
--- a/app/javascript/src/contexts/AppContext.tsx
+++ b/app/javascript/src/contexts/AppContext.tsx
@@ -0,0 +1,28 @@
+import React, { createContext, Dispatch, FC, SetStateAction, useContext, useState } from 'react'
+
+export type AppContext = {
+  setSideNavExpanded: Dispatch<SetStateAction<boolean>>
+  sideNavExpanded: boolean
+}
+
+const Context = createContext<AppContext | null>(null)
+
+export const useAppContext = (): AppContext => {
+  const context = useContext(Context);
+
+  if (context === null) {
+    throw new Error("You probably forgot to put <AppContext>.");
+  }
+
+  return context;
+};
+
+export const AppContext: FC = ({ children }) => {
+  const [sideNavExpanded, setSideNavExpanded] = useState(false)
+
+    return (
+    <Context.Provider value={{ sideNavExpanded, setSideNavExpanded }}>
+      {children}
+    </Context.Provider>
+  )
+}
--- a/app/javascript/src/contexts/AuthProvider.tsx
+++ b/app/javascript/src/contexts/AuthProvider.tsx
@@ -0,0 +1,22 @@
+import { Auth0Provider } from '@auth0/auth0-react'
+import React, { FC } from 'react'
+
+export const AuthProvider: FC = ({children}) => {
+  // @ts-ignore
+  const domain = window.AUTH_DOMAIN
+  // @ts-ignore
+  const clientId = window.AUTH_CLIENT_ID
+  // @ts-ignore
+  const audience = window.AUTH_AUDIENCE
+
+  return (
+    <Auth0Provider
+      domain={domain}
+      clientId={clientId}
+      audience={audience}
+      redirectUri={window.location.origin}
+    >
+      {children}
+    </Auth0Provider>
+  )
+}
--- a/app/javascript/src/images/logo.png
+++ b/app/javascript/src/images/logo.png
--- a/app/javascript/packs/src/index.tsx
+++ b/app/javascript/packs/src/index.tsx
@@ -6,8 +6,7 @@ document.addEventListener('DOMContentLoaded', () => {
  ReactDOM.render(
    <React.StrictMode>
      <App />
-    </React.StrictMode>
-    ,
+    </React.StrictMode>,
    document.getElementById('root'),
  )
 })
--- a/app/javascript/src/pages/Home/Home.tsx
+++ b/app/javascript/src/pages/Home/Home.tsx
@@ -0,0 +1,30 @@
+import React, { FC } from 'react'
+import { Container } from '../../components/Container'
+import { Header } from '../../components/Header'
+import { Navbar } from '../../components/Navbar'
+import { PoolListing } from '../../components/PoolListing'
+import { SideNav } from '../../components/SideNav'
+
+export const Home: FC = () => {
+  return (
+    <>
+      <Navbar />
+      <div className="flex flex-grow">
+        <SideNav />
+        <div className="flex flex-col h-full w-full overflow-x-hidden mt-16">
+          <Header>
+            <Container className="flex-col">
+              <h1 className="text-5xl text-white font-medium">XStake</h1>
+              <h2 className="text-3xl text-gray-50 font-light">
+                Investir em crypto não precisa ser difícil.
+              </h2>
+            </Container>
+          </Header>
+          <Container>
+            <PoolListing />
+          </Container>
+        </div>
+      </div>
+    </>
+  )
+}
--- a/app/javascript/src/pages/Home/index.ts
+++ b/app/javascript/src/pages/Home/index.ts
@@ -0,0 +1 @@
+export * from './Home'
--- a/app/javascript/src/pages/index.ts
+++ b/app/javascript/src/pages/index.ts
@@ -0,0 +1 @@
+export * from './Home'
--- a/app/javascript/src/pages/index.tsx
+++ b/app/javascript/src/pages/index.tsx
@@ -0,0 +1 @@
+export * from './Home'
--- a/app/javascript/src/types/PoolConfig.ts
+++ b/app/javascript/src/types/PoolConfig.ts
@@ -0,0 +1,15 @@
+import type { Address, Token } from "../constants/pancake/Tokens";
+import type { PoolCategory } from "../constants/Pools";
+
+export type PoolConfig = {
+  sousId: number;
+  earningToken: Token;
+  stakingToken: Token;
+  contractAddress: Address;
+  poolCategory: PoolCategory;
+  tokenPerBlock: string;
+  sortOrder?: number;
+  harvest?: boolean;
+  isFinished?: boolean;
+  enableEmergencyWithdraw?: boolean;
+};
--- a/app/javascript/src/types/Token.ts
+++ b/app/javascript/src/types/Token.ts
@@ -0,0 +1,5 @@
+export type Token = {
+  symbol: string;
+  address: string;
+  decimals: number;
+};
--- a/app/javascript/src/types/index.ts
+++ b/app/javascript/src/types/index.ts
@@ -0,0 +1,2 @@
+export * from "./Token";
+export * from "./PoolConfig";
--- a/app/javascript/stylesheets/tailwind.config.js
+++ b/app/javascript/stylesheets/tailwind.config.js
@@ -1,11 +1,18 @@
+const defaultTheme = require("tailwindcss/defaultTheme");
+
 module.exports = {
  purge: [],
  darkMode: false, // or 'media' or 'class'
  theme: {
-    extend: {},
+    extend: {
+      spacing: {
+        ...defaultTheme.spacing,
+        'full': '100%',
+      }
+    },
  },
  variants: {
    extend: {},
  },
  plugins: [],
-}
+};
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -7,7 +7,15 @@
    <%= csp_meta_tag %>

    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
+
+    <script>
+      window.AUTH_DOMAIN = "<%= ENV['AUTH_DOMAIN'] %>"
+      window.AUTH_CLIENT_ID = "<%= ENV['AUTH_CLIENT_ID'] %>"
+      window.AUTH_AUDIENCE = "<%= ENV['AUTH_AUDIENCE'] %>"
+    </script>
+
    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
+    <%= javascript_pack_tag 'react', 'data-turbolinks-track': 'reload' %>
  </head>

  <body>
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,9 +1,6 @@
 module.exports = function(api) {
  var validEnv = ['development', 'test', 'production']
  var currentEnv = api.env()
-  var isDevelopmentEnv = api.env('development')
-  var isProductionEnv = api.env('production')
-  var isTestEnv = api.env('test')

  if (!validEnv.includes(currentEnv)) {
    throw new Error(
@@ -17,66 +14,33 @@ module.exports = function(api) {

  return {
    presets: [
-      isTestEnv && [
+      '@babel/preset-env',
+      '@babel/preset-react',
+      '@babel/preset-typescript',
+    ],
+    env: {
+      test: {
+        presets: [
+          [
            '@babel/preset-env',
            {
              targets: {
-            node: 'current'
+                node: '12',
              },
-          modules: 'commonjs'
-        },
-        '@babel/preset-react'
-      ],
-      (isProductionEnv || isDevelopmentEnv) && [
-        '@babel/preset-env',
-        {
-          forceAllTransforms: true,
-          useBuiltIns: 'entry',
-          corejs: 3,
-          modules: false,
-          exclude: ['transform-typeof-symbol']
+              modules: 'commonjs',
+              useBuiltIns: false,
+              debug: false,
            }
          ],
-      [
          '@babel/preset-react',
-        {
-          development: isDevelopmentEnv || isTestEnv,
-          useBuiltIns: true
+          'jest'
+        ]
      }
-      ],
-      ['@babel/preset-typescript', { 'allExtensions': true, 'isTSX': true }]
-    ].filter(Boolean),
+    },
    plugins: [
-      'babel-plugin-macros',
      '@babel/plugin-syntax-dynamic-import',
-      isTestEnv && 'babel-plugin-dynamic-import-node',
-      '@babel/plugin-transform-destructuring',
-      [
-        '@babel/plugin-proposal-class-properties',
-        {
-          loose: true
-        }
-      ],
-      [
      '@babel/plugin-proposal-object-rest-spread',
-        {
-          useBuiltIns: true
-        }
+      '@babel/plugin-proposal-class-properties',
    ],
-      [
-        '@babel/plugin-transform-runtime',
-        {
-          helpers: false,
-          regenerator: true,
-          corejs: false
-        }
-      ],
-      [
-        '@babel/plugin-transform-regenerator',
-        {
-          async: false
-        }
-      ],
-    ].filter(Boolean)
  }
 }
--- a/config/application.rb
+++ b/config/application.rb
@@ -20,6 +20,8 @@ require "sprockets/railtie"
 # you've limited to :test, :development, or :production.
 Bundler.require(*Rails.groups)

+Dotenv::Railtie.load unless Rails.env.production?
+
 module XStake
  class Application < Rails::Application
    # Initialize configuration defaults for originally generated Rails version.
--- a/package.json
+++ b/package.json
@@ -1,7 +1,11 @@
 {
  "name": "x-stake",
  "private": true,
+  "scripts": {
+    "dev": "./bin/webpack-dev-server"
+  },
  "dependencies": {
+    "@auth0/auth0-react": "^1.6.0",
    "@babel/preset-react": "^7.14.5",
    "@babel/preset-typescript": "^7.14.5",
    "@rails/actioncable": "^6.0.0",
@@ -11,7 +15,9 @@
    "@types/react": "^17.0.15",
    "@types/react-dom": "^17.0.9",
    "autoprefixer": "^9",
+    "classnames": "^2.3.1",
    "postcss": "^7",
+    "ramda": "^0.27.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-router-dom": "^5.2.0",
@@ -23,7 +29,9 @@
  },
  "version": "0.1.0",
  "devDependencies": {
+    "@types/ramda": "^0.27.44",
    "@types/react-router-dom": "^5.1.8",
+    "dotenv-webpack": "^7.0.3",
    "webpack-dev-server": "^3.11.2"
  }
 }
--- a/yarn.lock
+++ b/yarn.lock
@@ -2,6 +2,26 @@
 # yarn lockfile v1


+"@auth0/auth0-react@^1.6.0":
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/@auth0/auth0-react/-/auth0-react-1.6.0.tgz#9175d9d1ee3379aaaacfb6bed4640d56f239f59f"
+  integrity sha512-xjuNJnINMrJFbSpOSr9mjdVwfI9b+JbMKxoZy8R9Tmk3DGpBJ9eo69Im2RAeAWRISdrrxEZxNv9RAh9AQUvxEA==
+  dependencies:
+    "@auth0/auth0-spa-js" "^1.16.1"
+
+"@auth0/auth0-spa-js@^1.16.1":
+  version "1.16.1"
+  resolved "https://registry.yarnpkg.com/@auth0/auth0-spa-js/-/auth0-spa-js-1.16.1.tgz#fb35fe233bc1a39db5ce5694e75ed7a2779d5dbf"
+  integrity sha512-LosLwxKmLTVvy7dFwugVUwToRRwMetSgA8B+fHY0rq+hLtQr3mwZuEiu4T7NkmOzHTzGUWxLN38DkU6nYEG0Nw==
+  dependencies:
+    abortcontroller-polyfill "^1.7.1"
+    browser-tabs-lock "^1.2.13"
+    core-js "^3.11.0"
+    es-cookie "^1.3.2"
+    fast-text-encoding "^1.0.3"
+    promise-polyfill "^8.2.0"
+    unfetch "^4.2.0"
+
 "@babel/code-frame@^7.0.0", "@babel/code-frame@^7.14.5":
  version "7.14.5"
  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.14.5.tgz#23b08d740e83f49c5e59945fbf1b43e80bbf4edb"
@@ -1095,6 +1115,13 @@
  resolved "https://registry.yarnpkg.com/@types/q/-/q-1.5.5.tgz#75a2a8e7d8ab4b230414505d92335d1dcb53a6df"
  integrity sha512-L28j2FcJfSZOnL1WBjDYp2vUHCeIFlyYI/53EwD/rKUBQ7MtUUfbQWiyKJGpcnv4/WgrhWsFKrcPstcAt/J0tQ==

+"@types/ramda@^0.27.44":
+  version "0.27.44"
+  resolved "https://registry.yarnpkg.com/@types/ramda/-/ramda-0.27.44.tgz#ba2283d67fcff366f7e68bd5124a0466e467967f"
+  integrity sha512-SlEHKcLG36PlU+rLJwp8p4dpC9Hp/LiH6n0REX2m4iEB15PWe1qKQzgNSZrYKhTHDFvkeEM/F2gcYwfighsEuQ==
+  dependencies:
+    ts-toolbelt "^6.15.1"
+
 "@types/react-dom@^17.0.9":
  version "17.0.9"
  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.9.tgz#441a981da9d7be117042e1a6fd3dac4b30f55add"
@@ -1288,6 +1315,11 @@
  resolved "https://registry.yarnpkg.com/@xtuc/long/-/long-4.2.2.tgz#d291c6a4e97989b5c61d9acf396ae4fe133a718d"
  integrity sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==

+abortcontroller-polyfill@^1.7.1:
+  version "1.7.3"
+  resolved "https://registry.yarnpkg.com/abortcontroller-polyfill/-/abortcontroller-polyfill-1.7.3.tgz#1b5b487bd6436b5b764fd52a612509702c3144b5"
+  integrity sha512-zetDJxd89y3X99Kvo4qFx8GKlt6GsvN3UcRZHwU6iFA/0KiOmhkTVhe8oRoTBiTVPZu09x3vCra47+w8Yz1+2Q==
+
 accepts@~1.3.4, accepts@~1.3.5, accepts@~1.3.7:
  version "1.3.7"
  resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.7.tgz#531bc726517a3b2b41f850021c6cc15eaab507cd"
@@ -1704,6 +1736,13 @@ brorand@^1.0.1, brorand@^1.1.0:
  resolved "https://registry.yarnpkg.com/brorand/-/brorand-1.1.0.tgz#12c25efe40a45e3c323eb8675a0a0ce57b22371f"
  integrity sha1-EsJe/kCkXjwyPrhnWgoM5XsiNx8=

+browser-tabs-lock@^1.2.13:
+  version "1.2.14"
+  resolved "https://registry.yarnpkg.com/browser-tabs-lock/-/browser-tabs-lock-1.2.14.tgz#f4ba30810d20199a1858c102da1f91e339250728"
+  integrity sha512-ssSpCRcvFe4vc098LDnrJOQDfZiG35KhQGB9hthTbwJk5mmUkePwhcMlW61NH3YuIE2Y9uGLqf9yxEBKbaDlaw==
+  dependencies:
+    lodash ">=4.17.21"
+
 browserify-aes@^1.0.0, browserify-aes@^1.0.4:
  version "1.2.0"
  resolved "https://registry.yarnpkg.com/browserify-aes/-/browserify-aes-1.2.0.tgz#326734642f403dabc3003209853bb70ad428ef48"
@@ -2020,6 +2059,11 @@ class-utils@^0.3.5:
    isobject "^3.0.0"
    static-extend "^0.1.1"

+classnames@^2.3.1:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
+  integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==
+
 clean-stack@^2.0.0:
  version "2.2.0"
  resolved "https://registry.yarnpkg.com/clean-stack/-/clean-stack-2.2.0.tgz#ee8472dbb129e727b31e8a10a427dee9dfe4008b"
@@ -2231,7 +2275,7 @@ core-js-compat@^3.14.0, core-js-compat@^3.16.0:
    browserslist "^4.16.6"
    semver "7.0.0"

-core-js@^3.12.1:
+core-js@^3.11.0, core-js@^3.12.1:
  version "3.16.0"
  resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.16.0.tgz#1d46fb33720bc1fa7f90d20431f36a5540858986"
  integrity sha512-5+5VxRFmSf97nM8Jr2wzOwLqRo6zphH2aX+7KsAUONObyzakDNq2G/bgbhinxB4PoV9L3aXQYhiDKyIKWd2c8g==
@@ -2739,6 +2783,25 @@ dot-prop@^5.2.0:
  dependencies:
    is-obj "^2.0.0"

+dotenv-defaults@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/dotenv-defaults/-/dotenv-defaults-2.0.2.tgz#6b3ec2e4319aafb70940abda72d3856770ee77ac"
+  integrity sha512-iOIzovWfsUHU91L5i8bJce3NYK5JXeAwH50Jh6+ARUdLiiGlYWfGw6UkzsYqaXZH/hjE/eCd/PlfM/qqyK0AMg==
+  dependencies:
+    dotenv "^8.2.0"
+
+dotenv-webpack@^7.0.3:
+  version "7.0.3"
+  resolved "https://registry.yarnpkg.com/dotenv-webpack/-/dotenv-webpack-7.0.3.tgz#f50ec3c7083a69ec6076e110566720003b7b107b"
+  integrity sha512-O0O9pOEwrk+n1zzR3T2uuXRlw64QxHSPeNN1GaiNBloQFNaCUL9V8jxSVz4jlXXFP/CIqK8YecWf8BAvsSgMjw==
+  dependencies:
+    dotenv-defaults "^2.0.2"
+
+dotenv@^8.2.0:
+  version "8.6.0"
+  resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-8.6.0.tgz#061af664d19f7f4d8fc6e4ff9b584ce237adcb8b"
+  integrity sha512-IrPdXQsk2BbzvCBGBOTmmSH5SodmqZNt4ERAZDmW4CT+tL8VtvinqywuANaFu4bOMWki16nqf0e4oC0QIaDr/g==
+
 duplexify@^3.4.2, duplexify@^3.6.0:
  version "3.7.1"
  resolved "https://registry.yarnpkg.com/duplexify/-/duplexify-3.7.1.tgz#2a4df5317f6ccfd91f86d6fd25d8d8a103b88309"
@@ -2845,6 +2908,11 @@ es-abstract@^1.17.2, es-abstract@^1.18.0-next.2, es-abstract@^1.18.2:
    string.prototype.trimstart "^1.0.4"
    unbox-primitive "^1.0.1"

+es-cookie@^1.3.2:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/es-cookie/-/es-cookie-1.3.2.tgz#80e831597f72a25721701bdcb21d990319acd831"
+  integrity sha512-UTlYYhXGLOy05P/vKVT2Ui7WtC7NiRzGtJyAKKn32g5Gvcjn7KAClLPWlipCtxIus934dFg9o9jXiBL0nP+t9Q==
+
 es-to-primitive@^1.2.1:
  version "1.2.1"
  resolved "https://registry.yarnpkg.com/es-to-primitive/-/es-to-primitive-1.2.1.tgz#e55cd4c9cdc188bcefb03b366c736323fc5c898a"
@@ -3053,6 +3121,11 @@ fast-json-stable-stringify@^2.0.0:
  resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633"
  integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==

+fast-text-encoding@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/fast-text-encoding/-/fast-text-encoding-1.0.3.tgz#ec02ac8e01ab8a319af182dae2681213cfe9ce53"
+  integrity sha512-dtm4QZH9nZtcDt8qJiOH9fcQd1NAgi+K1O2DbE6GG1PPCK/BWfOH3idCTRQ4ImXRUOyopDEgDEnVEE7Y/2Wrig==
+
 fastq@^1.6.0:
  version "1.11.1"
  resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.11.1.tgz#5d8175aae17db61947f8b162cfc7f63264d22807"
@@ -4258,7 +4331,7 @@ lodash.uniq@^4.5.0:
  resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
  integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=

-lodash@^4.17.11, lodash@^4.17.14, lodash@^4.17.21, lodash@^4.17.5:
+lodash@>=4.17.21, lodash@^4.17.11, lodash@^4.17.14, lodash@^4.17.21, lodash@^4.17.5:
  version "4.17.21"
  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
  integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
@@ -5840,6 +5913,11 @@ promise-inflight@^1.0.1:
  resolved "https://registry.yarnpkg.com/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"
  integrity sha1-mEcocL8igTL8vdhoEputEsPAKeM=

+promise-polyfill@^8.2.0:
+  version "8.2.0"
+  resolved "https://registry.yarnpkg.com/promise-polyfill/-/promise-polyfill-8.2.0.tgz#367394726da7561457aba2133c9ceefbd6267da0"
+  integrity sha512-k/TC0mIcPVF6yHhUvwAp7cvL6I2fFV7TzF1DuGPI8mBh4QQazf36xCKEHKTZKRysEoTQoQdKyP25J8MPJp7j5g==
+
 prop-types@^15.6.2:
  version "15.7.2"
  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
@@ -5967,6 +6045,11 @@ quick-lru@^5.1.1:
  resolved "https://registry.yarnpkg.com/quick-lru/-/quick-lru-5.1.1.tgz#366493e6b3e42a3a6885e2e99d18f80fb7a8c932"
  integrity sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA==

+ramda@^0.27.1:
+  version "0.27.1"
+  resolved "https://registry.yarnpkg.com/ramda/-/ramda-0.27.1.tgz#66fc2df3ef873874ffc2da6aa8984658abacf5c9"
+  integrity sha512-PgIdVpn5y5Yns8vqb8FzBUEYn98V3xcPgawAkkgj0YJ0qDsnHCiNmZYfOGMgOvoB0eWFLpYbhxUR3mxfDIMvpw==
+
 randombytes@^2.0.0, randombytes@^2.0.1, randombytes@^2.0.5, randombytes@^2.1.0:
  version "2.1.0"
  resolved "https://registry.yarnpkg.com/randombytes/-/randombytes-2.1.0.tgz#df6f84372f0270dc65cdf6291349ab7a473d4f2a"
@@ -7075,6 +7158,11 @@ ts-pnp@^1.1.6:
  resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.2.0.tgz#a500ad084b0798f1c3071af391e65912c86bca92"
  integrity sha512-csd+vJOb/gkzvcCHgTGSChYpy5f1/XKNsmvBGO4JXS+z1v2HobugDz4s1IeFXM3wZB44uczs+eazB5Q/ccdhQw==

+ts-toolbelt@^6.15.1:
+  version "6.15.5"
+  resolved "https://registry.yarnpkg.com/ts-toolbelt/-/ts-toolbelt-6.15.5.tgz#cb3b43ed725cb63644782c64fbcad7d8f28c0a83"
+  integrity sha512-FZIXf1ksVyLcfr7M317jbB67XFJhOO1YqdTcuGaq9q5jLUoTikukZ+98TPjKiP2jC5CgmYdWWYs0s2nLSU0/1A==
+
 tty-browserify@0.0.0:
  version "0.0.0"
  resolved "https://registry.yarnpkg.com/tty-browserify/-/tty-browserify-0.0.0.tgz#a157ba402da24e9bf957f9aa69d524eed42901a6"
@@ -7113,6 +7201,11 @@ unbox-primitive@^1.0.1:
    has-symbols "^1.0.2"
    which-boxed-primitive "^1.0.2"

+unfetch@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/unfetch/-/unfetch-4.2.0.tgz#7e21b0ef7d363d8d9af0fb929a5555f6ef97a3be"
+  integrity sha512-F9p7yYCn6cIW9El1zi0HI6vqpeIvBsr3dSuRO6Xuppb1u5rXpCPmMvLSyECLhybr9isec8Ohl0hPekMVrEinDA==
+
 unicode-canonical-property-names-ecmascript@^1.0.4:
  version "1.0.4"
  resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz#2619800c4c825800efdd8343af7dd9933cbe2818"