Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Symfony UX Map] Create recipes for the package and its bridges #1329

Merged
merged 3 commits into from
Aug 12, 2024

Conversation

Kocal
Copy link
Contributor

@Kocal Kocal commented Jul 20, 2024

Q A
License MIT
Doc issue/PR symfony/symfony-docs#...

Adding recipies for the new Symfony UX Map package and its Bridges, currently being reviewed in symfony/ux#1937.
I've specified version 2.19, but it may be 2.20 instead, let's keep it in draft then.

Copy link

github-actions bot commented Jul 20, 2024

Thanks for the PR 😍

How to test these changes in your application

  1. Define the SYMFONY_ENDPOINT environment variable:

    # On Unix-like (BSD, Linux and macOS)
    export SYMFONY_ENDPOINT=https://raw.githubusercontent.com/symfony/recipes/flex/pull-1329/index.json
    # On Windows
    SET SYMFONY_ENDPOINT=https://raw.githubusercontent.com/symfony/recipes/flex/pull-1329/index.json
  2. Install the package(s) related to this recipe:

    composer req 'symfony/flex:^1.16'
    composer req 'symfony/ux-google-map:^2.19' 'symfony/ux-leaflet-map:^2.19' 'symfony/ux-map:^2.19'
  3. Don't forget to unset the SYMFONY_ENDPOINT environment variable when done:

    # On Unix-like (BSD, Linux and macOS)
    unset SYMFONY_ENDPOINT
    # On Windows
    SET SYMFONY_ENDPOINT=

Diff between recipe versions

In order to help with the review stage, I'm in charge of computing the diff between the various versions of patched recipes.
I'm going keep this comment up to date with any updates of the attached patch.

@AlDaFlux
Copy link

AlDaFlux commented Aug 6, 2024

I try it on a php8.3 / Synfony 6.4

ubuntu@vps-95f47936:~/html/sandbox/dev$ echo $SYMFONY_ENDPOINT
https://raw.githubusercontent.com/symfony/recipes/flex/pull-1329/index.json
ubuntu@vps-95f47936:~/html/sandbox/dev$ composer req 'symfony/flex:^1.16'
./composer.json has been updated
Running composer update symfony/flex
Loading composer repositories with package information
Updating dependencies
Nothing to modify in lock file
....
ubuntu@vps-95f47936:~/html/sandbox/dev$ composer req 'symfony/ux-map:^2.19' 'symfony/ux-map-google:^2.19' 'symfony/ux-map-leaflet:^2.19'
./composer.json has been updated
Running composer update symfony/ux-map symfony/ux-map-google symfony/ux-map-leaflet
Loading composer repositories with package information
Updating dependencies
Your requirements could not be resolved to an installable set of packages.

  Problem 1
    - Root composer.json requires symfony/ux-map, it could not be found in any version, there may be a typo in the package name.
  Problem 2
    - Root composer.json requires symfony/ux-map-google, it could not be found in any version, there may be a typo in the package name.
  Problem 3
    - Root composer.json requires symfony/ux-map-leaflet, it could not be found in any version, there may be a typo in the package name.

Potential causes:
 - A typo in the package name
 - The package is not available in a stable-enough version according to your minimum-stability setting
   see <https://getcomposer.org/doc/04-schema.md#minimum-stability> for more details.
 - It's a private package and you forgot to add a custom repository to find it

Read <https://getcomposer.org/doc/articles/troubleshooting.md> for further common problems.

Installation failed, reverting ./composer.json and ./composer.lock to their original content.
ubuntu@vps-95f47936:~/html/sandbox/dev$

@Kocal
Copy link
Contributor Author

Kocal commented Aug 6, 2024

Yes, the PR is still being reviewed, the packages do not exist yet

javiereguiluz added a commit to symfony/ux that referenced this pull request Aug 7, 2024
This PR was squashed before being merged into the 2.x branch.

Discussion
----------

[Map] Create Map component

| Q             | A
| ------------- | ---
| Bug fix?      | no
| New feature?  | yes <!-- please update src/**/CHANGELOG.md files -->
| Issues        | Fix #38 <!-- prefix each issue number with "Fix #", no need to create an issue if none exist, explain below instead -->
| License       | MIT

Hi :)

This PR is a proposal for #38 a replacement for #39.

Symfony UX Map is a new Symfony UX component that makes it easy to create, customize and use interactive JavaScript maps.

The package ships with:
- a simple and generic way to create a map, with markers and info-windows
- two Bridge, [Leaflet](https://leafletjs.com/index.html) and [Google Maps](https://developers.google.com/maps/documentation/javascript)
- a way to define provider-specific options
- a nice and fluent API
- Flex recipes are also ready: symfony/recipes#1329

# Example

## Bridge configuration

```env
# .env
UX_MAP_DSN=leaflet://default
```

```yaml
# config/packages/ux_map.yaml
ux_map:
    renderer: '%env(UX_MAP_DSN)%'
```

## Map creation

An example to render a map, custom center and zoom, some markers and info windows:
```php
namespace App\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\Routing\Attribute\Route;
use Symfony\UX\Map\InfoWindow;
use Symfony\UX\Map\MapFactoryInterface;
use Symfony\UX\Map\Marker;
use Symfony\UX\Map\Point;

final class ContactController extends AbstractController
{
    #[Route('/contact')]
    public function __invoke(): Response
    {
            // 1. Create a new map instance
            $myMap = (new Map());
                ->center(new Point(46.903354, 1.888334))
                ->zoom(6)
            ;

            // 2. You can add markers, with an optional info window
            $myMap
                ->addMarker(new Marker(
                    position: new Point(48.8566, 2.3522),
                    title: 'Paris'
                ))
                ->addMarker(new Marker(
                    position: new Point(45.7640, 4.8357),
                    title: 'Lyon',
                    // With an info window
                    infoWindow: new InfoWindow(
                        headerContent: '<b>Lyon</b>',
                        content: 'The French town in the historic Rhône-Alpes region, located at the junction of the Rhône and Saône rivers.'
                    )
                ));

            // 3. And inject the map in your template to render it
            return $this->render('contact/index.html.twig', [
                'my_map' => $myMap,
            ]);
    }
}
```

## Map rendering

You must call `render_map(map)` to render the map:

```twig
{{ render_map(map, { style: 'height: 700px; width: 1024px; margin: 10px' }) }}
```

It gives you this interactive Leaflet map:

<img width="1524" alt="image" src="https://github.com/user-attachments/assets/cd0f64f3-5bf2-45c6-8b8d-8ad23c6ce183">

Commits
-------

212e61d [Map] Create Map component
@fabpot
Copy link
Member

fabpot commented Aug 7, 2024

@Kocal Not a draft anymore, right?

@Kocal Kocal marked this pull request as ready for review August 7, 2024 14:50
@symfony-recipes-bot symfony-recipes-bot enabled auto-merge (squash) August 7, 2024 14:53
@Kocal
Copy link
Contributor Author

Kocal commented Aug 7, 2024

@fabpot it should be alright now

fabpot
fabpot previously approved these changes Aug 7, 2024
@fabpot
Copy link
Member

fabpot commented Aug 7, 2024

We now need a 2.19 version of UX. Can I make the releases?

@fabpot
Copy link
Member

fabpot commented Aug 7, 2024

@kbond maybe?

@kbond
Copy link
Member

kbond commented Aug 7, 2024

@fabpot, can we do it Friday?

@fabpot
Copy link
Member

fabpot commented Aug 7, 2024

@fabpot, can we do it Friday?

Sure, no problems. Just ping me when you're ready.

auto-merge was automatically disabled August 7, 2024 15:45

Head branch was pushed to by a user without write access

@symfony-recipes-bot symfony-recipes-bot enabled auto-merge (squash) August 7, 2024 15:46
auto-merge was automatically disabled August 8, 2024 06:33

Head branch was pushed to by a user without write access

@symfony-recipes-bot symfony-recipes-bot enabled auto-merge (squash) August 8, 2024 06:33
auto-merge was automatically disabled August 12, 2024 19:35

Head branch was pushed to by a user without write access

@symfony-recipes-bot symfony-recipes-bot enabled auto-merge (squash) August 12, 2024 19:36
@Kocal
Copy link
Contributor Author

Kocal commented Aug 12, 2024

@fabpot @kbond I've rebased the PR, the recipes are ready to be merged if you want to :)

Checks fail because UX Map is PHP 8.3 only tho

auto-merge was automatically disabled August 12, 2024 19:42

Head branch was pushed to by a user without write access

@symfony-recipes-bot symfony-recipes-bot enabled auto-merge (squash) August 12, 2024 19:42
@fabpot fabpot disabled auto-merge August 12, 2024 20:20
@fabpot fabpot merged commit d618953 into symfony:main Aug 12, 2024
1 of 2 checks passed
@Kocal Kocal deleted the feat/symfony-ux-map branch August 13, 2024 04:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants