Merge branch 'main' into feature/mapsindoors-instance

MapsPeople · Jun 4, 2024 · cce0efb · cce0efb
2 parents bfba478 + 43bf660
commit cce0efb
Show file tree

Hide file tree

Showing 10 changed files with 7,333 additions and 0 deletions.
diff --git a/packages/tests/README.md b/packages/tests/README.md
@@ -1,5 +1,7 @@
 # MapsIndoors Web UI Tests
 
+This package can assist in testing out the Map Template assets that are published to NPM before publishing.
+
 ## `web-component`
 
 Use a locally built Map Template Web Component on a simple HTML page.
@@ -12,3 +14,17 @@ The page requires the web component to be built in the Map Template package:
 2. In the file `packages/tests/web-component/index.html` configure the Map Template Web Component, `<mapsindoors-map />` with the props that you want (access tokens, API keys etc.).
 3. From within the `packages/tests/web-component` folder, serve the HTML file by running `npm run dev`.
 4. Open `http://localhost:3000` in your browser.
+
+## `react-component`
+
+Use a locally built Map Template React Component in a React App.
+
+### Running it
+
+The React test app requires the React component to be built in the Map Template package:
+
+1. From within the `packages/map-template` folder, run `npm run build-for-npm`.
+2. In the file `packages/tests/react-component/src/App.jsx` configure the `<MapsIndoorsMap />` React component with the props that you want (access tokens, API key etc.).
+3. From within the `packages/tests/react-component` folder, make sure to install the dependencies `npm install`. This should only be done once.
+4. From within the `packages/tests/react-component` folder, serve the app by running `npm run dev`.
+5. Open `http://localhost:3000` in your browser.
diff --git a/packages/tests/react-component/.eslintrc.cjs b/packages/tests/react-component/.eslintrc.cjs
@@ -0,0 +1,21 @@
+module.exports = {
+    root: true,
+    env: { browser: true, es2020: true },
+    extends: [
+        'eslint:recommended',
+        'plugin:react/recommended',
+        'plugin:react/jsx-runtime',
+        'plugin:react-hooks/recommended',
+    ],
+    ignorePatterns: ['dist', '.eslintrc.cjs'],
+    parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
+    settings: { react: { version: '18.2' } },
+    plugins: ['react-refresh'],
+    rules: {
+        'react/jsx-no-target-blank': 'off',
+        'react-refresh/only-export-components': [
+            'warn',
+            { allowConstantExport: true },
+        ],
+    },
+}
diff --git a/packages/tests/react-component/.gitignore b/packages/tests/react-component/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/packages/tests/react-component/index.html b/packages/tests/react-component/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>MapsIndoors Map Template</title>
+</head>
+<body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+</body>
+</html>