Добавил раздел статистики, поменял тему оформления

[cronixXV]

Есть вопрос по данным варнингам(пробовал обновлять все пакеты, не помогло. Поэтому откатил назад. Не знаете, как их убрать?): WARNING in ./src/style/main.scss (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/style/main.scss)
Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
Deprecation Warning on line 37, column 4 of file:///Users/egorgruzdev/Desktop/js-middle-react-master/node_modules/bootstrap/scss/_type.scss:37:4:
Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.

More info: https://sass-lang.com/d/mixed-decls

37 | font-family: $display-font-family;

node_modules/bootstrap/scss/_type.scss 38:5 @import
node_modules/bootstrap/scss/bootstrap.scss 17:9 @import
src/style/main.scss 2:9 root stylesheet
WARNING in ./src/style/main.scss (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/style/main.scss)
Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
Deprecation Warning on line 38, column 4 of file:///Users/egorgruzdev/Desktop/js-middle-react-master/node_modules/bootstrap/scss/_type.scss:38:4:
Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.

More info: https://sass-lang.com/d/mixed-decls

38 | font-style: $display-font-style;

node_modules/bootstrap/scss/_type.scss 39:5 @import
node_modules/bootstrap/scss/bootstrap.scss 17:9 @import
src/style/main.scss 2:9 root stylesheet
WARNING in ./src/style/main.scss (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/style/main.scss)
Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
Deprecation Warning on line 39, column 4 of file:///Users/egorgruzdev/Desktop/js-middle-react-master/node_modules/bootstrap/scss/_type.scss:39:4:
Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.

More info: https://sass-lang.com/d/mixed-decls

39 | font-weight: $display-font-weight;

node_modules/bootstrap/scss/_type.scss 40:5 @import
node_modules/bootstrap/scss/bootstrap.scss 17:9 @import
src/style/main.scss 2:9 root stylesheet
WARNING in ./src/style/main.scss (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/style/main.scss)
Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
Deprecation Warning on line 502, column 2 of file:///Users/egorgruzdev/Desktop/js-middle-react-master/node_modules/bootstrap/scss/_reboot.scss:502:2:
Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.

More info: https://sass-lang.com/d/mixed-decls

502 | font-weight: $legend-font-weight;

node_modules/bootstrap/scss/_reboot.scss 503:3 @import
node_modules/bootstrap/scss/bootstrap.scss 16:9 @import
src/style/main.scss 2:9 root stylesheet
WARNING in ./src/style/main.scss (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/style/main.scss)
Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
Deprecation Warning on line 503, column 2 of file:///Users/egorgruzdev/Desktop/js-middle-react-master/node_modules/bootstrap/scss/_reboot.scss:503:2:
Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in & {}.

More info: https://sass-lang.com/d/mixed-decls

503 | line-height: inherit;

node_modules/bootstrap/scss/_reboot.scss 504:3 @import
node_modules/bootstrap/scss/bootstrap.scss 16:9 @import
src/style/main.scss 2:9 root stylesheet
WARNING in ./src/style/main.scss (./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/style/main.scss)
Module Warning (from ./node_modules/sass-loader/dist/cjs.js):
30 repetitive deprecation warnings omitted.
Run in verbose mode to see all warnings.

[iwebexpert]

Deprecation Warning on line 39, column 4 of file:///Users/egorgruzdev/Desktop/js-middle-react-master/node_modules/bootstrap/scss/_type.scss:39:4:
Sass's behavior for declarations that appear after nested

Дело скорее всего в версии SASS.
Подробнее: twbs/bootstrap#40621

Можно еще попробовать отключить Warning в консоли.
Пример:

// webpack.config.js
module.exports = {
  // другие настройки
  module: {
    rules: [
      {
        test: /\.scss$/,
        use: [
          'style-loader',
          'css-loader',
          {
            loader: 'sass-loader',
            options: {
              sassOptions: {
                quietDeps: true,
              },
            },
          },
        ],
      },
    ],
  },
};

[iwebexpert]

Можно дополнительно добавить иконку.
Все доступные иконки: https://react-icons.github.io/react-icons/
Это мелочь

[iwebexpert]

Попробуйте здесь использовать конструкцию React.useMemo() для оптимизации filteredData