Maputnik does not show file name

[Piahs-trophy]

Maputnik version: v3.0.0
Browser: Edge and Crome
OS: Windows

Maputnik separates the “style name” set under Style Settings and the "file name" when saving or loading a JSON file. These two are not automatically synchronized and only the style name is visible in the tab.

Problem: When I work with multiple Maputnik tabs, I easily lose track of which JSON file corresponds to which open editor window.

Example workflow:

Create new style → set style name = "map1"

Save file → filename defaults to "map1.json" → OK

Make changes → Save As → "map1_changed.json"

Open both files in separate Maputnik tabs

Issue: Both tabs now show the same style name ("map1") inside Maputnik, and the UI provides no indication of which file was originally loaded.

Wish: Ability to also see the file names in the UI.

[HarelM]

I'm not sure I have a good solution for this. Feel free to explore solution you think might help in this case.

[KanishJebaMathewM]

Hi, I'd like to work on this issue!

After testing on v3.0.0 locally, I've confirmed the bug and have a clear understanding of the root cause and fix.

---

Root cause

Maputnik has two separate concepts:

• Style name — stored as the name field inside the JSON, shown in Style Settings
• File name — the actual .json filename on disk (e.g. map1_changed.json)

When a file is opened, the filename is never stored in app state. Only the style name from inside the JSON is kept. So when multiple tabs are open with styles that share the same name, the UI gives no indication of which file each tab belongs to.

Note: the Save dialog already correctly pre-fills with the current filename, so that part works fine. The only missing piece is that the open filename is never displayed anywhere in the UI.

---

Proposed fix

The style name in Style Settings does not need to change — that was not the source of confusion. The fix is simply to display the currently open filename in the header bar as a read-only indicator.

Steps to implement:

1. When a file is opened via the Open dialog, capture the filename from the File object and store it as currentFileName in app state
2. When a file is saved, update currentFileName in app state with the new filename
3. Display currentFileName in the top header bar — read only, no editing needed
4. If no file is loaded yet (fresh/unsaved style), show nothing or an unsaved indicator in that spot

This is a minimal, non-breaking change — no sync logic needed between style name and filename, and nothing else in the UI needs to change.

---

Happy to submit a PR for this. Let me know if this approach sounds good!