Text (#916)

* chore: update dependencies

* build: fix build error

* chore: update dependencies

* feat: text sample

* fix: color mismatch in dark mode

* fix: align step in text page

frontend/package.json

@@ -38,10 +38,10 @@
         "version": "yarn format && git add -A"
     },
     "devDependencies": {
-        "@typescript-eslint/eslint-plugin": "4.12.0",
-        "@typescript-eslint/parser": "4.12.0",
-        "eslint": "7.17.0",
-        "eslint-config-prettier": "7.1.0",
+        "@typescript-eslint/eslint-plugin": "4.14.0",
+        "@typescript-eslint/parser": "4.14.0",
+        "eslint": "7.18.0",
+        "eslint-config-prettier": "7.2.0",
         "eslint-plugin-license-header": "0.2.0",
         "eslint-plugin-prettier": "3.3.1",
         "eslint-plugin-react": "7.22.0",

frontend/packages/cli/package.json

@@ -36,12 +36,12 @@
     "dependencies": {
         "@visualdl/server": "2.1.4",
         "open": "7.3.1",
-        "ora": "5.2.0",
+        "ora": "5.3.0",
         "pm2": "4.5.1",
         "yargs": "16.2.0"
     },
     "devDependencies": {
-        "@types/node": "14.14.20",
+        "@types/node": "14.14.22",
         "@types/yargs": "15.0.12",
         "cross-env": "7.0.3",
         "ts-node": "9.1.1",

frontend/packages/core/package.json

@@ -38,7 +38,7 @@
         "@visualdl/netron": "2.1.4",
         "@visualdl/wasm": "2.1.4",
         "bignumber.js": "9.0.1",
-        "d3": "6.3.1",
+        "d3": "6.4.0",
         "d3-format": "2.0.0",
         "echarts": "4.9.0",
         "echarts-gl": "1.1.2",
@@ -53,10 +53,10 @@
         "moment": "2.29.1",
         "nprogress": "0.2.0",
         "numeric": "1.2.6",
-        "polished": "4.0.5",
+        "polished": "4.1.0",
         "query-string": "6.13.8",
         "react": "17.0.1",
-        "react-content-loader": "5.1.4",
+        "react-content-loader": "6.0.1",
         "react-dom": "17.0.1",
         "react-helmet": "6.1.0",
         "react-i18next": "11.8.5",
@@ -69,7 +69,7 @@
         "react-toastify": "6.2.0",
         "redux": "4.0.5",
         "styled-components": "5.2.1",
-        "swr": "0.3.11",
+        "swr": "0.4.0",
         "three": "0.124.0",
         "tippy.js": "6.2.7",
         "umap-js": "1.3.3"
@@ -84,17 +84,17 @@
         "@snowpack/app-scripts-react": "1.12.6",
         "@snowpack/plugin-dotenv": "2.0.5",
         "@snowpack/plugin-optimize": "0.2.10",
-        "@snowpack/plugin-run-script": "2.2.1",
+        "@snowpack/plugin-run-script": "2.3.0",
         "@svgr/core": "5.5.0",
-        "@testing-library/jest-dom": "5.11.8",
-        "@testing-library/react": "11.2.2",
+        "@testing-library/jest-dom": "5.11.9",
+        "@testing-library/react": "11.2.3",
         "@types/d3": "6.2.0",
         "@types/d3-format": "2.0.0",
         "@types/echarts": "4.9.3",
         "@types/file-saver": "2.0.1",
         "@types/jest": "26.0.20",
         "@types/loadable__component": "5.13.1",
-        "@types/lodash": "4.14.167",
+        "@types/lodash": "4.14.168",
         "@types/mime-types": "2.1.0",
         "@types/nprogress": "0.2.0",
         "@types/numeric": "1.2.1",
@@ -102,16 +102,16 @@
         "@types/react-dom": "17.0.0",
         "@types/react-helmet": "6.1.0",
         "@types/react-rangeslider": "2.2.3",
-        "@types/react-redux": "7.1.15",
+        "@types/react-redux": "7.1.16",
         "@types/react-router-dom": "5.1.7",
         "@types/snowpack-env": "2.3.3",
         "@types/styled-components": "5.1.7",
         "@visualdl/mock": "2.1.4",
         "babel-plugin-styled-components": "1.12.0",
         "dotenv": "8.2.0",
-        "enhanced-resolve": "5.4.1",
+        "enhanced-resolve": "5.7.0",
         "express": "4.17.1",
-        "fs-extra": "9.0.1",
+        "fs-extra": "9.1.0",
         "html-minifier": "4.0.0",
         "http-proxy-middleware": "1.0.6",
         "jest": "26.6.3",

frontend/packages/core/public/locales/en/common.json

@@ -32,6 +32,7 @@
     "stop": "Stop",
     "stop-realtime-refresh": "Stop realtime refresh",
     "stopped": "Stopped",
+    "text": "Text",
     "theme": {
         "auto": "Auto",
         "dark": "Dark",

frontend/packages/core/public/locales/zh/common.json

@@ -13,8 +13,8 @@
     "loading": "数据载入中，请稍等",
     "next-page": "下一页",
     "pr-curve": "PR曲线",
-    "roc-curve": "ROC曲线",
     "previous-page": "上一页",
+    "roc-curve": "ROC曲线",
     "run": "运行",
     "running": "运行中",
     "runs": "数据流",
@@ -32,6 +32,7 @@
     "stop": "停止",
     "stop-realtime-refresh": "停止实时数据刷新",
     "stopped": "已停止",
+    "text": "文本",
     "theme": {
         "auto": "自动",
         "dark": "深色",

frontend/packages/core/snowpack.config.js

@@ -37,7 +37,7 @@ module.exports = {
             {
                 minifyHTML: false, // we will do it later in post-build
                 preloadModules: true,
-                target: ['chrome63', 'firefox67', 'safari11.1', 'edge79'] // browsers support es module
+                target: ['chrome79', 'firefox67', 'safari11.1', 'edge79'] // browsers support es module
             }
         ],
         [

frontend/packages/core/src/components/Chart.tsx

@@ -14,10 +14,9 @@
  * limitations under the License.
  */
 
-import React, {FunctionComponent, useCallback, useEffect, useState} from 'react';
+import React, {FunctionComponent} from 'react';
 import {WithStyled, borderRadius, headerHeight, math, rem, sameBorder, size, transitionProps} from '~/utils/style';
 
-import ee from '~/utils/event';
 import styled from 'styled-components';
 
 const Div = styled.div<{maximized?: boolean; divWidth?: string; divHeight?: string}>`
@@ -38,28 +37,12 @@ const Div = styled.div<{maximized?: boolean; divWidth?: string; divHeight?: stri
 `;
 
 type ChartProps = {
-    cid: symbol;
+    maximized?: boolean;
     width?: string;
     height?: string;
 };
 
-const Chart: FunctionComponent<ChartProps & WithStyled> = ({cid, width, height, className, children}) => {
-    const [maximized, setMaximized] = useState(false);
-    const toggleMaximize = useCallback(
-        (id: symbol, value: boolean) => {
-            if (id === cid) {
-                setMaximized(value);
-            }
-        },
-        [cid]
-    );
-    useEffect(() => {
-        ee.on('toggle-chart-size', toggleMaximize);
-        return () => {
-            ee.off('toggle-chart-size', toggleMaximize);
-        };
-    }, [toggleMaximize]);
-
+const Chart: FunctionComponent<ChartProps & WithStyled> = ({maximized, width, height, className, children}) => {
     return (
         <Div
             maximized={maximized}

frontend/packages/core/src/components/ChartPage.tsx

@@ -14,13 +14,12 @@
  * limitations under the License.
  */
 
-import {ChartCollapseTitle as ChartCollapseTitleLoader, Chart as ChartLoader} from '~/components/Loader/ChartPage';
 import React, {FunctionComponent, PropsWithChildren, useCallback, useEffect, useMemo, useState} from 'react';
 import {Trans, useTranslation} from 'react-i18next';
 import {WithStyled, headerHeight, link, rem, transitionProps} from '~/utils/style';
 
-import Chart from '~/components/Chart';
 import ChartCollapse from '~/components/ChartCollapse';
+import {ChartCollapseTitle as ChartCollapseTitleLoader} from '~/components/Loader/ChartPage';
 import Pagination from '~/components/Pagination';
 import SearchInput from '~/components/SearchInput';
 import groupBy from 'lodash/groupBy';
@@ -79,26 +78,23 @@ type Item = {
     label: string;
 };
 
-export interface WithChart<T extends Item> {
-    (item: T & {cid: symbol}, index: number): React.ReactNode;
+export interface RenderChart<T extends Item> {
+    (item: T, index: number): React.ReactNode;
 }
 
 type ChartPageProps<T extends Item> = {
     items?: T[];
     running?: boolean;
-    loading?: boolean | React.ReactNode;
-    chartSize?: {
-        width?: string;
-        height?: string;
-    };
-    withChart?: WithChart<T>;
+    loading?: boolean;
+    loader: React.ReactNode;
+    renderChart?: RenderChart<T>;
 };
 
 const ChartPage = <T extends Item>({
     items,
     loading,
-    chartSize,
-    withChart,
+    loader,
+    renderChart,
     className
 }: PropsWithChildren<ChartPageProps<T> & WithStyled>): ReturnType<FunctionComponent> => {
     const {t} = useTranslation('common');
@@ -145,33 +141,14 @@ const ChartPage = <T extends Item>({
 
     const total = useMemo(() => Math.ceil(matchedTags.length / pageSize), [matchedTags]);
 
-    const withCharts = useCallback(
+    const renderCharts = useCallback(
         (charts: T[], search?: boolean) => (
             <Wrapper>
                 {loading ? (
-                    Array.from({length: 2}).map((_, index) => (
-                        <Chart
-                            cid={Symbol()}
-                            key={index}
-                            width={chartSize?.width ?? rem(430)}
-                            height={chartSize?.height ?? rem(337)}
-                        >
-                            {loading === true ? <ChartLoader /> : loading}
-                        </Chart>
-                    ))
+                    loader
                 ) : charts.length ? (
                     charts.map((item, j) => {
-                        const cid = Symbol(item.label);
-                        return (
-                            <Chart
-                                cid={cid}
-                                key={item.id || item.label}
-                                width={chartSize?.width ?? rem(430)}
-                                height={chartSize?.height ?? rem(337)}
-                            >
-                                {withChart?.({...item, cid}, j)}
-                            </Chart>
-                        );
+                        return <React.Fragment key={item.id || item.label}>{renderChart?.(item, j)}</React.Fragment>;
                     })
                 ) : (
                     <Empty height={rem(500)}>
@@ -188,21 +165,21 @@ const ChartPage = <T extends Item>({
                 )}
             </Wrapper>
         ),
-        [loading, t, chartSize?.width, chartSize?.height, withChart]
+        [loading, t, loader, renderChart]
     );
 
     const content = useMemo(() => {
         if (loading) {
             return Array.from({length: 3}).map((_, index) => (
                 <ChartCollapse key={index} title={<ChartCollapseTitleLoader />} opened={!index}>
-                    {withCharts([])}
+                    {renderCharts([])}
                 </ChartCollapse>
             ));
         }
         if (searchValue) {
             return (
                 <ChartCollapse title={t('common:search-result')} total={matchedTags.length}>
-                    {withCharts(pageMatchedTags, true)}
+                    {renderCharts(pageMatchedTags, true)}
                     {pageMatchedTags.length ? <StyledPagination page={page} total={total} onChange={setPage} /> : null}
                 </ChartCollapse>
             );
@@ -215,7 +192,7 @@ const ChartPage = <T extends Item>({
                     total={groupedItem[1].length}
                     opened={i === 0}
                 >
-                    {withCharts(groupedItem[1])}
+                    {renderCharts(groupedItem[1])}
                 </ChartCollapse>
             ));
         }
@@ -228,7 +205,7 @@ const ChartPage = <T extends Item>({
                 </Trans>
             </Empty>
         );
-    }, [groupedItems, loading, matchedTags.length, page, pageMatchedTags, searchValue, t, total, withCharts]);
+    }, [groupedItems, loading, matchedTags.length, page, pageMatchedTags, searchValue, t, total, renderCharts]);
 
     return (
         <div className={className}>

frontend/packages/core/src/components/Content.tsx

@@ -26,6 +26,7 @@ const Section = styled.section`
 
 const Article = styled.article`
     flex: auto;
+    min-width: 0;
     margin: ${contentMargin};
     min-height: ${contentHeight};
 `;

frontend/packages/core/src/components/CurvesPage/CurveChart.tsx

@@ -20,11 +20,12 @@ import React, {FunctionComponent, useCallback, useMemo, useRef, useState} from '
 import {options as chartOptions, nearestPoint} from '~/resource/curves';
 import {rem, size} from '~/utils/style';
 
+import Chart from '~/components/Chart';
+import {Chart as ChartLoader} from '~/components/Loader/ChartPage';
 import ChartToolbox from '~/components/ChartToolbox';
 import type {EChartOption} from 'echarts';
 import TooltipTable from '~/components/TooltipTable';
 import {cycleFetcher} from '~/utils/fetch';
-import ee from '~/utils/event';
 import {format} from 'd3-format';
 import queryString from 'query-string';
 import {renderToStaticMarkup} from 'react-dom/server';
@@ -61,15 +62,23 @@ const Error = styled.div`
     align-items: center;
 `;
 
+const chartSize = {
+    width: 430,
+    height: 337
+};
+const chartSizeInRem = {
+    width: rem(chartSize.width),
+    height: rem(chartSize.height)
+};
+
 type PRCurveChartProps = {
     type: CurveType;
-    cid: symbol;
     runs: Run[];
     tag: string;
     running?: boolean;
 };
 
-const PRCurveChart: FunctionComponent<PRCurveChartProps> = ({type, cid, runs, tag, running}) => {
+const PRCurveChart: FunctionComponent<PRCurveChartProps> = ({type, runs, tag, running}) => {
     const {t} = useTranslation(['curves', 'common']);
 
     const echart = useRef<LineChartRef>(null);
@@ -81,10 +90,6 @@ const PRCurveChart: FunctionComponent<PRCurveChartProps> = ({type, cid, runs, ta
     );
 
     const [maximized, setMaximized] = useState<boolean>(false);
-    const toggleMaximized = useCallback(() => {
-        ee.emit('toggle-chart-size', cid, !maximized);
-        setMaximized(m => !m);
-    }, [cid, maximized]);
 
     const selectedData = useMemo<[number, number, number[][]][]>(
         () =>
@@ -202,32 +207,45 @@ const PRCurveChart: FunctionComponent<PRCurveChartProps> = ({type, cid, runs, ta
     }
 
     return (
-        <Wrapper>
-            <StyledLineChart ref={echart} title={tag} options={options} data={data} loading={loading} zoom />
-            <Toolbox
-                items={[
-                    {
-                        icon: 'maximize',
-                        activeIcon: 'minimize',
-                        tooltip: t('curves:maximize'),
-                        activeTooltip: t('curves:minimize'),
-                        toggle: true,
-                        onClick: toggleMaximized
-                    },
-                    {
-                        icon: 'restore-size',
-                        tooltip: t('curves:restore'),
-                        onClick: () => echart.current?.restore()
-                    },
-                    {
-                        icon: 'download',
-                        tooltip: t('curves:download-image'),
-                        onClick: () => echart.current?.saveAsImage()
-                    }
-                ]}
-            />
-        </Wrapper>
+        <Chart maximized={maximized} {...chartSizeInRem}>
+            <Wrapper>
+                <StyledLineChart ref={echart} title={tag} options={options} data={data} loading={loading} zoom />
+                <Toolbox
+                    items={[
+                        {
+                            icon: 'maximize',
+                            activeIcon: 'minimize',
+                            tooltip: t('curves:maximize'),
+                            activeTooltip: t('curves:minimize'),
+                            toggle: true,
+                            onClick: () => setMaximized(m => !m)
+                        },
+                        {
+                            icon: 'restore-size',
+                            tooltip: t('curves:restore'),
+                            onClick: () => echart.current?.restore()
+                        },
+                        {
+                            icon: 'download',
+                            tooltip: t('curves:download-image'),
+                            onClick: () => echart.current?.saveAsImage()
+                        }
+                    ]}
+                />
+            </Wrapper>
+        </Chart>
     );
 };
 
 export default PRCurveChart;
+
+export const Loader: FunctionComponent = () => (
+    <>
+        <Chart {...chartSizeInRem}>
+            <ChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+        <Chart {...chartSizeInRem}>
+            <ChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+    </>
+);

frontend/packages/core/src/components/HistogramPage/HistogramChart.tsx

@@ -24,10 +24,11 @@ import React, {FunctionComponent, useCallback, useEffect, useMemo, useRef, useSt
 import StackChart, {StackChartProps, StackChartRef} from '~/components/StackChart';
 import {rem, size} from '~/utils/style';
 
+import Chart from '~/components/Chart';
+import {Chart as ChartLoader} from '~/components/Loader/ChartPage';
 import ChartToolbox from '~/components/ChartToolbox';
 import type {Run} from '~/types';
 import {distance} from '~/utils';
-import ee from '~/utils/event';
 import {fetcher} from '~/utils/fetch';
 import {format} from 'd3-format';
 import minBy from 'lodash/minBy';
@@ -70,15 +71,23 @@ const Error = styled.div`
     align-items: center;
 `;
 
+const chartSize = {
+    width: 430,
+    height: 337
+};
+const chartSizeInRem = {
+    width: rem(chartSize.width),
+    height: rem(chartSize.height)
+};
+
 type HistogramChartProps = {
-    cid: symbol;
     run: Run;
     tag: string;
     mode: Modes;
     running?: boolean;
 };
 
-const HistogramChart: FunctionComponent<HistogramChartProps> = ({cid, run, tag, mode, running}) => {
+const HistogramChart: FunctionComponent<HistogramChartProps> = ({run, tag, mode, running}) => {
     const {t} = useTranslation(['histogram', 'common']);
 
     const echart = useRef<LineChartRef | StackChartRef>(null);
@@ -93,10 +102,6 @@ const HistogramChart: FunctionComponent<HistogramChartProps> = ({cid, run, tag,
     );
 
     const [maximized, setMaximized] = useState<boolean>(false);
-    const toggleMaximized = useCallback(() => {
-        ee.emit('toggle-chart-size', cid, !maximized);
-        setMaximized(m => !m);
-    }, [cid, maximized]);
 
     const title = useMemo(() => `${tag} (${run.label})`, [tag, run.label]);
 
@@ -278,27 +283,40 @@ const HistogramChart: FunctionComponent<HistogramChartProps> = ({cid, run, tag,
     }
 
     return (
-        <Wrapper>
-            {chart}
-            <Toolbox
-                items={[
-                    {
-                        icon: 'maximize',
-                        activeIcon: 'minimize',
-                        tooltip: t('histogram:maximize'),
-                        activeTooltip: t('histogram:minimize'),
-                        toggle: true,
-                        onClick: toggleMaximized
-                    },
-                    {
-                        icon: 'download',
-                        tooltip: t('histogram:download-image'),
-                        onClick: () => echart.current?.saveAsImage()
-                    }
-                ]}
-            />
-        </Wrapper>
+        <Chart maximized={maximized} {...chartSizeInRem}>
+            <Wrapper>
+                {chart}
+                <Toolbox
+                    items={[
+                        {
+                            icon: 'maximize',
+                            activeIcon: 'minimize',
+                            tooltip: t('histogram:maximize'),
+                            activeTooltip: t('histogram:minimize'),
+                            toggle: true,
+                            onClick: () => setMaximized(m => !m)
+                        },
+                        {
+                            icon: 'download',
+                            tooltip: t('histogram:download-image'),
+                            onClick: () => echart.current?.saveAsImage()
+                        }
+                    ]}
+                />
+            </Wrapper>
+        </Chart>
     );
 };
 
 export default HistogramChart;
+
+export const Loader: FunctionComponent = () => (
+    <>
+        <Chart {...chartSizeInRem}>
+            <ChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+        <Chart {...chartSizeInRem}>
+            <ChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+    </>
+);

frontend/packages/core/src/components/Loader/ChartPage.tsx

@@ -18,9 +18,9 @@ import React, {FunctionComponent} from 'react';
 
 import ContentLoader from './ContentLoader';
 
-export const Chart: FunctionComponent = () => {
+export const Chart: FunctionComponent<{width: number; height: number}> = ({width, height}) => {
     return (
-        <ContentLoader viewBox="0 0 428 335">
+        <ContentLoader viewBox={`0 0 ${width} ${height}`}>
             <rect x="20" y="20" rx="3" ry="3" width="200" height="16" />
             <rect x="20" y="56" rx="3" ry="3" width="390" height="231" />
             <rect x="20" y="301" rx="3" ry="3" width="16" height="16" />
@@ -29,9 +29,9 @@ export const Chart: FunctionComponent = () => {
     );
 };
 
-export const SampleChart: FunctionComponent<{height: number}> = ({height}) => {
+export const SampleChart: FunctionComponent<{width: number; height: number}> = ({width, height}) => {
     return (
-        <ContentLoader viewBox={`0 0 428 ${height}`}>
+        <ContentLoader viewBox={`0 0 ${width} ${height}`}>
             <rect x="20" y="20" rx="3" ry="3" width="200" height="18" />
             <rect x="333" y="26.5" rx="2.5" ry="2.5" width="17" height="5" />
             <rect x="358" y="22" rx="3" ry="3" width="50" height="14" />
@@ -48,6 +48,15 @@ export const SampleChart: FunctionComponent<{height: number}> = ({height}) => {
     );
 };
 
+export const TextChart: FunctionComponent<{width: number}> = ({width}) => {
+    return (
+        <ContentLoader viewBox="0 0 1098 38" height={38}>
+            <rect x="8" y="6" rx="4" ry="4" width="64" height="26" />
+            <rect x="86" y="11" rx="3" ry="3" width={width} height="16" />
+        </ContentLoader>
+    );
+};
+
 export const ChartCollapseTitle: FunctionComponent = () => {
     return (
         <ContentLoader viewBox="0 0 200 18" width={200} height={18}>

frontend/packages/core/src/components/Loader/ContentLoader.tsx

@@ -21,7 +21,7 @@ import type {IContentLoaderProps} from 'react-content-loader';
 import {themes} from '~/utils/theme';
 import useTheme from '~/hooks/useTheme';
 
-const RunList: FunctionComponent<IContentLoaderProps> = ({children, ...props}) => {
+const Loader: FunctionComponent<IContentLoaderProps> = ({children, ...props}) => {
     const theme = useTheme();
     return (
         <ContentLoader
@@ -34,4 +34,4 @@ const RunList: FunctionComponent<IContentLoaderProps> = ({children, ...props}) =
     );
 };
 
-export default RunList;
+export default Loader;

frontend/packages/core/src/components/SamplePage/AudioChart.tsx → frontend/packages/core/src/components/SamplePage/Audio.tsx

@@ -18,7 +18,10 @@ import Audio, {AudioProps} from '~/components/Audio';
 import React, {FunctionComponent, useCallback, useState} from 'react';
 import SampleChart, {SampleChartBaseProps, SampleEntityProps} from '~/components/SamplePage/SampleChart';
 
+import Chart from '~/components/Chart';
+import {SampleChart as SampleChartLoader} from '~/components/Loader/ChartPage';
 import {format} from 'd3-format';
+import {rem} from '~/utils/style';
 import styled from 'styled-components';
 import {useTranslation} from 'react-i18next';
 
@@ -32,6 +35,15 @@ const StyledAudio = styled(Audio)`
 
 const cache = 5 * 60 * 1000;
 
+const chartSize = {
+    width: 430,
+    height: 244
+};
+const chartSizeInRem = {
+    width: rem(chartSize.width),
+    height: rem(chartSize.height)
+};
+
 type AudioChartProps = {
     audioContext?: AudioContext;
 } & SampleChartBaseProps;
@@ -47,7 +59,7 @@ const AudioChart: FunctionComponent<AudioChartProps> = ({audioContext, ...props}
         []
     );
 
-    const content = useCallback(
+    const renderContent = useCallback(
         (props: SampleEntityProps) => (
             <StyledAudio audioContext={audioContext} {...props} onLoading={onLoading} onLoad={onLoad} />
         ),
@@ -55,20 +67,33 @@ const AudioChart: FunctionComponent<AudioChartProps> = ({audioContext, ...props}
     );
 
     return (
-        <SampleChart
-            type="audio"
-            cache={cache}
-            footer={
-                <span>
-                    {t('sample:sample-rate')}
-                    {t('common:colon')}
-                    {sampleRate}
-                </span>
-            }
-            content={content}
-            {...props}
-        />
+        <Chart {...chartSizeInRem}>
+            <SampleChart
+                type="audio"
+                cache={cache}
+                footer={
+                    <span>
+                        {t('sample:sample-rate')}
+                        {t('common:colon')}
+                        {sampleRate}
+                    </span>
+                }
+                renderContent={renderContent}
+                {...props}
+            />
+        </Chart>
     );
 };
 
 export default AudioChart;
+
+export const Loader: FunctionComponent = () => (
+    <>
+        <Chart {...chartSizeInRem}>
+            <SampleChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+        <Chart {...chartSizeInRem}>
+            <SampleChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+    </>
+);

frontend/packages/core/src/components/SamplePage/ImageChart.tsx → frontend/packages/core/src/components/SamplePage/Image.tsx

@@ -20,10 +20,12 @@ import SampleChart, {
     SampleEntityProps,
     SamplePreviewerProps
 } from '~/components/SamplePage/SampleChart';
-import {size, transitionProps} from '~/utils/style';
+import {rem, size, transitionProps} from '~/utils/style';
 
+import Chart from '~/components/Chart';
 import Image from '~/components/Image';
 import ImagePreviewer from '~/components/SamplePage/ImagePreviewer';
+import {SampleChart as SampleChartLoader} from '~/components/Loader/ChartPage';
 import styled from 'styled-components';
 
 const StyledImage = styled(Image)<{brightness?: number; contrast?: number; fit?: boolean}>`
@@ -36,6 +38,15 @@ const StyledImage = styled(Image)<{brightness?: number; contrast?: number; fit?:
 
 const cache = 5 * 60 * 1000;
 
+const chartSize = {
+    width: 430,
+    height: 406
+};
+const chartSizeInRem = {
+    width: rem(chartSize.width),
+    height: rem(chartSize.height)
+};
+
 type ImageChartProps = {
     brightness?: number;
     contrast?: number;
@@ -43,14 +54,35 @@ type ImageChartProps = {
 } & SampleChartBaseProps;
 
 const ImageChart: FunctionComponent<ImageChartProps> = ({brightness, contrast, fit, ...props}) => {
-    const content = useCallback(
+    const renderContent = useCallback(
         (props: SampleEntityProps) => <StyledImage {...props} brightness={brightness} contrast={contrast} fit={fit} />,
         [brightness, contrast, fit]
     );
 
-    const previewer = useCallback((props: SamplePreviewerProps) => <ImagePreviewer {...props} />, []);
+    const renderPreviewer = useCallback((props: SamplePreviewerProps) => <ImagePreviewer {...props} />, []);
 
-    return <SampleChart type="image" cache={cache} content={content} previewer={previewer} {...props} />;
+    return (
+        <Chart {...chartSizeInRem}>
+            <SampleChart
+                type="image"
+                cache={cache}
+                renderContent={renderContent}
+                renderPreviewer={renderPreviewer}
+                {...props}
+            />
+        </Chart>
+    );
 };
 
 export default ImageChart;
+
+export const Loader: FunctionComponent = () => (
+    <>
+        <Chart {...chartSizeInRem}>
+            <SampleChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+        <Chart {...chartSizeInRem}>
+            <SampleChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+    </>
+);

frontend/packages/core/src/components/SamplePage/SampleChart.tsx

@@ -16,6 +16,7 @@
 
 import React, {FunctionComponent, useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {ellipsis, em, primaryColor, rem, size, transitionProps} from '~/utils/style';
+import useRequest, {useRunningRequest} from '~/hooks/useRequest';
 
 import type {BlobResponse} from '~/utils/fetch';
 import ChartToolbox from '~/components/ChartToolbox';
@@ -29,8 +30,6 @@ import mime from 'mime-types';
 import queryString from 'query-string';
 import {saveFile} from '~/utils/saveFile';
 import styled from 'styled-components';
-import useRequest from '~/hooks/useRequest';
-import {useRunningRequest} from '~/hooks/useRequest';
 import {useTranslation} from 'react-i18next';
 
 const Wrapper = styled.div`
@@ -114,7 +113,7 @@ const FooterInfo = styled.div`
     }
 `;
 
-type SampleData = {
+export type SampleData = {
     step: number;
     wallTime: number;
 };
@@ -144,11 +143,11 @@ type SampleChartProps = {
     cache: number;
     step?: number;
     footer?: JSX.Element;
-    content: (props: SampleEntityProps) => React.ReactNode;
-    previewer?: (props: SamplePreviewerProps) => React.ReactNode;
+    renderContent: (props: SampleEntityProps) => React.ReactNode;
+    renderPreviewer?: (props: SamplePreviewerProps) => React.ReactNode;
 } & SampleChartBaseProps;
 
-const getUrl = (type: string, index: number, run: string, tag: string, wallTime: number): string =>
+export const getEntityUrl = (type: string, index: number, run: string, tag: string, wallTime: number): string =>
     `/${type}/${type}?${queryString.stringify({index, ts: wallTime, run, tag})}`;
 
 const SampleChart: FunctionComponent<SampleChartProps> = ({
@@ -158,8 +157,8 @@ const SampleChart: FunctionComponent<SampleChartProps> = ({
     type,
     cache,
     footer,
-    content,
-    previewer
+    renderContent,
+    renderPreviewer
 }) => {
     const {t, i18n} = useTranslation(['sample', 'common']);
 
@@ -208,7 +207,7 @@ const SampleChart: FunctionComponent<SampleChartProps> = ({
         if (!data) {
             return;
         }
-        const url = getUrl(type, step, run.label, tag, wallTime);
+        const url = getEntityUrl(type, step, run.label, tag, wallTime);
         cached.current[step] = {
             src: url,
             timer: window.setTimeout(() => {
@@ -278,7 +277,7 @@ const SampleChart: FunctionComponent<SampleChartProps> = ({
         }
     }, [src, entityData, entityError, entityLoading]);
 
-    const Content = useMemo(() => {
+    const content = useMemo<React.ReactNode>(() => {
         // show loading when deferring
         if (loading || !cached.current[step] || !viewed) {
             return <GridLoader color={primaryColor} size="10px" />;
@@ -290,13 +289,13 @@ const SampleChart: FunctionComponent<SampleChartProps> = ({
             return <span>{t('common:empty')}</span>;
         }
         if (entityProps) {
-            return content(entityProps);
+            return renderContent(entityProps);
         }
         return null;
-    }, [viewed, loading, error, data, step, entityProps, t, content]);
+    }, [viewed, loading, error, data, step, entityProps, t, renderContent]);
 
-    const Previewer = useMemo<React.ReactNode>(() => {
-        if (!previewer) {
+    const previewer = useMemo<React.ReactNode>(() => {
+        if (!renderPreviewer) {
             return null;
         }
         if (!preview) {
@@ -305,7 +304,7 @@ const SampleChart: FunctionComponent<SampleChartProps> = ({
         if (!entityProps) {
             return null;
         }
-        return previewer({
+        return renderPreviewer({
             ...entityProps,
             loading: !cached.current[step] || entityProps.loading,
             steps,
@@ -314,7 +313,7 @@ const SampleChart: FunctionComponent<SampleChartProps> = ({
             onChange: setStep,
             onChangeComplete: cacheSrc
         });
-    }, [previewer, entityProps, preview, steps, step, cacheSrc]);
+    }, [renderPreviewer, entityProps, preview, steps, step, cacheSrc]);
 
     return (
         <Wrapper ref={wrapperRef}>
@@ -325,10 +324,10 @@ const SampleChart: FunctionComponent<SampleChartProps> = ({
             <StepSlider value={step} steps={steps} onChange={setStep} onChangeComplete={cacheSrc}>
                 {formatTime(wallTime, i18n.language)}
             </StepSlider>
-            <Container ref={container} preview={!!previewer && !!src} onClick={() => setPreview(true)}>
-                {Content}
+            <Container ref={container} preview={!!renderPreviewer && !!src} onClick={() => setPreview(true)}>
+                {content}
             </Container>
-            {Previewer}
+            {previewer}
             <Footer>
                 <ChartToolbox
                     items={[

frontend/packages/core/src/components/SamplePage/Text.tsx

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React, {FunctionComponent, useCallback, useEffect, useState} from 'react';
+import type {SampleChartBaseProps, SampleData} from './SampleChart';
+import {borderRadius, ellipsis, em, rem, sameBorder, size, transitionProps} from '~/utils/style';
+import useRequest, {useRunningRequest} from '~/hooks/useRequest';
+
+import ContentLoader from '~/components/Loader/ContentLoader';
+import Icon from '~/components/Icon';
+import {TextChart as TextChartLoader} from '~/components/Loader/ChartPage';
+import {fetcher} from '~/utils/fetch';
+import {getEntityUrl} from './SampleChart';
+import queryString from 'query-string';
+import styled from 'styled-components';
+import {useTranslation} from 'react-i18next';
+
+const Wrapper = styled.div`
+    width: 100%;
+`;
+
+const Title = styled.h4<{color: string; opened?: boolean}>`
+    cursor: pointer;
+    background-color: var(--text-chart-title-background-color);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    height: ${rem(40)};
+    margin: 0;
+    padding: 0 ${rem(20)} 0 ${rem(12)};
+    border-radius: ${borderRadius};
+    font-weight: 400;
+    font-size: ${em(14)};
+    ${transitionProps('background-color')}
+
+    .tag {
+        flex: auto;
+        font-weight: 700;
+
+        &::before {
+            content: '';
+            display: inline-block;
+            ${size(rem(10), rem(3))}
+            margin-right: ${rem(8)};
+            border-radius: ${rem(1.5)};
+            vertical-align: middle;
+            background-color: var(--text-chart-title-indicator-color);
+            ${transitionProps('background-color')}
+        }
+    }
+
+    .run {
+        flex: none;
+        color: var(--text-lighter-color);
+        ${transitionProps('color')}
+        ${ellipsis()}
+        max-width: 50%;
+
+        &::before {
+            content: '';
+            display: inline-block;
+            ${size(rem(9), rem(9))}
+            margin-right: ${rem(8)};
+            border-radius: ${rem(4.5)};
+            vertical-align: middle;
+            background-color: ${props => props.color};
+        }
+    }
+
+    .steps {
+        flex: none;
+        color: var(--text-lighter-color);
+        margin-left: ${rem(12)};
+    }
+
+    .icon {
+        margin-left: ${rem(20)};
+        font-size: ${rem(10)};
+        color: var(--text-lighter-color);
+        transform: rotate(${props => (props.opened ? '180' : '0')}deg);
+        ${transitionProps(['transform', 'color'])};
+    }
+`;
+
+const TextWrapper = styled.div`
+    height: ${rem(40)};
+    margin-top: ${rem(12)};
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    padding: 0;
+    ${sameBorder(true)}
+    ${transitionProps('border-color')}
+`;
+
+const TextGrid = styled.div`
+    margin-top: ${rem(12)};
+    display: grid;
+    grid-template-columns: fit-content(25%) auto;
+    grid-row-gap: ${rem(12)};
+    justify-items: stretch;
+    align-items: stretch;
+    ${transitionProps('border-color')}
+
+    > span {
+        height: ${rem(40)};
+        line-height: 1.857142857;
+        padding: ${rem(7)} 0;
+    }
+
+    .step {
+        ${sameBorder()}
+        border-right: none;
+        border-top-left-radius: ${borderRadius};
+        border-bottom-left-radius: ${borderRadius};
+        padding-left: ${rem(8)};
+        padding-right: ${rem(14)};
+
+        > span {
+            display: block;
+            width: 100%;
+            color: var(--text-light-color);
+            background-color: var(--text-chart-tag-background-color);
+            padding: 0 ${rem(8)};
+            border-radius: ${borderRadius};
+            ${transitionProps(['background-color', 'color'])}
+        }
+    }
+
+    .text {
+        ${sameBorder()}
+        border-left: none;
+        border-top-right-radius: ${borderRadius};
+        border-bottom-right-radius: ${borderRadius};
+        padding-right: ${rem(20)};
+        ${ellipsis()}
+
+        > * {
+            vertical-align: middle;
+        }
+    }
+`;
+
+type TextProps = {
+    index: number;
+    run: string;
+    tag: string;
+} & SampleData;
+
+const Text: FunctionComponent<TextProps> = ({run, tag, step, wallTime, index}) => {
+    const {t} = useTranslation('sample');
+
+    const {data: text, error, loading} = useRequest<string>(getEntityUrl('text', index, run, tag, wallTime), fetcher, {
+        dedupingInterval: 5 * 60 * 1000
+    });
+
+    return (
+        <>
+            <span className="step">
+                <span>
+                    {t('sample:step')} {step}
+                </span>
+            </span>
+            <span className="text" title={text ?? ''}>
+                {loading ? (
+                    <ContentLoader viewBox="0 0 640 16" height="16">
+                        <rect x="0" y="0" rx="3" ry="3" width={((index + 1) * 250) % 640} height="16" />
+                    </ContentLoader>
+                ) : (
+                    error ?? text
+                )}
+            </span>
+        </>
+    );
+};
+
+type TextChartProps = {
+    opened?: boolean;
+} & SampleChartBaseProps;
+
+const TextChart: FunctionComponent<TextChartProps> = ({run, tag, opened, running}) => {
+    const [isOpened, setIsOpened] = useState(opened ?? false);
+    useEffect(() => setIsOpened(opened ?? false), [opened]);
+    const toggleOpened = useCallback(() => setIsOpened(m => !m), []);
+
+    const {data, error, loading} = useRunningRequest<SampleData[]>(
+        `/text/list?${queryString.stringify({run: run.label, tag})}`,
+        !!running
+    );
+
+    return (
+        <Wrapper>
+            <Title color={run.colors[0]} opened={isOpened} onClick={toggleOpened}>
+                <span className="tag">{tag}</span>
+                <span className="run">{run.label}</span>
+                <span className="steps">{data?.length ?? 0}</span>
+                <Icon className="icon" type="chevron-down" />
+            </Title>
+            {isOpened ? (
+                loading ? (
+                    <>
+                        <TextWrapper>
+                            <TextChartLoader width={270} />
+                        </TextWrapper>
+                        <TextWrapper>
+                            <TextChartLoader width={640} />
+                        </TextWrapper>
+                    </>
+                ) : error ? (
+                    <TextWrapper>{error}</TextWrapper>
+                ) : (
+                    <TextGrid>
+                        {data?.map((item, index) => (
+                            <Text key={index} {...item} run={run.label} tag={tag} index={index} />
+                        ))}
+                    </TextGrid>
+                )
+            ) : null}
+        </Wrapper>
+    );
+};
+
+export default TextChart;
+
+export const Loader: FunctionComponent = () => (
+    <>
+        <Wrapper>
+            <Title color=""></Title>
+            <TextWrapper>
+                <TextChartLoader width={270} />
+            </TextWrapper>
+            <TextWrapper>
+                <TextChartLoader width={640} />
+            </TextWrapper>
+        </Wrapper>
+        <Wrapper>
+            <Title color=""></Title>
+        </Wrapper>
+    </>
+);

frontend/packages/core/src/components/ScalarPage/ScalarChart.tsx

@@ -30,12 +30,13 @@ import {
 } from '~/resource/scalar';
 import {rem, size} from '~/utils/style';
 
+import Chart from '~/components/Chart';
+import {Chart as ChartLoader} from '~/components/Loader/ChartPage';
 import ChartToolbox from '~/components/ChartToolbox';
 import type {EChartOption} from 'echarts';
 import type {Run} from '~/types';
 import TooltipTable from '~/components/TooltipTable';
 import {cycleFetcher} from '~/utils/fetch';
-import ee from '~/utils/event';
 import {format} from 'd3-format';
 import queryString from 'query-string';
 import {renderToStaticMarkup} from 'react-dom/server';
@@ -78,8 +79,16 @@ const Error = styled.div`
     align-items: center;
 `;
 
+const chartSize = {
+    width: 430,
+    height: 337
+};
+const chartSizeInRem = {
+    width: rem(chartSize.width),
+    height: rem(chartSize.height)
+};
+
 type ScalarChartProps = {
-    cid: symbol;
     runs: Run[];
     tag: string;
     smoothing: number;
@@ -92,7 +101,6 @@ type ScalarChartProps = {
 };
 
 const ScalarChart: FunctionComponent<ScalarChartProps> = ({
-    cid,
     runs,
     tag,
     smoothing,
@@ -114,10 +122,6 @@ const ScalarChart: FunctionComponent<ScalarChartProps> = ({
     );
 
     const [maximized, setMaximized] = useState<boolean>(false);
-    const toggleMaximized = useCallback(() => {
-        ee.emit('toggle-chart-size', cid, !maximized);
-        setMaximized(m => !m);
-    }, [cid, maximized]);
 
     const xAxisType = useMemo(() => (xAxis === XAxis.WallTime ? XAxisType.time : XAxisType.value), [xAxis]);
 
@@ -243,7 +247,7 @@ const ScalarChart: FunctionComponent<ScalarChartProps> = ({
                 tooltip: t('scalar:maximize'),
                 activeTooltip: t('scalar:minimize'),
                 toggle: true,
-                onClick: toggleMaximized
+                onClick: () => setMaximized(m => !m)
             },
             {
                 icon: 'restore-size',
@@ -275,7 +279,7 @@ const ScalarChart: FunctionComponent<ScalarChartProps> = ({
                 ]
             }
         ],
-        [downloadData, t, toggleMaximized, toggleYAxisType]
+        [downloadData, t, toggleYAxisType]
     );
 
     // display error only on first fetch
@@ -284,11 +288,24 @@ const ScalarChart: FunctionComponent<ScalarChartProps> = ({
     }
 
     return (
-        <Wrapper>
-            <StyledLineChart ref={echart} title={tag} options={options} data={data} loading={loading} zoom />
-            <Toolbox items={toolbox} />
-        </Wrapper>
+        <Chart maximized={maximized} {...chartSizeInRem}>
+            <Wrapper>
+                <StyledLineChart ref={echart} title={tag} options={options} data={data} loading={loading} zoom />
+                <Toolbox items={toolbox} />
+            </Wrapper>
+        </Chart>
     );
 };
 
 export default ScalarChart;
+
+export const Loader: FunctionComponent = () => (
+    <>
+        <Chart {...chartSizeInRem}>
+            <ChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+        <Chart {...chartSizeInRem}>
+            <ChartLoader width={chartSize.width - 2} height={chartSize.height - 2} />
+        </Chart>
+    </>
+);

frontend/packages/core/src/hooks/useNavItems.ts

@@ -26,6 +26,7 @@ export const navMap = {
     histogram: Pages.Histogram,
     image: Pages.Image,
     audio: Pages.Audio,
+    text: Pages.Text,
     graph: Pages.Graph,
     embeddings: Pages.HighDimensional,
     pr_curve: Pages.PRCurve,

frontend/packages/core/src/pages/curves/pr.tsx

@@ -14,12 +14,12 @@
  * limitations under the License.
  */
 
-import ChartPage, {WithChart} from '~/components/ChartPage';
+import ChartPage, {RenderChart} from '~/components/ChartPage';
+import CurveChart, {Loader as ChartLoader} from '~/components/CurvesPage/CurveChart';
 import React, {FunctionComponent, useCallback, useState} from 'react';
 
 import Content from '~/components/Content';
 import CurveAside from '~/components/CurvesPage/CurveAside';
-import CurveChart from '~/components/CurvesPage/CurveChart';
 import Error from '~/components/Error';
 import type {Tag} from '~/resource/curves';
 import Title from '~/components/Title';
@@ -33,8 +33,8 @@ const PRCurve: FunctionComponent = () => {
 
     const [tags, setTags] = useState<Tag[]>([]);
 
-    const withChart = useCallback<WithChart<Tag>>(
-        ({label, runs, ...args}) => <CurveChart type="pr" runs={runs} tag={label} {...args} running={running} />,
+    const renderChart = useCallback<RenderChart<Tag>>(
+        ({label, runs}) => <CurveChart type="pr" runs={runs} tag={label} running={running} />,
         [running]
     );
 
@@ -54,7 +54,7 @@ const PRCurve: FunctionComponent = () => {
                 {!loading && !tags.length ? (
                     <Error />
                 ) : (
-                    <ChartPage items={tags} withChart={withChart} loading={loading} />
+                    <ChartPage items={tags} renderChart={renderChart} loader={<ChartLoader />} loading={loading} />
                 )}
             </Content>
         </>

frontend/packages/core/src/pages/curves/roc.tsx

@@ -14,12 +14,12 @@
  * limitations under the License.
  */
 
-import ChartPage, {WithChart} from '~/components/ChartPage';
+import ChartPage, {RenderChart} from '~/components/ChartPage';
+import CurveChart, {Loader as ChartLoader} from '~/components/CurvesPage/CurveChart';
 import React, {FunctionComponent, useCallback, useState} from 'react';
 
 import Content from '~/components/Content';
 import CurveAside from '~/components/CurvesPage/CurveAside';
-import CurveChart from '~/components/CurvesPage/CurveChart';
 import Error from '~/components/Error';
 import type {Tag} from '~/resource/curves';
 import Title from '~/components/Title';
@@ -33,8 +33,8 @@ const ROCCurve: FunctionComponent = () => {
 
     const [tags, setTags] = useState<Tag[]>([]);
 
-    const withChart = useCallback<WithChart<Tag>>(
-        ({label, runs, ...args}) => <CurveChart type="roc" runs={runs} tag={label} {...args} running={running} />,
+    const renderChart = useCallback<RenderChart<Tag>>(
+        ({label, runs}) => <CurveChart type="roc" runs={runs} tag={label} running={running} />,
         [running]
     );
 
@@ -54,7 +54,7 @@ const ROCCurve: FunctionComponent = () => {
                 {!loading && !tags.length ? (
                     <Error />
                 ) : (
-                    <ChartPage items={tags} withChart={withChart} loading={loading} />
+                    <ChartPage items={tags} renderChart={renderChart} loader={<ChartLoader />} loading={loading} />
                 )}
             </Content>
         </>

frontend/packages/core/src/pages/histogram.tsx

@@ -14,7 +14,8 @@
  * limitations under the License.
  */
 
-import ChartPage, {WithChart} from '~/components/ChartPage';
+import ChartPage, {RenderChart} from '~/components/ChartPage';
+import HistogramChart, {Loader as ChartLoader} from '~/components/HistogramPage/HistogramChart';
 import {Modes, modes} from '~/resource/histogram';
 import React, {FunctionComponent, useCallback, useMemo, useState} from 'react';
 
@@ -22,7 +23,6 @@ import {AsideSection} from '~/components/Aside';
 import Content from '~/components/Content';
 import Error from '~/components/Error';
 import Field from '~/components/Field';
-import HistogramChart from '~/components/HistogramPage/HistogramChart';
 import RadioButton from '~/components/RadioButton';
 import RadioGroup from '~/components/RadioGroup';
 import RunAside from '~/components/RunAside';
@@ -66,8 +66,8 @@ const Histogram: FunctionComponent = () => {
         [loading, mode, onChangeRuns, running, runs, selectedRuns, t]
     );
 
-    const withChart = useCallback<WithChart<TagWithSingleRun>>(
-        ({label, run, ...args}) => <HistogramChart run={run} tag={label} {...args} mode={mode} running={running} />,
+    const renderChart = useCallback<RenderChart<TagWithSingleRun>>(
+        ({label, run}) => <HistogramChart run={run} tag={label} mode={mode} running={running} />,
         [running, mode]
     );
 
@@ -78,7 +78,12 @@ const Histogram: FunctionComponent = () => {
                 {!loading && !runs.length ? (
                     <Error />
                 ) : (
-                    <ChartPage items={tagsWithSingleRun} withChart={withChart} loading={loading} />
+                    <ChartPage
+                        items={tagsWithSingleRun}
+                        renderChart={renderChart}
+                        loader={<ChartLoader />}
+                        loading={loading}
+                    />
                 )}
             </Content>
         </>

frontend/packages/core/src/pages/sample/audio.tsx

@@ -16,23 +16,17 @@
 
 // cSpell:words ungrouped
 
-import ChartPage, {WithChart} from '~/components/ChartPage';
+import AudioChart, {Loader as ChartLoader} from '~/components/SamplePage/Audio';
+import ChartPage, {RenderChart} from '~/components/ChartPage';
 import React, {FunctionComponent, useCallback, useEffect, useMemo, useRef, useState} from 'react';
 
-import AudioChart from '~/components/SamplePage/AudioChart';
 import Content from '~/components/Content';
 import Error from '~/components/Error';
 import RunAside from '~/components/RunAside';
-import {SampleChart as SampleChartLoader} from '~/components/Loader/ChartPage';
 import Title from '~/components/Title';
-import {rem} from '~/utils/style';
 import useTagFilter from '~/hooks/useTagFilter';
 import {useTranslation} from 'react-i18next';
 
-const chartSize = {
-    height: rem(244)
-};
-
 const AudioSample: FunctionComponent = () => {
     const {t} = useTranslation(['sample', 'common']);
 
@@ -65,7 +59,7 @@ const AudioSample: FunctionComponent = () => {
         [loading, onChangeRuns, running, runs, selectedRuns]
     );
 
-    const withChart = useCallback<WithChart<typeof tagsWithSingleRun[number]>>(
+    const renderChart = useCallback<RenderChart<typeof tagsWithSingleRun[number]>>(
         ({run, label}) => <AudioChart audioContext={audioContext.current} run={run} tag={label} running={running} />,
         [running]
     );
@@ -81,9 +75,9 @@ const AudioSample: FunctionComponent = () => {
                 ) : (
                     <ChartPage
                         items={tagsWithSingleRun}
-                        chartSize={chartSize}
-                        withChart={withChart}
-                        loading={loading && <SampleChartLoader height={242} />}
+                        renderChart={renderChart}
+                        loader={<ChartLoader />}
+                        loading={loading}
                     />
                 )}
             </Content>

frontend/packages/core/src/pages/sample/image.tsx

@@ -16,7 +16,8 @@
 
 // cSpell:words ungrouped
 
-import ChartPage, {WithChart} from '~/components/ChartPage';
+import ChartPage, {RenderChart} from '~/components/ChartPage';
+import ImageChart, {Loader as ChartLoader} from '~/components/SamplePage/Image';
 import React, {FunctionComponent, useCallback, useMemo, useState} from 'react';
 
 import {AsideSection} from '~/components/Aside';
@@ -24,19 +25,12 @@ import Checkbox from '~/components/Checkbox';
 import Content from '~/components/Content';
 import Error from '~/components/Error';
 import Field from '~/components/Field';
-import ImageChart from '~/components/SamplePage/ImageChart';
 import RunAside from '~/components/RunAside';
-import {SampleChart as SampleChartLoader} from '~/components/Loader/ChartPage';
 import Slider from '~/components/Slider';
 import Title from '~/components/Title';
-import {rem} from '~/utils/style';
 import useTagFilter from '~/hooks/useTagFilter';
 import {useTranslation} from 'react-i18next';
 
-const chartSize = {
-    height: rem(406)
-};
-
 const ImageSample: FunctionComponent = () => {
     const {t} = useTranslation(['sample', 'common']);
 
@@ -78,7 +72,7 @@ const ImageSample: FunctionComponent = () => {
         [brightness, contrast, loading, onChangeRuns, running, runs, selectedRuns, showActualSize, t]
     );
 
-    const withChart = useCallback<WithChart<typeof tagsWithSingleRun[number]>>(
+    const renderChart = useCallback<RenderChart<typeof tagsWithSingleRun[number]>>(
         ({run, label}) => (
             <ImageChart
                 run={run}
@@ -103,9 +97,9 @@ const ImageSample: FunctionComponent = () => {
                 ) : (
                     <ChartPage
                         items={tagsWithSingleRun}
-                        chartSize={chartSize}
-                        withChart={withChart}
-                        loading={loading && <SampleChartLoader height={404} />}
+                        renderChart={renderChart}
+                        loader={<ChartLoader />}
+                        loading={loading}
                     />
                 )}
             </Content>

frontend/packages/core/src/pages/sample/text.tsx

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// cSpell:words ungrouped
+
+import ChartPage, {RenderChart} from '~/components/ChartPage';
+import React, {FunctionComponent, useCallback, useMemo, useState} from 'react';
+import TextChart, {Loader as ChartLoader} from '~/components/SamplePage/Text';
+
+import Content from '~/components/Content';
+import Error from '~/components/Error';
+import RunAside from '~/components/RunAside';
+import Title from '~/components/Title';
+import useTagFilter from '~/hooks/useTagFilter';
+import {useTranslation} from 'react-i18next';
+
+const TextSample: FunctionComponent = () => {
+    const {t} = useTranslation(['sample', 'common']);
+
+    const [running, setRunning] = useState(true);
+
+    const {runs, tagsWithSingleRun, selectedRuns, onChangeRuns, loading} = useTagFilter('text', running);
+
+    const aside = useMemo(
+        () => (
+            <RunAside
+                runs={runs}
+                selectedRuns={selectedRuns}
+                onChangeRuns={onChangeRuns}
+                running={running}
+                onToggleRunning={setRunning}
+                loading={loading}
+            ></RunAside>
+        ),
+        [loading, onChangeRuns, running, runs, selectedRuns]
+    );
+
+    const withChart = useCallback<RenderChart<typeof tagsWithSingleRun[number]>>(
+        ({run, label}, index) => <TextChart run={run} tag={label} opened={index === 0} running={running} />,
+        [running]
+    );
+
+    return (
+        <>
+            <Title>
+                {t('common:text')} - {t('common:sample')}
+            </Title>
+            <Content aside={aside}>
+                {!loading && !runs.length ? (
+                    <Error />
+                ) : (
+                    <ChartPage
+                        items={tagsWithSingleRun}
+                        renderChart={withChart}
+                        loader={<ChartLoader />}
+                        loading={loading}
+                    />
+                )}
+            </Content>
+        </>
+    );
+};
+
+export default TextSample;

frontend/packages/core/src/pages/scalar.tsx

@@ -14,8 +14,9 @@
  * limitations under the License.
  */
 
-import ChartPage, {WithChart} from '~/components/ChartPage';
+import ChartPage, {RenderChart} from '~/components/ChartPage';
 import React, {FunctionComponent, useCallback, useEffect, useMemo, useState} from 'react';
+import ScalarChart, {Loader as ChartLoader} from '~/components/ScalarPage/ScalarChart';
 import {SortingMethod, XAxis, parseSmoothing, sortingMethod as toolTipSortingValues} from '~/resource/scalar';
 
 import {AsideSection} from '~/components/Aside';
@@ -24,7 +25,6 @@ import Content from '~/components/Content';
 import Error from '~/components/Error';
 import Field from '~/components/Field';
 import RunAside from '~/components/RunAside';
-import ScalarChart from '~/components/ScalarPage/ScalarChart';
 import Select from '~/components/Select';
 import Slider from '~/components/Slider';
 import type {Tag} from '~/types';
@@ -143,12 +143,11 @@ const Scalar: FunctionComponent = () => {
         ]
     );
 
-    const withChart = useCallback<WithChart<Tag>>(
-        ({label, runs, ...args}) => (
+    const renderChart = useCallback<RenderChart<Tag>>(
+        ({label, runs}) => (
             <ScalarChart
                 runs={runs}
                 tag={label}
-                {...args}
                 smoothing={smoothing}
                 xAxis={xAxis}
                 sortingMethod={tooltipSorting}
@@ -168,7 +167,7 @@ const Scalar: FunctionComponent = () => {
                 {!loading && !runs.length ? (
                     <Error />
                 ) : (
-                    <ChartPage items={tags} withChart={withChart} loading={loading} />
+                    <ChartPage items={tags} renderChart={renderChart} loader={<ChartLoader />} loading={loading} />
                 )}
             </Content>
         </>

frontend/packages/core/src/routes/index.ts

@@ -21,6 +21,7 @@ export enum Pages {
     Histogram = 'histogram',
     Image = 'image',
     Audio = 'audio',
+    Text = 'text',
     Graph = 'graph',
     HighDimensional = 'high-dimensional',
     PRCurve = 'pr-curve',
@@ -66,6 +67,11 @@ const routes: Route[] = [
                 id: Pages.Audio,
                 path: '/sample/audio',
                 component: React.lazy(() => import('~/pages/sample/audio'))
+            },
+            {
+                id: Pages.Text,
+                path: '/sample/text',
+                component: React.lazy(() => import('~/pages/sample/text'))
             }
         ]
     },

frontend/packages/core/src/store/runs/reducers.ts

@@ -23,6 +23,7 @@ const initState: RunsState = {
     histogram: [],
     image: [],
     audio: [],
+    text: [],
     'pr-curve': [],
     'roc-curve': []
 };

frontend/packages/core/src/store/runs/types.ts

@@ -25,6 +25,7 @@ export interface RunsState {
     histogram: Runs;
     image: Runs;
     audio: Runs;
+    text: Runs;
     'pr-curve': Runs;
     'roc-curve': Runs;
 }

frontend/packages/core/src/utils/theme.ts

@@ -87,7 +87,11 @@ export const themes = {
         graphUploaderBackgroundColor: '#f9f9f9',
         graphUploaderActiveBackgroundColor: '#f2f6ff',
         graphCopyrightColor: '#ddd',
-        graphCopyrightLogoFilter: 'opacity(25%)'
+        graphCopyrightLogoFilter: 'opacity(25%)',
+
+        textChartTitleBackgroundColor: '#f8f8f8',
+        textChartTitleIndicatorColor: '#000',
+        textChartTagBackgroundColor: '#f6f6f6'
     },
     dark: {
         textColor: '#cfcfd1',
@@ -131,7 +135,12 @@ export const themes = {
         graphUploaderBackgroundColor: '#262629',
         graphUploaderActiveBackgroundColor: '#303033',
         graphCopyrightColor: '#565657',
-        graphCopyrightLogoFilter: 'invert(35%) sepia(5%) saturate(79%) hue-rotate(202deg) brightness(88%) contrast(86%)'
+        graphCopyrightLogoFilter:
+            'invert(35%) sepia(5%) saturate(79%) hue-rotate(202deg) brightness(88%) contrast(86%)',
+
+        textChartTitleBackgroundColor: '#2a2a2a',
+        textChartTitleIndicatorColor: '#fff',
+        textChartTagBackgroundColor: '#222'
     }
 } as const;
 

frontend/packages/demo/package.json

@@ -32,10 +32,10 @@
         "test": "echo \"Error: no test specified\" && exit 0"
     },
     "devDependencies": {
-        "@types/express": "4.17.9",
+        "@types/express": "4.17.11",
         "@types/mkdirp": "1.0.1",
-        "@types/node": "14.14.20",
-        "@types/node-fetch": "2.5.7",
+        "@types/node": "14.14.22",
+        "@types/node-fetch": "2.5.8",
         "@types/rimraf": "3.0.0",
         "cpy-cli": "3.1.1",
         "get-port": "5.1.1",

frontend/packages/mock/data/components.ts

@@ -14,4 +14,4 @@
  * limitations under the License.
  */
 
-export default ['embeddings', 'scalar', 'image', 'audio', 'graph', 'histogram', 'pr_curve', 'roc_curve'];
+export default ['embeddings', 'scalar', 'image', 'audio', 'text', 'graph', 'histogram', 'pr_curve', 'roc_curve'];

frontend/packages/mock/data/text/list.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export default [
+    {
+        wallTime: 1512549785061.623,
+        step: 60
+    },
+    {
+        wallTime: 1512886109672.786,
+        step: 60
+    },
+    {
+        wallTime: 1512886124266.915,
+        step: 210
+    },
+    {
+        wallTime: 1512886138898.628,
+        step: 330
+    },
+    {
+        wallTime: 1512886139883.663,
+        step: 340
+    },
+    {
+        wallTime: 1512886147195.567,
+        step: 410
+    },
+    {
+        wallTime: 1512886156478.56,
+        step: 500
+    },
+    {
+        wallTime: 1512886187827.93,
+        step: 810
+    },
+    {
+        wallTime: 1512886200386.198,
+        step: 950
+    },
+    {
+        wallTime: 1512886204224.405,
+        step: 990
+    }
+];

frontend/packages/mock/data/text/tags.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+// cSpell:disable
+
+export default {
+    runs: ['train', 'test'],
+    tags: [
+        [
+            'input_reshape/input/text/7',
+            'input_reshape/input/text/4',
+            'input_reshape/input/text/5',
+            'hahaha/input/text/2',
+            'hahaha/input/text/3',
+            'hahaha/input/text/0',
+            'ohehe/input/text/1',
+            '😼/input/text/8',
+            '😼/input/text/9'
+        ],
+        [
+            'input_reshape/input/text/6',
+            'input_reshape/input/text/7',
+            'input_reshape/input/text/4',
+            'input_reshape/input/text/5',
+            'hahaha/input/text/2',
+            'hahaha/input/text/3',
+            'oheihei/input/text/0',
+            'oheihei/input/text/1',
+            '😼/input/text/8',
+            '😼/input/text/9'
+        ]
+    ]
+};

frontend/packages/mock/data/text/text.ts

+/**
+ * Copyright 2020 Baidu Inc. All Rights Reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import {Request, Response} from 'express';
+
+const texts = [
+    '不要以为抹消过去，重新来过，即可发生什么改变',
+    '这只是谁也不会伤害到的，温柔的谎言。虽然听上去不时闪现着希望，实际上却是迂回地饱含着绝望的说法。可能做不到 这件事本身说话人自己也了然于心，而向众人留有回旋的余地。',
+    '自称理解了能教他人什么的都太狂妄了 自以为理解了是罪与恶 虽然如此 我们不得不自欺欺人地活下去',
+    '自己的过去会被当做笑话或者捏他的形式，被他人随随便便的共有化。最终只会被他和她们当做方便好用的交流素材， 快乐的使用着',
+    '怎么办？没怎么办。只想就这件事随便说说而已。就好比，在电视里看到战争和贫困的场景，只能一边说着“真是可怜啊 ”“真是不得了啊”“这是我们无能为力的事情啊”，而同时我们在舒适的屋子里吃着好吃的晚饭的事情也没有改变。 我们无法在此之后着手做些什么，到最后不过只能想到“要对目前为止自己的幸福心怀感激”这种程度的事',
+    '世上没有像一个模子刻出来样的恶人哦 平时大家都是善人 至少大家都是普通人 但是 一到紧要关头 就会突然变成恶人 所以很 可怕 因为不能大意 人不可轻信',
+    '人类要是遇到真心害怕的事 完全不会在意别人 就算牺牲周围的人也要获救 只要暴露出这份丑陋的嘴脸 就再也无法好好相处了  不能逃避只是强身的想法 错的并不会总是自己 社会上 人世间 身边 总会有人做错 自己可以改变它 这只是顺应了这个垃圾一 般的冷酷且残酷的世界 承认自己的失败并顺从的行为 只是用漂亮话装饰起来 连自己都要欺骗罢了'
+];
+
+export default async (req: Request, res: Response) => {
+    const index = (+req.query.index ?? 0) % texts.length;
+    res.setHeader('Content-Type', 'text/plain');
+    return texts[index];
+};

frontend/packages/mock/package.json

@@ -40,9 +40,9 @@
         "mime-types": "2.1.28"
     },
     "devDependencies": {
-        "@types/express": "4.17.9",
+        "@types/express": "4.17.11",
         "@types/faker": "5.1.5",
-        "@types/node": "14.14.20",
+        "@types/node": "14.14.22",
         "cpy-cli": "3.1.1",
         "rimraf": "3.0.2",
         "ts-node": "9.1.1",

frontend/packages/netron/package.json

@@ -40,19 +40,19 @@
         "pako": "1.0.11"
     },
     "devDependencies": {
-        "autoprefixer": "10.2.0",
+        "autoprefixer": "10.2.3",
         "copy-webpack-plugin": "7.0.0",
         "css-loader": "5.0.1",
         "html-webpack-plugin": "4.5.1",
-        "mini-css-extract-plugin": "1.3.3",
-        "postcss": "8.2.2",
-        "postcss-loader": "4.1.0",
+        "mini-css-extract-plugin": "1.3.4",
+        "postcss": "8.2.4",
+        "postcss-loader": "4.2.0",
         "rimraf": "3.0.2",
-        "sass": "1.32.2",
-        "sass-loader": "10.1.0",
+        "sass": "1.32.5",
+        "sass-loader": "10.1.1",
         "terser": "5.5.1",
-        "webpack": "5.11.1",
-        "webpack-cli": "4.3.1"
+        "webpack": "5.17.0",
+        "webpack-cli": "4.4.0"
     },
     "engines": {
         "node": ">=12",

frontend/packages/server/package.json

@@ -39,15 +39,15 @@
     "dependencies": {
         "@visualdl/core": "2.1.4",
         "dotenv": "8.2.0",
-        "enhanced-resolve": "5.4.1",
+        "enhanced-resolve": "5.7.0",
         "express": "4.17.1",
         "http-proxy-middleware": "1.0.6",
         "pm2": "4.5.1"
     },
     "devDependencies": {
         "@types/enhanced-resolve": "3.0.6",
-        "@types/express": "4.17.9",
-        "@types/node": "14.14.20",
+        "@types/express": "4.17.11",
+        "@types/node": "14.14.22",
         "@visualdl/mock": "2.1.4",
         "cross-env": "7.0.3",
         "nodemon": "2.0.7",

frontend/yarn.lock

@@ -1234,10 +1234,10 @@
   resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz#8eed982e2ee6f7f4e44c253e12962980791efd46"
   integrity sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==
 
-"@eslint/eslintrc@^0.2.2":
-  version "0.2.2"
-  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-0.2.2.tgz#d01fc791e2fc33e88a29d6f3dc7e93d0cd784b76"
-  integrity sha512-EfB5OHNYp1F4px/LI/FEnGylop7nOqkQ1LRzCM0KccA2U8tvV8w01KBv37LbO7nW4H+YhKyo2LcJhRwjjV17QQ==
+"@eslint/eslintrc@^0.3.0":
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-0.3.0.tgz#d736d6963d7003b6514e6324bec9c602ac340318"
+  integrity sha512-1JTKgrOKAHVivSvOYw+sJOunkBjUOvjqWk1DPja7ZFhIS2mX/4EgTT8M7eTK9jrKhL/FvXXEbQwIs3pg1xp3dg==
   dependencies:
     ajv "^6.12.4"
     debug "^4.1.1"
@@ -1246,7 +1246,7 @@
     ignore "^4.0.6"
     import-fresh "^3.2.1"
     js-yaml "^3.13.1"
-    lodash "^4.17.19"
+    lodash "^4.17.20"
     minimatch "^3.0.4"
     strip-json-comments "^3.1.1"
 
@@ -2231,11 +2231,12 @@
     fastq "^1.6.0"
 
 "@npmcli/move-file@^1.0.1":
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/@npmcli/move-file/-/move-file-1.0.1.tgz#de103070dac0f48ce49cf6693c23af59c0f70464"
-  integrity sha512-Uv6h1sT+0DrblvIrolFtbvM1FgWm+/sy4B3pvLp67Zys+thcukzS5ekn7HsZFGpWP4Q3fYJCljbWQE/XivMRLw==
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@npmcli/move-file/-/move-file-1.1.0.tgz#4ef8a53d727b9e43facf35404caf55ebf92cfec8"
+  integrity sha512-Iv2iq0JuyYjKeFkSR4LPaCdDZwlGK9X2cP/01nJcp3yMJ1FjNd9vpiEYvLUgzBxKPg2SFmaOhizoQsPc0LWeOQ==
   dependencies:
     mkdirp "^1.0.4"
+    rimraf "^2.7.1"
 
 "@octokit/auth-token@^2.4.0":
   version "2.4.4"
@@ -2253,10 +2254,10 @@
     is-plain-object "^5.0.0"
     universal-user-agent "^6.0.0"
 
-"@octokit/openapi-types@^2.2.0":
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/@octokit/openapi-types/-/openapi-types-2.2.0.tgz#123e0438a0bc718ccdac3b5a2e69b3dd00daa85b"
-  integrity sha512-274lNUDonw10kT8wHg8fCcUc1ZjZHbWv0/TbAwb0ojhBQqZYc1cQ/4yqTVTtPMDeZ//g7xVEYe/s3vURkRghPg==
+"@octokit/openapi-types@^2.3.0":
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/@octokit/openapi-types/-/openapi-types-2.3.0.tgz#075c4e5a1d05d0b62cd8048b71764537aa870c00"
+  integrity sha512-Own8lHWVi5eEfLOnsIzAx16BoRbpkzac3QDUCxIqYMf4bjz+AGpv17UfRn1Va4lVmjwOpvZglpFI3mmxuQ+sIQ==
 
 "@octokit/plugin-enterprise-rest@^6.0.1":
   version "6.0.1"
@@ -2345,11 +2346,11 @@
     "@types/node" ">= 8"
 
 "@octokit/types@^6.0.0", "@octokit/types@^6.0.3":
-  version "6.2.1"
-  resolved "https://registry.yarnpkg.com/@octokit/types/-/types-6.2.1.tgz#7f881fe44475ab1825776a4a59ca1ae082ed1043"
-  integrity sha512-jHs9OECOiZxuEzxMZcXmqrEO8GYraHF+UzNVH2ACYh8e/Y7YoT+hUf9ldvVd6zIvWv4p3NdxbQ0xx3ku5BnSiA==
+  version "6.3.1"
+  resolved "https://registry.yarnpkg.com/@octokit/types/-/types-6.3.1.tgz#18af2eee977dd8beba25003bf22dd7dcca5a9bdb"
+  integrity sha512-SyOaprLWVPS6QhbZY8hF9Oydx/UUnslKq1NyNUr4CN42UEPC3+9AvrYrDm4UvaU1D5u/vVMuSZOicFqOielRXQ==
   dependencies:
-    "@octokit/openapi-types" "^2.2.0"
+    "@octokit/openapi-types" "^2.3.0"
     "@types/node" ">= 8"
 
 "@opencensus/core@0.0.9":
@@ -2515,6 +2516,11 @@
     estree-walker "^1.0.1"
     picomatch "^2.2.2"
 
+"@scarf/scarf@^1.1.0":
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/@scarf/scarf/-/scarf-1.1.0.tgz#b84b4a91cd938a688d36245b7a7db6fbc476a499"
+  integrity sha512-b2iE8kjjzzUo2WZ0xuE2N77kfnTds7ClrDxcz3Atz7h2XrNVoAPUoT75i7CY0st5x++70V91Y+c6RpBX9MX7Jg==
+
 "@simbathesailor/use-what-changed@0.1.25":
   version "0.1.25"
   resolved "https://registry.yarnpkg.com/@simbathesailor/use-what-changed/-/use-what-changed-0.1.25.tgz#adf9373fb8d71dd8ab41c7cd789d8dd1fd80a058"
@@ -2531,9 +2537,9 @@
   integrity sha512-FyD2meJpDPjyNQejSjvnhpgI/azsQkA4lGbuu5BQZfjvJ9cbRZXzeWL2HceCekW4lixO9JPesIIQkSoLjeJHNQ==
 
 "@sinonjs/commons@^1.7.0":
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-1.8.1.tgz#e7df00f98a203324f6dc7cc606cad9d4a8ab2217"
-  integrity sha512-892K+kWUUi3cl+LlqEWIDrhvLgdL79tECi8JZUyq6IviKy/DNhuzCRlbHUjxK89f4ypPMMaFnFuR9Ie6DoIMsw==
+  version "1.8.2"
+  resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-1.8.2.tgz#858f5c4b48d80778fde4b9d541f27edc0d56488b"
+  integrity sha512-sruwd86RJHdsVf/AtBoijDmUqJp3B6hF/DGC23C+JaegnDHaZyewCjoVGTdg3J0uz3Zs7NnIT05OBOmML72lQw==
   dependencies:
     type-detect "4.0.8"
 
@@ -2561,19 +2567,19 @@
     react-app-polyfill "^1.0.6"
 
 "@snowpack/plugin-babel@^2.1.4":
-  version "2.1.5"
-  resolved "https://registry.yarnpkg.com/@snowpack/plugin-babel/-/plugin-babel-2.1.5.tgz#ecf84d227d9b471f2e6b122c375a47647a4f6785"
-  integrity sha512-mG1jPixFhcek0tR7RO3qO0/US8vy+nNa4woTnTtmVPPnE14A7A4PjQ8NSed0y5m6kZUDCIrxoJCs18hrRVYQIQ==
+  version "2.1.6"
+  resolved "https://registry.yarnpkg.com/@snowpack/plugin-babel/-/plugin-babel-2.1.6.tgz#f0fd7564152b3ed22c4c4fe8dd9bada00e546204"
+  integrity sha512-UB5KNQDQ0vnPUSGJ1xscILuuT8eyDK46VCAuImDITYbCy5mf812qwhrvNjbZmGIfnkDmTS2RKopP2cbouDzzSw==
   dependencies:
     "@babel/core" "^7.10.5"
     workerpool "^6.0.0"
 
 "@snowpack/plugin-build-script@^2.0.12":
-  version "2.0.12"
-  resolved "https://registry.yarnpkg.com/@snowpack/plugin-build-script/-/plugin-build-script-2.0.12.tgz#bbb59fedbaae40eed1e3c20f6050659911577897"
-  integrity sha512-v4Kcmu8x0C5iqPbI8w1vMyT6ZVVeh/Z4LTFeTJx+nLm5VKdQJsLyLarI2YhOuQEGB/RZeR4PxvAJBZn1xcH6Bw==
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/@snowpack/plugin-build-script/-/plugin-build-script-2.1.0.tgz#d2733ad09c6ce31f88cff9f7a6fd7cfdf6559db1"
+  integrity sha512-rNuNxI5fM4QieNSOlwhZVD+0iA0nhEAS8MgXStCeH3mr0lC8dVLSYRTt83bS4Q6pxF9zFFfY5z+CTq/JVz8aUw==
   dependencies:
-    execa "^4.0.3"
+    execa "^5.0.0"
     npm-run-path "^4.0.1"
 
 "@snowpack/plugin-dotenv@2.0.5", "@snowpack/plugin-dotenv@^2.0.4":
@@ -2601,28 +2607,28 @@
     p-queue "^6.6.1"
 
 "@snowpack/plugin-react-refresh@^2.3.5":
-  version "2.3.9"
-  resolved "https://registry.yarnpkg.com/@snowpack/plugin-react-refresh/-/plugin-react-refresh-2.3.9.tgz#b118665504fb7f2622cc5a85e7ae46d4999725e0"
-  integrity sha512-QBsK1SQPmwxD3BKuLfbOa2oYKJKyRtBaL4CmkB+XNINia+TUKD8+m9cjbvO0QBRHDNhr6++9M5LDg41Jzm74tw==
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/@snowpack/plugin-react-refresh/-/plugin-react-refresh-2.4.0.tgz#a91ae1285621763438d759a75a04b0a7bf26fc23"
+  integrity sha512-qz2BzdWa5DPK7teTRrh8/SY81mWt//NZmRUUzrQZS2I9d9St8GfSAbFgeJunpBCpPXW9QaaI7huNaoTx/+1/Ag==
   dependencies:
     "@babel/core" "^7.0.0"
     "@babel/plugin-syntax-class-properties" "^7.10.0"
     react-refresh "^0.9.0"
 
-"@snowpack/plugin-run-script@2.2.1", "@snowpack/plugin-run-script@^2.2.1":
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/@snowpack/plugin-run-script/-/plugin-run-script-2.2.1.tgz#8a564f84c65c1136b9b898ef5a89552cf473a638"
-  integrity sha512-TuYOtcTrJJnm7oMtAQCZN8/GEXI6Tumtk3MEKNhka/id9LrHdUvaYZ9+yxj/n4hep9/kJ0Y7SlweL32L5Zy0Ow==
+"@snowpack/plugin-run-script@2.3.0", "@snowpack/plugin-run-script@^2.2.1":
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/@snowpack/plugin-run-script/-/plugin-run-script-2.3.0.tgz#3775778aca61342e6df47b4198676fafb5cf8c07"
+  integrity sha512-rIbD67uzTPkzemMFbw5seUm/hZFrToTSqN/SGGq5XaU45ftX2sCRzp0lqSH+lZYhC5QTSm5RxXW1HcuPOlbPXQ==
   dependencies:
-    execa "^4.0.3"
+    execa "^5.0.0"
     npm-run-path "^4.0.1"
 
 "@snowpack/plugin-typescript@^1.1.0":
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/@snowpack/plugin-typescript/-/plugin-typescript-1.1.1.tgz#50b982faa962e33fb07a512ed4cbc16bef67df77"
-  integrity sha512-qKEPSTI1Q5r8AAklF6Hpt4xKchkIy1EBWbdTi4v3uA2t/eqlpiZXhJyXTEIfOiPE01nQFIUIcgBeufuNMHVXNw==
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/@snowpack/plugin-typescript/-/plugin-typescript-1.2.1.tgz#7170b039d16d41963cc61a714fe7c37f3fdd9d51"
+  integrity sha512-wU+JNaMVkqGsqTaUY7TnEMhGt/3URTgA9dpMCtZX6wn/ceA7Gwlmue/sOLynf0OTNLygHPvjiQECQYkEi3LTtg==
   dependencies:
-    execa "^4.0.3"
+    execa "^5.0.0"
     npm-run-path "^4.0.1"
 
 "@svgr/babel-plugin-add-jsx-attribute@^5.4.0":
@@ -2720,9 +2726,9 @@
     defer-to-connect "^2.0.0"
 
 "@testing-library/dom@^7.28.1":
-  version "7.29.2"
-  resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.29.2.tgz#6cba65d961d8b36d621a98caa8537444075fb42e"
-  integrity sha512-CBMELfyY1jKdtLcSRmEnZWRzRkCRVSNPTzhzrn8wY8OnzUo7Pe/W+HgLzt4TDnWIPYeusHBodf9wUjJF48kPmA==
+  version "7.29.4"
+  resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.29.4.tgz#1647c2b478789621ead7a50614ad81ab5ae5b86c"
+  integrity sha512-CtrJRiSYEfbtNGtEsd78mk1n1v2TUbeABlNIcOCJdDfkN5/JTOwQEbbQpoSRxGqzcWPgStMvJ4mNolSuBRv1NA==
   dependencies:
     "@babel/code-frame" "^7.10.4"
     "@babel/runtime" "^7.12.5"
@@ -2733,10 +2739,10 @@
     lz-string "^1.4.4"
     pretty-format "^26.6.2"
 
-"@testing-library/jest-dom@5.11.8":
-  version "5.11.8"
-  resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-5.11.8.tgz#433a84d6f9a089485101b9e112ef03e5c30bcbfc"
-  integrity sha512-ScyKrWQM5xNcr79PkSewnA79CLaoxVskE+f7knTOhDD9ftZSA1Jw8mj+pneqhEu3x37ncNfW84NUr7lqK+mXjA==
+"@testing-library/jest-dom@5.11.9":
+  version "5.11.9"
+  resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-5.11.9.tgz#e6b3cd687021f89f261bd53cbe367041fbd3e975"
+  integrity sha512-Mn2gnA9d1wStlAIT2NU8J15LNob0YFBVjs2aEQ3j8rsfRQo+lAs7/ui1i2TGaJjapLmuNPLTsrm+nPjmZDwpcQ==
   dependencies:
     "@babel/runtime" "^7.9.2"
     "@types/testing-library__jest-dom" "^5.9.1"
@@ -2747,10 +2753,10 @@
     lodash "^4.17.15"
     redent "^3.0.0"
 
-"@testing-library/react@11.2.2":
-  version "11.2.2"
-  resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-11.2.2.tgz#099c6c195140ff069211143cb31c0f8337bdb7b7"
-  integrity sha512-jaxm0hwUjv+hzC+UFEywic7buDC9JQ1q3cDsrWVSDAPmLotfA6E6kUHlYm/zOeGCac6g48DR36tFHxl7Zb+N5A==
+"@testing-library/react@11.2.3":
+  version "11.2.3"
+  resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-11.2.3.tgz#9971ede1c8465a231d7982eeca3c39fc362d5443"
+  integrity sha512-BirBUGPkTW28ULuCwIbYo0y2+0aavHczBT6N9r3LrsswEW3pg25l1wgoE7I8QBIy1upXWkwKpYdWY7NYYP0Bxw==
   dependencies:
     "@babel/runtime" "^7.12.5"
     "@testing-library/dom" "^7.28.1"
@@ -2768,9 +2774,9 @@
   integrity sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==
 
 "@types/aria-query@^4.2.0":
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-4.2.0.tgz#14264692a9d6e2fa4db3df5e56e94b5e25647ac0"
-  integrity sha512-iIgQNzCm0v7QMhhe4Jjn9uRh+I6GoPmt03CbEtwx3ao8/EfoQcmgtqH4vQ5Db/lxiIGaWDv6nwvunuh0RyX0+A==
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-4.2.1.tgz#78b5433344e2f92e8b306c06a5622c50c245bf6b"
+  integrity sha512-S6oPal772qJZHoRZLFc/XoZW2gFvwXusYUmXPXkgxJLuEk2vOt7jc4Yo6z/vtI0EBkbPBVrJJ0B+prLIKiWqHg==
 
 "@types/babel__core@^7.0.0", "@types/babel__core@^7.1.7":
   version "7.1.12"
@@ -2892,9 +2898,9 @@
     "@types/d3-selection" "*"
 
 "@types/d3-dsv@*":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@types/d3-dsv/-/d3-dsv-2.0.0.tgz#c9fb8b2f0f7168d21a6bbd29492141bfd1b8db16"
-  integrity sha512-wYqy7T8tQ/DmocwxmlPujllLI5fg3lb6/FrVVWkLUD+NsRV+kcE4nbRZg10G9yjJ8pK2ZXqu+VP5jQbN13uNRQ==
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@types/d3-dsv/-/d3-dsv-2.0.1.tgz#44ce09b025cf365d27cbe11fc13cd10954369627"
+  integrity sha512-wovgiG9Mgkr/SZ/m/c0m+RwrIT4ozsuCWeLxJyoObDWsie2DeQT4wzMdHZPR9Ya5oZLQT3w3uSl0NehG0+0dCA==
 
 "@types/d3-ease@*":
   version "2.0.0"
@@ -3083,32 +3089,32 @@
     "@types/estree" "*"
     "@types/json-schema" "*"
 
-"@types/estree@*", "@types/estree@^0.0.45":
-  version "0.0.45"
-  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.45.tgz#e9387572998e5ecdac221950dab3e8c3b16af884"
-  integrity sha512-jnqIUKDUqJbDIUxm0Uj7bnlMnRm1T/eZ9N+AVMqhPgzrba2GhGG5o/jCTwmdPK709nEZsGoMzXEDUjcXHa3W0g==
+"@types/estree@*", "@types/estree@^0.0.46":
+  version "0.0.46"
+  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.46.tgz#0fb6bfbbeabd7a30880504993369c4bf1deab1fe"
+  integrity sha512-laIjwTQaD+5DukBZaygQ79K1Z0jb1bPEMRrkXSLjtCcZm+abyp5YbrqpSLzD42FwWW6gK/aS4NYpJ804nG2brg==
 
 "@types/estree@0.0.39":
   version "0.0.39"
   resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.39.tgz#e177e699ee1b8c22d23174caaa7422644389509f"
   integrity sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==
 
-"@types/express-serve-static-core@*":
-  version "4.17.17"
-  resolved "https://registry.yarnpkg.com/@types/express-serve-static-core/-/express-serve-static-core-4.17.17.tgz#6ba02465165b6c9c3d8db3a28def6b16fc9b70f5"
-  integrity sha512-YYlVaCni5dnHc+bLZfY908IG1+x5xuibKZMGv8srKkvtul3wUuanYvpIj9GXXoWkQbaAdR+kgX46IETKUALWNQ==
+"@types/express-serve-static-core@^4.17.18":
+  version "4.17.18"
+  resolved "https://registry.yarnpkg.com/@types/express-serve-static-core/-/express-serve-static-core-4.17.18.tgz#8371e260f40e0e1ca0c116a9afcd9426fa094c40"
+  integrity sha512-m4JTwx5RUBNZvky/JJ8swEJPKFd8si08pPF2PfizYjGZOKr/svUWPcoUmLow6MmPzhasphB7gSTINY67xn3JNA==
   dependencies:
     "@types/node" "*"
     "@types/qs" "*"
     "@types/range-parser" "*"
 
-"@types/express@4.17.9":
-  version "4.17.9"
-  resolved "https://registry.yarnpkg.com/@types/express/-/express-4.17.9.tgz#f5f2df6add703ff28428add52bdec8a1091b0a78"
-  integrity sha512-SDzEIZInC4sivGIFY4Sz1GG6J9UObPwCInYJjko2jzOf/Imx/dlpume6Xxwj1ORL82tBbmN4cPDIDkLbWHk9hw==
+"@types/express@4.17.11":
+  version "4.17.11"
+  resolved "https://registry.yarnpkg.com/@types/express/-/express-4.17.11.tgz#debe3caa6f8e5fcda96b47bd54e2f40c4ee59545"
+  integrity sha512-no+R6rW60JEc59977wIxreQVsIEOAYwgCqldrA/vkpCnbD7MqTefO97lmoBe4WE0F156bC4uLSP1XHDOySnChg==
   dependencies:
     "@types/body-parser" "*"
-    "@types/express-serve-static-core" "*"
+    "@types/express-serve-static-core" "^4.17.18"
     "@types/qs" "*"
     "@types/serve-static" "*"
 
@@ -3166,9 +3172,9 @@
   integrity sha512-c3Xy026kOF7QOTn00hbIllV1dLR9hG9NkSrLQgCVs8NF6sBU+VGWjD3wLPhmh1TYAc7ugCFsvHYMN4VcBN1U1A==
 
 "@types/http-proxy@^1.17.4":
-  version "1.17.4"
-  resolved "https://registry.yarnpkg.com/@types/http-proxy/-/http-proxy-1.17.4.tgz#e7c92e3dbe3e13aa799440ff42e6d3a17a9d045b"
-  integrity sha512-IrSHl2u6AWXduUaDLqYpt45tLVCtYv7o4Z0s1KghBCDgIIS9oW5K1H8mZG/A2CfeLdEa7rTd1ACOiHBc1EMT2Q==
+  version "1.17.5"
+  resolved "https://registry.yarnpkg.com/@types/http-proxy/-/http-proxy-1.17.5.tgz#c203c5e6e9dc6820d27a40eb1e511c70a220423d"
+  integrity sha512-GNkDE7bTv6Sf8JbV2GksknKOsk7OznNYHSdrtvPJXO0qJ9odZig6IZKUi5RFGi6d1bf6dgIAe4uXi3DBc7069Q==
   dependencies:
     "@types/node" "*"
 
@@ -3218,10 +3224,10 @@
   dependencies:
     "@types/react" "*"
 
-"@types/lodash@4.14.167":
-  version "4.14.167"
-  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.167.tgz#ce7d78553e3c886d4ea643c37ec7edc20f16765e"
-  integrity sha512-w7tQPjARrvdeBkX/Rwg95S592JwxqOjmms3zWQ0XZgSyxSLdzWaYH3vErBhdVS/lRBX7F8aBYcYJYTr5TMGOzw==
+"@types/lodash@4.14.168":
+  version "4.14.168"
+  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.168.tgz#fe24632e79b7ade3f132891afff86caa5e5ce008"
+  integrity sha512-oVfRvqHV/V6D1yifJbVRU3TMp8OT6o6BG+U9MkwuJ3U8/CsDHvalRpsxBqivn71ztOFZBTfJMvETbqHiaNSj7Q==
 
 "@types/mime-types@2.1.0":
   version "2.1.0"
@@ -3250,18 +3256,23 @@
   dependencies:
     "@types/node" "*"
 
-"@types/node-fetch@2.5.7":
-  version "2.5.7"
-  resolved "https://registry.yarnpkg.com/@types/node-fetch/-/node-fetch-2.5.7.tgz#20a2afffa882ab04d44ca786449a276f9f6bbf3c"
-  integrity sha512-o2WVNf5UhWRkxlf6eq+jMZDu7kjgpgJfl4xVNlvryc95O/6F2ld8ztKX+qu+Rjyet93WAWm5LjeX9H5FGkODvw==
+"@types/node-fetch@2.5.8":
+  version "2.5.8"
+  resolved "https://registry.yarnpkg.com/@types/node-fetch/-/node-fetch-2.5.8.tgz#e199c835d234c7eb0846f6618012e558544ee2fb"
+  integrity sha512-fbjI6ja0N5ZA8TV53RUqzsKNkl9fv8Oj3T7zxW7FGv1GSH7gwJaNF8dzCjrqKaxKeUpTz4yT1DaJFq/omNpGfw==
   dependencies:
     "@types/node" "*"
     form-data "^3.0.0"
 
-"@types/node@*", "@types/node@14.14.20", "@types/node@>= 8":
-  version "14.14.20"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-14.14.20.tgz#f7974863edd21d1f8a494a73e8e2b3658615c340"
-  integrity sha512-Y93R97Ouif9JEOWPIUyU+eyIdyRqQR0I8Ez1dzku4hDx34NWh4HbtIc3WNzwB1Y9ULvNGeu5B8h8bVL5cAk4/A==
+"@types/node@*", "@types/node@>= 8":
+  version "14.14.21"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-14.14.21.tgz#d934aacc22424fe9622ebf6857370c052eae464e"
+  integrity sha512-cHYfKsnwllYhjOzuC5q1VpguABBeecUp24yFluHpn/BQaVxB1CuQ1FSRZCzrPxrkIfWISXV2LbeoBthLWg0+0A==
+
+"@types/node@14.14.22":
+  version "14.14.22"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-14.14.22.tgz#0d29f382472c4ccf3bd96ff0ce47daf5b7b84b18"
+  integrity sha512-g+f/qj/cNcqKkc3tFqlXOYjrmZA+jNBiDzbP3kH+B+otKFqAdPgVTGP1IeKRdMml/aE69as5S4FqtxAbl+LaMw==
 
 "@types/normalize-package-data@^2.4.0":
   version "2.4.0"
@@ -3324,10 +3335,10 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react-redux@7.1.15":
-  version "7.1.15"
-  resolved "https://registry.yarnpkg.com/@types/react-redux/-/react-redux-7.1.15.tgz#19075884db94101be762accef924d266a603fb1b"
-  integrity sha512-+piY42tUflPfI7y9Vy3UkG6MEMuJlrxfdtgeUcWmd5Z0qB57NXAPG6smkqu1DNXluo/KDyXPeRYhcFzMwt1BEA==
+"@types/react-redux@7.1.16":
+  version "7.1.16"
+  resolved "https://registry.yarnpkg.com/@types/react-redux/-/react-redux-7.1.16.tgz#0fbd04c2500c12105494c83d4a3e45c084e3cb21"
+  integrity sha512-f/FKzIrZwZk7YEO9E1yoxIuDNRiDducxkFlkw/GNMGEnK9n4K8wJzlJBghpSuOVDgEUHoDkDF7Gi9lHNQR4siw==
   dependencies:
     "@types/hoist-non-react-statics" "^3.3.0"
     "@types/react" "*"
@@ -3344,9 +3355,9 @@
     "@types/react-router" "*"
 
 "@types/react-router@*":
-  version "5.1.10"
-  resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-5.1.10.tgz#7de7ad3df20a8adb2b97943f1871ca4d2705c42c"
-  integrity sha512-yu11Hu16CfGvvBWc7wluRlxbwfuSlY0snEntbbOTvfgMvyO6uLaEpAbnVOntr+9TNIpR++OOlPkmDcJPxOXRaQ==
+  version "5.1.11"
+  resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-5.1.11.tgz#b01ce4cb21bf7d6b32edc862fc1e2c0088044b5b"
+  integrity sha512-ofHbZMlp0Y2baOHgsWBQ4K3AttxY61bDMkwTiBOkPg7U6C/3UwwB5WaIx28JmSVi/eX3uFEMRo61BV22fDQIvg==
   dependencies:
     "@types/history" "*"
     "@types/react" "*"
@@ -3452,9 +3463,9 @@
     source-map "^0.7.3"
 
 "@types/webpack@^4.41.8":
-  version "4.41.25"
-  resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.41.25.tgz#4d3b5aecc4e44117b376280fbfd2dc36697968c4"
-  integrity sha512-cr6kZ+4m9lp86ytQc1jPOJXgINQyz3kLLunZ57jznW+WIAL0JqZbGubQk4GlD42MuQL5JGOABrxdpqqWeovlVQ==
+  version "4.41.26"
+  resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.41.26.tgz#27a30d7d531e16489f9c7607c747be6bc1a459ef"
+  integrity sha512-7ZyTfxjCRwexh+EJFwRUM+CDB2XvgHl4vfuqf1ZKrgGvcS5BrNvPQqJh3tsZ0P6h6Aa1qClVHaJZszLPzpqHeA==
   dependencies:
     "@types/anymatch" "*"
     "@types/node" "*"
@@ -3480,61 +3491,62 @@
   resolved "https://registry.yarnpkg.com/@types/zrender/-/zrender-4.0.0.tgz#a6806f12ec4eccaaebd9b0d816f049aca6188fbd"
   integrity sha512-s89GOIeKFiod2KSqHkfd2rzx+T2DVu7ihZCBEBnhFrzvQPUmzvDSBot9Fi1DfMQm9Odg+rTqoMGC38RvrwJK2w==
 
-"@typescript-eslint/eslint-plugin@4.12.0":
-  version "4.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-4.12.0.tgz#00d1b23b40b58031e6d7c04a5bc6c1a30a2e834a"
-  integrity sha512-wHKj6q8s70sO5i39H2g1gtpCXCvjVszzj6FFygneNFyIAxRvNSVz9GML7XpqrB9t7hNutXw+MHnLN/Ih6uyB8Q==
+"@typescript-eslint/eslint-plugin@4.14.0":
+  version "4.14.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-4.14.0.tgz#92db8e7c357ed7d69632d6843ca70b71be3a721d"
+  integrity sha512-IJ5e2W7uFNfg4qh9eHkHRUCbgZ8VKtGwD07kannJvM5t/GU8P8+24NX8gi3Hf5jST5oWPY8kyV1s/WtfiZ4+Ww==
   dependencies:
-    "@typescript-eslint/experimental-utils" "4.12.0"
-    "@typescript-eslint/scope-manager" "4.12.0"
+    "@typescript-eslint/experimental-utils" "4.14.0"
+    "@typescript-eslint/scope-manager" "4.14.0"
     debug "^4.1.1"
     functional-red-black-tree "^1.0.1"
+    lodash "^4.17.15"
     regexpp "^3.0.0"
     semver "^7.3.2"
     tsutils "^3.17.1"
 
-"@typescript-eslint/experimental-utils@4.12.0":
-  version "4.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-4.12.0.tgz#372838e76db76c9a56959217b768a19f7129546b"
-  integrity sha512-MpXZXUAvHt99c9ScXijx7i061o5HEjXltO+sbYfZAAHxv3XankQkPaNi5myy0Yh0Tyea3Hdq1pi7Vsh0GJb0fA==
+"@typescript-eslint/experimental-utils@4.14.0":
+  version "4.14.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-4.14.0.tgz#5aa7b006736634f588a69ee343ca959cd09988df"
+  integrity sha512-6i6eAoiPlXMKRbXzvoQD5Yn9L7k9ezzGRvzC/x1V3650rUk3c3AOjQyGYyF9BDxQQDK2ElmKOZRD0CbtdkMzQQ==
   dependencies:
     "@types/json-schema" "^7.0.3"
-    "@typescript-eslint/scope-manager" "4.12.0"
-    "@typescript-eslint/types" "4.12.0"
-    "@typescript-eslint/typescript-estree" "4.12.0"
+    "@typescript-eslint/scope-manager" "4.14.0"
+    "@typescript-eslint/types" "4.14.0"
+    "@typescript-eslint/typescript-estree" "4.14.0"
     eslint-scope "^5.0.0"
     eslint-utils "^2.0.0"
 
-"@typescript-eslint/parser@4.12.0":
-  version "4.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-4.12.0.tgz#e1cf30436e4f916c31fcc962158917bd9e9d460a"
-  integrity sha512-9XxVADAo9vlfjfoxnjboBTxYOiNY93/QuvcPgsiKvHxW6tOZx1W4TvkIQ2jB3k5M0pbFP5FlXihLK49TjZXhuQ==
+"@typescript-eslint/parser@4.14.0":
+  version "4.14.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-4.14.0.tgz#62d4cd2079d5c06683e9bfb200c758f292c4dee7"
+  integrity sha512-sUDeuCjBU+ZF3Lzw0hphTyScmDDJ5QVkyE21pRoBo8iDl7WBtVFS+WDN3blY1CH3SBt7EmYCw6wfmJjF0l/uYg==
   dependencies:
-    "@typescript-eslint/scope-manager" "4.12.0"
-    "@typescript-eslint/types" "4.12.0"
-    "@typescript-eslint/typescript-estree" "4.12.0"
+    "@typescript-eslint/scope-manager" "4.14.0"
+    "@typescript-eslint/types" "4.14.0"
+    "@typescript-eslint/typescript-estree" "4.14.0"
     debug "^4.1.1"
 
-"@typescript-eslint/scope-manager@4.12.0":
-  version "4.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-4.12.0.tgz#beeb8beca895a07b10c593185a5612f1085ef279"
-  integrity sha512-QVf9oCSVLte/8jvOsxmgBdOaoe2J0wtEmBr13Yz0rkBNkl5D8bfnf6G4Vhox9qqMIoG7QQoVwd2eG9DM/ge4Qg==
+"@typescript-eslint/scope-manager@4.14.0":
+  version "4.14.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-4.14.0.tgz#55a4743095d684e1f7b7180c4bac2a0a3727f517"
+  integrity sha512-/J+LlRMdbPh4RdL4hfP1eCwHN5bAhFAGOTsvE6SxsrM/47XQiPSgF5MDgLyp/i9kbZV9Lx80DW0OpPkzL+uf8Q==
   dependencies:
-    "@typescript-eslint/types" "4.12.0"
-    "@typescript-eslint/visitor-keys" "4.12.0"
+    "@typescript-eslint/types" "4.14.0"
+    "@typescript-eslint/visitor-keys" "4.14.0"
 
-"@typescript-eslint/types@4.12.0":
-  version "4.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-4.12.0.tgz#fb891fe7ccc9ea8b2bbd2780e36da45d0dc055e5"
-  integrity sha512-N2RhGeheVLGtyy+CxRmxdsniB7sMSCfsnbh8K/+RUIXYYq3Ub5+sukRCjVE80QerrUBvuEvs4fDhz5AW/pcL6g==
+"@typescript-eslint/types@4.14.0":
+  version "4.14.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-4.14.0.tgz#d8a8202d9b58831d6fd9cee2ba12f8a5a5dd44b6"
+  integrity sha512-VsQE4VvpldHrTFuVPY1ZnHn/Txw6cZGjL48e+iBxTi2ksa9DmebKjAeFmTVAYoSkTk7gjA7UqJ7pIsyifTsI4A==
 
-"@typescript-eslint/typescript-estree@4.12.0":
-  version "4.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-4.12.0.tgz#3963418c850f564bdab3882ae23795d115d6d32e"
-  integrity sha512-gZkFcmmp/CnzqD2RKMich2/FjBTsYopjiwJCroxqHZIY11IIoN0l5lKqcgoAPKHt33H2mAkSfvzj8i44Jm7F4w==
+"@typescript-eslint/typescript-estree@4.14.0":
+  version "4.14.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-4.14.0.tgz#4bcd67486e9acafc3d0c982b23a9ab8ac8911ed7"
+  integrity sha512-wRjZ5qLao+bvS2F7pX4qi2oLcOONIB+ru8RGBieDptq/SudYwshveORwCVU4/yMAd4GK7Fsf8Uq1tjV838erag==
   dependencies:
-    "@typescript-eslint/types" "4.12.0"
-    "@typescript-eslint/visitor-keys" "4.12.0"
+    "@typescript-eslint/types" "4.14.0"
+    "@typescript-eslint/visitor-keys" "4.14.0"
     debug "^4.1.1"
     globby "^11.0.1"
     is-glob "^4.0.1"
@@ -3542,159 +3554,140 @@
     semver "^7.3.2"
     tsutils "^3.17.1"
 
-"@typescript-eslint/visitor-keys@4.12.0":
-  version "4.12.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-4.12.0.tgz#a470a79be6958075fa91c725371a83baf428a67a"
-  integrity sha512-hVpsLARbDh4B9TKYz5cLbcdMIOAoBYgFPCSP9FFS/liSF+b33gVNq8JHY3QGhHNVz85hObvL7BEYLlgx553WCw==
+"@typescript-eslint/visitor-keys@4.14.0":
+  version "4.14.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-4.14.0.tgz#b1090d9d2955b044b2ea2904a22496849acbdf54"
+  integrity sha512-MeHHzUyRI50DuiPgV9+LxcM52FCJFYjJiWHtXlbyC27b80mfOwKeiKI+MHOTEpcpfmoPFm/vvQS88bYIx6PZTA==
   dependencies:
-    "@typescript-eslint/types" "4.12.0"
+    "@typescript-eslint/types" "4.14.0"
     eslint-visitor-keys "^2.0.0"
 
-"@webassemblyjs/ast@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.9.1.tgz#76c6937716d68bf1484c15139f5ed30b9abc8bb4"
-  integrity sha512-uMu1nCWn2Wxyy126LlGqRVlhdTOsO/bsBRI4dNq3+6SiSuRKRQX6ejjKgh82LoGAPSq72lDUiQ4FWVaf0PecYw==
+"@webassemblyjs/ast@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/ast/-/ast-1.11.0.tgz#a5aa679efdc9e51707a4207139da57920555961f"
+  integrity sha512-kX2W49LWsbthrmIRMbQZuQDhGtjyqXfEmmHyEi4XWnSZtPmxY0+3anPIzsnRb45VH/J55zlOfWvZuY47aJZTJg==
   dependencies:
-    "@webassemblyjs/helper-module-context" "1.9.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.9.1"
-    "@webassemblyjs/wast-parser" "1.9.1"
-
-"@webassemblyjs/floating-point-hex-parser@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.9.1.tgz#9eb0ff90a1cdeef51f36ba533ed9f06b5cdadd09"
-  integrity sha512-5VEKu024RySmLKTTBl9q1eO/2K5jk9ZS+2HXDBLA9s9p5IjkaXxWiDb/+b7wSQp6FRdLaH1IVGIfOex58Na2pg==
+    "@webassemblyjs/helper-numbers" "1.11.0"
+    "@webassemblyjs/helper-wasm-bytecode" "1.11.0"
 
-"@webassemblyjs/helper-api-error@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.9.1.tgz#ad89015c4246cd7f5ed0556700237f8b9c2c752f"
-  integrity sha512-y1lGmfm38djrScwpeL37rRR9f1D6sM8RhMpvM7CYLzOlHVboouZokXK/G88BpzW0NQBSvCCOnW5BFhten4FPfA==
-
-"@webassemblyjs/helper-buffer@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.9.1.tgz#186e67ac25f9546ea7939759413987f157524133"
-  integrity sha512-uS6VSgieHbk/m4GSkMU5cqe/5TekdCzQso4revCIEQ3vpGZgqSSExi4jWpTWwDpAHOIAb1Jfrs0gUB9AA4n71w==
+"@webassemblyjs/floating-point-hex-parser@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/floating-point-hex-parser/-/floating-point-hex-parser-1.11.0.tgz#34d62052f453cd43101d72eab4966a022587947c"
+  integrity sha512-Q/aVYs/VnPDVYvsCBL/gSgwmfjeCb4LW8+TMrO3cSzJImgv8lxxEPM2JA5jMrivE7LSz3V+PFqtMbls3m1exDA==
 
-"@webassemblyjs/helper-code-frame@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-code-frame/-/helper-code-frame-1.9.1.tgz#aab177b7cc87a318a8f8664ad68e2c3828ebc42b"
-  integrity sha512-ZQ2ZT6Evk4DPIfD+92AraGYaFIqGm4U20e7FpXwl7WUo2Pn1mZ1v8VGH8i+Y++IQpxPbQo/UyG0Khs7eInskzA==
-  dependencies:
-    "@webassemblyjs/wast-printer" "1.9.1"
+"@webassemblyjs/helper-api-error@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-api-error/-/helper-api-error-1.11.0.tgz#aaea8fb3b923f4aaa9b512ff541b013ffb68d2d4"
+  integrity sha512-baT/va95eXiXb2QflSx95QGT5ClzWpGaa8L7JnJbgzoYeaA27FCvuBXU758l+KXWRndEmUXjP0Q5fibhavIn8w==
 
-"@webassemblyjs/helper-fsm@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-fsm/-/helper-fsm-1.9.1.tgz#527e91628e84d13d3573884b3dc4c53a81dcb911"
-  integrity sha512-J32HGpveEqqcKFS0YbgicB0zAlpfIxJa5MjxDxhu3i5ltPcVfY5EPvKQ1suRguFPehxiUs+/hfkwPEXom/l0lw==
+"@webassemblyjs/helper-buffer@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-buffer/-/helper-buffer-1.11.0.tgz#d026c25d175e388a7dbda9694e91e743cbe9b642"
+  integrity sha512-u9HPBEl4DS+vA8qLQdEQ6N/eJQ7gT7aNvMIo8AAWvAl/xMrcOSiI2M0MAnMCy3jIFke7bEee/JwdX1nUpCtdyA==
 
-"@webassemblyjs/helper-module-context@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-module-context/-/helper-module-context-1.9.1.tgz#778670b3d471f7cf093d1e7c0dde431b54310e16"
-  integrity sha512-IEH2cMmEQKt7fqelLWB5e/cMdZXf2rST1JIrzWmf4XBt3QTxGdnnLvV4DYoN8pJjOx0VYXsWg+yF16MmJtolZg==
+"@webassemblyjs/helper-numbers@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-numbers/-/helper-numbers-1.11.0.tgz#7ab04172d54e312cc6ea4286d7d9fa27c88cd4f9"
+  integrity sha512-DhRQKelIj01s5IgdsOJMKLppI+4zpmcMQ3XboFPLwCpSNH6Hqo1ritgHgD0nqHeSYqofA6aBN/NmXuGjM1jEfQ==
   dependencies:
-    "@webassemblyjs/ast" "1.9.1"
+    "@webassemblyjs/floating-point-hex-parser" "1.11.0"
+    "@webassemblyjs/helper-api-error" "1.11.0"
+    "@xtuc/long" "4.2.2"
 
-"@webassemblyjs/helper-wasm-bytecode@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.9.1.tgz#563f59bcf409ccf469edde168b9426961ffbf6df"
-  integrity sha512-i2rGTBqFUcSXxyjt2K4vm/3kkHwyzG6o427iCjcIKjOqpWH8SEem+xe82jUk1iydJO250/CvE5o7hzNAMZf0dQ==
+"@webassemblyjs/helper-wasm-bytecode@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-bytecode/-/helper-wasm-bytecode-1.11.0.tgz#85fdcda4129902fe86f81abf7e7236953ec5a4e1"
+  integrity sha512-MbmhvxXExm542tWREgSFnOVo07fDpsBJg3sIl6fSp9xuu75eGz5lz31q7wTLffwL3Za7XNRCMZy210+tnsUSEA==
 
-"@webassemblyjs/helper-wasm-section@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.9.1.tgz#f7988f94c12b01b99a16120cb01dc099b00e4798"
-  integrity sha512-FetqzjtXZr2d57IECK+aId3D0IcGweeM0CbAnJHkYJkcRTHP+YcMb7Wmc0j21h5UWBpwYGb9dSkK/93SRCTrGg==
+"@webassemblyjs/helper-wasm-section@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.11.0.tgz#9ce2cc89300262509c801b4af113d1ca25c1a75b"
+  integrity sha512-3Eb88hcbfY/FCukrg6i3EH8H2UsD7x8Vy47iVJrP967A9JGqgBVL9aH71SETPx1JrGsOUVLo0c7vMCN22ytJew==
   dependencies:
-    "@webassemblyjs/ast" "1.9.1"
-    "@webassemblyjs/helper-buffer" "1.9.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.9.1"
-    "@webassemblyjs/wasm-gen" "1.9.1"
+    "@webassemblyjs/ast" "1.11.0"
+    "@webassemblyjs/helper-buffer" "1.11.0"
+    "@webassemblyjs/helper-wasm-bytecode" "1.11.0"
+    "@webassemblyjs/wasm-gen" "1.11.0"
 
-"@webassemblyjs/ieee754@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.9.1.tgz#3b715871ca7d75784717cf9ceca9d7b81374b8af"
-  integrity sha512-EvTG9M78zP1MmkBpUjGQHZc26DzPGZSLIPxYHCjQsBMo60Qy2W34qf8z0exRDtxBbRIoiKa5dFyWer/7r1aaSQ==
+"@webassemblyjs/ieee754@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/ieee754/-/ieee754-1.11.0.tgz#46975d583f9828f5d094ac210e219441c4e6f5cf"
+  integrity sha512-KXzOqpcYQwAfeQ6WbF6HXo+0udBNmw0iXDmEK5sFlmQdmND+tr773Ti8/5T/M6Tl/413ArSJErATd8In3B+WBA==
   dependencies:
     "@xtuc/ieee754" "^1.2.0"
 
-"@webassemblyjs/leb128@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.9.1.tgz#b2ecaa39f9e8277cc9c707c1ca8b2aa7b27d0b72"
-  integrity sha512-Oc04ub0vFfLnF+2/+ki3AE+anmW4sv9uNBqb+79fgTaPv6xJsOT0dhphNfL3FrME84CbX/D1T9XT8tjFo0IIiw==
+"@webassemblyjs/leb128@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/leb128/-/leb128-1.11.0.tgz#f7353de1df38aa201cba9fb88b43f41f75ff403b"
+  integrity sha512-aqbsHa1mSQAbeeNcl38un6qVY++hh8OpCOzxhixSYgbRfNWcxJNJQwe2rezK9XEcssJbbWIkblaJRwGMS9zp+g==
   dependencies:
     "@xtuc/long" "4.2.2"
 
-"@webassemblyjs/utf8@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.9.1.tgz#d02d9daab85cda3211e43caf31dca74c260a73b0"
-  integrity sha512-llkYtppagjCodFjo0alWOUhAkfOiQPQDIc5oA6C9sFAXz7vC9QhZf/f8ijQIX+A9ToM3c9Pq85X0EX7nx9gVhg==
+"@webassemblyjs/utf8@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/utf8/-/utf8-1.11.0.tgz#86e48f959cf49e0e5091f069a709b862f5a2cadf"
+  integrity sha512-A/lclGxH6SpSLSyFowMzO/+aDEPU4hvEiooCMXQPcQFPPJaYcPQNKGOCLUySJsYJ4trbpr+Fs08n4jelkVTGVw==
 
-"@webassemblyjs/wasm-edit@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.9.1.tgz#e27a6bdbf78e5c72fa812a2fc3cbaad7c3e37578"
-  integrity sha512-S2IaD6+x9B2Xi8BCT0eGsrXXd8UxAh2LVJpg1ZMtHXnrDcsTtIX2bDjHi40Hio6Lc62dWHmKdvksI+MClCYbbw==
-  dependencies:
-    "@webassemblyjs/ast" "1.9.1"
-    "@webassemblyjs/helper-buffer" "1.9.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.9.1"
-    "@webassemblyjs/helper-wasm-section" "1.9.1"
-    "@webassemblyjs/wasm-gen" "1.9.1"
-    "@webassemblyjs/wasm-opt" "1.9.1"
-    "@webassemblyjs/wasm-parser" "1.9.1"
-    "@webassemblyjs/wast-printer" "1.9.1"
-
-"@webassemblyjs/wasm-gen@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.9.1.tgz#56a0787d1fa7994fdc7bea59004e5bec7189c5fc"
-  integrity sha512-bqWI0S4lBQsEN5FTZ35vYzfKUJvtjNnBobB1agCALH30xNk1LToZ7Z8eiaR/Z5iVECTlBndoRQV3F6mbEqE/fg==
+"@webassemblyjs/wasm-edit@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-edit/-/wasm-edit-1.11.0.tgz#ee4a5c9f677046a210542ae63897094c2027cb78"
+  integrity sha512-JHQ0damXy0G6J9ucyKVXO2j08JVJ2ntkdJlq1UTiUrIgfGMmA7Ik5VdC/L8hBK46kVJgujkBIoMtT8yVr+yVOQ==
+  dependencies:
+    "@webassemblyjs/ast" "1.11.0"
+    "@webassemblyjs/helper-buffer" "1.11.0"
+    "@webassemblyjs/helper-wasm-bytecode" "1.11.0"
+    "@webassemblyjs/helper-wasm-section" "1.11.0"
+    "@webassemblyjs/wasm-gen" "1.11.0"
+    "@webassemblyjs/wasm-opt" "1.11.0"
+    "@webassemblyjs/wasm-parser" "1.11.0"
+    "@webassemblyjs/wast-printer" "1.11.0"
+
+"@webassemblyjs/wasm-gen@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-gen/-/wasm-gen-1.11.0.tgz#3cdb35e70082d42a35166988dda64f24ceb97abe"
+  integrity sha512-BEUv1aj0WptCZ9kIS30th5ILASUnAPEvE3tVMTrItnZRT9tXCLW2LEXT8ezLw59rqPP9klh9LPmpU+WmRQmCPQ==
   dependencies:
-    "@webassemblyjs/ast" "1.9.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.9.1"
-    "@webassemblyjs/ieee754" "1.9.1"
-    "@webassemblyjs/leb128" "1.9.1"
-    "@webassemblyjs/utf8" "1.9.1"
+    "@webassemblyjs/ast" "1.11.0"
+    "@webassemblyjs/helper-wasm-bytecode" "1.11.0"
+    "@webassemblyjs/ieee754" "1.11.0"
+    "@webassemblyjs/leb128" "1.11.0"
+    "@webassemblyjs/utf8" "1.11.0"
 
-"@webassemblyjs/wasm-opt@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.9.1.tgz#fbdf8943a825e6dcc4cd69c3e092289fa4aec96c"
-  integrity sha512-gSf7I7YWVXZ5c6XqTEqkZjVs8K1kc1k57vsB6KBQscSagDNbAdxt6MwuJoMjsE1yWY1tsuL+pga268A6u+Fdkg==
+"@webassemblyjs/wasm-opt@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-opt/-/wasm-opt-1.11.0.tgz#1638ae188137f4bb031f568a413cd24d32f92978"
+  integrity sha512-tHUSP5F4ywyh3hZ0+fDQuWxKx3mJiPeFufg+9gwTpYp324mPCQgnuVKwzLTZVqj0duRDovnPaZqDwoyhIO8kYg==
   dependencies:
-    "@webassemblyjs/ast" "1.9.1"
-    "@webassemblyjs/helper-buffer" "1.9.1"
-    "@webassemblyjs/wasm-gen" "1.9.1"
-    "@webassemblyjs/wasm-parser" "1.9.1"
+    "@webassemblyjs/ast" "1.11.0"
+    "@webassemblyjs/helper-buffer" "1.11.0"
+    "@webassemblyjs/wasm-gen" "1.11.0"
+    "@webassemblyjs/wasm-parser" "1.11.0"
 
-"@webassemblyjs/wasm-parser@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.9.1.tgz#5e8352a246d3f605312c8e414f7990de55aaedfa"
-  integrity sha512-ImM4N2T1MEIond0MyE3rXvStVxEmivQrDKf/ggfh5pP6EHu3lL/YTAoSrR7shrbKNPpeKpGesW1LIK/L4kqduw==
+"@webassemblyjs/wasm-parser@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wasm-parser/-/wasm-parser-1.11.0.tgz#3e680b8830d5b13d1ec86cc42f38f3d4a7700754"
+  integrity sha512-6L285Sgu9gphrcpDXINvm0M9BskznnzJTE7gYkjDbxET28shDqp27wpruyx3C2S/dvEwiigBwLA1cz7lNUi0kw==
   dependencies:
-    "@webassemblyjs/ast" "1.9.1"
-    "@webassemblyjs/helper-api-error" "1.9.1"
-    "@webassemblyjs/helper-wasm-bytecode" "1.9.1"
-    "@webassemblyjs/ieee754" "1.9.1"
-    "@webassemblyjs/leb128" "1.9.1"
-    "@webassemblyjs/utf8" "1.9.1"
+    "@webassemblyjs/ast" "1.11.0"
+    "@webassemblyjs/helper-api-error" "1.11.0"
+    "@webassemblyjs/helper-wasm-bytecode" "1.11.0"
+    "@webassemblyjs/ieee754" "1.11.0"
+    "@webassemblyjs/leb128" "1.11.0"
+    "@webassemblyjs/utf8" "1.11.0"
 
-"@webassemblyjs/wast-parser@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-parser/-/wast-parser-1.9.1.tgz#e25ef13585c060073c1db0d6bd94340fdeee7596"
-  integrity sha512-2xVxejXSvj3ls/o2TR/zI6p28qsGupjHhnHL6URULQRcXmryn3w7G83jQMcT7PHqUfyle65fZtWLukfdLdE7qw==
-  dependencies:
-    "@webassemblyjs/ast" "1.9.1"
-    "@webassemblyjs/floating-point-hex-parser" "1.9.1"
-    "@webassemblyjs/helper-api-error" "1.9.1"
-    "@webassemblyjs/helper-code-frame" "1.9.1"
-    "@webassemblyjs/helper-fsm" "1.9.1"
-    "@xtuc/long" "4.2.2"
-
-"@webassemblyjs/wast-printer@1.9.1":
-  version "1.9.1"
-  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.9.1.tgz#b9f38e93652037d4f3f9c91584635af4191ed7c1"
-  integrity sha512-tDV8V15wm7mmbAH6XvQRU1X+oPGmeOzYsd6h7hlRLz6QpV4Ec/KKxM8OpLtFmQPLCreGxTp+HuxtH4pRIZyL9w==
+"@webassemblyjs/wast-printer@1.11.0":
+  version "1.11.0"
+  resolved "https://registry.yarnpkg.com/@webassemblyjs/wast-printer/-/wast-printer-1.11.0.tgz#680d1f6a5365d6d401974a8e949e05474e1fab7e"
+  integrity sha512-Fg5OX46pRdTgB7rKIUojkh9vXaVN6sGYCnEiJN1GYkb0RPwShZXp6KTDqmoMdQPKhcroOXh3fEzmkWmCYaKYhQ==
   dependencies:
-    "@webassemblyjs/ast" "1.9.1"
-    "@webassemblyjs/wast-parser" "1.9.1"
+    "@webassemblyjs/ast" "1.11.0"
     "@xtuc/long" "4.2.2"
 
+"@webpack-cli/configtest@^1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@webpack-cli/configtest/-/configtest-1.0.0.tgz#2aff5f1ebc6f793c13ba9b2a701d180eab17f5ee"
+  integrity sha512-Un0SdBoN1h4ACnIO7EiCjWuyhNI0Jl96JC+63q6xi4HDUYRZn8Auluea9D+v9NWKc5J4sICVEltdBaVjLX39xw==
+
 "@webpack-cli/info@^1.2.1":
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/@webpack-cli/info/-/info-1.2.1.tgz#af98311f983d0b9fce7284cfcf1acaf1e9f4879c"
@@ -3702,10 +3695,10 @@
   dependencies:
     envinfo "^7.7.3"
 
-"@webpack-cli/serve@^1.2.1":
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/@webpack-cli/serve/-/serve-1.2.1.tgz#7513d7a769e3f97958de799b5b49874425ae3396"
-  integrity sha512-Zj1z6AyS+vqV6Hfi7ngCjFGdHV5EwZNIHo6QfFTNe9PyW+zBU1zJ9BiOW1pmUEq950RC4+Dym6flyA/61/vhyw==
+"@webpack-cli/serve@^1.2.2":
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/@webpack-cli/serve/-/serve-1.2.2.tgz#1f8eee44f96524756268f5e3f43e9d943f864d41"
+  integrity sha512-03GkWxcgFfm8+WIwcsqJb9agrSDNDDoxaNnexPnCCexP5SCE4IgFd9lNpSy+K2nFqVMpgTFw6SwbmVAVTndVew==
 
 "@xtuc/ieee754@^1.2.0":
   version "1.2.0"
@@ -4153,13 +4146,13 @@ autobind-decorator@^1.3.4:
   resolved "https://registry.yarnpkg.com/autobind-decorator/-/autobind-decorator-1.4.3.tgz#4c96ffa77b10622ede24f110f5dbbf56691417d1"
   integrity sha1-TJb/p3sQYi7eJPEQ9du/VmkUF9E=
 
-autoprefixer@10.2.0:
-  version "10.2.0"
-  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-10.2.0.tgz#73c148882ff771b48df9e76eaad88565516eda0c"
-  integrity sha512-5SdPoK2Q3rxVh4xC8GKdy772KbEESdl2SyJADCw5FMUrd5eNtpOTLo7oCFMEKvK86zQdvsIVTYk93E8dAfRy6g==
+autoprefixer@10.2.3:
+  version "10.2.3"
+  resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-10.2.3.tgz#2834b55b75cfc10fa80c66000a66dc94b7136804"
+  integrity sha512-vlz+iv+EnLkVaTgX8wApfYzmK3LUfK8Z9XAnmflzxMy/+oFuNK8fVGQV79SOpBv4jxk2YQJimw4hXIKZ29570A==
   dependencies:
     browserslist "^4.16.1"
-    caniuse-lite "^1.0.30001173"
+    caniuse-lite "^1.0.30001178"
     colorette "^1.2.1"
     fraction.js "^4.0.13"
     normalize-range "^0.1.2"
@@ -4369,9 +4362,9 @@ bignumber.js@9.0.1:
   integrity sha512-IdZR9mh6ahOBv/hYGiXyVuyCetmGJhtYkqLBpTStdhEGjegpPlUawydyaF3pbIOFynJTpllEs+NP+CS9jKFLjA==
 
 binary-extensions@^2.0.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.1.0.tgz#30fa40c9e7fe07dbc895678cd287024dea241dd9"
-  integrity sha512-1Yj8h9Q+QDF5FzhMs/c9+6UntbD5MkRfRwac8DoEm9ZfUBZ7tZ55YcGVAzEe4bXsdQHEk+s9S5wsOKVdZrw0tQ==
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-2.2.0.tgz#75f502eeaf9ffde42fc98829645be4ea76bd9e2d"
+  integrity sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==
 
 binary-install@0.0.1:
   version "0.0.1"
@@ -4639,13 +4632,13 @@ cachedir@^2.3.0:
   resolved "https://registry.yarnpkg.com/cachedir/-/cachedir-2.3.0.tgz#0c75892a052198f0b21c7c1804d8331edfcae0e8"
   integrity sha512-A+Fezp4zxnit6FanDmv9EqXNAi3vt9DWp51/71UEhXukb7QUuvtv9344h91dyAxuTLoSYJFU299qzR3tzwPAhw==
 
-call-bind@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.0.tgz#24127054bb3f9bdcb4b1fb82418186072f77b8ce"
-  integrity sha512-AEXsYIyyDY3MCzbwdhzG3Jx1R0J2wetQyUynn6dYHAO+bg8l1k7jwZtRv4ryryFs7EP+NDlikJlVe59jr0cM2w==
+call-bind@^1.0.0, call-bind@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c"
+  integrity sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==
   dependencies:
     function-bind "^1.1.1"
-    get-intrinsic "^1.0.0"
+    get-intrinsic "^1.0.2"
 
 call-me-maybe@^1.0.1:
   version "1.0.1"
@@ -4744,9 +4737,14 @@ camelize@^1.0.0:
   integrity sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=
 
 caniuse-lite@^1.0.30001173:
-  version "1.0.30001173"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001173.tgz#3c47bbe3cd6d7a9eda7f50ac016d158005569f56"
-  integrity sha512-R3aqmjrICdGCTAnSXtNyvWYMK3YtV5jwudbq0T7nN9k4kmE4CBuwPqyJ+KBzepSTh0huivV2gLbSMEzTTmfeYw==
+  version "1.0.30001178"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001178.tgz#3ad813b2b2c7d585b0be0a2440e1e233c6eabdbc"
+  integrity sha512-VtdZLC0vsXykKni8Uztx45xynytOi71Ufx9T8kHptSw9AL4dpqailUJJHavttuzUe1KYuBYtChiWv+BAb7mPmQ==
+
+caniuse-lite@^1.0.30001178:
+  version "1.0.30001179"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001179.tgz#b0803883b4471a6c62066fb1752756f8afc699c8"
+  integrity sha512-blMmO0QQujuUWZKyVrD1msR4WNDAqb/UPO1Sw2WWsQ7deoM5bJiicKnWJ1Y0NS/aGINSnKPIWBMw5luX+NDUCA==
 
 capture-exit@^2.0.0:
   version "2.0.0"
@@ -4825,9 +4823,9 @@ cheerio@^1.0.0-rc.3:
     parse5-htmlparser2-tree-adapter "^6.0.0"
 
 "chokidar@>=2.0.0 <4.0.0", chokidar@^3.2.2, chokidar@^3.3.0, chokidar@^3.4.0:
-  version "3.5.0"
-  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.0.tgz#458a4816a415e9d3b3caa4faec2b96a6935a9e65"
-  integrity sha512-JgQM9JS92ZbFR4P90EvmzNpSGhpPBGBSj10PILeDyYFwp4h2/D9OM03wsJ4zW1fEp4ka2DGrnUeD7FuvQ2aZ2Q==
+  version "3.5.1"
+  resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.1.tgz#ee9ce7bbebd2b79f49f304799d5468e31e14e68a"
+  integrity sha512-9+s+Od+W0VJJzawDma/gvBNQqkTiqYTWLuZoyAsivsI4AaWTCzHG06/TMjsf1cYe9Cb97UCEhjz7HvnPk2p/tw==
   dependencies:
     anymatch "~3.1.1"
     braces "~3.0.2"
@@ -5565,9 +5563,9 @@ csstype@^2.5.7:
   integrity sha512-2mSc+VEpGPblzAxyeR+vZhJKgYg0Og0nnRi7pmRXFYYxSfnOnW8A5wwQb4n4cE2nIOzqKOAzLCaEX6aBmNEv8A==
 
 csstype@^3.0.2:
-  version "3.0.5"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.5.tgz#7fdec6a28a67ae18647c51668a9ff95bb2fa7bb8"
-  integrity sha512-uVDi8LpBUKQj6sdxNaTetL6FpeCqTjOvAQuQUa/qAqq8oOd4ivkbhgnqayl0dnPal8Tb/yB1tF+gOvCBiicaiQ==
+  version "3.0.6"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.6.tgz#865d0b5833d7d8d40f4e5b8a6d76aea3de4725ef"
+  integrity sha512-+ZAmfyWMT7TiIlzdqJgjMb7S4f1beorDbWbsocyK4RaiqA5RTX3K14bnBWmmA9QEM0gRdsjyyrEmcyga8Zsxmw==
 
 currently-unhandled@^0.4.1:
   version "0.4.1"
@@ -6033,10 +6031,10 @@ d3@5.16.0:
     d3-voronoi "1"
     d3-zoom "1"
 
-d3@6.3.1:
-  version "6.3.1"
-  resolved "https://registry.yarnpkg.com/d3/-/d3-6.3.1.tgz#c5fe6c7abff432826775a9e04db80b5f2e22eb1c"
-  integrity sha512-rbaoA67o2N4lO1TCuvrTGQdowNb3zT0z2ygg6TLmJZAd7TRPg+lhbfDOVwQUAgdbRD+73kg2FrEQ9HLiap5H2w==
+d3@6.4.0:
+  version "6.4.0"
+  resolved "https://registry.yarnpkg.com/d3/-/d3-6.4.0.tgz#7b50a833209f70ccd768292d649417dddcb9bde0"
+  integrity sha512-A8uZ7IPQSNmc5YZtrzbkNepsChV6vj7rZj9A1LV33GmDeZ0mMSgO1nxbksbN9ciTWR1YySUD4aJc3wBGb8xdrg==
   dependencies:
     d3-array "2"
     d3-axis "2"
@@ -6532,9 +6530,9 @@ ee-first@1.1.1:
   integrity sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=
 
 electron-to-chromium@^1.3.634:
-  version "1.3.634"
-  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.634.tgz#82ea400f520f739c4f6ff00c1f7524827a917d25"
-  integrity sha512-QPrWNYeE/A0xRvl/QP3E0nkaEvYUvH3gM04ZWYtIa6QlSpEetRlRI1xvQ7hiMIySHHEV+mwDSX8Kj4YZY6ZQAw==
+  version "1.3.641"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.641.tgz#03f14efd70a7971eff2efc947b3c1d0f717c82b9"
+  integrity sha512-b0DLhsHSHESC1I+Nx6n4w4Lr61chMd3m/av1rZQhS2IXTzaS5BMM5N+ldWdMIlni9CITMRM09m8He4+YV/92TA==
 
 electron-updater@4.3.1:
   version "4.3.1"
@@ -6595,10 +6593,10 @@ end-of-stream@^1.0.0, end-of-stream@^1.1.0:
   dependencies:
     once "^1.4.0"
 
-enhanced-resolve@5.4.1, enhanced-resolve@^5.3.1:
-  version "5.4.1"
-  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.4.1.tgz#c89b0c34f17f931902ef2913a125d4b825b49b6f"
-  integrity sha512-4GbyIMzYktTFoRSmkbgZ1LU+RXwf4AQ8Z+rSuuh1dC8plp0PPeaWvx6+G4hh4KnUJ48VoxKbNyA1QQQIUpXjYA==
+enhanced-resolve@5.7.0, enhanced-resolve@^5.7.0:
+  version "5.7.0"
+  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-5.7.0.tgz#525c5d856680fbd5052de453ac83e32049958b5c"
+  integrity sha512-6njwt/NsZFUKhM6j9U8hzVyD4E4r0x7NQzhTCbcWOJ0IQjNSAoalWmb0AE51Wn+fwan5qVESWi7t2ToBxs9vrw==
   dependencies:
     graceful-fs "^4.2.4"
     tapable "^2.2.0"
@@ -6660,24 +6658,26 @@ es-abstract@^1.17.0-next.1:
     string.prototype.trimstart "^1.0.1"
 
 es-abstract@^1.18.0-next.1:
-  version "1.18.0-next.1"
-  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.18.0-next.1.tgz#6e3a0a4bda717e5023ab3b8e90bec36108d22c68"
-  integrity sha512-I4UGspA0wpZXWENrdA0uHbnhte683t3qT/1VFH9aX2dA5PPSf6QW5HHXf5HImaqPmjXaVeVk4RGWnaylmV7uAA==
+  version "1.18.0-next.2"
+  resolved "https://registry.yarnpkg.com/es-abstract/-/es-abstract-1.18.0-next.2.tgz#088101a55f0541f595e7e057199e27ddc8f3a5c2"
+  integrity sha512-Ih4ZMFHEtZupnUh6497zEL4y2+w8+1ljnCyaTa+adcoafI1GOvMwFlDjBLfWR7y9VLfrjRJe9ocuHY1PSR9jjw==
   dependencies:
+    call-bind "^1.0.2"
     es-to-primitive "^1.2.1"
     function-bind "^1.1.1"
+    get-intrinsic "^1.0.2"
     has "^1.0.3"
     has-symbols "^1.0.1"
     is-callable "^1.2.2"
-    is-negative-zero "^2.0.0"
+    is-negative-zero "^2.0.1"
     is-regex "^1.1.1"
-    object-inspect "^1.8.0"
+    object-inspect "^1.9.0"
     object-keys "^1.1.1"
-    object.assign "^4.1.1"
-    string.prototype.trimend "^1.0.1"
-    string.prototype.trimstart "^1.0.1"
+    object.assign "^4.1.2"
+    string.prototype.trimend "^1.0.3"
+    string.prototype.trimstart "^1.0.3"
 
-es-module-lexer@^0.3.24, es-module-lexer@^0.3.25:
+es-module-lexer@^0.3.24, es-module-lexer@^0.3.25, es-module-lexer@^0.3.26:
   version "0.3.26"
   resolved "https://registry.yarnpkg.com/es-module-lexer/-/es-module-lexer-0.3.26.tgz#7b507044e97d5b03b01d4392c74ffeb9c177a83b"
   integrity sha512-Va0Q/xqtrss45hWzP8CZJwzGSZJjDM5/MJRE3IXXnUCcVLElR9BRaE9F62BopysASyc4nM3uwhSW7FFB9nlWAA==
@@ -6704,9 +6704,9 @@ es6-promisify@^5.0.0:
     es6-promise "^4.0.3"
 
 esbuild@^0.8.0, esbuild@^0.8.7:
-  version "0.8.31"
-  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.8.31.tgz#c21e7adb3ad283c951a53de7ad64a5ae2df2ed34"
-  integrity sha512-7EIU0VdUxltwivjVezX3HgeNzeIVR1snkrAo57WdUnuBMykdzin5rTrxwCDM6xQqj0RL/HjOEm3wFr2ijHKeaA==
+  version "0.8.33"
+  resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.8.33.tgz#4e24ab4e780b08ff5527171bf5a684594c8b56e9"
+  integrity sha512-2ms/P6Y9zJfopR9dKo2vHzhXKfGSNlquVVoVOF8YnhjuzZVrvManMVBPadBsR/t7jzIkRnwqvxrs7d4f3C3eyg==
 
 escalade@^3.1.1:
   version "3.1.1"
@@ -6778,10 +6778,10 @@ esinstall@^0.5.1:
     validate-npm-package-name "^3.0.0"
     vm2 "^3.9.2"
 
-eslint-config-prettier@7.1.0:
-  version "7.1.0"
-  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-7.1.0.tgz#5402eb559aa94b894effd6bddfa0b1ca051c858f"
-  integrity sha512-9sm5/PxaFG7qNJvJzTROMM1Bk1ozXVTKI0buKOyb0Bsr1hrwi0H/TzxF/COtf1uxikIK8SwhX7K6zg78jAzbeA==
+eslint-config-prettier@7.2.0:
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-7.2.0.tgz#f4a4bd2832e810e8cc7c1411ec85b3e85c0c53f9"
+  integrity sha512-rV4Qu0C3nfJKPOAhFujFxB7RMP+URFyQqqOZW9DMRD7ZDTFyjaIlETU3xzHELt++4ugC0+Jm084HQYkkJe+Ivg==
 
 eslint-plugin-license-header@0.2.0:
   version "0.2.0"
@@ -6844,13 +6844,13 @@ eslint-visitor-keys@^2.0.0:
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.0.0.tgz#21fdc8fbcd9c795cc0321f0563702095751511a8"
   integrity sha512-QudtT6av5WXels9WjIM7qz1XD1cWGvX4gGXvp/zBn9nXG02D0utdU3Em2m/QjTnrsk6bBjmCygl3rmj118msQQ==
 
-eslint@7.17.0:
-  version "7.17.0"
-  resolved "https://registry.yarnpkg.com/eslint/-/eslint-7.17.0.tgz#4ccda5bf12572ad3bf760e6f195886f50569adb0"
-  integrity sha512-zJk08MiBgwuGoxes5sSQhOtibZ75pz0J35XTRlZOk9xMffhpA9BTbQZxoXZzOl5zMbleShbGwtw+1kGferfFwQ==
+eslint@7.18.0:
+  version "7.18.0"
+  resolved "https://registry.yarnpkg.com/eslint/-/eslint-7.18.0.tgz#7fdcd2f3715a41fe6295a16234bd69aed2c75e67"
+  integrity sha512-fbgTiE8BfUJZuBeq2Yi7J3RB3WGUQ9PNuNbmgi6jt9Iv8qrkxfy19Ds3OpL1Pm7zg3BtTVhvcUZbIRQ0wmSjAQ==
   dependencies:
     "@babel/code-frame" "^7.0.0"
-    "@eslint/eslintrc" "^0.2.2"
+    "@eslint/eslintrc" "^0.3.0"
     ajv "^6.10.0"
     chalk "^4.0.0"
     cross-spawn "^7.0.2"
@@ -6874,7 +6874,7 @@ eslint@7.17.0:
     js-yaml "^3.13.1"
     json-stable-stringify-without-jsonify "^1.0.1"
     levn "^0.4.1"
-    lodash "^4.17.19"
+    lodash "^4.17.20"
     minimatch "^3.0.4"
     natural-compare "^1.4.0"
     optionator "^0.9.1"
@@ -7180,9 +7180,9 @@ fast-glob@^2.2.6:
     micromatch "^3.1.10"
 
 fast-glob@^3.1.1, fast-glob@^3.2.4:
-  version "3.2.4"
-  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.4.tgz#d20aefbf99579383e7f3cc66529158c9b98554d3"
-  integrity sha512-kr/Oo6PX51265qeuCYsyGypiO5uJFgBS0jksyG7FUeCyQzNwYnzrNIMR1NXfkZXsMYXYLRAHgISHBz8gQcxKHQ==
+  version "3.2.5"
+  resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.5.tgz#7939af2a656de79a4f1901903ee8adcaa7cb9661"
+  integrity sha512-2DtFcgT68wiTTiwZ2hNdJfcHNke9XOfnwmBRWXhmeKM8rF0TGwmC/Qto3S7RoZKp5cilZbxzO5iTNTQsJ+EeDg==
   dependencies:
     "@nodelib/fs.stat" "^2.0.2"
     "@nodelib/fs.walk" "^1.2.3"
@@ -7439,15 +7439,15 @@ from2@^2.1.0:
     inherits "^2.0.1"
     readable-stream "^2.0.0"
 
-fs-extra@9.0.1, fs-extra@^9.0.0:
-  version "9.0.1"
-  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-9.0.1.tgz#910da0062437ba4c39fedd863f1675ccfefcb9fc"
-  integrity sha512-h2iAoN838FqAFJY2/qVpzFXy+EBxfVE220PalAqQLDVsFOHLJrZvut5puAbCdNv6WJk+B8ihI+k0c7JK5erwqQ==
+fs-extra@9.1.0:
+  version "9.1.0"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-9.1.0.tgz#5954460c764a8da2094ba3554bf839e6b9a7c86d"
+  integrity sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==
   dependencies:
     at-least-node "^1.0.0"
     graceful-fs "^4.2.0"
     jsonfile "^6.0.1"
-    universalify "^1.0.0"
+    universalify "^2.0.0"
 
 fs-extra@^8.1.0:
   version "8.1.0"
@@ -7458,6 +7458,16 @@ fs-extra@^8.1.0:
     jsonfile "^4.0.0"
     universalify "^0.1.0"
 
+fs-extra@^9.0.0:
+  version "9.0.1"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-9.0.1.tgz#910da0062437ba4c39fedd863f1675ccfefcb9fc"
+  integrity sha512-h2iAoN838FqAFJY2/qVpzFXy+EBxfVE220PalAqQLDVsFOHLJrZvut5puAbCdNv6WJk+B8ihI+k0c7JK5erwqQ==
+  dependencies:
+    at-least-node "^1.0.0"
+    graceful-fs "^4.2.0"
+    jsonfile "^6.0.1"
+    universalify "^1.0.0"
+
 fs-minipass@^1.2.5:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/fs-minipass/-/fs-minipass-1.2.7.tgz#ccff8570841e7fe4265693da88936c55aed7f7c7"
@@ -7551,7 +7561,7 @@ get-caller-file@^2.0.1, get-caller-file@^2.0.5:
   resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-2.0.5.tgz#4f94412a82db32f36e3b0b9741f8a97feb031f7e"
   integrity sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==
 
-get-intrinsic@^1.0.0, get-intrinsic@^1.0.1, get-intrinsic@^1.0.2:
+get-intrinsic@^1.0.1, get-intrinsic@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.0.2.tgz#6820da226e50b24894e08859469dc68361545d49"
   integrity sha512-aeX0vrFm21ILl3+JpFFRNe9aUvp6VFZb2/CTbgLb8j75kOhvoNYjt9d8KA/tJG4gSo8nzEDedRl0h7vDmBYRVg==
@@ -8609,7 +8619,7 @@ is-module@^1.0.0:
   resolved "https://registry.yarnpkg.com/is-module/-/is-module-1.0.0.tgz#3258fb69f78c14d5b815d664336b4cffb6441591"
   integrity sha1-Mlj7afeMFNW4FdZkM2tM/7ZEFZE=
 
-is-negative-zero@^2.0.0:
+is-negative-zero@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/is-negative-zero/-/is-negative-zero-2.0.1.tgz#3de746c18dda2319241a53675908d8f766f11c24"
   integrity sha512-2z6JzQvZRa9A2Y7xC6dQQm4FSTSTNWjKIYYTt4246eMTJmIo0Q+ZyOsU66X8lxK1AbB92dFeglPLrhwpeRKO6w==
@@ -9198,7 +9208,7 @@ jest-watcher@^26.6.2:
     jest-util "^26.6.2"
     string-length "^4.0.1"
 
-jest-worker@^26.6.1, jest-worker@^26.6.2:
+jest-worker@^26.6.2:
   version "26.6.2"
   resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-26.6.2.tgz#7f72cbc4d643c365e27b9fd775f9d0eaa9c7a8ed"
   integrity sha512-KWYVV1c4i+jbMpaBC+U++4Va0cp8OisU185o73T1vo99hqi7w8tSJfUXYswwqqrjzwxa6KpRK54WhPvwf5w6PQ==
@@ -9595,7 +9605,7 @@ load-json-file@^5.3.0:
     strip-bom "^3.0.0"
     type-fest "^0.3.0"
 
-loader-runner@^4.1.0:
+loader-runner@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-4.2.0.tgz#d7022380d66d14c5fb1d496b89864ebcfd478384"
   integrity sha512-92+huvxMvYlMzMt0iIOukcwYBFpkYJdpl2xsZ7LrlayO7E8SOv+JJUEK17B/dJIHAOLMfh2dZZ/Y18WgmGtYNw==
@@ -10068,10 +10078,10 @@ mini-create-react-context@^0.4.0:
     "@babel/runtime" "^7.12.1"
     tiny-warning "^1.0.3"
 
-mini-css-extract-plugin@1.3.3:
-  version "1.3.3"
-  resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.3.tgz#7802e62b34199aa7d1a62e654395859a836486a0"
-  integrity sha512-7lvliDSMiuZc81kI+5/qxvn47SCM7BehXex3f2c6l/pR3Goj58IQxZh9nuPQ3AkGQgoETyXuIqLDaO5Oa0TyBw==
+mini-css-extract-plugin@1.3.4:
+  version "1.3.4"
+  resolved "https://registry.yarnpkg.com/mini-css-extract-plugin/-/mini-css-extract-plugin-1.3.4.tgz#706e69632cdcdb8b15bf8e638442a0dba304a9c8"
+  integrity sha512-dNjqyeogUd8ucUgw5sxm1ahvSfSUgef7smbmATRSbDm4EmNx5kQA6VdUEhEeCKSjX6CTYjb5vxgMUvRjqP3uHg==
   dependencies:
     loader-utils "^2.0.0"
     schema-utils "^3.0.0"
@@ -10834,10 +10844,10 @@ optionator@^0.9.1:
     type-check "^0.4.0"
     word-wrap "^1.2.3"
 
-ora@5.2.0:
-  version "5.2.0"
-  resolved "https://registry.yarnpkg.com/ora/-/ora-5.2.0.tgz#de10bfd2d15514384af45f3fa9d9b1aaf344fda1"
-  integrity sha512-+wG2v8TUU8EgzPHun1k/n45pXquQ9fHnbXVetl9rRgO6kjZszGGbraF3XPTIdgeA+s1lbRjSEftAnyT0w8ZMvQ==
+ora@5.3.0:
+  version "5.3.0"
+  resolved "https://registry.yarnpkg.com/ora/-/ora-5.3.0.tgz#fb832899d3a1372fe71c8b2c534bbfe74961bb6f"
+  integrity sha512-zAKMgGXUim0Jyd6CXK9lraBnD3H5yPGBPPOkC23a2BG6hsm4Zu6OQSjQuEtV0BHDf4aKHcUFvJiGRrFuW3MG8g==
   dependencies:
     bl "^4.0.3"
     chalk "^4.1.0"
@@ -10929,7 +10939,7 @@ p-limit@^2.0.0, p-limit@^2.2.0:
   dependencies:
     p-try "^2.0.0"
 
-p-limit@^3.0.2:
+p-limit@^3.0.2, p-limit@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-3.1.0.tgz#e1daccbe78d0d1388ca18c64fea38e3e57e3706b"
   integrity sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==
@@ -11131,9 +11141,9 @@ parse-json@^4.0.0:
     json-parse-better-errors "^1.0.1"
 
 parse-json@^5.0.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.1.0.tgz#f96088cdf24a8faa9aea9a009f2d9d942c999646"
-  integrity sha512-+mi/lmVVNKFNVyLXV31ERiy2CY5E1/F6QtJFEzoChPRwwngMNXRDQ9GJ5WdE2Z2P4AujsOi0/+2qHID68KwfIQ==
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-5.2.0.tgz#c76fc66dee54231c962b22bcc8a72cf2f99753cd"
+  integrity sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==
   dependencies:
     "@babel/code-frame" "^7.0.0"
     error-ex "^1.3.1"
@@ -11141,12 +11151,14 @@ parse-json@^5.0.0:
     lines-and-columns "^1.1.6"
 
 parse-path@^4.0.0:
-  version "4.0.2"
-  resolved "https://registry.yarnpkg.com/parse-path/-/parse-path-4.0.2.tgz#ef14f0d3d77bae8dd4bc66563a4c151aac9e65aa"
-  integrity sha512-HSqVz6iuXSiL8C1ku5Gl1Z5cwDd9Wo0q8CoffdAghP6bz8pJa1tcMC+m4N+z6VAS8QdksnIGq1TB6EgR4vPR6w==
+  version "4.0.3"
+  resolved "https://registry.yarnpkg.com/parse-path/-/parse-path-4.0.3.tgz#82d81ec3e071dcc4ab49aa9f2c9c0b8966bb22bf"
+  integrity sha512-9Cepbp2asKnWTJ9x2kpw6Fe8y9JDbqwahGCTvklzd/cEq5C5JC59x2Xb0Kx+x0QZ8bvNquGO8/BWP0cwBHzSAA==
   dependencies:
     is-ssh "^1.3.0"
     protocols "^1.4.0"
+    qs "^6.9.4"
+    query-string "^6.13.8"
 
 parse-url@^5.0.0:
   version "5.0.2"
@@ -11434,28 +11446,29 @@ pm2@4.5.1:
   optionalDependencies:
     systeminformation "^4.32"
 
-polished@4.0.5:
-  version "4.0.5"
-  resolved "https://registry.yarnpkg.com/polished/-/polished-4.0.5.tgz#3f91873c8f72dec1723b3f892f57fbb22645b23d"
-  integrity sha512-BY2+LVtOHQWBQpGN4GPAKpCdsBePOdSdHTpZegRDRCrvGPkRPTx1DEC+vGjIDPhXS7W2qiBxschnwRWTFdMZag==
+polished@4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/polished/-/polished-4.1.0.tgz#ab80c10e04fdf8795faee723b59577de18d2936b"
+  integrity sha512-y8IInTGHuwku7+O+wsJ7OOvNpJF7EPP/IDzF1uj9UJfEEKpMAfeq5gZ5UrtOksM7Jk4+hBAk6Ce8rFOOF4msZg==
   dependencies:
     "@babel/runtime" "^7.12.5"
+    "@scarf/scarf" "^1.1.0"
 
 posix-character-classes@^0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab"
   integrity sha1-AerA/jta9xoqbAL+q7jB/vfgDqs=
 
-postcss-loader@4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/postcss-loader/-/postcss-loader-4.1.0.tgz#4647a6c8dad3cb6b253fbfaa21d62201086f6e39"
-  integrity sha512-vbCkP70F3Q9PIk6d47aBwjqAMI4LfkXCoyxj+7NPNuVIwfTGdzv2KVQes59/RuxMniIgsYQCFSY42P3+ykJfaw==
+postcss-loader@4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/postcss-loader/-/postcss-loader-4.2.0.tgz#f6993ea3e0f46600fb3ee49bbd010448123a7db4"
+  integrity sha512-mqgScxHqbiz1yxbnNcPdKYo/6aVt+XExURmEbQlviFVWogDbM4AJ0A/B+ZBpYsJrTRxKw7HyRazg9x0Q9SWwLA==
   dependencies:
     cosmiconfig "^7.0.0"
     klona "^2.0.4"
     loader-utils "^2.0.0"
     schema-utils "^3.0.0"
-    semver "^7.3.2"
+    semver "^7.3.4"
 
 postcss-modules-extract-imports@^2.0.0:
   version "2.0.0"
@@ -11548,10 +11561,10 @@ postcss-value-parser@^4.0.2, postcss-value-parser@^4.1.0:
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.1.0.tgz#443f6a20ced6481a2bda4fa8532a6e55d789a2cb"
   integrity sha512-97DXOFbQJhk71ne5/Mt6cOu6yxsSfM0QGQyl0L25Gca4yGWEGJaig7l7gbCX623VqTBNGLRLaVUCnNkcedlRSQ==
 
-postcss@8.2.2:
-  version "8.2.2"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.2.2.tgz#60613b62297005084fd21024a68637798864fe26"
-  integrity sha512-HM1NDNWLgglJPQQMNwvLxgH2KcrKZklKLi/xXYIOaqQB57p/pDWEJNS83PVICYsn1Dg/9C26TiejNr422/ePaQ==
+postcss@8.2.4, postcss@^8.1.4, postcss@^8.1.8:
+  version "8.2.4"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.2.4.tgz#20a98a39cf303d15129c2865a9ec37eda0031d04"
+  integrity sha512-kRFftRoExRVXZlwUuay9iC824qmXPcQQVzAjbCCgjpXnkdMCJYBu2gTwAaFBzv8ewND6O8xFb3aELmEkh9zTzg==
   dependencies:
     colorette "^1.2.1"
     nanoid "^3.1.20"
@@ -11566,15 +11579,6 @@ postcss@^7.0.14, postcss@^7.0.32, postcss@^7.0.5, postcss@^7.0.6:
     source-map "^0.6.1"
     supports-color "^6.1.0"
 
-postcss@^8.1.4, postcss@^8.1.8:
-  version "8.2.3"
-  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.2.3.tgz#14ed1294850c99661761d9cb68863718eb75690d"
-  integrity sha512-tdmNCCmxJEsLZNj810qlj8QbvnUNKFL9A5doV+uHrGGK/YNKWEslrytnHDWr9M/GgGjfUFwXCRbxd/b6IoRBXQ==
-  dependencies:
-    colorette "^1.2.1"
-    nanoid "^3.1.20"
-    source-map "^0.6.1"
-
 prelude-ls@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396"
@@ -11787,12 +11791,17 @@ qs@6.7.0:
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.7.0.tgz#41dc1a015e3d581f1621776be31afb2876a9b1bc"
   integrity sha512-VCdBRNFTX1fyE7Nb6FYoURo/SPe62QCaAyzJvUjwRaIsc+NePBEniHlvxFmmX56+HZphIGtV0XeCirBtpDrTyQ==
 
+qs@^6.9.4:
+  version "6.9.6"
+  resolved "https://registry.yarnpkg.com/qs/-/qs-6.9.6.tgz#26ed3c8243a431b2924aca84cc90471f35d5a0ee"
+  integrity sha512-TIRk4aqYLNoJUbd+g2lEdz5kLWIuTMRagAXxl78Q0RiVjAOugHmeKNGdd3cwo/ktpf9aL9epCfFqWDEKysUlLQ==
+
 qs@~6.5.2:
   version "6.5.2"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"
   integrity sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA==
 
-query-string@6.13.8:
+query-string@6.13.8, query-string@^6.13.8:
   version "6.13.8"
   resolved "https://registry.yarnpkg.com/query-string/-/query-string-6.13.8.tgz#8cf231759c85484da3cf05a851810d8e825c1159"
   integrity sha512-jxJzQI2edQPE/NPUOusNjO/ZOGqr1o2OBa/3M00fU76FsLXDVbJDv/p7ng5OdQyorKrkRz1oqfwmbe5MAMePQg==
@@ -11877,10 +11886,10 @@ react-app-polyfill@^1.0.6:
     regenerator-runtime "^0.13.3"
     whatwg-fetch "^3.0.0"
 
-react-content-loader@5.1.4:
-  version "5.1.4"
-  resolved "https://registry.yarnpkg.com/react-content-loader/-/react-content-loader-5.1.4.tgz#854bafe4415dd9de07174621375bc308edd0ebb5"
-  integrity sha512-hTq7pZi2GKCK6a9d3u6XStozm0QGCEjw8cSqQReiWnh2up6IwCha5R5TF0o6SY5qUDpByloEZEZtnFxpJyENFw==
+react-content-loader@6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/react-content-loader/-/react-content-loader-6.0.1.tgz#1c5ce4a6256d974fcd3ac85460eca24b33226920"
+  integrity sha512-djJUgGNze7YdWzJA1kYO1eKXAMpP+Z4sMulmEuTVi6vEXzfuQCJs6yD8hhgWj23vvJPZL5b8NyabxteyF8Hq/g==
 
 react-dom@17.0.1:
   version "17.0.1"
@@ -12231,12 +12240,12 @@ regex-not@^1.0.0, regex-not@^1.0.2:
     safe-regex "^1.1.0"
 
 regexp.prototype.flags@^1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.3.0.tgz#7aba89b3c13a64509dabcf3ca8d9fbb9bdf5cb75"
-  integrity sha512-2+Q0C5g951OlYlJz6yu5/M33IcsESLlLfsyIaLJaG4FA2r4yP8MvVMJUUP/fVBkSpbbbZlS5gynbEWLipiiXiQ==
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/regexp.prototype.flags/-/regexp.prototype.flags-1.3.1.tgz#7ef352ae8d159e758c0eadca6f8fcb4eef07be26"
+  integrity sha512-JiBdRBq91WlY7uRJ0ds7R+dU02i6LKi8r3BuQhNXn+kmeLN+EfHhfjqMRis1zJxnlu88hq/4dx0P2OP3APRTOA==
   dependencies:
+    call-bind "^1.0.2"
     define-properties "^1.1.3"
-    es-abstract "^1.17.0-next.1"
 
 regexpp@^3.0.0, regexpp@^3.1.0:
   version "3.1.0"
@@ -12275,9 +12284,9 @@ regjsgen@^0.5.1:
   integrity sha512-OFFT3MfrH90xIW8OOSyUrk6QHD5E9JOTeGodiJeBS3J6IwlgzJMNE/1bZklWz5oTg+9dCMyEetclvCVXOPoN3A==
 
 regjsparser@^0.6.4:
-  version "0.6.4"
-  resolved "https://registry.yarnpkg.com/regjsparser/-/regjsparser-0.6.4.tgz#a769f8684308401a66e9b529d2436ff4d0666272"
-  integrity sha512-64O87/dPDgfk8/RQqC4gkZoGyyWFIEUTTh80CU6CWuK5vkCGyekIx+oKcEIYtP/RAxSQltCZHCNu/mdd7fqlJw==
+  version "0.6.6"
+  resolved "https://registry.yarnpkg.com/regjsparser/-/regjsparser-0.6.6.tgz#6d8c939d1a654f78859b08ddcc4aa777f3fa800a"
+  integrity sha512-jjyuCp+IEMIm3N1H1LLTJW1EISEJV9+5oHdEyrt43Pg9cDSb6rrLZei2cVWpl0xTjmmlpec/lEQGYgM7xfpGCQ==
   dependencies:
     jsesc "~0.5.0"
 
@@ -12504,7 +12513,7 @@ rimraf@3.0.2, rimraf@^3.0.0, rimraf@^3.0.2:
   dependencies:
     glob "^7.1.3"
 
-rimraf@^2.5.4, rimraf@^2.6.2, rimraf@^2.6.3:
+rimraf@^2.5.4, rimraf@^2.6.2, rimraf@^2.6.3, rimraf@^2.7.1:
   version "2.7.1"
   resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.7.1.tgz#35797f13a7fdadc566142c29d4f07ccad483e3ec"
   integrity sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==
@@ -12544,9 +12553,9 @@ rollup@^1.31.1:
     acorn "^7.1.0"
 
 rollup@^2.23.0, rollup@^2.34.0:
-  version "2.36.1"
-  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.36.1.tgz#2174f0c25c7b400d57b05628d0e732c7ae8d2178"
-  integrity sha512-eAfqho8dyzuVvrGqpR0ITgEdq0zG2QJeWYh+HeuTbpcaXk8vNFc48B7bJa1xYosTCKx0CuW+447oQOW8HgBIZQ==
+  version "2.36.2"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.36.2.tgz#883fc793c70c8481ad604f1065cd79ab0a4e9c49"
+  integrity sha512-qjjiuJKb+/8n0EZyQYVW+gFU4bNRBcZaXVzUgSVrGw0HlQBlK2aWyaOMMs1Ufic1jV69b9kW3u3i9B+hISDm3A==
   optionalDependencies:
     fsevents "~2.1.2"
 
@@ -12626,10 +12635,10 @@ sane@^4.0.3:
     minimist "^1.1.1"
     walker "~1.0.5"
 
-sass-loader@10.1.0:
-  version "10.1.0"
-  resolved "https://registry.yarnpkg.com/sass-loader/-/sass-loader-10.1.0.tgz#1727fcc0c32ab3eb197cda61d78adf4e9174a4b3"
-  integrity sha512-ZCKAlczLBbFd3aGAhowpYEy69Te3Z68cg8bnHHl6WnSCvnKpbM6pQrz957HWMa8LKVuhnD9uMplmMAHwGQtHeg==
+sass-loader@10.1.1:
+  version "10.1.1"
+  resolved "https://registry.yarnpkg.com/sass-loader/-/sass-loader-10.1.1.tgz#4ddd5a3d7638e7949065dd6e9c7c04037f7e663d"
+  integrity sha512-W6gVDXAd5hR/WHsPicvZdjAWHBcEJ44UahgxcIE196fW2ong0ZHMPO1kZuI5q0VlvMQZh32gpv69PLWQm70qrw==
   dependencies:
     klona "^2.0.4"
     loader-utils "^2.0.0"
@@ -12637,10 +12646,10 @@ sass-loader@10.1.0:
     schema-utils "^3.0.0"
     semver "^7.3.2"
 
-sass@1.32.2:
-  version "1.32.2"
-  resolved "https://registry.yarnpkg.com/sass/-/sass-1.32.2.tgz#66dc0250bc86c15d19ddee7135e93d0cf3d3257b"
-  integrity sha512-u1pUuzqwz3SAgvHSWp1k0mRhX82b2DdlVnP6UIetQPZtYbuJUDaPQhZE12jyjB7vYeOScfz9WPsZJB6Rpk7heA==
+sass@1.32.5:
+  version "1.32.5"
+  resolved "https://registry.yarnpkg.com/sass/-/sass-1.32.5.tgz#2882d22ad5748c05fa9bff6c3b0ffbc4f4b9e1dc"
+  integrity sha512-kU1yJ5zUAmPxr7f3q0YXTAd1oZjSR1g3tYyv+xu0HZSl5JiNOaE987eiz7wCUvbm4I9fGWGU2TgApTtcP4GMNQ==
   dependencies:
     chokidar ">=2.0.0 <4.0.0"
 
@@ -12700,7 +12709,7 @@ semver@7.0.0:
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.0.0.tgz#5f3ca35761e47e05b206c6daff2cf814f0316b8e"
   integrity sha512-+GB6zVA9LWh6zovYQLALHwv5rb2PHGlJi3lfiqIHxR0uuwCgefcOJc59v9fv1w8GbStwxuuqqAjI9NMAOOgq1A==
 
-semver@^7.1.3, semver@^7.2, semver@^7.2.1, semver@^7.3.2:
+semver@^7.1.3, semver@^7.2, semver@^7.2.1, semver@^7.3.2, semver@^7.3.4:
   version "7.3.4"
   resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.4.tgz#27aaa7d2e4ca76452f98d3add093a72c943edc97"
   integrity sha512-tCfb2WLjqFAtXn4KEdxIhalnRtoKFN7nAwj0B3ZXCbQloV2tq5eDbcTmT68JJD3nRJq24/XgxtQKFIpQdtvmVw==
@@ -13252,7 +13261,7 @@ string.prototype.matchall@^4.0.2:
     regexp.prototype.flags "^1.3.0"
     side-channel "^1.0.3"
 
-string.prototype.trimend@^1.0.1:
+string.prototype.trimend@^1.0.1, string.prototype.trimend@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/string.prototype.trimend/-/string.prototype.trimend-1.0.3.tgz#a22bd53cca5c7cf44d7c9d5c732118873d6cd18b"
   integrity sha512-ayH0pB+uf0U28CtjlLvL7NaohvR1amUvVZk+y3DYb0Ey2PUV5zPkkKy9+U1ndVEIXO8hNg18eIv9Jntbii+dKw==
@@ -13260,7 +13269,7 @@ string.prototype.trimend@^1.0.1:
     call-bind "^1.0.0"
     define-properties "^1.1.3"
 
-string.prototype.trimstart@^1.0.1:
+string.prototype.trimstart@^1.0.1, string.prototype.trimstart@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/string.prototype.trimstart/-/string.prototype.trimstart-1.0.3.tgz#9b4cb590e123bb36564401d59824298de50fd5aa"
   integrity sha512-oBIBUy5lea5tt0ovtOFiEQaBkoBBkyJhZXzJYrSmDo5IUUqbOPvVezuRs/agBIdZ2p2Eo1FD6bD9USyBLfl3xg==
@@ -13444,10 +13453,10 @@ svg-parser@^2.0.2:
   resolved "https://registry.yarnpkg.com/svg-parser/-/svg-parser-2.0.4.tgz#fdc2e29e13951736140b76cb122c8ee6630eb6b5"
   integrity sha512-e4hG1hRwoOdRb37cIMSgzNsxyzKfayW6VOflrwvR+/bzrkyxY/31WkbgnQpgtrNp1SdpJvpUAGTa/ZoiPNDuRQ==
 
-swr@0.3.11:
-  version "0.3.11"
-  resolved "https://registry.yarnpkg.com/swr/-/swr-0.3.11.tgz#f7f50ed26c06afea4249482cec504768a2272664"
-  integrity sha512-ya30LuRGK2R7eDlttnb7tU5EmJYJ+N6ytIOM2j0Hqs0qauJcDjVLDOGy7KmFeH5ivOwLHalFaIyYl2K+SGa7HQ==
+swr@0.4.0:
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/swr/-/swr-0.4.0.tgz#e76da9f981fe6dee0e133289e9b582fc80d9c41d"
+  integrity sha512-70qd1FHYHwIdYXW0jTpm5ktitzvPBCtyKz8ZzynWlY/rMqe4drYPgcl/H9Ipuh+Xv6ZW5viNx13ro8EKIWZcoQ==
   dependencies:
     dequal "2.0.2"
 
@@ -13462,9 +13471,9 @@ symbol-tree@^3.2.4:
   integrity sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==
 
 systeminformation@^4.32:
-  version "4.34.5"
-  resolved "https://registry.yarnpkg.com/systeminformation/-/systeminformation-4.34.5.tgz#f2520697085736d9c3edf58ee9230c6aee1130f3"
-  integrity sha512-oFgpUeGc2BVTl9FPsdixzfcHkMg1llGUeA+flsZf7AM9HTQhWfcVrfHJEoWCq+mOqiSp4SCNrdSPFXJKYPDdYg==
+  version "4.34.7"
+  resolved "https://registry.yarnpkg.com/systeminformation/-/systeminformation-4.34.7.tgz#8b4a00c44781349905881c95dded8bafe7aae47f"
+  integrity sha512-cS3FiSZasFgVNjO9CP3aZmTO2VHwXKG+JN6Z85nWRyOzxRMNbZe7Xzwrewp42hj+OPMC3hk7MrAFyu/qLM65Mw==
 
 table@^6.0.4:
   version "6.0.7"
@@ -13553,19 +13562,19 @@ terminal-link@^2.0.0:
     ansi-escapes "^4.2.1"
     supports-hyperlinks "^2.0.0"
 
-terser-webpack-plugin@^5.0.3:
-  version "5.0.3"
-  resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-5.0.3.tgz#ec60542db2421f45735c719d2e17dabfbb2e3e42"
-  integrity sha512-zFdGk8Lh9ZJGPxxPE6jwysOlATWB8GMW8HcfGULWA/nPal+3VdATflQvSBSLQJRCmYZnfFJl6vkRTiwJGNgPiQ==
+terser-webpack-plugin@^5.1.1:
+  version "5.1.1"
+  resolved "https://registry.yarnpkg.com/terser-webpack-plugin/-/terser-webpack-plugin-5.1.1.tgz#7effadee06f7ecfa093dbbd3e9ab23f5f3ed8673"
+  integrity sha512-5XNNXZiR8YO6X6KhSGXfY0QrGrCRlSwAEjIIrlRQR4W8nP69TaJUlh3bkuac6zzgspiGPfKEHcY295MMVExl5Q==
   dependencies:
-    jest-worker "^26.6.1"
-    p-limit "^3.0.2"
+    jest-worker "^26.6.2"
+    p-limit "^3.1.0"
     schema-utils "^3.0.0"
     serialize-javascript "^5.0.1"
     source-map "^0.6.1"
-    terser "^5.3.8"
+    terser "^5.5.1"
 
-terser@5.5.1, terser@^5.3.8:
+terser@5.5.1, terser@^5.5.1:
   version "5.5.1"
   resolved "https://registry.yarnpkg.com/terser/-/terser-5.5.1.tgz#540caa25139d6f496fdea056e414284886fb2289"
   integrity sha512-6VGWZNVP2KTUcltUQJ25TtNjx/XgdDsBDKGt8nN0MpydU36LmbPPcMBd2kmtZNNGVVDLg44k7GKeHHj+4zPIBQ==
@@ -13821,9 +13830,9 @@ tslib@^2.0.1, tslib@^2.0.3:
   integrity sha512-hcVC3wYEziELGGmEEXue7D75zbwIIVUMWAVbHItGPx0ziyXxrOMQx4rQEVEV45Ut/1IotuEvwqPopzIOkDMf0A==
 
 tsutils@^3.17.1:
-  version "3.19.0"
-  resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.19.0.tgz#9387cb5fcb71579aa0909c509604f8a7fbe1cff1"
-  integrity sha512-A7BaLUPvcQ1cxVu72YfD+UMI3SQPTDv/w4ol6TOwLyI0hwfG9EC+cYlhdflJTmtYTgZ3KqdPSe/otxU4K3kArg==
+  version "3.19.1"
+  resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.19.1.tgz#d8566e0c51c82f32f9c25a4d367cd62409a547a9"
+  integrity sha512-GEdoBf5XI324lu7ycad7s6laADfnAqCw6wLGI+knxvw9vsIYBaJfYdmeCEG3FMMUiSm3OGgNb+m6utsWf5h9Vw==
   dependencies:
     tslib "^1.8.1"
 
@@ -14103,9 +14112,9 @@ upper-case@^1.1.1:
   integrity sha1-9rRQHC7EzdJrp4vnIilh3ndiFZg=
 
 uri-js@^4.2.2:
-  version "4.4.0"
-  resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.0.tgz#aa714261de793e8a82347a7bcc9ce74e86f28602"
-  integrity sha512-B0yRTzYdUCCn9n+F4+Gh4yIDtMQcaJsmYBDsTSG8g/OejKBodLQ2IHfN3bM7jUsRXndopT7OIXWdYqc1fjmV6g==
+  version "4.4.1"
+  resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"
+  integrity sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==
   dependencies:
     punycode "^2.1.0"
 
@@ -14303,14 +14312,15 @@ webidl-conversions@^6.1.0:
   resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-6.1.0.tgz#9111b4d7ea80acd40f5270d666621afa78b69514"
   integrity sha512-qBIvFLGiBpLjfwmYAaHPXsn+ho5xZnGvyGvsarywGNc8VyQJUMHJ8OBKGGrPER0okBeMDaan4mNBlgBROxuI8w==
 
-webpack-cli@4.3.1:
-  version "4.3.1"
-  resolved "https://registry.yarnpkg.com/webpack-cli/-/webpack-cli-4.3.1.tgz#87a7873bc9c6a4708aa657759274b691e72a04a8"
-  integrity sha512-/F4+9QNZM/qKzzL9/06Am8NXIkGV+/NqQ62Dx7DSqudxxpAgBqYn6V7+zp+0Y7JuWksKUbczRY3wMTd+7Uj6OA==
+webpack-cli@4.4.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/webpack-cli/-/webpack-cli-4.4.0.tgz#38c7fa01ea31510f5c490245dd1bb28018792f1b"
+  integrity sha512-/Qh07CXfXEkMu5S8wEpjuaw2Zj/CC0hf/qbTDp6N8N7JjdGuaOjZ7kttz+zhuJO/J5m7alQEhNk9lsc4rC6xgQ==
   dependencies:
     "@discoveryjs/json-ext" "^0.5.0"
+    "@webpack-cli/configtest" "^1.0.0"
     "@webpack-cli/info" "^1.2.1"
-    "@webpack-cli/serve" "^1.2.1"
+    "@webpack-cli/serve" "^1.2.2"
     colorette "^1.2.1"
     commander "^6.2.0"
     enquirer "^2.3.6"
@@ -14320,14 +14330,15 @@ webpack-cli@4.3.1:
     interpret "^2.2.0"
     rechoir "^0.7.0"
     v8-compile-cache "^2.2.0"
-    webpack-merge "^4.2.2"
+    webpack-merge "^5.7.3"
 
-webpack-merge@^4.2.2:
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/webpack-merge/-/webpack-merge-4.2.2.tgz#a27c52ea783d1398afd2087f547d7b9d2f43634d"
-  integrity sha512-TUE1UGoTX2Cd42j3krGYqObZbOD+xF7u28WB7tfUordytSjbWTIjK/8V0amkBfTYN4/pB/GIDlJZZ657BGG19g==
+webpack-merge@^5.7.3:
+  version "5.7.3"
+  resolved "https://registry.yarnpkg.com/webpack-merge/-/webpack-merge-5.7.3.tgz#2a0754e1877a25a8bbab3d2475ca70a052708213"
+  integrity sha512-6/JUQv0ELQ1igjGDzHkXbVDRxkfA57Zw7PfiupdLFJYrgFqY5ZP8xxbpp2lU3EPwYx89ht5Z/aDkD40hFCm5AA==
   dependencies:
-    lodash "^4.17.15"
+    clone-deep "^4.0.1"
+    wildcard "^2.0.0"
 
 webpack-sources@^1.1.0:
   version "1.4.3"
@@ -14345,33 +14356,33 @@ webpack-sources@^2.1.1:
     source-list-map "^2.0.1"
     source-map "^0.6.1"
 
-webpack@5.11.1:
-  version "5.11.1"
-  resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.11.1.tgz#39b2b9daeb5c6c620e03b7556ec674eaed4016b4"
-  integrity sha512-tNUIdAmYJv+nupRs/U/gqmADm6fgrf5xE+rSlSsf2PgsGO7j2WG7ccU6AWNlOJlHFl+HnmXlBmHIkiLf+XA9mQ==
+webpack@5.17.0:
+  version "5.17.0"
+  resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.17.0.tgz#e92aebad45be25f86f788dc72fc11daacdcfd55d"
+  integrity sha512-R+IdNEaYcYaACpXZOt7reyc8txBK7J06lOPkX1SbgmeoAnUbyBZivJIksrDBnmMA3wlTWvPcX7DubxELyPB8rA==
   dependencies:
     "@types/eslint-scope" "^3.7.0"
-    "@types/estree" "^0.0.45"
-    "@webassemblyjs/ast" "1.9.1"
-    "@webassemblyjs/helper-module-context" "1.9.1"
-    "@webassemblyjs/wasm-edit" "1.9.1"
-    "@webassemblyjs/wasm-parser" "1.9.1"
+    "@types/estree" "^0.0.46"
+    "@webassemblyjs/ast" "1.11.0"
+    "@webassemblyjs/wasm-edit" "1.11.0"
+    "@webassemblyjs/wasm-parser" "1.11.0"
     acorn "^8.0.4"
     browserslist "^4.14.5"
     chrome-trace-event "^1.0.2"
-    enhanced-resolve "^5.3.1"
+    enhanced-resolve "^5.7.0"
+    es-module-lexer "^0.3.26"
     eslint-scope "^5.1.1"
     events "^3.2.0"
     glob-to-regexp "^0.4.1"
     graceful-fs "^4.2.4"
     json-parse-better-errors "^1.0.2"
-    loader-runner "^4.1.0"
+    loader-runner "^4.2.0"
     mime-types "^2.1.27"
     neo-async "^2.6.2"
     pkg-dir "^5.0.0"
     schema-utils "^3.0.0"
     tapable "^2.1.1"
-    terser-webpack-plugin "^5.0.3"
+    terser-webpack-plugin "^5.1.1"
     watchpack "^2.0.0"
     webpack-sources "^2.1.1"
 
@@ -14443,6 +14454,11 @@ widest-line@^3.1.0:
   dependencies:
     string-width "^4.0.0"
 
+wildcard@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/wildcard/-/wildcard-2.0.0.tgz#a77d20e5200c6faaac979e4b3aadc7b3dd7f8fec"
+  integrity sha512-JcKqAHLPxcdb9KM49dufGXn2x3ssnfjbcaQdLlfZsL9rH9wgDQjUtDxbo8NE0F6SFvydeu1VhZe7hZuHsB2/pw==
+
 windows-release@^3.1.0:
   version "3.3.3"
   resolved "https://registry.yarnpkg.com/windows-release/-/windows-release-3.3.3.tgz#1c10027c7225743eec6b89df160d64c2e0293999"
@@ -14461,9 +14477,9 @@ wordwrap@^1.0.0:
   integrity sha1-J1hIEIkUVqQXHI0CJkQa3pDLyus=
 
 workerpool@^6.0.0:
-  version "6.0.3"
-  resolved "https://registry.yarnpkg.com/workerpool/-/workerpool-6.0.3.tgz#3f80ba4d914fe7bb8d933628c26e5d7ff820c703"
-  integrity sha512-meU8ZzO+ipcx/njxtKUcbu2K95085q5WYDo8fR6PMW3hCY4driteIsNsEowYV7dzOtvq0HotUKsReJkK8gKXgg==
+  version "6.0.4"
+  resolved "https://registry.yarnpkg.com/workerpool/-/workerpool-6.0.4.tgz#f83ecf101b35c034cb20ed38cedd619dde9d722c"
+  integrity sha512-sAc9w9oAJQ2680gDArGinjw0Ygj2K3KF1ZCRfslBKUCzc9Gycwlj9ZIAbizPRBftcXxhXgoGMVPxJE0VMNnWbw==
 
 wrap-ansi@^5.1.0:
   version "5.1.0"