mirror of
https://github.com/utopia-os/utopia-ui.git
synced 2025-12-13 07:46:10 +00:00
Merge branch 'main' into invites-2
This commit is contained in:
Maximilian Harz
commit
c1e528b3cd
43
.github/dependabot.yml
vendored
Normal file
43
.github/dependabot.yml
vendored
Normal file
@ -0,0 +1,43 @@
|
||||
version: 2
|
||||
updates:
|
||||
- package-ecosystem: "npm"
|
||||
directory: "/"
|
||||
schedule:
|
||||
interval: "weekly"
|
||||
day: "wednesday"
|
||||
time: "03:00"
|
||||
timezone: "Europe/Berlin"
|
||||
open-pull-requests-limit: 99
|
||||
groups:
|
||||
react-ecosystem:
|
||||
patterns:
|
||||
- "react"
|
||||
- "react-dom"
|
||||
- "@types/react"
|
||||
- "@types/react-dom"
|
||||
typescript-eslint:
|
||||
patterns:
|
||||
- "@typescript-eslint/parser"
|
||||
- "@typescript-eslint/eslint-plugin"
|
||||
tiptap:
|
||||
patterns:
|
||||
- "@tiptap/core"
|
||||
- "@tiptap/extension-*"
|
||||
- "@tiptap/pm"
|
||||
- "@tiptap/react"
|
||||
- "@tiptap/starter-kit"
|
||||
labels:
|
||||
- "dependencies"
|
||||
- "javascript"
|
||||
|
||||
- package-ecosystem: "github-actions"
|
||||
directory: "/"
|
||||
schedule:
|
||||
interval: "weekly"
|
||||
day: "wednesday"
|
||||
time: "03:00"
|
||||
timezone: "Europe/Berlin"
|
||||
open-pull-requests-limit: 99
|
||||
labels:
|
||||
- "dependencies"
|
||||
- "github_actions"
|
||||
8
.github/workflows/test.e2e.yml
vendored
8
.github/workflows/test.e2e.yml
vendored
@ -140,7 +140,7 @@ jobs:
|
||||
|
||||
- name: Upload test artifacts on failure
|
||||
if: failure()
|
||||
uses: actions/upload-artifact@2848b2cda0e5190984587ec6bb1f36730ca78d50 # v4.6.2
|
||||
uses: actions/upload-artifact@330a01c490aca151604b8cf639adc76d48f6c5d4 # v4.6.2
|
||||
with:
|
||||
name: cypress-test-results-${{ github.run_id }}
|
||||
path: |
|
||||
@ -170,7 +170,7 @@ jobs:
|
||||
working-directory: ./cypress
|
||||
|
||||
- name: Download test artifacts
|
||||
uses: actions/download-artifact@4a24838f3d5601fd639834081e118c2995d51e1c # v5.0.0
|
||||
uses: actions/download-artifact@f093f21ca4cfa7c75ccbbc2be54da76a0c7e1f05 # v5.0.0
|
||||
with:
|
||||
name: cypress-test-results-${{ github.run_id }}
|
||||
path: ./cypress
|
||||
@ -191,7 +191,7 @@ jobs:
|
||||
GITHUB_SHA: ${{ github.sha }}
|
||||
|
||||
- name: Upload consolidated test report
|
||||
uses: actions/upload-artifact@2848b2cda0e5190984587ec6bb1f36730ca78d50 # v4.6.2
|
||||
uses: actions/upload-artifact@330a01c490aca151604b8cf639adc76d48f6c5d4 # v4.6.2
|
||||
with:
|
||||
name: e2e-test-report-${{ github.run_id }}
|
||||
path: cypress/results/html/
|
||||
@ -200,7 +200,7 @@ jobs:
|
||||
|
||||
- name: Upload raw test data (for debugging)
|
||||
if: failure()
|
||||
uses: actions/upload-artifact@2848b2cda0e5190984587ec6bb1f36730ca78d50 # v4.6.2
|
||||
uses: actions/upload-artifact@330a01c490aca151604b8cf639adc76d48f6c5d4 # v4.6.2
|
||||
with:
|
||||
name: e2e-raw-data-${{ github.run_id }}
|
||||
path: |
|
||||
|
||||
2
.github/workflows/test.lint.pr.yml
vendored
2
.github/workflows/test.lint.pr.yml
vendored
@ -32,6 +32,8 @@ jobs:
|
||||
backend
|
||||
app
|
||||
lib
|
||||
deps
|
||||
deps-dev
|
||||
docu
|
||||
docker
|
||||
release
|
||||
|
||||
17
README.md
17
README.md
@ -23,8 +23,23 @@ Utopia Map is made for networks and initiatives that aim to connect people in r
|
||||
|
||||
Clone the repository and get started with the following commands:
|
||||
|
||||
**Start docker**
|
||||
```bash
|
||||
npm install
|
||||
docker compose up -d
|
||||
```
|
||||
**Initialize backend**
|
||||
|
||||
```bash
|
||||
sudo chmod 777 -R ./data/
|
||||
cd backend/
|
||||
./push.sh
|
||||
./seed.sh
|
||||
```
|
||||
After this the frontend is running on http://localhost:8080 and the backend on http://localhost:8055
|
||||
|
||||
**Start dev server**
|
||||
```bash
|
||||
cd app/
|
||||
npm run dev
|
||||
```
|
||||
|
||||
|
||||
12331
app/package-lock.json
generated
12331
app/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -15,10 +15,9 @@
|
||||
"dependencies": {
|
||||
"@directus/sdk": "^17.0.2",
|
||||
"@heroicons/react": "^2.1.1",
|
||||
"@tailwindcss/vite": "^4.0.15",
|
||||
"@tailwindcss/vite": "^4.1.17",
|
||||
"@types/geojson": "^7946.0.10",
|
||||
"axios": "^1.6.5",
|
||||
"date-fns": "^3.3.1",
|
||||
"axios": "^1.13.2",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-rnd": "^10.4.1",
|
||||
@ -28,32 +27,32 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint-community/eslint-plugin-eslint-comments": "^4.4.1",
|
||||
"@types/node": "^22.15.28",
|
||||
"@types/node": "^24.10.1",
|
||||
"@types/react": "^18.2.79",
|
||||
"@types/react-dom": "^18.2.25",
|
||||
"@typescript-eslint/eslint-plugin": "^5.62.0",
|
||||
"@typescript-eslint/parser": "^5.62.0",
|
||||
"@vitejs/plugin-react": "^4.0.0",
|
||||
"daisyui": "^5.0.6",
|
||||
"daisyui": "^5.5.5",
|
||||
"eslint": "^8.24.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-config-prettier": "^10.1.8",
|
||||
"eslint-config-standard": "^17.1.0",
|
||||
"eslint-import-resolver-typescript": "^3.6.3",
|
||||
"eslint-import-resolver-typescript": "^4.4.4",
|
||||
"eslint-plugin-import": "^2.31.0",
|
||||
"eslint-plugin-json": "^3.1.0",
|
||||
"eslint-plugin-n": "^16.6.2",
|
||||
"eslint-plugin-n": "^17.23.1",
|
||||
"eslint-plugin-no-catch-all": "^1.1.0",
|
||||
"eslint-plugin-prettier": "^5.2.1",
|
||||
"eslint-plugin-promise": "^6.1.1",
|
||||
"eslint-plugin-promise": "^7.2.1",
|
||||
"eslint-plugin-react": "^7.31.8",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.18",
|
||||
"eslint-plugin-react-hooks": "^7.0.1",
|
||||
"eslint-plugin-react-refresh": "^0.4.24",
|
||||
"eslint-plugin-security": "^3.0.1",
|
||||
"eslint-plugin-yml": "^1.14.0",
|
||||
"postcss": "^8.4.30",
|
||||
"tailwindcss": "^4.0.15",
|
||||
"typescript": "^5.0.2",
|
||||
"vite": "^6.2.0",
|
||||
"vite-plugin-pwa": "^0.21.1"
|
||||
"tailwindcss": "^4.1.17",
|
||||
"typescript": "^5.9.3",
|
||||
"vite": "^7.2.2",
|
||||
"vite-plugin-pwa": "^1.1.0"
|
||||
}
|
||||
}
|
||||
|
||||
@ -56,6 +56,7 @@ import MapContainer from './pages/MapContainer'
|
||||
import { getBottomRoutes, routes } from './routes/sidebar'
|
||||
import { config } from './config'
|
||||
import { InviteApi } from './api/inviteApi'
|
||||
import { MapPinIcon } from '@heroicons/react/24/solid'
|
||||
|
||||
const userApi = new UserApi()
|
||||
const inviteApi = new InviteApi(userApi)
|
||||
@ -140,14 +141,19 @@ function App() {
|
||||
?.filter((l: LayerProps) => l.listed)
|
||||
.map((l: LayerProps) => ({
|
||||
path: '/' + l.name, // url
|
||||
icon: (
|
||||
icon: l.markerIcon?.image ? (
|
||||
<SVG
|
||||
src={`${config.apiUrl}assets/${l.markerIcon.image_outline ?? l.markerIcon.image}`}
|
||||
className='tw:w-6 tw:h-6'
|
||||
style={{
|
||||
width: `${(l.markerIcon.size ?? 18) * 1.3}px`,
|
||||
height: `${(l.markerIcon.size ?? 18) * 1.3}px`,
|
||||
}}
|
||||
preProcessor={(code: string) =>
|
||||
code.replace(/stroke=".*?"/g, 'stroke="currentColor"')
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<MapPinIcon className='tw:w-6 tw:h-6' />
|
||||
),
|
||||
name: l.name, // name that appear in Sidebar
|
||||
color: l.menuColor,
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
"template": "{{id}}"
|
||||
},
|
||||
"readonly": false,
|
||||
"required": true,
|
||||
"required": false,
|
||||
"sort": 2,
|
||||
"special": [
|
||||
"m2o"
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
"name": "markerShape",
|
||||
"table": "layers",
|
||||
"data_type": "character varying",
|
||||
"default_value": null,
|
||||
"default_value": "circle",
|
||||
"max_length": 255,
|
||||
"numeric_precision": null,
|
||||
"numeric_scale": null,
|
||||
|
||||
@ -28,7 +28,7 @@
|
||||
"name": "zoom_offset",
|
||||
"table": "maps",
|
||||
"data_type": "integer",
|
||||
"default_value": -1,
|
||||
"default_value": 0,
|
||||
"max_length": null,
|
||||
"numeric_precision": 32,
|
||||
"numeric_scale": 0,
|
||||
|
||||
@ -1,47 +0,0 @@
|
||||
{
|
||||
"collection": "marker_icons",
|
||||
"field": "image_outline",
|
||||
"type": "uuid",
|
||||
"meta": {
|
||||
"collection": "marker_icons",
|
||||
"conditions": null,
|
||||
"display": null,
|
||||
"display_options": null,
|
||||
"field": "image_outline",
|
||||
"group": null,
|
||||
"hidden": false,
|
||||
"interface": "file-image",
|
||||
"note": null,
|
||||
"options": {
|
||||
"folder": "f255d3a7-8ecc-4ee0-b584-dee753317415"
|
||||
},
|
||||
"readonly": false,
|
||||
"required": false,
|
||||
"sort": 4,
|
||||
"special": [
|
||||
"file"
|
||||
],
|
||||
"translations": null,
|
||||
"validation": null,
|
||||
"validation_message": null,
|
||||
"width": "half"
|
||||
},
|
||||
"schema": {
|
||||
"name": "image_outline",
|
||||
"table": "marker_icons",
|
||||
"data_type": "uuid",
|
||||
"default_value": null,
|
||||
"max_length": null,
|
||||
"numeric_precision": null,
|
||||
"numeric_scale": null,
|
||||
"is_nullable": true,
|
||||
"is_unique": false,
|
||||
"is_indexed": false,
|
||||
"is_primary_key": false,
|
||||
"is_generated": false,
|
||||
"generation_expression": null,
|
||||
"has_auto_increment": false,
|
||||
"foreign_key_table": "directus_files",
|
||||
"foreign_key_column": "id"
|
||||
}
|
||||
}
|
||||
@ -1,43 +0,0 @@
|
||||
{
|
||||
"collection": "marker_icons",
|
||||
"field": "size_outline",
|
||||
"type": "decimal",
|
||||
"meta": {
|
||||
"collection": "marker_icons",
|
||||
"conditions": null,
|
||||
"display": null,
|
||||
"display_options": null,
|
||||
"field": "size_outline",
|
||||
"group": null,
|
||||
"hidden": false,
|
||||
"interface": "input",
|
||||
"note": null,
|
||||
"options": null,
|
||||
"readonly": false,
|
||||
"required": false,
|
||||
"sort": 5,
|
||||
"special": null,
|
||||
"translations": null,
|
||||
"validation": null,
|
||||
"validation_message": null,
|
||||
"width": "half"
|
||||
},
|
||||
"schema": {
|
||||
"name": "size_outline",
|
||||
"table": "marker_icons",
|
||||
"data_type": "numeric",
|
||||
"default_value": null,
|
||||
"max_length": null,
|
||||
"numeric_precision": 10,
|
||||
"numeric_scale": 5,
|
||||
"is_nullable": true,
|
||||
"is_unique": false,
|
||||
"is_indexed": false,
|
||||
"is_primary_key": false,
|
||||
"is_generated": false,
|
||||
"generation_expression": null,
|
||||
"has_auto_increment": false,
|
||||
"foreign_key_table": null,
|
||||
"foreign_key_column": null
|
||||
}
|
||||
}
|
||||
@ -1,25 +0,0 @@
|
||||
{
|
||||
"collection": "marker_icons",
|
||||
"field": "image_outline",
|
||||
"related_collection": "directus_files",
|
||||
"meta": {
|
||||
"junction_field": null,
|
||||
"many_collection": "marker_icons",
|
||||
"many_field": "image_outline",
|
||||
"one_allowed_collections": null,
|
||||
"one_collection": "directus_files",
|
||||
"one_collection_field": null,
|
||||
"one_deselect_action": "nullify",
|
||||
"one_field": null,
|
||||
"sort_field": null
|
||||
},
|
||||
"schema": {
|
||||
"table": "marker_icons",
|
||||
"column": "image_outline",
|
||||
"foreign_key_table": "directus_files",
|
||||
"foreign_key_column": "id",
|
||||
"constraint_name": "marker_icons_image_outline_foreign",
|
||||
"on_update": "NO ACTION",
|
||||
"on_delete": "SET NULL"
|
||||
}
|
||||
}
|
||||
1171
cypress/package-lock.json
generated
1171
cypress/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -24,14 +24,14 @@
|
||||
"@eslint/js": "^9.36.0",
|
||||
"@types/mochawesome": "^6.2.4",
|
||||
"@types/node": "^24.5.2",
|
||||
"cypress": "^15.3.0",
|
||||
"cypress-split": "^1.24.23",
|
||||
"eslint": "^9.36.0",
|
||||
"eslint-plugin-cypress": "^5.1.1",
|
||||
"cypress": "^15.6.0",
|
||||
"cypress-split": "^1.24.25",
|
||||
"eslint": "^9.39.1",
|
||||
"eslint-plugin-cypress": "^5.2.0",
|
||||
"mochawesome": "^7.1.4",
|
||||
"mochawesome-merge": "^4.3.0",
|
||||
"mochawesome-report-generator": "^6.2.0",
|
||||
"typescript": "^5.9.2",
|
||||
"typescript-eslint": "^8.44.1"
|
||||
"mochawesome-report-generator": "^6.3.2",
|
||||
"typescript": "^5.9.3",
|
||||
"typescript-eslint": "^8.47.0"
|
||||
}
|
||||
}
|
||||
|
||||
924
lib/examples/1-basic-map/package-lock.json
generated
924
lib/examples/1-basic-map/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
84
lib/examples/2-static-layers/package-lock.json
generated
84
lib/examples/2-static-layers/package-lock.json
generated
@ -28,31 +28,48 @@
|
||||
}
|
||||
},
|
||||
"../..": {
|
||||
"version": "3.0.86",
|
||||
"name": "utopia-ui",
|
||||
"version": "3.0.111",
|
||||
"license": "GPL-3.0-only",
|
||||
"dependencies": {
|
||||
"@heroicons/react": "^2.0.17",
|
||||
"@tanstack/react-query": "^5.17.8",
|
||||
"@maplibre/maplibre-gl-leaflet": "^0.1.3",
|
||||
"@tiptap/core": "^3.6.5",
|
||||
"@tiptap/extension-bubble-menu": "^3.6.5",
|
||||
"@tiptap/extension-color": "^3.6.5",
|
||||
"@tiptap/extension-image": "^3.6.5",
|
||||
"@tiptap/extension-link": "^3.6.5",
|
||||
"@tiptap/extension-placeholder": "^3.6.5",
|
||||
"@tiptap/extension-youtube": "^3.6.5",
|
||||
"@tiptap/pm": "^3.6.5",
|
||||
"@tiptap/react": "^3.6.5",
|
||||
"@tiptap/starter-kit": "^3.6.5",
|
||||
"axios": "^1.6.5",
|
||||
"date-fns": "^3.3.1",
|
||||
"browser-image-compression": "^2.0.2",
|
||||
"classnames": "^2.5.1",
|
||||
"leaflet": "^1.9.4",
|
||||
"leaflet.locatecontrol": "^0.79.0",
|
||||
"maplibre-gl": "^5.9.0",
|
||||
"radash": "^12.1.0",
|
||||
"react-colorful": "^5.6.1",
|
||||
"react-image-crop": "^10.1.8",
|
||||
"react-dropzone": "^14.3.8",
|
||||
"react-icons": "^5.5.0",
|
||||
"react-image-crop": "^11.0.10",
|
||||
"react-inlinesvg": "^4.2.0",
|
||||
"react-leaflet": "^4.2.1",
|
||||
"react-leaflet-cluster": "^2.1.0",
|
||||
"react-markdown": "^9.0.1",
|
||||
"react-photo-album": "^3.0.2",
|
||||
"react-router-dom": "^6.16.0",
|
||||
"react-qr-code": "^2.0.16",
|
||||
"react-toastify": "^9.1.3",
|
||||
"remark-breaks": "^4.0.0",
|
||||
"tiptap-markdown": "^0.9.0",
|
||||
"yet-another-react-lightbox": "^3.21.7"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint-community/eslint-plugin-eslint-comments": "^4.4.1",
|
||||
"@rollup/plugin-alias": "^5.1.1",
|
||||
"@rollup/plugin-commonjs": "^28.0.3",
|
||||
"@rollup/plugin-node-resolve": "^16.0.0",
|
||||
"@rollup/plugin-typescript": "^12.1.2",
|
||||
"@tailwindcss/postcss": "^4.0.14",
|
||||
@ -67,8 +84,8 @@
|
||||
"@typescript-eslint/parser": "^5.62.0",
|
||||
"@vitejs/plugin-react": "^4.3.4",
|
||||
"@vitest/coverage-v8": "^3.0.5",
|
||||
"cypress": "^14.0.3",
|
||||
"daisyui": "^5.0.6",
|
||||
"cypress": "^15.6.0",
|
||||
"daisyui": "^5.2.3",
|
||||
"eslint": "^8.24.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-config-standard": "^17.1.0",
|
||||
@ -84,7 +101,7 @@
|
||||
"eslint-plugin-react-refresh": "^0.4.18",
|
||||
"eslint-plugin-security": "^3.0.1",
|
||||
"eslint-plugin-yml": "^1.14.0",
|
||||
"happy-dom": "^16.8.1",
|
||||
"happy-dom": "^20.0.0",
|
||||
"postcss": "^8.4.21",
|
||||
"prettier": "^3.3.3",
|
||||
"react": "^18.3.1",
|
||||
@ -102,9 +119,13 @@
|
||||
"vite-plugin-svgr": "^4.3.0",
|
||||
"vitest": "^3.0.5"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=22.20.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0"
|
||||
"react-dom": "^18.2.0",
|
||||
"react-router-dom": "^6.23.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@ampproject/remapping": {
|
||||
@ -969,19 +990,32 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@eslint/plugin-kit": {
|
||||
"version": "0.3.1",
|
||||
"resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.3.1.tgz",
|
||||
"integrity": "sha512-0J+zgWxHN+xXONWIyPWKFMgVuJoZuGiIFu8yxk7RJjxkzpGmyja5wRFqZIVtjDVOQpV+Rw0iOAjYPE2eQyjr0w==",
|
||||
"version": "0.3.5",
|
||||
"resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.3.5.tgz",
|
||||
"integrity": "sha512-Z5kJ+wU3oA7MMIqVR9tyZRtjYPr4OC004Q4Rw7pgOKUOKkJfZ3O24nz3WYfGRpMDNmcOi3TwQOmgm7B7Tpii0w==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"@eslint/core": "^0.14.0",
|
||||
"@eslint/core": "^0.15.2",
|
||||
"levn": "^0.4.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@eslint/plugin-kit/node_modules/@eslint/core": {
|
||||
"version": "0.15.2",
|
||||
"resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.15.2.tgz",
|
||||
"integrity": "sha512-78Md3/Rrxh83gCxoUc0EiciuOHsIITzLy53m3d9UyiW8y9Dj2D29FeETqyKA+BRK76tnTp6RXWb3pCay8Oyomg==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"@types/json-schema": "^7.0.15"
|
||||
},
|
||||
"engines": {
|
||||
"node": "^18.18.0 || ^20.9.0 || >=21.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@humanfs/core": {
|
||||
"version": "0.19.1",
|
||||
"resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz",
|
||||
@ -1662,9 +1696,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz",
|
||||
"integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==",
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
|
||||
"integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
@ -1833,9 +1867,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/brace-expansion": {
|
||||
"version": "1.1.11",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
|
||||
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
|
||||
"version": "1.1.12",
|
||||
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
|
||||
"integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
@ -2544,9 +2578,9 @@
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/js-yaml": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
|
||||
"integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.1.tgz",
|
||||
"integrity": "sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
@ -3287,9 +3321,9 @@
|
||||
"link": true
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "6.3.5",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-6.3.5.tgz",
|
||||
"integrity": "sha512-cZn6NDFE7wdTpINgs++ZJ4N49W2vRp8LCKrn3Ob1kYNtOo21vfDoaV5GzBfLU4MovSAB8uNRm4jgzVQZ+mBzPQ==",
|
||||
"version": "6.4.1",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-6.4.1.tgz",
|
||||
"integrity": "sha512-+Oxm7q9hDoLMyJOYfUYBuHQo+dkAloi33apOPP56pzj+vsdJDzr+j1NISE5pyaAuKL4A3UD34qd0lx5+kfKp2g==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
|
||||
899
lib/examples/3-tags/package-lock.json
generated
899
lib/examples/3-tags/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
14658
lib/package-lock.json
generated
14658
lib/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -44,15 +44,15 @@
|
||||
"license": "GPL-3.0-only",
|
||||
"devDependencies": {
|
||||
"@eslint-community/eslint-plugin-eslint-comments": "^4.4.1",
|
||||
"@rollup/plugin-alias": "^5.1.1",
|
||||
"@rollup/plugin-commonjs": "^28.0.3",
|
||||
"@rollup/plugin-node-resolve": "^16.0.0",
|
||||
"@rollup/plugin-typescript": "^12.1.2",
|
||||
"@tailwindcss/postcss": "^4.0.14",
|
||||
"@rollup/plugin-alias": "^6.0.0",
|
||||
"@rollup/plugin-commonjs": "^29.0.0",
|
||||
"@rollup/plugin-node-resolve": "^16.0.3",
|
||||
"@rollup/plugin-typescript": "^12.3.0",
|
||||
"@tailwindcss/postcss": "^4.1.17",
|
||||
"@testing-library/jest-dom": "^6.6.3",
|
||||
"@testing-library/react": "^16.2.0",
|
||||
"@types/geojson": "^7946.0.14",
|
||||
"@types/leaflet": "^1.7.11",
|
||||
"@types/leaflet": "^1.9.21",
|
||||
"@types/leaflet.markercluster": "^1.5.5",
|
||||
"@types/react": "^18.2.0",
|
||||
"@types/react-dom": "^18.0.5",
|
||||
@ -60,21 +60,21 @@
|
||||
"@typescript-eslint/parser": "^5.62.0",
|
||||
"@vitejs/plugin-react": "^4.3.4",
|
||||
"@vitest/coverage-v8": "^3.0.5",
|
||||
"cypress": "^14.0.3",
|
||||
"daisyui": "^5.2.3",
|
||||
"cypress": "^15.6.0",
|
||||
"daisyui": "^5.5.5",
|
||||
"eslint": "^8.24.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-config-prettier": "^10.1.8",
|
||||
"eslint-config-standard": "^17.1.0",
|
||||
"eslint-import-resolver-typescript": "^3.6.3",
|
||||
"eslint-import-resolver-typescript": "^4.4.4",
|
||||
"eslint-plugin-import": "^2.31.0",
|
||||
"eslint-plugin-json": "^3.1.0",
|
||||
"eslint-plugin-n": "^16.6.2",
|
||||
"eslint-plugin-n": "^17.23.1",
|
||||
"eslint-plugin-no-catch-all": "^1.1.0",
|
||||
"eslint-plugin-prettier": "^5.2.1",
|
||||
"eslint-plugin-promise": "^6.1.1",
|
||||
"eslint-plugin-promise": "^7.2.1",
|
||||
"eslint-plugin-react": "^7.31.8",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.18",
|
||||
"eslint-plugin-react-hooks": "^7.0.1",
|
||||
"eslint-plugin-react-refresh": "^0.4.24",
|
||||
"eslint-plugin-security": "^3.0.1",
|
||||
"eslint-plugin-yml": "^1.14.0",
|
||||
"happy-dom": "^20.0.0",
|
||||
@ -82,16 +82,16 @@
|
||||
"prettier": "^3.3.3",
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1",
|
||||
"rollup": "^4.34.6",
|
||||
"rollup": "^4.53.3",
|
||||
"rollup-plugin-dts": "^6.1.1",
|
||||
"rollup-plugin-postcss": "^4.0.2",
|
||||
"rollup-plugin-svg": "^2.0.0",
|
||||
"tailwindcss": "^4.0.14",
|
||||
"tailwindcss": "^4.1.17",
|
||||
"typedoc": "^0.27.6",
|
||||
"typedoc-plugin-coverage": "^3.4.1",
|
||||
"typedoc-plugin-missing-exports": "^3.1.0",
|
||||
"typescript": "^5.7.3",
|
||||
"vite": "^6.0.11",
|
||||
"typescript": "^5.9.3",
|
||||
"vite": "^7.2.2",
|
||||
"vite-plugin-svgr": "^4.3.0",
|
||||
"vitest": "^3.0.5"
|
||||
},
|
||||
@ -103,21 +103,19 @@
|
||||
"dependencies": {
|
||||
"@heroicons/react": "^2.0.17",
|
||||
"@maplibre/maplibre-gl-leaflet": "^0.1.3",
|
||||
"@tanstack/react-query": "^5.17.8",
|
||||
"@tiptap/core": "^3.6.5",
|
||||
"@tiptap/extension-bubble-menu": "^3.6.5",
|
||||
"@tiptap/extension-color": "^3.6.5",
|
||||
"@tiptap/extension-image": "^3.6.5",
|
||||
"@tiptap/extension-link": "^3.6.5",
|
||||
"@tiptap/extension-placeholder": "^3.6.5",
|
||||
"@tiptap/extension-youtube": "^3.6.5",
|
||||
"@tiptap/core": "^3.11.0",
|
||||
"@tiptap/extension-bubble-menu": "^3.11.0",
|
||||
"@tiptap/extension-color": "^3.11.0",
|
||||
"@tiptap/extension-image": "^3.11.0",
|
||||
"@tiptap/extension-link": "^3.11.0",
|
||||
"@tiptap/extension-placeholder": "^3.11.0",
|
||||
"@tiptap/extension-youtube": "^3.11.0",
|
||||
"@tiptap/pm": "^3.6.5",
|
||||
"@tiptap/react": "^3.6.5",
|
||||
"@tiptap/starter-kit": "^3.6.5",
|
||||
"axios": "^1.6.5",
|
||||
"@tiptap/react": "^3.11.0",
|
||||
"@tiptap/starter-kit": "^3.11.0",
|
||||
"axios": "^1.13.2",
|
||||
"browser-image-compression": "^2.0.2",
|
||||
"classnames": "^2.5.1",
|
||||
"date-fns": "^3.3.1",
|
||||
"leaflet": "^1.9.4",
|
||||
"leaflet.locatecontrol": "^0.79.0",
|
||||
"maplibre-gl": "^5.9.0",
|
||||
@ -125,12 +123,12 @@
|
||||
"react-colorful": "^5.6.1",
|
||||
"react-dropzone": "^14.3.8",
|
||||
"react-icons": "^5.5.0",
|
||||
"react-image-crop": "^10.1.8",
|
||||
"react-image-crop": "^11.0.10",
|
||||
"react-inlinesvg": "^4.2.0",
|
||||
"react-leaflet": "^4.2.1",
|
||||
"react-leaflet-cluster": "^2.1.0",
|
||||
"react-leaflet-cluster": "^3.1.1",
|
||||
"react-markdown": "^9.0.1",
|
||||
"react-photo-album": "^3.0.2",
|
||||
"react-photo-album": "^3.2.1",
|
||||
"react-qr-code": "^2.0.16",
|
||||
"react-toastify": "^9.1.3",
|
||||
"remark-breaks": "^4.0.0",
|
||||
|
||||
@ -1,4 +1,3 @@
|
||||
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
|
||||
import { useContext, createContext } from 'react'
|
||||
import { BrowserRouter as Router, useInRouterContext } from 'react-router-dom'
|
||||
import { ToastContainer } from 'react-toastify'
|
||||
@ -54,8 +53,6 @@ export const ContextWrapper = ({ children }: { children: React.ReactNode }) => {
|
||||
|
||||
// eslint-disable-next-line react/prop-types
|
||||
export const Wrappers = ({ children }) => {
|
||||
const queryClient = new QueryClient()
|
||||
|
||||
return (
|
||||
<PermissionsProvider initialPermissions={[]}>
|
||||
<TagsProvider initialTags={[]}>
|
||||
@ -64,30 +61,28 @@ export const Wrappers = ({ children }) => {
|
||||
<ItemsProvider initialItems={[]}>
|
||||
<SelectPositionProvider>
|
||||
<LeafletRefsProvider initialLeafletRefs={{}}>
|
||||
<QueryClientProvider client={queryClient}>
|
||||
<AppStateProvider>
|
||||
<ClusterRefProvider>
|
||||
<PopupFormProvider>
|
||||
<QuestsProvider initialOpen={true}>
|
||||
<ToastContainer
|
||||
position='top-right'
|
||||
autoClose={2000}
|
||||
hideProgressBar
|
||||
newestOnTop={false}
|
||||
closeOnClick
|
||||
rtl={false}
|
||||
pauseOnFocusLoss
|
||||
draggable
|
||||
pauseOnHover
|
||||
theme='light'
|
||||
closeButton={CloseButton}
|
||||
/>
|
||||
{children}
|
||||
</QuestsProvider>
|
||||
</PopupFormProvider>
|
||||
</ClusterRefProvider>
|
||||
</AppStateProvider>
|
||||
</QueryClientProvider>
|
||||
<AppStateProvider>
|
||||
<ClusterRefProvider>
|
||||
<PopupFormProvider>
|
||||
<QuestsProvider initialOpen={true}>
|
||||
<ToastContainer
|
||||
position='top-right'
|
||||
autoClose={2000}
|
||||
hideProgressBar
|
||||
newestOnTop={false}
|
||||
closeOnClick
|
||||
rtl={false}
|
||||
pauseOnFocusLoss
|
||||
draggable
|
||||
pauseOnHover
|
||||
theme='light'
|
||||
closeButton={CloseButton}
|
||||
/>
|
||||
{children}
|
||||
</QuestsProvider>
|
||||
</PopupFormProvider>
|
||||
</ClusterRefProvider>
|
||||
</AppStateProvider>
|
||||
</LeafletRefsProvider>
|
||||
</SelectPositionProvider>
|
||||
</ItemsProvider>
|
||||
|
||||
@ -64,7 +64,7 @@ export function SideBar({ routes, bottomRoutes }: { routes: Route[]; bottomRoute
|
||||
}}
|
||||
>
|
||||
<div
|
||||
className='tw:p-1.5 tw:rounded-selector tw:text-white'
|
||||
className='tw:p-1.5 tw:rounded-selector tw:text-white tw:h-9 tw:w-9 tw:flex tw:items-center tw:justify-center'
|
||||
style={{ backgroundColor: route.color ?? '#777' }}
|
||||
>
|
||||
{route.icon}
|
||||
|
||||
@ -44,7 +44,7 @@ export function RichTextEditor({
|
||||
|
||||
const regex = /!\[.*?\]\(.*?\)/g
|
||||
newValue = newValue.replace(regex, (match: string) => match + '\n\n')
|
||||
if (updateFormValue && newValue) {
|
||||
if (updateFormValue) {
|
||||
updateFormValue(newValue)
|
||||
}
|
||||
}
|
||||
|
||||
@ -41,6 +41,9 @@ export const Layer = ({
|
||||
const setItemsApi = useSetItemsApi()
|
||||
const setItemsData = useSetItemsData()
|
||||
|
||||
// Ensure markerShape has a valid value, default to 'circle' if null or empty
|
||||
const normalizedMarkerShape = markerShape || 'circle'
|
||||
|
||||
const addTag = useAddTag()
|
||||
const [newTagsToAdd] = useState<Tag[]>([])
|
||||
const [tagsReady] = useState<boolean>(false)
|
||||
@ -55,7 +58,7 @@ export const Layer = ({
|
||||
menuText,
|
||||
menuColor,
|
||||
markerIcon,
|
||||
markerShape,
|
||||
markerShape: normalizedMarkerShape,
|
||||
markerDefaultColor,
|
||||
markerDefaultColor2,
|
||||
api,
|
||||
@ -79,7 +82,7 @@ export const Layer = ({
|
||||
menuText,
|
||||
menuColor,
|
||||
markerIcon,
|
||||
markerShape,
|
||||
markerShape: normalizedMarkerShape,
|
||||
markerDefaultColor,
|
||||
markerDefaultColor2,
|
||||
api,
|
||||
@ -116,7 +119,7 @@ export const Layer = ({
|
||||
name,
|
||||
markerDefaultColor,
|
||||
markerDefaultColor2,
|
||||
markerShape,
|
||||
markerShape: normalizedMarkerShape,
|
||||
markerIcon,
|
||||
menuText,
|
||||
}}
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
/* eslint-disable @typescript-eslint/no-non-null-assertion */
|
||||
import { MapPinIcon } from '@heroicons/react/24/solid'
|
||||
import { useState } from 'react'
|
||||
import SVG from 'react-inlinesvg'
|
||||
|
||||
@ -94,13 +95,18 @@ export default function AddButton({
|
||||
e.preventDefault()
|
||||
}}
|
||||
>
|
||||
<img
|
||||
src={appState.assetsApi.url + layer.markerIcon.image}
|
||||
style={{
|
||||
filter: 'invert(100%) brightness(200%)',
|
||||
width: `${(layer.markerIcon.size ?? 18) * 1.3}px`,
|
||||
}}
|
||||
/>
|
||||
{layer.markerIcon?.image ? (
|
||||
<img
|
||||
src={appState.assetsApi.url + layer.markerIcon.image}
|
||||
style={{
|
||||
filter: 'invert(100%) brightness(200%)',
|
||||
width: `${(layer.markerIcon.size ?? 18) * 1.3}px`,
|
||||
height: `${(layer.markerIcon.size ?? 18) * 1.3}px`,
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<MapPinIcon className='tw:w-6 tw:h-6' style={{ color: '#ffffff' }} />
|
||||
)}
|
||||
</button>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
||||
/* eslint-disable @typescript-eslint/no-unsafe-call */
|
||||
import FlagIcon from '@heroicons/react/24/outline/FlagIcon'
|
||||
import MagnifyingGlassIcon from '@heroicons/react/24/outline/MagnifyingGlassIcon'
|
||||
import MapPinIcon from '@heroicons/react/24/outline/MapPinIcon'
|
||||
import axios from 'axios'
|
||||
import { LatLng, LatLngBounds, marker } from 'leaflet'
|
||||
import { useRef, useState } from 'react'
|
||||
@ -167,56 +167,85 @@ export const SearchControl = () => {
|
||||
{itemsResults.length > 0 && tagsResults.length > 0 && (
|
||||
<hr className='tw:opacity-50'></hr>
|
||||
)}
|
||||
{itemsResults.slice(0, 5).map((item) => (
|
||||
<div
|
||||
key={item.id}
|
||||
className='tw:cursor-pointer tw:hover:font-bold tw:flex tw:flex-row'
|
||||
data-cy='search-item-result'
|
||||
onClick={() => {
|
||||
const marker = Object.entries(leafletRefs).find((r) => r[1].item === item)?.[1]
|
||||
.marker
|
||||
if (marker) {
|
||||
navigate(`/${item.id}?${new URLSearchParams(window.location.search)}`)
|
||||
} else {
|
||||
navigate(
|
||||
'item/' + item.id + '?' + new URLSearchParams(window.location.search),
|
||||
)
|
||||
}
|
||||
}}
|
||||
>
|
||||
{item.layer?.markerIcon.image ? (
|
||||
<div
|
||||
className='tw:w-7 tw:h-full tw:flex tw:justify-center tw:items-center'
|
||||
data-cy='search-item-icon'
|
||||
>
|
||||
<SVG
|
||||
src={appState.assetsApi.url + item.layer.markerIcon.image}
|
||||
className='tw:text-current tw:mr-2 tw:mt-0'
|
||||
style={{ width: `${(item.layer.markerIcon.size ?? 18) * 1.2}px` }}
|
||||
preProcessor={(code: string): string => {
|
||||
code = code.replace(/fill=".*?"/g, 'fill="currentColor"')
|
||||
code = code.replace(/stroke=".*?"/g, 'stroke="currentColor"')
|
||||
return code
|
||||
}}
|
||||
{itemsResults.slice(0, 5).map((item) => {
|
||||
// Calculate color using the same logic as PopupView
|
||||
const itemTags =
|
||||
item.text
|
||||
?.match(/#[^\s#]+/g)
|
||||
?.map((tag) =>
|
||||
tags.find((t) => t.name.toLowerCase() === tag.slice(1).toLowerCase()),
|
||||
)
|
||||
.filter(Boolean) ?? []
|
||||
|
||||
let color1 = item.layer?.markerDefaultColor ?? '#777'
|
||||
if (item.color) {
|
||||
color1 = item.color
|
||||
} else if (itemTags[0]) {
|
||||
color1 = itemTags[0].color
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
key={item.id}
|
||||
className='tw:cursor-pointer tw:hover:font-bold tw:flex tw:flex-row tw:items-center tw:gap-2'
|
||||
data-cy='search-item-result'
|
||||
onClick={() => {
|
||||
const marker = Object.entries(leafletRefs).find(
|
||||
(r) => r[1].item === item,
|
||||
)?.[1].marker
|
||||
if (marker) {
|
||||
navigate(`/${item.id}?${new URLSearchParams(window.location.search)}`)
|
||||
} else {
|
||||
navigate(
|
||||
'item/' + item.id + '?' + new URLSearchParams(window.location.search),
|
||||
)
|
||||
}
|
||||
}}
|
||||
>
|
||||
{item.layer?.markerIcon?.image ? (
|
||||
<div
|
||||
className='tw:p-1.5 tw:rounded-selector tw:text-white tw:h-7 tw:w-7 tw:flex tw:items-center tw:justify-center tw:flex-shrink-0 tw:overflow-hidden'
|
||||
style={{ backgroundColor: color1 }}
|
||||
data-cy='search-item-icon'
|
||||
>
|
||||
<SVG
|
||||
src={appState.assetsApi.url + item.layer.markerIcon.image}
|
||||
className='tw:text-current tw:max-w-full tw:max-h-full'
|
||||
style={{
|
||||
width: `${item.layer.markerIcon.size ?? 18}px`,
|
||||
height: `${item.layer.markerIcon.size ?? 18}px`,
|
||||
}}
|
||||
preProcessor={(code: string): string => {
|
||||
code = code.replace(/fill=".*?"/g, 'fill="currentColor"')
|
||||
code = code.replace(/stroke=".*?"/g, 'stroke="currentColor"')
|
||||
return code
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
className='tw:w-7 tw:h-7 tw:flex-shrink-0'
|
||||
data-cy='search-item-icon-placeholder'
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<div className='tw:w-7' data-cy='search-item-icon-placeholder' />
|
||||
)}
|
||||
<div>
|
||||
<div className='tw:text-sm tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap tw:max-w-[17rem]'>
|
||||
{item.name}
|
||||
)}
|
||||
<div className='tw:flex tw:flex-col tw:min-w-0'>
|
||||
<div className='tw:text-sm tw:font-bold tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap'>
|
||||
{item.name}
|
||||
</div>
|
||||
<div className='tw:text-xs tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap'>
|
||||
{item.text}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
)
|
||||
})}
|
||||
{Array.from(geoResults).length > 0 &&
|
||||
(itemsResults.length > 0 || tagsResults.length > 0) && (
|
||||
<hr className='tw:opacity-50'></hr>
|
||||
)}
|
||||
{Array.from(geoResults).map((geo) => (
|
||||
<div
|
||||
className='tw:flex tw:flex-row tw:hover:font-bold tw:cursor-pointer'
|
||||
className='tw:flex tw:flex-row tw:items-center tw:hover:font-bold tw:cursor-pointer tw:gap-2'
|
||||
data-cy='search-geo-result'
|
||||
key={Math.random()}
|
||||
onClick={() => {
|
||||
@ -249,19 +278,21 @@ export const SearchControl = () => {
|
||||
hide()
|
||||
}}
|
||||
>
|
||||
<MagnifyingGlassIcon
|
||||
className='tw:text-current tw:mr-2 tw:mt-0 tw:w-5'
|
||||
data-cy='search-geo-icon'
|
||||
/>
|
||||
<div>
|
||||
<div className='tw:h-7 tw:w-7 tw:flex tw:items-center tw:justify-center tw:flex-shrink-0'>
|
||||
<MapPinIcon
|
||||
className='tw:text-current tw:w-5 tw:h-5'
|
||||
data-cy='search-geo-icon'
|
||||
/>
|
||||
</div>
|
||||
<div className='tw:flex tw:flex-col tw:min-w-0'>
|
||||
<div
|
||||
className='tw:text-sm tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap tw:max-w-[17rem]'
|
||||
className='tw:text-sm tw:font-bold tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap'
|
||||
data-cy='search-geo-name'
|
||||
>
|
||||
{geo?.properties.name ? geo?.properties.name : value}
|
||||
</div>
|
||||
<div
|
||||
className='tw:text-xs tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap tw:max-w-[17rem]'
|
||||
className='tw:text-xs tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap'
|
||||
data-cy='search-geo-details'
|
||||
>
|
||||
{geo?.properties?.city && `${capitalizeFirstLetter(geo?.properties?.city)}, `}{' '}
|
||||
@ -281,7 +312,7 @@ export const SearchControl = () => {
|
||||
))}
|
||||
{isGeoCoordinate(value) && (
|
||||
<div
|
||||
className='tw:flex tw:flex-row tw:hover:font-bold tw:cursor-pointer'
|
||||
className='tw:flex tw:flex-row tw:items-center tw:hover:font-bold tw:cursor-pointer tw:gap-2'
|
||||
data-cy='search-coordinate-result'
|
||||
onClick={() => {
|
||||
marker(
|
||||
@ -306,19 +337,21 @@ export const SearchControl = () => {
|
||||
)
|
||||
}}
|
||||
>
|
||||
<FlagIcon
|
||||
className='tw:text-current tw:mr-2 tw:mt-0 tw:w-4'
|
||||
data-cy='search-coordinate-icon'
|
||||
/>
|
||||
<div>
|
||||
<div className='tw:h-7 tw:w-7 tw:flex tw:items-center tw:justify-center tw:flex-shrink-0'>
|
||||
<FlagIcon
|
||||
className='tw:text-current tw:w-5 tw:h-5'
|
||||
data-cy='search-coordinate-icon'
|
||||
/>
|
||||
</div>
|
||||
<div className='tw:flex tw:flex-col tw:min-w-0'>
|
||||
<div
|
||||
className='tw:text-sm tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap tw:max-w-[17rem]'
|
||||
className='tw:text-sm tw:font-bold tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap'
|
||||
data-cy='search-coordinate-text'
|
||||
>
|
||||
{value}
|
||||
</div>
|
||||
<div
|
||||
className='tw:text-xs tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap tw:max-w-[17rem]'
|
||||
className='tw:text-xs tw:overflow-hidden tw:text-ellipsis tw:whitespace-nowrap'
|
||||
data-cy='search-coordinate-label'
|
||||
>
|
||||
{'Coordiante'}
|
||||
|
||||
@ -6,7 +6,7 @@ export const TagsControl = () => {
|
||||
const removeFilterTag = useRemoveFilterTag()
|
||||
|
||||
return (
|
||||
<div className='tw:flex tw:flex-wrap tw:mt-4 tw:w-[calc(100vw-2rem)] tw:max-w-xs'>
|
||||
<div className='tw:flex tw:flex-wrap tw:mt-4 tw:w-[calc(100vw-2rem)] tw:max-w-xs tw:relative'>
|
||||
{filterTags.map((tag) => (
|
||||
<div
|
||||
key={tag.id}
|
||||
|
||||
@ -33,9 +33,10 @@ export const useNavigationUrl = (coordinates?: [number, number]) => {
|
||||
export const useShareLogic = (item?: Item) => {
|
||||
const shareUrl = window.location.href
|
||||
const shareTitle = item?.name ?? 'Utopia Map Item'
|
||||
const inviteLink = item?.secrets
|
||||
? `${window.location.origin}/invite/${item.secrets[0].secret}`
|
||||
: shareUrl
|
||||
const inviteLink =
|
||||
item?.secrets && item.secrets.length > 0
|
||||
? `${window.location.origin}/invite/${item.secrets[0].secret}`
|
||||
: shareUrl
|
||||
|
||||
const copyLink = () => {
|
||||
navigator.clipboard
|
||||
|
||||
@ -85,7 +85,9 @@ export function HeaderView({
|
||||
onConfirm={deleteCallback ?? (() => undefined)}
|
||||
/>
|
||||
|
||||
<QRModal item={item} isOpen={qrModalOpen} onClose={() => setQrModalOpen(false)} />
|
||||
{showQrButton && (
|
||||
<QRModal item={item} isOpen={qrModalOpen} onClose={() => setQrModalOpen(false)} />
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
||||
/* eslint-disable @typescript-eslint/no-unsafe-call */
|
||||
import Markdown from 'react-markdown'
|
||||
import { Link as RouterLink } from 'react-router-dom'
|
||||
import remarkBreaks from 'remark-breaks'
|
||||
|
||||
import { useAddFilterTag } from '#components/Map/hooks/useFilter'
|
||||
@ -46,7 +47,9 @@ export const TextView = ({
|
||||
innerText = replacedText = rawText
|
||||
} else if (text === undefined) {
|
||||
// Field was omitted by backend (no permission)
|
||||
innerText = replacedText = `Login to see this ${item?.layer?.item_default_name ?? 'item'}`
|
||||
innerText = replacedText = `[Login](/login) to see this ${
|
||||
item?.layer?.item_default_name ?? 'item'
|
||||
}`
|
||||
} else if (text === null || text === '') {
|
||||
// Field is not set or empty - show nothing
|
||||
innerText = ''
|
||||
@ -127,7 +130,12 @@ export const TextView = ({
|
||||
else return children
|
||||
}
|
||||
|
||||
// Default: Link
|
||||
// Internal Link (React Router)
|
||||
if (href.startsWith('/')) {
|
||||
return <RouterLink to={href}>{children}</RouterLink>
|
||||
}
|
||||
|
||||
// External Link
|
||||
return (
|
||||
<a href={href} target='_blank' rel='noreferrer'>
|
||||
{children}
|
||||
|
||||
@ -5,7 +5,6 @@
|
||||
/* eslint-disable @typescript-eslint/no-non-null-assertion */
|
||||
/* eslint-disable @typescript-eslint/no-non-null-asserted-optional-chain */
|
||||
/* eslint-disable @typescript-eslint/prefer-optional-chain */
|
||||
/* eslint-disable @typescript-eslint/restrict-template-expressions */
|
||||
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
||||
import { LatLng } from 'leaflet'
|
||||
import { forwardRef, useState } from 'react'
|
||||
@ -17,6 +16,7 @@ import { useRemoveItem, useUpdateItem } from '#components/Map/hooks/useItems'
|
||||
import { usePopupForm } from '#components/Map/hooks/usePopupForm'
|
||||
import { useSetSelectPosition } from '#components/Map/hooks/useSelectPosition'
|
||||
import { timeAgo } from '#utils/TimeAgo'
|
||||
import { removeItemFromUrl } from '#utils/UrlHelper'
|
||||
|
||||
import { HeaderView } from './ItemPopupComponents/HeaderView'
|
||||
import { TextView } from './ItemPopupComponents/TextView'
|
||||
@ -80,8 +80,7 @@ export const ItemViewPopup = forwardRef((props: ItemViewPopupProps, ref: any) =>
|
||||
}
|
||||
setLoading(false)
|
||||
map.closePopup()
|
||||
const params = new URLSearchParams(window.location.search)
|
||||
window.history.pushState({}, '', '/' + `${params ? `?${params}` : ''}`)
|
||||
removeItemFromUrl()
|
||||
navigate('/')
|
||||
}
|
||||
|
||||
|
||||
@ -140,6 +140,7 @@ function UtopiaMap({
|
||||
maplibreStyle={maplibreStyle}
|
||||
zoomOffset={zoomOffset}
|
||||
tileSize={tileSize}
|
||||
showZoomControl={showZoomControl}
|
||||
>
|
||||
{children}
|
||||
</UtopiaMapInner>
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
/* eslint-disable @typescript-eslint/no-empty-function */
|
||||
/* eslint-disable @typescript-eslint/restrict-plus-operands */
|
||||
/* eslint-disable @typescript-eslint/restrict-template-expressions */
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
|
||||
/* eslint-disable @typescript-eslint/no-unsafe-member-access */
|
||||
@ -15,6 +14,12 @@ import { toast } from 'react-toastify'
|
||||
import { useSetAppState } from '#components/AppShell/hooks/useAppState'
|
||||
import { useTheme } from '#components/AppShell/hooks/useTheme'
|
||||
import { containsUUID } from '#utils/ContainsUUID'
|
||||
import {
|
||||
removeItemFromUrl,
|
||||
resetMetaTags as resetMetaTagsUtil,
|
||||
setItemInUrl,
|
||||
updateMetaTags,
|
||||
} from '#utils/UrlHelper'
|
||||
|
||||
import { useClusterRef, useSetClusterRef } from './hooks/useClusterRef'
|
||||
import {
|
||||
@ -64,6 +69,7 @@ export function UtopiaMapInner({
|
||||
maplibreStyle,
|
||||
zoomOffset = 0,
|
||||
tileSize = 256,
|
||||
showZoomControl,
|
||||
}: {
|
||||
children?: React.ReactNode
|
||||
geo?: GeoJsonObject
|
||||
@ -81,6 +87,7 @@ export function UtopiaMapInner({
|
||||
maplibreStyle?: string
|
||||
zoomOffset?: number
|
||||
tileSize?: number
|
||||
showZoomControl?: boolean
|
||||
}) {
|
||||
const selectNewItemPosition = useSelectPosition()
|
||||
const setSelectNewItemPosition = useSetSelectPosition()
|
||||
@ -150,21 +157,45 @@ export function UtopiaMapInner({
|
||||
return null
|
||||
}
|
||||
|
||||
// Track if we're currently switching popups to prevent URL cleanup
|
||||
const popupCloseTimeoutRef = useRef<NodeJS.Timeout | null>(null)
|
||||
|
||||
useMapEvents({
|
||||
popupopen: (e) => {
|
||||
const item = Object.entries(leafletRefs).find((r) => r[1].popup === e.popup)?.[1].item
|
||||
if (window.location.pathname.split('/')[1] !== item?.id) {
|
||||
const params = new URLSearchParams(window.location.search)
|
||||
if (!location.pathname.includes('/item/')) {
|
||||
window.history.pushState(
|
||||
{},
|
||||
'',
|
||||
`/${item?.id}` + `${params.toString() !== '' ? `?${params}` : ''}`,
|
||||
)
|
||||
|
||||
// Cancel any pending popup close URL cleanup - we're opening a new popup
|
||||
if (popupCloseTimeoutRef.current) {
|
||||
clearTimeout(popupCloseTimeoutRef.current)
|
||||
popupCloseTimeoutRef.current = null
|
||||
}
|
||||
|
||||
// Only update URL if no profile is open
|
||||
if (!location.pathname.includes('/item/')) {
|
||||
if (window.location.pathname.split('/')[1] !== item?.id && item?.id) {
|
||||
setItemInUrl(item.id)
|
||||
}
|
||||
let title = ''
|
||||
if (item?.name) title = item.name
|
||||
document.title = `${document.title.split('-')[0]} - ${title}`
|
||||
if (item?.name) {
|
||||
updateMetaTags(item.name, item.text)
|
||||
}
|
||||
}
|
||||
// If profile is open, don't change URL but still update meta tags
|
||||
else if (item?.name) {
|
||||
updateMetaTags(item.name, item.text)
|
||||
}
|
||||
},
|
||||
popupclose: () => {
|
||||
// Only remove UUID from URL if no profile is open
|
||||
if (!location.pathname.includes('/item/')) {
|
||||
// Wait briefly to see if another popup is being opened
|
||||
// If so, the popupopen handler will cancel this timeout
|
||||
popupCloseTimeoutRef.current = setTimeout(() => {
|
||||
if (containsUUID(window.location.pathname)) {
|
||||
removeItemFromUrl()
|
||||
resetMetaTagsUtil()
|
||||
}
|
||||
popupCloseTimeoutRef.current = null
|
||||
}, 50)
|
||||
}
|
||||
},
|
||||
})
|
||||
@ -183,15 +214,9 @@ export function UtopiaMapInner({
|
||||
clusterRef?.zoomToShowLayer(ref.marker, () => {
|
||||
ref.marker.openPopup()
|
||||
})
|
||||
let title = ''
|
||||
if (ref.item.name) title = ref.item.name
|
||||
document.title = `${document.title.split('-')[0]} - ${title}`
|
||||
document
|
||||
.querySelector('meta[property="og:title"]')
|
||||
?.setAttribute('content', ref.item.name ?? '')
|
||||
document
|
||||
.querySelector('meta[property="og:description"]')
|
||||
?.setAttribute('content', ref.item.text ?? '')
|
||||
if (ref.item.name) {
|
||||
updateMetaTags(ref.item.name, ref.item.text)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -203,18 +228,10 @@ export function UtopiaMapInner({
|
||||
}, [leafletRefs, location])
|
||||
|
||||
const resetMetaTags = () => {
|
||||
const params = new URLSearchParams(window.location.search)
|
||||
if (!containsUUID(window.location.pathname)) {
|
||||
window.history.pushState({}, '', '/' + `${params.toString() !== '' ? `?${params}` : ''}`)
|
||||
if (containsUUID(window.location.pathname)) {
|
||||
removeItemFromUrl()
|
||||
}
|
||||
document.title = document.title.split('-')[0]
|
||||
document.querySelector('meta[property="og:title"]')?.setAttribute('content', document.title)
|
||||
document
|
||||
.querySelector('meta[property="og:description"]')
|
||||
?.setAttribute(
|
||||
'content',
|
||||
`${document.querySelector('meta[name="description"]')?.getAttribute('content')}`,
|
||||
)
|
||||
resetMetaTagsUtil()
|
||||
}
|
||||
|
||||
const onEachFeature = (feature: Feature<GeoJSONGeometry, any>, layer: L.Layer) => {
|
||||
@ -285,7 +302,9 @@ export function UtopiaMapInner({
|
||||
<Outlet />
|
||||
<Control position='topLeft' zIndex='1000' absolute>
|
||||
<SearchControl />
|
||||
<TagsControl />
|
||||
<div className={`${showZoomControl ? 'tw:pl-14' : ''}`}>
|
||||
<TagsControl />
|
||||
</div>
|
||||
</Control>
|
||||
<Control position='bottomLeft' zIndex='999' absolute>
|
||||
{showFullscreenControl && <FullscreenControl />}
|
||||
|
||||
@ -17,6 +17,7 @@ import { ActionButton } from '#components/Profile/Subcomponents/ActionsButton'
|
||||
import { LinkedItemsHeaderView } from '#components/Profile/Subcomponents/LinkedItemsHeaderView'
|
||||
import { TagView } from '#components/Templates/TagView'
|
||||
import { timeAgo } from '#utils/TimeAgo'
|
||||
import { setUrlParam } from '#utils/UrlHelper'
|
||||
|
||||
import type { Item } from '#types/Item'
|
||||
import type { Tag } from '#types/Tag'
|
||||
@ -67,11 +68,7 @@ export const TabsView = ({
|
||||
const updateActiveTab = useCallback(
|
||||
(id: number) => {
|
||||
setActiveTab(id)
|
||||
|
||||
const params = new URLSearchParams(window.location.search)
|
||||
params.set('tab', `${id}`)
|
||||
const newUrl = location.pathname + '?' + params.toString()
|
||||
window.history.pushState({}, '', newUrl)
|
||||
setUrlParam('tab', `${id}`)
|
||||
},
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
[location.pathname],
|
||||
|
||||
@ -14,6 +14,7 @@ import { toast } from 'react-toastify'
|
||||
import { encodeTag } from '#utils/FormatTags'
|
||||
import { hashTagRegex } from '#utils/HashTagRegex'
|
||||
import { randomColor } from '#utils/RandomColor'
|
||||
import { removeItemFromUrl } from '#utils/UrlHelper'
|
||||
|
||||
import type { FormState } from '#types/FormState'
|
||||
import type { Item } from '#types/Item'
|
||||
@ -185,8 +186,7 @@ export const handleDelete = async (
|
||||
toast.success('Item deleted')
|
||||
|
||||
map.closePopup()
|
||||
const params = new URLSearchParams(window.location.search)
|
||||
window.history.pushState({}, '', '/' + `${params ? `?${params}` : ''}`)
|
||||
removeItemFromUrl()
|
||||
navigate('/')
|
||||
} catch (error) {
|
||||
toast.error(error instanceof Error ? error.message : String(error))
|
||||
@ -273,7 +273,7 @@ export const onUpdateItem = async (
|
||||
setLoading(true)
|
||||
|
||||
state.text
|
||||
.toLocaleLowerCase()
|
||||
?.toLocaleLowerCase()
|
||||
.match(hashTagRegex)
|
||||
?.map((tag) => {
|
||||
if (!tags.find((t) => t.name.toLocaleLowerCase() === tag.slice(1).toLocaleLowerCase())) {
|
||||
|
||||
@ -40,7 +40,7 @@ const MarkerIconFactory = (
|
||||
) => {
|
||||
if (icon)
|
||||
return divIcon({
|
||||
html: `<div class="svg-container">${createSvg(shape, color1, color2)}<img class="overlay-svg" style="width: ${icon.size ? icon.size : '12.5'}px; filter: invert(1) brightness(2);" src="${`${assetsURL ?? ''}` + icon.image}"></div>`,
|
||||
html: `<div class="svg-container">${createSvg(shape, color1, color2)}<img class="overlay-svg" style="width: ${icon.size ? icon.size : '12.5'}px; height: ${icon.size ? icon.size : '12.5'}px; filter: invert(1) brightness(2);" src="${`${assetsURL ?? ''}` + icon.image}"></div>`,
|
||||
iconAnchor: [17, 40],
|
||||
popupAnchor: [0, -40],
|
||||
iconSize: new Point(40, 46),
|
||||
|
||||
74
lib/src/Utils/UrlHelper.ts
Normal file
74
lib/src/Utils/UrlHelper.ts
Normal file
@ -0,0 +1,74 @@
|
||||
/**
|
||||
* Utility functions for managing browser URL and history
|
||||
*/
|
||||
|
||||
/**
|
||||
* Updates the browser URL with an item ID while preserving query parameters
|
||||
* @param itemId - The item UUID to add to the URL
|
||||
*/
|
||||
export function setItemInUrl(itemId: string): void {
|
||||
const params = new URLSearchParams(window.location.search)
|
||||
const paramsString = params.toString()
|
||||
const newUrl = `/${itemId}${paramsString !== '' ? `?${paramsString}` : ''}`
|
||||
window.history.pushState({}, '', newUrl)
|
||||
}
|
||||
|
||||
/**
|
||||
* Removes the item ID from the browser URL while preserving query parameters
|
||||
*/
|
||||
export function removeItemFromUrl(): void {
|
||||
const params = new URLSearchParams(window.location.search)
|
||||
const paramsString = params.toString()
|
||||
const newUrl = `/${paramsString !== '' ? `?${paramsString}` : ''}`
|
||||
window.history.pushState({}, '', newUrl)
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates a specific query parameter in the URL while preserving the path
|
||||
* @param key - The parameter key
|
||||
* @param value - The parameter value
|
||||
*/
|
||||
export function setUrlParam(key: string, value: string): void {
|
||||
const params = new URLSearchParams(window.location.search)
|
||||
params.set(key, value)
|
||||
const newUrl = window.location.pathname + '?' + params.toString()
|
||||
window.history.pushState({}, '', newUrl)
|
||||
}
|
||||
|
||||
/**
|
||||
* Removes a specific query parameter from the URL
|
||||
* @param key - The parameter key to remove
|
||||
*/
|
||||
export function removeUrlParam(key: string): void {
|
||||
const params = new URLSearchParams(window.location.search)
|
||||
params.delete(key)
|
||||
const paramsString = params.toString()
|
||||
const newUrl = window.location.pathname + (paramsString !== '' ? `?${paramsString}` : '')
|
||||
window.history.pushState({}, '', newUrl)
|
||||
}
|
||||
|
||||
/**
|
||||
* Resets page title and OpenGraph meta tags to default values
|
||||
*/
|
||||
export function resetMetaTags(): void {
|
||||
document.title = document.title.split('-')[0].trim()
|
||||
document.querySelector('meta[property="og:title"]')?.setAttribute('content', document.title)
|
||||
const description = document.querySelector('meta[name="description"]')?.getAttribute('content')
|
||||
if (description) {
|
||||
document.querySelector('meta[property="og:description"]')?.setAttribute('content', description)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates page title and OpenGraph meta tags with item information
|
||||
* @param itemName - The name of the item
|
||||
* @param itemText - The text/description of the item
|
||||
*/
|
||||
export function updateMetaTags(itemName: string, itemText?: string): void {
|
||||
const baseTitle = document.title.split('-')[0].trim()
|
||||
document.title = `${baseTitle} - ${itemName}`
|
||||
document.querySelector('meta[property="og:title"]')?.setAttribute('content', itemName)
|
||||
if (itemText) {
|
||||
document.querySelector('meta[property="og:description"]')?.setAttribute('content', itemText)
|
||||
}
|
||||
}
|
||||
@ -4,6 +4,8 @@ import 'react-image-crop/dist/ReactCrop.css'
|
||||
import 'react-photo-album/rows.css'
|
||||
import 'react-toastify/dist/ReactToastify.css'
|
||||
import 'yet-another-react-lightbox/styles.css'
|
||||
import 'react-leaflet-cluster/dist/assets/MarkerCluster.css'
|
||||
import 'react-leaflet-cluster/dist/assets/MarkerCluster.Default.css'
|
||||
|
||||
import '#assets/css/tailwind.css'
|
||||
import '#assets/css/masonry.css'
|
||||
|
||||
4
lib/src/types/LayerProps.d.ts
vendored
4
lib/src/types/LayerProps.d.ts
vendored
@ -13,8 +13,8 @@ export interface LayerProps {
|
||||
name: string
|
||||
menuColor: string
|
||||
menuText: string
|
||||
markerIcon: MarkerIcon
|
||||
markerShape: string
|
||||
markerIcon?: MarkerIcon
|
||||
markerShape?: string
|
||||
markerDefaultColor: string
|
||||
markerDefaultColor2?: string
|
||||
api?: ItemsApi<Item>
|
||||
|
||||
1513
package-lock.json
generated
1513
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
Loading…
x
Reference in New Issue
Block a user