Skip to content

Commit 31f8aa5

Browse files
oterraloterral
committed
Merge branch 'master' into olviier/personneverk
2 parents 72fecba + a3676b1 commit 31f8aa5

File tree

241 files changed

+4230
-3895
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

241 files changed

+4230
-3895
lines changed

‎CHANGELOG.md‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,16 @@
22

33
All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
44

5+
## [1.31.0](https://github.com/geops/trafimage-maps/compare/v1.30.42...v1.31.0) (2025-12-15)
6+
7+
### Features
8+
9+
- allow multiple web components son the same page ([#1243](https://github.com/geops/trafimage-maps/issues/1243)) ([c078a5f](https://github.com/geops/trafimage-maps/commit/c078a5f33659964d8fc179b1bc3b0390fd8866bb))
10+
11+
### Bug Fixes
12+
13+
- update topic info and PDF dates ([#1236](https://github.com/geops/trafimage-maps/issues/1236)) ([889c01f](https://github.com/geops/trafimage-maps/commit/889c01f38fb50726d302a5dfd0b65728f588b559))
14+
515
### [1.30.42](https://github.com/geops/trafimage-maps/compare/v1.30.41...v1.30.42) (2025-12-05)
616

717
### Bug Fixes

‎package.json‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "trafimage-maps",
33
"description": "trafimage-maps web component",
4-
"version": "1.30.43-beta.0",
4+
"version": "1.31.0",
55
"private": true,
66
"main": "build/bundle.js",
77
"proxy": "http://127.0.0.1:8000",
@@ -40,7 +40,6 @@
4040
"react-dom": "18.3.1",
4141
"react-draggable": "4.4.6",
4242
"react-helmet": "^6.1.0",
43-
"react-i18next": "14.1.2",
4443
"react-icons": "^5.2.1",
4544
"react-redux": "^9.1.2",
4645
"react-select": "5.8.0",

‎public/embed.html‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,22 @@
1313
.then((response) => response.json())
1414
.then((data) => {
1515
document.getElementById('map').setAttribute('apiKey', data.key);
16+
document.getElementById('map2').setAttribute('apiKey', data.key);
1617
});
1718
</script>
1819
</head>
1920
<body style="height: 1000px">
2021
<div>
2122
<h1>Test web component in custom page</h1>
2223
</div>
23-
<div id="root" style="width: 800px; height: 500px; border: solid 1px black">
24-
<trafimage-maps id="map" embedded="true"></trafimage-maps>
24+
<div id="root">
25+
<div style="width: 1600px; height: 500px; border: solid 1px black;resize:both;">
26+
<trafimage-maps id="map2" embedded="true" elements="permalink=false"></trafimage-maps>
27+
</div>
28+
<br/>
29+
<div style="width: 1600px; height: 500px; border: solid 1px black;resize:both;">
30+
<trafimage-maps id="map" embedded="true" elements="permalink=false"></trafimage-maps>
31+
</div>
2532
</div>
2633
</body>
2734
</html>

‎src/WebComponent.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import Style from "style-it";
66
import LayerService from "./utils/LayerService";
77
import TrafimageMaps from "./components/TrafimageMaps";
88
import styles from "./WebComponent.scss";
9-
import { getTopicConfig } from "./config/topics";
9+
import { getTopicsFromAppName } from "./config/topics";
1010

1111
const propTypes = {
1212
/**
@@ -269,7 +269,7 @@ function WebComponent(props) {
269269
);
270270

271271
const appTopics = useMemo(() => {
272-
const tps = topics || getTopicConfig(appName);
272+
const tps = topics || getTopicsFromAppName(appName);
273273

274274
if (!tps) {
275275
// eslint-disable-next-line no-console

‎src/components/CloseButton/CloseButton.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import PropTypes from "prop-types";
22
import { IconButton } from "@mui/material";
33
import React from "react";
44
import { MdClose } from "react-icons/md";
5-
import { useTranslation } from "react-i18next";
5+
import useTranslation from "../../utils/useTranslation";
66

77
function CloseButton({ children, ...props }) {
88
const { t } = useTranslation();

‎src/components/Copyright/Copyright.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import React from "react";
2-
import { useTranslation } from "react-i18next";
32
import { useSelector } from "react-redux";
43
import RsCopyright from "react-spatial/components/Copyright";
54
import { makeStyles } from "@mui/styles";
5+
import useTranslation from "../../utils/useTranslation";
66

77
const useStyles = makeStyles(() => ({
88
wrapper: {

‎src/components/DataLink/DataLink.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from "react";
22
import PropTypes from "prop-types";
33
import { makeStyles } from "@mui/styles";
4-
import { useTranslation } from "react-i18next";
4+
import useTranslation from "../../utils/useTranslation";
55
import Link from "../Link";
66

77
const useStyles = makeStyles(() => {

‎src/components/DataLink/DataLink.test.js‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,21 @@
11
import React from "react";
2+
import { Provider } from "react-redux";
23
import { render, screen } from "@testing-library/react";
34
import { Layer } from "mobility-toolbox-js/ol";
4-
import DataLink from "./DataLink";
5-
import { passagierfrequenzen } from "../../config/ch.sbb.netzkarte";
5+
import DataLinkBase from "./DataLink";
6+
import { getNetzkarteLayers } from "../../config/ch.sbb.netzkarte";
7+
8+
const passagierfrequenzen = getNetzkarteLayers().find(
9+
(layer) => layer.key === "ch.sbb.bahnhoffrequenzen",
10+
);
11+
12+
function DataLink(props) {
13+
return (
14+
<Provider store={global.store}>
15+
<DataLinkBase {...props} />
16+
</Provider>
17+
);
18+
}
619

720
describe("DataLink", () => {
821
describe("should dislay data link with Open Data text", () => {

‎src/components/Dialog/Dialog.js‎

Lines changed: 30 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,25 @@
11
/* eslint-disable react/jsx-props-no-spreading */
2-
import React, { useEffect, useState, useRef, forwardRef } from "react";
2+
import React, {
3+
useEffect,
4+
useState,
5+
useRef,
6+
useId,
7+
forwardRef,
8+
useMemo,
9+
} from "react";
310
import PropTypes from "prop-types";
4-
import { useTranslation } from "react-i18next";
511
import { useSelector, useDispatch } from "react-redux";
612
import { makeStyles } from "@mui/styles";
713
import { Dialog as MuiDialog, DialogTitle, Paper } from "@mui/material";
814
import Draggable from "react-draggable";
15+
import useTranslation from "../../utils/useTranslation";
916
import useHasScreenSize from "../../utils/useHasScreenSize";
1017
import { setDialogVisible, setDialogPosition } from "../../model/app/actions";
1118
import CloseButton from "../CloseButton";
1219

1320
const useStyles = makeStyles((theme) => ({
1421
rootDesktop: {
15-
zIndex: "0!important",
22+
zIndex: "100!important",
1623
pointerEvents: "none",
1724
},
1825

@@ -63,7 +70,7 @@ const useStyles = makeStyles((theme) => ({
6370
overflowY: "auto",
6471
},
6572
dialogBodyDesktop: {
66-
maxHeight: (props) => (props.isModal ? 620 : "none"),
73+
maxHeight: (props) => (props.isModal ? 620 : 360),
6774
},
6875
dialogBodyMobile: {
6976
maxHeight: (props) => (props.isModal ? 360 : 280),
@@ -81,17 +88,20 @@ const PaperComponent = forwardRef((props, ref) => {
8188
return <Paper square ref={ref} {...props} elevation={4} />;
8289
});
8390

84-
function DraggablePaperComponent(props) {
91+
// eslint-disable-next-line react/prop-types
92+
function DraggablePaperComponent({ handleId, ...props }) {
8593
const dispatch = useDispatch();
8694
const dialogPosition = useSelector((state) => state.app.dialogPosition);
8795
const nodeRef = useRef(null);
8896
return (
8997
<Draggable
9098
nodeRef={nodeRef}
91-
handle="#draggable-dialog-title"
99+
// eslint-disable-next-line react/destructuring-assignment, react/prop-types
100+
handle={`#${handleId}`}
92101
cancel={'[class*="MuiDialogContent-root"]'}
93102
defaultPosition={dialogPosition}
94103
position={dialogPosition}
104+
bounds="parent"
95105
onStop={(evt, pos) => {
96106
dispatch(
97107
setDialogPosition({
@@ -128,6 +138,10 @@ function Dialog({
128138
}) {
129139
const { t } = useTranslation();
130140
const dispatch = useDispatch();
141+
const idd = useId();
142+
// The id creates useID is not a valid selector so we make it
143+
// valid by replacing colons with underscores
144+
const id = useMemo(() => idd.replace(/:/g, "_"), [idd]);
131145
const classesProp = classes || {};
132146

133147
const [dialogNode, setDialogNode] = useState(null);
@@ -176,6 +190,11 @@ function Dialog({
176190
PaperComponent: isSmallScreen
177191
? PaperComponent
178192
: React.memo(DraggablePaperComponent),
193+
PaperProps: !isSmallScreen // only for DraggeblePaper
194+
? {
195+
handleId: id,
196+
}
197+
: undefined,
179198
classes: {
180199
...classesProp,
181200
root: `${!isSmallScreen ? classesDialog.rootDesktop : ""}${classesProp.root ? ` ${classesProp.root}` : ""}`,
@@ -208,10 +227,11 @@ function Dialog({
208227
disablePortal
209228
open
210229
name={name}
230+
aria-labelledby={id}
211231
{...dialogProps}
212232
>
213233
<DialogTitle
214-
id="draggable-dialog-title"
234+
id={id}
215235
variant="h4"
216236
style={{ cursor: isModal ? "auto" : "move" }}
217237
>
@@ -225,7 +245,9 @@ function Dialog({
225245
/>
226246
<div
227247
className={`${classesDialog.dialogBody} ${
228-
isSmallScreen ? classesDialog.dialogBodyMobile : ""
248+
isSmallScreen
249+
? classesDialog.dialogBodyMobile
250+
: classesDialog.dialogBodyDesktop
229251
}`}
230252
>
231253
{body}

‎src/components/Dialog/Dialog.test.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ describe("Dialog", () => {
1515
beforeEach(() => {
1616
store = global.mockStore({
1717
map: {},
18-
app: {},
18+
app: { i18n: global.i18n },
1919
});
2020
map = new Map({ view: new View({}) });
2121
});

0 commit comments

Comments
 (0)