Skip to content

Commit 57658a5

Browse files
mohdashraf010897mohdashraf010897
authored
fix(maps): breaking examples with RS v4 (#2188)
* chore(maps): GeoDistanceDropdown example * chore(maps): GeoDistanceSlider example * chore(maps): ReactiveMap example * fix(maps): mongo GeoDistanceDropdown example * fix(maps): mongo GeoDistanceSlider example * fix(maps): mongo ReactiveMap example * fix(maps): mongo ReactiveMap example - remove DataSearch * fix: lint issues * fix(maps): removed unstable_renderSubtreeIntoContainer method
1 parent 6a028ce commit 57658a5

File tree

19 files changed

+357
-455
lines changed

19 files changed

+357
-455
lines changed

‎packages/maps/examples/GeoDistanceDropdown/package.json‎

Lines changed: 37 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,38 @@
11
{
2-
"name": "geodistancedropdown",
3-
"version": "1.0.0",
4-
"description": "GeoDistanceDropdown example for ReactiveSearch",
5-
"main": "index.js",
6-
"license": "Apache-2.0",
7-
"dependencies": {
8-
"@appbaseio/reactivemaps": "3.0.2",
9-
"@appbaseio/reactivesearch": "4.0.0-rc.1",
10-
"react": "^17.0.0",
11-
"react-dom": "^17.0.0",
12-
"react-scripts": "3.0.1"
13-
},
14-
"scripts": {
15-
"start": "react-scripts start",
16-
"build": "react-scripts build",
17-
"test": "react-scripts test",
18-
"eject": "react-scripts eject"
19-
},
20-
"browserslist": {
21-
"production": [
22-
">0.2%",
23-
"not dead",
24-
"not op_mini all"
25-
],
26-
"development": [
27-
"last 1 chrome version",
28-
"last 1 firefox version",
29-
"last 1 safari version"
30-
]
31-
}
32-
}
2+
"name": "geodistancedropdown",
3+
"version": "1.0.0",
4+
"description": "GeoDistanceDropdown example for ReactiveSearch",
5+
"main": "index.js",
6+
"license": "Apache-2.0",
7+
"dependencies": {
8+
"@appbaseio/reactivemaps": "3.0.2",
9+
"@appbaseio/reactivesearch": "4.0.0-rc.1",
10+
"react": "^18.2.0",
11+
"react-dom": "^18.2.0",
12+
"react-scripts": "5.0.1"
13+
},
14+
"eslintConfig": {
15+
"extends": [
16+
"react-app",
17+
"react-app/jest"
18+
]
19+
},
20+
"scripts": {
21+
"start": "react-scripts start",
22+
"build": "react-scripts build",
23+
"test": "react-scripts test",
24+
"eject": "react-scripts eject"
25+
},
26+
"browserslist": {
27+
"production": [
28+
">0.2%",
29+
"not dead",
30+
"not op_mini all"
31+
],
32+
"development": [
33+
"last 1 chrome version",
34+
"last 1 firefox version",
35+
"last 1 safari version"
36+
]
37+
}
38+
}

‎packages/maps/examples/GeoDistanceDropdown/public/index.html‎

Lines changed: 15 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,22 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="utf-8" />
5-
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
6-
<meta name="viewport" content="width=device-width, initial-scale=1" />
7-
<meta name="theme-color" content="#000000" />
8-
<meta http-equiv="X-UA-Compatible" content="ie=edge">
9-
<title>GeoDistanceDropdown</title>
10-
<link href="https://use.fontawesome.com/releases/v5.0.2/css/all.css" rel="stylesheet">
11-
<link
3+
<head>
4+
<meta charset="utf-8" />
5+
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1" />
7+
<meta name="theme-color" content="#000000" />
8+
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
9+
<title>GeoDistanceDropdown</title>
10+
<link href="https://use.fontawesome.com/releases/v5.0.2/css/all.css" rel="stylesheet" />
11+
<link
1212
href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.4/leaflet.css"
1313
rel="stylesheet"
1414
/>
15-
<!--
16-
manifest.json provides metadata used when your web app is installed on a
17-
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
18-
-->
19-
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
20-
<!--
21-
Notice the use of %PUBLIC_URL% in the tags above.
22-
It will be replaced with the URL of the `public` folder during the build.
23-
Only files inside the `public` folder can be referenced from the HTML.
2415

25-
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
26-
work correctly both with client-side routing and a non-root public URL.
27-
Learn how to configure a non-root public URL by running `npm run build`.
28-
-->
29-
</head>
30-
<body>
31-
<noscript>You need to enable JavaScript to run this app.</noscript>
32-
<div id="root"></div>
33-
<!--
34-
This HTML file is a template.
35-
If you open it directly in the browser, you will see an empty page.
36-
37-
You can add webfonts, meta tags, or analytics to this file.
38-
The build step will place the bundled scripts into the <body> tag.
39-
40-
To begin the development, run `npm start` or `yarn start`.
41-
To create a production bundle, use `npm run build` or `yarn build`.
42-
-->
43-
</body>
16+
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
17+
</head>
18+
<body>
19+
<noscript>You need to enable JavaScript to run this app.</noscript>
20+
<div id="root"></div>
21+
</body>
4422
</html>

‎packages/maps/examples/GeoDistanceDropdown/src/index.js‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import React from 'react';
2-
import ReactDOM from 'react-dom';
1+
import ReactDOM from 'react-dom/client';
2+
import { Component } from 'react';
33
import { ReactiveBase, SelectedFilters } from '@appbaseio/reactivesearch';
44
import {
55
ReactiveOpenStreetMap,
@@ -18,7 +18,7 @@ const providers = [
1818
value: 'openstreetMap',
1919
},
2020
];
21-
class App extends React.Component {
21+
class App extends Component {
2222
constructor() {
2323
super();
2424

@@ -45,7 +45,7 @@ class App extends React.Component {
4545
react: {
4646
and: 'GeoDistanceDropdown',
4747
},
48-
onPopoverClick: item => <div>{item.venue.venue_name}</div>,
48+
onPopoverClick: (item) => <div>{item.venue.venue_name}</div>,
4949
showMapStyles: true,
5050
};
5151
return (
@@ -126,4 +126,5 @@ class App extends React.Component {
126126
}
127127
}
128128

129-
ReactDOM.render(<App />, document.getElementById('root'));
129+
const root = ReactDOM.createRoot(document.getElementById('root'));
130+
root.render(<App />);

‎packages/maps/examples/GeoDistanceSlider/package.json‎

Lines changed: 37 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,38 @@
11
{
2-
"name": "geodistanceslider",
3-
"version": "1.0.0",
4-
"description": "GeoDistanceSlider example for ReactiveSearch",
5-
"main": "index.js",
6-
"license": "Apache-2.0",
7-
"dependencies": {
8-
"@appbaseio/reactivemaps": "3.0.2",
9-
"@appbaseio/reactivesearch": "4.0.0-rc.1",
10-
"react": "^17.0.0",
11-
"react-dom": "^17.0.0",
12-
"react-scripts": "3.0.1"
13-
},
14-
"scripts": {
15-
"start": "react-scripts start",
16-
"build": "react-scripts build",
17-
"test": "react-scripts test",
18-
"eject": "react-scripts eject"
19-
},
20-
"browserslist": {
21-
"production": [
22-
">0.2%",
23-
"not dead",
24-
"not op_mini all"
25-
],
26-
"development": [
27-
"last 1 chrome version",
28-
"last 1 firefox version",
29-
"last 1 safari version"
30-
]
31-
}
32-
}
2+
"name": "geodistanceslider",
3+
"version": "1.0.0",
4+
"description": "GeoDistanceSlider example for ReactiveSearch",
5+
"main": "index.js",
6+
"license": "Apache-2.0",
7+
"dependencies": {
8+
"@appbaseio/reactivemaps": "3.0.2",
9+
"@appbaseio/reactivesearch": "4.0.0-rc.1",
10+
"react": "^18.2.0",
11+
"react-dom": "^18.2.0",
12+
"react-scripts": "5.0.1"
13+
},
14+
"eslintConfig": {
15+
"extends": [
16+
"react-app",
17+
"react-app/jest"
18+
]
19+
},
20+
"scripts": {
21+
"start": "react-scripts start",
22+
"build": "react-scripts build",
23+
"test": "react-scripts test",
24+
"eject": "react-scripts eject"
25+
},
26+
"browserslist": {
27+
"production": [
28+
">0.2%",
29+
"not dead",
30+
"not op_mini all"
31+
],
32+
"development": [
33+
"last 1 chrome version",
34+
"last 1 firefox version",
35+
"last 1 safari version"
36+
]
37+
}
38+
}

‎packages/maps/examples/GeoDistanceSlider/public/index.html‎

Lines changed: 18 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,25 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="utf-8" />
5-
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
6-
<meta name="viewport" content="width=device-width, initial-scale=1" />
7-
<meta name="theme-color" content="#000000" />
8-
<meta http-equiv="X-UA-Compatible" content="ie=edge">
9-
<title>GeoDistanceSlider</title>
10-
<link href="https://use.fontawesome.com/releases/v5.0.2/css/all.css" rel="stylesheet">
11-
<link
3+
<head>
4+
<meta charset="utf-8" />
5+
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1" />
7+
<meta name="theme-color" content="#000000" />
8+
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
9+
<title>GeoDistanceSlider</title>
10+
<link href="https://use.fontawesome.com/releases/v5.0.2/css/all.css" rel="stylesheet" />
11+
<link
1212
href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.3.4/leaflet.css"
1313
rel="stylesheet"
1414
/>
15-
<!--
16-
manifest.json provides metadata used when your web app is installed on a
17-
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
18-
-->
19-
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
20-
<!--
21-
Notice the use of %PUBLIC_URL% in the tags above.
22-
It will be replaced with the URL of the `public` folder during the build.
23-
Only files inside the `public` folder can be referenced from the HTML.
15+
<!-- one can add the below library to supress warning - "Consider marking event handler as
16+
'passive' to make the page more responsive" -->
17+
<!-- <script type="text/javascript" src="https://unpkg.com/default-passive-events"></script> -->
2418

25-
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
26-
work correctly both with client-side routing and a non-root public URL.
27-
Learn how to configure a non-root public URL by running `npm run build`.
28-
-->
29-
</head>
30-
<body>
31-
<noscript>You need to enable JavaScript to run this app.</noscript>
32-
<div id="root"></div>
33-
<!--
34-
This HTML file is a template.
35-
If you open it directly in the browser, you will see an empty page.
36-
37-
You can add webfonts, meta tags, or analytics to this file.
38-
The build step will place the bundled scripts into the <body> tag.
39-
40-
To begin the development, run `npm start` or `yarn start`.
41-
To create a production bundle, use `npm run build` or `yarn build`.
42-
-->
43-
</body>
19+
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
20+
</head>
21+
<body>
22+
<noscript>You need to enable JavaScript to run this app.</noscript>
23+
<div id="root"></div>
24+
</body>
4425
</html>

‎packages/maps/examples/GeoDistanceSlider/src/index.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import React from 'react';
2-
import ReactDOM from 'react-dom';
1+
import ReactDOM from 'react-dom/client';
2+
import { Component } from 'react';
33
import { ReactiveBase, SelectedFilters } from '@appbaseio/reactivesearch';
44
import {
55
ReactiveGoogleMap,
@@ -18,7 +18,7 @@ const providers = [
1818
value: 'openstreetMap',
1919
},
2020
];
21-
class App extends React.Component {
21+
class App extends Component {
2222
constructor() {
2323
super();
2424

@@ -128,4 +128,5 @@ class App extends React.Component {
128128
}
129129
}
130130

131-
ReactDOM.render(<App />, document.getElementById('root'));
131+
const root = ReactDOM.createRoot(document.getElementById('root'));
132+
root.render(<App />);

‎packages/maps/examples/ReactiveMap/package.json‎

Lines changed: 37 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,38 @@
11
{
2-
"name": "reactivemap",
3-
"version": "1.0.0",
4-
"description": "ReactiveMap example for ReactiveSearch",
5-
"main": "index.js",
6-
"license": "Apache-2.0",
7-
"dependencies": {
8-
"@appbaseio/reactivemaps": "3.0.2",
9-
"@appbaseio/reactivesearch": "4.0.0-rc.1",
10-
"react": "^17.0.0",
11-
"react-dom": "^17.0.0",
12-
"react-scripts": "3.0.1"
13-
},
14-
"scripts": {
15-
"start": "react-scripts start",
16-
"build": "react-scripts build",
17-
"test": "react-scripts test",
18-
"eject": "react-scripts eject"
19-
},
20-
"browserslist": {
21-
"production": [
22-
">0.2%",
23-
"not dead",
24-
"not op_mini all"
25-
],
26-
"development": [
27-
"last 1 chrome version",
28-
"last 1 firefox version",
29-
"last 1 safari version"
30-
]
31-
}
32-
}
2+
"name": "reactivemap",
3+
"version": "1.0.0",
4+
"description": "ReactiveMap example for ReactiveSearch",
5+
"main": "index.js",
6+
"license": "Apache-2.0",
7+
"dependencies": {
8+
"@appbaseio/reactivemaps": "3.0.2",
9+
"@appbaseio/reactivesearch": "4.0.0-rc.1",
10+
"react": "^18.2.0",
11+
"react-dom": "^18.2.0",
12+
"react-scripts": "5.0.1"
13+
},
14+
"scripts": {
15+
"start": "react-scripts start",
16+
"build": "react-scripts build",
17+
"test": "react-scripts test",
18+
"eject": "react-scripts eject"
19+
},
20+
"eslintConfig": {
21+
"extends": [
22+
"react-app",
23+
"react-app/jest"
24+
]
25+
},
26+
"browserslist": {
27+
"production": [
28+
">0.2%",
29+
"not dead",
30+
"not op_mini all"
31+
],
32+
"development": [
33+
"last 1 chrome version",
34+
"last 1 firefox version",
35+
"last 1 safari version"
36+
]
37+
}
38+
}

0 commit comments

Comments
 (0)