[Map] Make UX Map compatible with Live Components (and some internal things) by Kocal · Pull Request #2385 · symfony/ux

Kocal · 2024-11-17T09:44:16Z

Q	A
Bug fix?	no
New feature?	yes
Issues	Fix #...
License	MIT

Here’s a corrected and polished version of your text:

Hi! 😊

This PR enhances the UX Map to be compatible with Live Components, allowing you to interact with the Map directly from your PHP code. You can perform actions and see your map update in real-time from the front-end!

To achieve this, I had to refactor and improve several areas:

Due to the hydration and de-hydration processes of Live Components, I ensured that the toArray and new fromArray methods for Map, Marker, and all other value objects could rebuild an equivalent object accurately (e.g., $marker == Marker::fromArray($marker->toArray())).
Since Stimulus monitors value changes, it wasn’t efficient to store everything in a single large view object containing zoom, center, markers, etc. These properties were split into individual values to improve performance.
Before rendering the map, an @id is now automatically computed for each Marker and Polygon definition. This optimization makes rendering significantly more efficient, avoiding the need to remove and re-render all markers or polygons (and avoiding a visual glitch aswell).

Enregistrement.de.l.ecran.2024-11-17.a.10.30.54-2.mov

Enregistrement.de.l.ecran.2024-11-17.a.10.28.15-2.mov

github-actions · 2024-11-17T09:44:45Z

📊 Packages dist files size difference

Thanks for the PR! Here is the difference in size of the packages dist files between the base branch and the PR.
Please review the changes and make sure they are expected.

File	Before (Size / Gzip)	After (Size / Gzip)
Map
`abstract_map_controller.d.ts`	`3 kB` / `741 B`	`3.31 kB`^{+10% 📈} / `821 B`^{+11% 📈}
`abstract_map_controller.js`	`1.88 kB` / `610 B`	`3.23 kB`^{+72% 📈} / `843 B`^{+38% 📈}
Map (Bridge Google)
`map_controller.d.ts`	`2.07 kB` / `729 B`	`2.19 kB`^{+6% 📈} / `733 B`^{+1% 📈}
`map_controller.js`	`7.07 kB` / `1.67 kB`	`8.7 kB`^{+23% 📈} / `1.95 kB`^{+17% 📈}
Map (Bridge Leaflet)
`map_controller.d.ts`	`1.31 kB` / `544 B`	`1.57 kB`^{+20% 📈} / `579 B`^{+6% 📈}
`map_controller.js`	`5.52 kB` / `1.77 kB`	`7.2 kB`^{+30% 📈} / `2.06 kB`^{+16% 📈}

Kocal · 2024-11-17T10:26:22Z

Note: Usages and examples can be a bit limited for the moment, but for a next PR I would like to add more methods like getZoom() or removeMarker() (...)

src/Map/assets/src/abstract_map_controller.ts

src/Map/doc/index.rst

src/Map/src/Exception/UnableToDenormalizeOptionsException.php

src/Map/src/Exception/UnableToNormalizeOptionsException.php

src/Map/src/Live/ComponentWithMapTrait.php

smnandre · 2024-11-20T22:19:38Z

src/Map/src/Live/ComponentWithMapTrait.php

+    /**
+     * @internal
+     */
+    #[LiveProp(hydrateWith: 'hydrateMap', dehydrateWith: 'dehydrateMap')]


Suggested change

#[LiveProp(hydrateWith: 'hydrateMap', dehydrateWith: 'dehydrateMap')]

#[LiveProp(hydrateWith: 'hydrateMap', dehydrateWith: 'dehydrateMap')]

Should be private i think, and we maybe should create a dedicated hydration extension here.. wdyt ?

I put it public otherwise the Live hydration process was not working due to visibility issue. Maybe I can try to add a setter?

Let's discuss all this tomorrow :)

src/Map/src/MapOptionsInterface.php

src/Map/src/MapOptionsNormalizer.php

src/Map/src/Renderer/AbstractRenderer.php

src/Map/src/Exception/UnableToNormalizeOptionsException.php

src/Map/doc/index.rst

src/Map/src/Live/ComponentWithMapTrait.php

src/Map/CHANGELOG.md

smnandre

Nice!!

smnandre · 2024-11-22T06:33:06Z

src/Map/src/Live/ComponentWithMapTrait.php

+/**
+ * @author Hugo Alliaume <hugo@alliau.me>
+ */
+trait ComponentWithMapTrait


Suggested change

/**

* @author Hugo Alliaume <hugo@alliau.me>

*/

trait ComponentWithMapTrait

/**

* @author Hugo Alliaume <hugo@alliau.me>

*

* @experimental

*/

trait ComponentWithMapTrait

… methods internal

… of Map's value objects, add MapOptionsNormalizer

…te JS tests

Co-authored-by: Simon André <smn.andre@gmail.com>

This PR was squashed before being merged into the 2.x branch. Discussion ---------- [Map] Fix default values of Stimulus Map Controller | Q | A | ------------- | --- | Bug fix? | yes | New feature? | no  | Issues | Fix #2417  | License | MIT  This issue happens at `doCreateMap` when we called `->fitBoundsToMarkers()` instead of `->center(...)`. The value `center` was supposed to be `null`, but since I forgot to configure the default value of `this.centerValue` to `null`, it automatically used `{}` as default value (https://stimulus.hotwired.dev/reference/values#getters) and it breaks the code. This bug has been introduced in #2385. Commits ------- 4cb91ef [Map] Fix default values of Stimulus Map Controller

carsonbot added Feature New Feature Map Status: Needs Review Needs to be reviewed labels Nov 17, 2024

Kocal force-pushed the imp-map-split-view-attrs branch 6 times, most recently from 00fc2d4 to bcbc42a Compare November 17, 2024 10:17

Kocal requested review from WebMamba, kbond and smnandre November 17, 2024 10:18

smnandre reviewed Nov 19, 2024

View reviewed changes

src/Map/assets/src/abstract_map_controller.ts Show resolved Hide resolved

Kocal force-pushed the imp-map-split-view-attrs branch from bcbc42a to 635bf7c Compare November 19, 2024 19:48

Kocal mentioned this pull request Nov 19, 2024

[Map] add polyline support #2340

Merged

Kocal requested a review from smnandre November 20, 2024 20:29