@arcblock/graphql-playground 2.2.2 → 2.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/lib/index.js +4 -3
  2. package/package.json +5 -5
  3. package/src/index.js +5 -4
package/lib/index.js CHANGED
@@ -77,7 +77,8 @@ function PrettifyButton() {
77
77
 
78
78
  function GraphQLPlayground(props) {
79
79
  const newProps = (0, _Util.mergeProps)(props, GraphQLPlayground, ['style', 'persistentQuery', 'enableQueryComposer', 'enableCodeExporter', 'enableHistory']);
80
- const history = (0, _reactRouterDom.useHistory)();
80
+ const location = (0, _reactRouterDom.useLocation)();
81
+ const navigate = (0, _reactRouterDom.useNavigate)();
81
82
  const graphiql = (0, _react.useRef)(null);
82
83
  const subscriptionClient = (0, _react.useRef)(null);
83
84
  const [schema, setSchema] = (0, _react.useState)(null);
@@ -89,11 +90,11 @@ function GraphQLPlayground(props) {
89
90
  const {
90
91
  pathname,
91
92
  search
92
- } = history.location;
93
+ } = location;
93
94
  const params = (0, _Util.parseQuery)(search);
94
95
  params.query = newQuery;
95
96
  const newUrl = "".concat(pathname, "?").concat((0, _Util.stringifyQuery)(params));
96
- history.replace(newUrl);
97
+ navigate(newUrl);
97
98
  };
98
99
 
99
100
  (0, _react.useEffect)(() => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arcblock/graphql-playground",
3
- "version": "2.2.2",
3
+ "version": "2.3.0",
4
4
  "description": "A React Component to interact with GraphQL APIs",
5
5
  "keywords": [
6
6
  "react",
@@ -29,15 +29,15 @@
29
29
  "url": "https://github.com/ArcBlock/ux/issues"
30
30
  },
31
31
  "dependencies": {
32
- "@arcblock/ux": "^2.2.2",
32
+ "@arcblock/ux": "^2.3.0",
33
33
  "axios": "^0.21.4",
34
34
  "core-js": "^3.24.1",
35
- "graphiql": "^1.10.0",
35
+ "graphiql": "^1.11.3",
36
36
  "graphiql-code-exporter": "^3.0.3",
37
37
  "graphiql-explorer": "^0.9.0",
38
38
  "graphql": "^16.5.0",
39
39
  "react-load-script": "^0.0.6",
40
- "react-router-dom": "^5.3.3",
40
+ "react-router-dom": "^6.3.0",
41
41
  "styled-components": "^5.3.5"
42
42
  },
43
43
  "peerDependencies": {
@@ -55,5 +55,5 @@
55
55
  "eslint-plugin-react-hooks": "^4.6.0",
56
56
  "jest": "^24.9.0"
57
57
  },
58
- "gitHead": "3329ac7ede9cdb8b65c925bb9359ee0e23ad1aa6"
58
+ "gitHead": "1d17ca422c95117bbf74c199b21692e478aa5003"
59
59
  }
package/src/index.js CHANGED
@@ -13,7 +13,7 @@ import CodeExporterSnippets from 'graphiql-code-exporter/lib/snippets';
13
13
  import { buildClientSchema, getIntrospectionQuery } from 'graphql';
14
14
  import { useHistoryContext, usePrettifyEditors } from '@graphiql/react';
15
15
 
16
- import { useHistory } from 'react-router-dom';
16
+ import { useNavigate, useLocation } from 'react-router-dom';
17
17
  import 'graphiql/graphiql.css';
18
18
 
19
19
  import 'graphiql-code-exporter/CodeExporter.css';
@@ -41,7 +41,8 @@ export default function GraphQLPlayground(props) {
41
41
  'enableHistory',
42
42
  ]);
43
43
 
44
- const history = useHistory();
44
+ const location = useLocation();
45
+ const navigate = useNavigate();
45
46
  const graphiql = useRef(null);
46
47
  const subscriptionClient = useRef(null);
47
48
  const [schema, setSchema] = useState(null);
@@ -50,11 +51,11 @@ export default function GraphQLPlayground(props) {
50
51
  const [codeExporterIsOpen, setExporterOpen] = useState(false);
51
52
 
52
53
  const persistQuery = (newQuery) => {
53
- const { pathname, search } = history.location;
54
+ const { pathname, search } = location;
54
55
  const params = parseQuery(search);
55
56
  params.query = newQuery;
56
57
  const newUrl = `${pathname}?${stringifyQuery(params)}`;
57
- history.replace(newUrl);
58
+ navigate(newUrl);
58
59
  };
59
60
 
60
61
  useEffect(() => {