build: upgrade deps
This commit is contained in:
parent
089ead3888
commit
5f6261790c
8 changed files with 821 additions and 621 deletions
72
package.json
72
package.json
|
@ -24,21 +24,21 @@
|
||||||
"@babel/runtime": "^7.12.5",
|
"@babel/runtime": "^7.12.5",
|
||||||
"@hsjs/react-cache": "0.0.0-alpha.aa94237",
|
"@hsjs/react-cache": "0.0.0-alpha.aa94237",
|
||||||
"@reach/tooltip": "^0.12.1",
|
"@reach/tooltip": "^0.12.1",
|
||||||
"@sentry/browser": "^5.28.0",
|
"@sentry/browser": "^5.29.2",
|
||||||
"chart.js": "^2.9.2",
|
"chart.js": "^2.9.2",
|
||||||
"clsx": "^1.1.0",
|
"clsx": "^1.1.0",
|
||||||
"core-js": "^3.8.1",
|
"core-js": "^3.8.2",
|
||||||
"date-fns": "^2.16.0",
|
"date-fns": "^2.16.0",
|
||||||
"fontsource-open-sans": "^3.0.9",
|
"fontsource-open-sans": "^4.0.0",
|
||||||
"fontsource-roboto-mono": "^3.0.3",
|
"fontsource-roboto-mono": "^4.0.0",
|
||||||
"framer-motion": "^2.9.5",
|
"framer-motion": "^3.1.2",
|
||||||
"history": "^5.0.0",
|
"history": "^5.0.0",
|
||||||
"i18next": "^19.8.4",
|
"i18next": "^19.8.4",
|
||||||
"i18next-browser-languagedetector": "^6.0.1",
|
"i18next-browser-languagedetector": "^6.0.1",
|
||||||
"i18next-http-backend": "^1.0.21",
|
"i18next-http-backend": "^1.0.21",
|
||||||
"immer": "^8.0.0",
|
"immer": "^8.0.0",
|
||||||
"invariant": "^2.2.4",
|
"invariant": "^2.2.4",
|
||||||
"lodash-es": "^4.17.14",
|
"lodash-es": "^4.17.20",
|
||||||
"memoize-one": "^5.1.1",
|
"memoize-one": "^5.1.1",
|
||||||
"modern-normalize": "^1.0.0",
|
"modern-normalize": "^1.0.0",
|
||||||
"prop-types": "^15.5.10",
|
"prop-types": "^15.5.10",
|
||||||
|
@ -46,15 +46,15 @@
|
||||||
"react-dom": "0.0.0-experimental-94c0244ba",
|
"react-dom": "0.0.0-experimental-94c0244ba",
|
||||||
"react-feather": "^2.0.9",
|
"react-feather": "^2.0.9",
|
||||||
"react-helmet": "^6.1.0",
|
"react-helmet": "^6.1.0",
|
||||||
"react-i18next": "^11.7.4",
|
"react-i18next": "^11.8.5",
|
||||||
"react-icons": "^4.1.0",
|
"react-icons": "^4.1.0",
|
||||||
"react-modal": "^3.12.1",
|
"react-modal": "^3.12.1",
|
||||||
"react-query": "^2.26.3",
|
"react-query": "^3.5.9",
|
||||||
"react-router": "6.0.0-beta.0",
|
"react-router": "6.0.0-beta.0",
|
||||||
"react-router-dom": "6.0.0-beta.0",
|
"react-router-dom": "6.0.0-beta.0",
|
||||||
"react-switch": "^5.0.1",
|
"react-switch": "^5.0.1",
|
||||||
"react-table": "^7.6.2",
|
"react-table": "^7.6.2",
|
||||||
"react-tabs": "^3.1.0",
|
"react-tabs": "^3.1.2",
|
||||||
"react-tiny-fab": "^4.0.2",
|
"react-tiny-fab": "^4.0.2",
|
||||||
"react-window": "^1.8.5",
|
"react-window": "^1.8.5",
|
||||||
"recoil": "^0.1.2",
|
"recoil": "^0.1.2",
|
||||||
|
@ -67,68 +67,70 @@
|
||||||
"workbox-strategies": "^6.0.2"
|
"workbox-strategies": "^6.0.2"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@babel/core": "^7.12.9",
|
"@babel/core": "^7.12.10",
|
||||||
"@babel/plugin-proposal-class-properties": "^7.7.4",
|
"@babel/plugin-proposal-class-properties": "^7.7.4",
|
||||||
"@babel/plugin-proposal-do-expressions": "^7.7.4",
|
"@babel/plugin-proposal-do-expressions": "^7.7.4",
|
||||||
"@babel/plugin-syntax-dynamic-import": "^7.7.4",
|
"@babel/plugin-syntax-dynamic-import": "^7.7.4",
|
||||||
"@babel/plugin-transform-runtime": "^7.11.0",
|
"@babel/plugin-transform-runtime": "^7.12.10",
|
||||||
"@babel/preset-env": "^7.12.7",
|
"@babel/preset-env": "^7.12.11",
|
||||||
"@babel/preset-flow": "^7.7.4",
|
"@babel/preset-flow": "^7.7.4",
|
||||||
"@babel/preset-react": "^7.12.7",
|
"@babel/preset-react": "^7.12.10",
|
||||||
"@babel/preset-typescript": "^7.12.7",
|
"@babel/preset-typescript": "^7.12.7",
|
||||||
"@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
|
"@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
|
||||||
"@types/invariant": "^2.2.33",
|
"@types/invariant": "^2.2.33",
|
||||||
"@types/jest": "^26.0.16",
|
"@types/jest": "^26.0.19",
|
||||||
"@types/lodash-es": "^4.17.3",
|
"@types/lodash-es": "^4.17.4",
|
||||||
"@types/react": "^17.0.0",
|
"@types/react": "^17.0.0",
|
||||||
"@types/react-dom": "^17.0.0",
|
"@types/react-dom": "^17.0.0",
|
||||||
"@types/react-helmet": "^6.1.0",
|
"@types/react-helmet": "^6.1.0",
|
||||||
"@types/react-modal": "^3.10.6",
|
"@types/react-modal": "^3.10.6",
|
||||||
"@types/react-tabs": "^2.3.2",
|
"@types/react-tabs": "^2.3.2",
|
||||||
"@typescript-eslint/eslint-plugin": "^4.9.0",
|
"@types/react-window": "^1.8.2",
|
||||||
"@typescript-eslint/parser": "^4.9.0",
|
"@typescript-eslint/eslint-plugin": "^4.11.1",
|
||||||
"autoprefixer": "^10.0.4",
|
"@typescript-eslint/parser": "^4.11.1",
|
||||||
|
"autoprefixer": "^10.1.0",
|
||||||
"babel-eslint": "10.x",
|
"babel-eslint": "10.x",
|
||||||
"babel-loader": "^8.2.2",
|
"babel-loader": "^8.2.2",
|
||||||
"clean-webpack-plugin": "^3.0.0",
|
"clean-webpack-plugin": "^3.0.0",
|
||||||
"copy-webpack-plugin": "^6.3.2",
|
"copy-webpack-plugin": "^7.0.0",
|
||||||
"css-loader": "^5.0.1",
|
"css-loader": "^5.0.1",
|
||||||
"css-minimizer-webpack-plugin": "^1.1.5",
|
"css-minimizer-webpack-plugin": "^1.1.5",
|
||||||
"cssnano": "^4.1.7",
|
"cssnano": "^4.1.7",
|
||||||
"eslint": "^7.15.0",
|
"eslint": "^7.17.0",
|
||||||
"eslint-config-airbnb-base": "^14.2.1",
|
"eslint-config-airbnb-base": "^14.2.1",
|
||||||
"eslint-config-prettier": "^7.0.0",
|
"eslint-config-prettier": "^7.1.0",
|
||||||
"eslint-config-react-app": "^6.0.0",
|
"eslint-config-react-app": "^6.0.0",
|
||||||
"eslint-import-resolver-webpack": "^0.13.0",
|
"eslint-import-resolver-webpack": "^0.13.0",
|
||||||
"eslint-plugin-flowtype": "^5.2.0",
|
"eslint-plugin-flowtype": "^5.2.0",
|
||||||
"eslint-plugin-import": "^2.22.1",
|
"eslint-plugin-import": "^2.22.1",
|
||||||
"eslint-plugin-jest": "^24.1.3",
|
"eslint-plugin-jest": "^24.1.3",
|
||||||
"eslint-plugin-jsx-a11y": "^6.3.1",
|
"eslint-plugin-jsx-a11y": "^6.3.1",
|
||||||
"eslint-plugin-react": "^7.21.4",
|
"eslint-plugin-react": "^7.22.0",
|
||||||
"eslint-plugin-react-hooks": "^4.1.2",
|
"eslint-plugin-react-hooks": "^4.1.2",
|
||||||
"eslint-plugin-simple-import-sort": "^6.0.1",
|
"eslint-plugin-simple-import-sort": "^7.0.0",
|
||||||
|
"express": "^4.17.1",
|
||||||
"file-loader": "^6.1.1",
|
"file-loader": "^6.1.1",
|
||||||
"fork-ts-checker-notifier-webpack-plugin": "^3.0.0",
|
"fork-ts-checker-notifier-webpack-plugin": "^3.0.0",
|
||||||
"fork-ts-checker-webpack-plugin": "^6.0.5",
|
"fork-ts-checker-webpack-plugin": "^6.0.8",
|
||||||
"html-webpack-plugin": "^4.5.0",
|
"html-webpack-plugin": "^4.5.1",
|
||||||
"mini-css-extract-plugin": "^1.3.2",
|
"mini-css-extract-plugin": "^1.3.3",
|
||||||
"postcss": "^8.1.14",
|
"postcss": "^8.2.2",
|
||||||
"postcss-custom-media": "^7.0.8",
|
"postcss-custom-media": "^7.0.8",
|
||||||
"postcss-extend-rule": "^3.0.0",
|
"postcss-extend-rule": "^3.0.0",
|
||||||
"postcss-import": "^13.0.0",
|
"postcss-import": "^14.0.0",
|
||||||
"postcss-loader": "^4.1.0",
|
"postcss-loader": "^4.1.0",
|
||||||
"postcss-nested": "^5.0.2",
|
"postcss-nested": "^5.0.3",
|
||||||
"postcss-simple-vars": "^6.0.0",
|
"postcss-simple-vars": "^6.0.2",
|
||||||
"prettier": "^2.2.1",
|
"prettier": "^2.2.1",
|
||||||
"react-refresh": "^0.9.0",
|
"react-refresh": "^0.9.0",
|
||||||
"resize-observer-polyfill": "^1.5.1",
|
"resize-observer-polyfill": "^1.5.1",
|
||||||
"style-loader": "^2.0.0",
|
"style-loader": "^2.0.0",
|
||||||
"terser-webpack-plugin": "^5.0.0",
|
"terser-webpack-plugin": "^5.0.0",
|
||||||
"ts-loader": "^8.0.11",
|
"ts-loader": "^8.0.13",
|
||||||
"typescript": "^4.1.2",
|
"typescript": "^4.1.3",
|
||||||
"webpack": "^5.10.0",
|
"webpack": "^5.11.1",
|
||||||
"webpack-bundle-analyzer": "^4.2.0",
|
"webpack-bundle-analyzer": "^4.3.0",
|
||||||
"webpack-cli": "^4.2.0",
|
"webpack-cli": "^4.3.1",
|
||||||
"webpack-dev-middleware": "^4.0.2",
|
"webpack-dev-middleware": "^4.0.2",
|
||||||
"webpack-hot-middleware": "^2.22.2",
|
"webpack-hot-middleware": "^2.22.2",
|
||||||
"workbox-webpack-plugin": "^6.0.2"
|
"workbox-webpack-plugin": "^6.0.2"
|
||||||
|
|
|
@ -1,11 +1,13 @@
|
||||||
import './Root.css';
|
import './Root.css';
|
||||||
|
|
||||||
import React, { lazy, Suspense } from 'react';
|
import React, { lazy, Suspense } from 'react';
|
||||||
|
import { QueryClientProvider } from 'react-query';
|
||||||
import { PartialRouteObject } from 'react-router';
|
import { PartialRouteObject } from 'react-router';
|
||||||
import { HashRouter as Router, useRoutes } from 'react-router-dom';
|
import { HashRouter as Router, useRoutes } from 'react-router-dom';
|
||||||
import { RecoilRoot } from 'recoil';
|
import { RecoilRoot } from 'recoil';
|
||||||
import { About } from 'src/components/about/About';
|
import { About } from 'src/components/about/About';
|
||||||
import { Head } from 'src/components/shared/Head';
|
import { Head } from 'src/components/shared/Head';
|
||||||
|
import { queryClient } from 'src/misc/query';
|
||||||
|
|
||||||
import { actions, initialState } from '../store';
|
import { actions, initialState } from '../store';
|
||||||
import APIConfig from './APIConfig';
|
import APIConfig from './APIConfig';
|
||||||
|
@ -99,6 +101,7 @@ const Root = () => (
|
||||||
<ErrorBoundary>
|
<ErrorBoundary>
|
||||||
<RecoilRoot>
|
<RecoilRoot>
|
||||||
<StateProvider initialState={initialState} actions={actions}>
|
<StateProvider initialState={initialState} actions={actions}>
|
||||||
|
<QueryClientProvider client={queryClient}>
|
||||||
<Router>
|
<Router>
|
||||||
<div className={s0.app}>
|
<div className={s0.app}>
|
||||||
<Head />
|
<Head />
|
||||||
|
@ -107,6 +110,7 @@ const Root = () => (
|
||||||
</Suspense>
|
</Suspense>
|
||||||
</div>
|
</div>
|
||||||
</Router>
|
</Router>
|
||||||
|
</QueryClientProvider>
|
||||||
</StateProvider>
|
</StateProvider>
|
||||||
</RecoilRoot>
|
</RecoilRoot>
|
||||||
</ErrorBoundary>
|
</ErrorBoundary>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { RotateCw } from 'react-feather';
|
import { RotateCw } from 'react-feather';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { queryCache, useQuery } from 'react-query';
|
import { useQuery, useQueryClient } from 'react-query';
|
||||||
import { areEqual, VariableSizeList } from 'react-window';
|
import { areEqual, VariableSizeList } from 'react-window';
|
||||||
import { useRecoilState } from 'recoil';
|
import { useRecoilState } from 'recoil';
|
||||||
import { fetchRuleProviders } from 'src/api/rule-provider';
|
import { fetchRuleProviders } from 'src/api/rule-provider';
|
||||||
|
@ -76,17 +76,11 @@ const mapState = (s: State) => ({
|
||||||
export default connect(mapState)(Rules);
|
export default connect(mapState)(Rules);
|
||||||
|
|
||||||
function useRuleAndProvider(apiConfig: ClashAPIConfig) {
|
function useRuleAndProvider(apiConfig: ClashAPIConfig) {
|
||||||
const { data: rules, isFetching } = useQuery(
|
const { data: rules, isFetching } = useQuery(['/rules', apiConfig], () =>
|
||||||
['/rules', apiConfig],
|
fetchRules('/rules', apiConfig)
|
||||||
fetchRules,
|
|
||||||
{
|
|
||||||
suspense: true,
|
|
||||||
}
|
|
||||||
);
|
);
|
||||||
const { data: provider } = useQuery(
|
const { data: provider } = useQuery(['/providers/rules', apiConfig], () =>
|
||||||
['/providers/rules', apiConfig],
|
fetchRuleProviders('/providers/rules', apiConfig)
|
||||||
fetchRuleProviders,
|
|
||||||
{ suspense: true }
|
|
||||||
);
|
);
|
||||||
|
|
||||||
const [filterText] = useRecoilState(ruleFilterText);
|
const [filterText] = useRecoilState(ruleFilterText);
|
||||||
|
@ -106,10 +100,11 @@ function useRuleAndProvider(apiConfig: ClashAPIConfig) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function useInvalidateQueries() {
|
function useInvalidateQueries() {
|
||||||
|
const queryClient = useQueryClient();
|
||||||
return useCallback(() => {
|
return useCallback(() => {
|
||||||
queryCache.invalidateQueries('/rules');
|
queryClient.invalidateQueries('/rules');
|
||||||
queryCache.invalidateQueries('/providers/rules');
|
queryClient.invalidateQueries('/providers/rules');
|
||||||
}, []);
|
}, [queryClient]);
|
||||||
}
|
}
|
||||||
|
|
||||||
function Rules({ apiConfig }) {
|
function Rules({ apiConfig }) {
|
||||||
|
|
|
@ -43,12 +43,8 @@ function Version({
|
||||||
}
|
}
|
||||||
|
|
||||||
function AboutImpl(props: Props) {
|
function AboutImpl(props: Props) {
|
||||||
const { data: version } = useQuery(
|
const { data: version } = useQuery(['/version', props.apiConfig], () =>
|
||||||
['/version', props.apiConfig],
|
fetchVersion('/version', props.apiConfig)
|
||||||
fetchVersion,
|
|
||||||
{
|
|
||||||
suspense: true,
|
|
||||||
}
|
|
||||||
);
|
);
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
|
|
@ -2,7 +2,7 @@ import cx from 'clsx';
|
||||||
import { formatDistance } from 'date-fns';
|
import { formatDistance } from 'date-fns';
|
||||||
import * as React from 'react';
|
import * as React from 'react';
|
||||||
import { RotateCw } from 'react-feather';
|
import { RotateCw } from 'react-feather';
|
||||||
import { queryCache, useMutation } from 'react-query';
|
import { useMutation, useQueryClient } from 'react-query';
|
||||||
import { refreshRuleProviderByName } from 'src/api/rule-provider';
|
import { refreshRuleProviderByName } from 'src/api/rule-provider';
|
||||||
import Button from 'src/components/Button';
|
import Button from 'src/components/Button';
|
||||||
import { SectionNameType } from 'src/components/shared/Basic';
|
import { SectionNameType } from 'src/components/shared/Basic';
|
||||||
|
@ -14,9 +14,10 @@ function useRefresh(
|
||||||
name: string,
|
name: string,
|
||||||
apiConfig: ClashAPIConfig
|
apiConfig: ClashAPIConfig
|
||||||
): [(ev: React.MouseEvent<HTMLButtonElement>) => unknown, boolean] {
|
): [(ev: React.MouseEvent<HTMLButtonElement>) => unknown, boolean] {
|
||||||
const [mutate, { isLoading }] = useMutation(refreshRuleProviderByName, {
|
const queryClient = useQueryClient();
|
||||||
|
const { mutate, isLoading } = useMutation(refreshRuleProviderByName, {
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
queryCache.invalidateQueries('/providers/rules');
|
queryClient.invalidateQueries('/providers/rules');
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
11
src/misc/query.ts
Normal file
11
src/misc/query.ts
Normal file
|
@ -0,0 +1,11 @@
|
||||||
|
import { QueryCache, QueryClient } from 'react-query';
|
||||||
|
|
||||||
|
const queryCache = new QueryCache();
|
||||||
|
export const queryClient = new QueryClient({
|
||||||
|
queryCache,
|
||||||
|
defaultOptions: {
|
||||||
|
queries: {
|
||||||
|
suspense: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
|
@ -72,7 +72,7 @@ const plugins = [
|
||||||
title: 'TypeScript',
|
title: 'TypeScript',
|
||||||
excludeWarnings: false,
|
excludeWarnings: false,
|
||||||
}),
|
}),
|
||||||
new CopyPlugin({ patterns: [{ from: 'assets/*', flatten: true }] }),
|
new CopyPlugin({ patterns: [{ from: 'assets' }] }),
|
||||||
new CleanWebpackPlugin(),
|
new CleanWebpackPlugin(),
|
||||||
// chart.js requires moment
|
// chart.js requires moment
|
||||||
// and we don't need locale stuff in moment
|
// and we don't need locale stuff in moment
|
||||||
|
|
Loading…
Reference in a new issue