fix coderabbit requested changes

Author: thangqd

apps/geolibre-desktop/src/components/layout/TopToolbar.tsx

@@ -1045,6 +1045,8 @@ export function TopToolbar({
   // openSettingsSection. This toolbar owns the dialog + its kind state.
   useEffect(() => {
     const onOpenAddData = (event: Event) => {
+      // Read-only embeds must not open Add Data via the Browser panel event.
+      if (viewer) return;
       const detail = (event as CustomEvent<OpenAddDataDetail>).detail;
       // Reject kinds the Mac App Store build hides so a stray event cannot
       // open a dialog whose backing service is compiled out.
@@ -1059,7 +1061,7 @@ export function TopToolbar({
     };
     window.addEventListener(OPEN_ADD_DATA_EVENT, onOpenAddData);
     return () => window.removeEventListener(OPEN_ADD_DATA_EVENT, onOpenAddData);
-  }, []);
+  }, [viewer]);
   // Deck.gl Layer kind the Add Data dialog opens on (e.g. the 3D-model entry
   // jumps straight to the scenegraph layer type).
   const [addDataDeckVizKind, setAddDataDeckVizKind] = useState<string | undefined>(undefined);
@@ -1579,7 +1581,7 @@ export function TopToolbar({
     },
     {
       id: "view.comments",
-      title: "View Comments",
+      title: t("toolbar.command.viewComments"),
       group: t("toolbar.commandGroup.view"),
       keywords: "comments review threads notes annotations pins",
       icon: MessageSquare,
@@ -2093,7 +2095,11 @@ export function TopToolbar({
               aria-label={t("toolbar.item.projectName")}
               className="hidden h-7 w-44 border-transparent px-2 text-xs shadow-none focus-visible:border-input md:block"
               value={projectName}
-              onChange={(event) => setProjectName(event.target.value)}
+              readOnly={viewer}
+              onChange={(event) => {
+                if (viewer) return;
+                setProjectName(event.target.value);
+              }}
               onKeyDown={(event) => {
                 if (
                   event.key === "Enter" &&
@@ -2110,6 +2116,7 @@ export function TopToolbar({
                 projectNameComposingRef.current = false;
               }}
               onBlur={(event) => {
+                if (viewer) return;
                 const nextName = event.target.value.trim();
                 // Persist the canonical, locale-independent default name; a
                 // translated string would otherwise be written into the saved

apps/geolibre-desktop/src/i18n/locales/en.json

@@ -2095,6 +2095,7 @@
       "resetPitch": "Reset Pitch",
       "resetPitchBearing": "Reset Pitch & Bearing",
       "setView": "Set View",
+      "viewComments": "View Comments",
       "zoomIn": "Zoom In",
       "zoomOut": "Zoom Out",
       "switchToLight": "Switch to Light Mode",

packages/plugins/src/plugins/maplibre-dggal.ts

@@ -641,7 +641,7 @@ function refresh(): void {
   updatePanelStatus();
 }
 
-/** Update the status line without recreating the rest of the panel controls. */
+/** Update the status line (and auto-resolution readout) without recreating controls. */
 function updatePanelStatus(): void {
   const status = panelContainer?.querySelector<HTMLElement>("[data-dggal-status]");
   if (!status) {
@@ -650,6 +650,16 @@ function updatePanelStatus(): void {
   }
   status.textContent = currentError ?? labels.cellCount(currentGrid.features.length);
   status.style.color = currentError ? "#dc2626" : "";
+  if (settings.autoResolution) {
+    const shown = String(effectiveResolution());
+    const resolution = panelContainer?.querySelector<HTMLInputElement>("[data-dggal-resolution]");
+    const resolutionValue = panelContainer?.querySelector<HTMLElement>("[data-dggal-resolution-value]");
+    if (resolution) {
+      resolution.value = shown;
+      resolution.title = shown;
+    }
+    if (resolutionValue) resolutionValue.textContent = shown;
+  }
 }
 
 /**
@@ -824,11 +834,11 @@ function renderPanel(container: HTMLElement): void {
   );
   row(labels.autoResolution, autoResolution);
 
-  // In automatic mode the slider becomes a read-only indicator of the
-  // zoom-derived resolution; refresh() re-renders the panel on every moveend,
-  // so it tracks zoom gestures.
+  // In automatic mode the slider is a read-only indicator of the zoom-derived
+  // resolution; updatePanelStatus() keeps it in sync on every moveend.
   const shownResolution = effectiveResolution();
   const resolution = document.createElement("input");
+  resolution.dataset.dggalResolution = "";
   resolution.type = "range";
   resolution.min = "0";
   resolution.max = String(DGGAL_TYPES[settings.dggrsType]);
@@ -847,6 +857,7 @@ function renderPanel(container: HTMLElement): void {
   resolutionWrap.style.gap = "6px";
   resolutionWrap.style.opacity = settings.autoResolution ? "0.6" : "1";
   const resolutionValue = document.createElement("strong");
+  resolutionValue.dataset.dggalResolutionValue = "";
   resolutionValue.textContent = String(shownResolution);
   resolution.addEventListener("input", () => {
     resolutionValue.textContent = resolution.value;

packages/plugins/src/plugins/maplibre-dggrid.ts

@@ -865,7 +865,7 @@ function refresh(): void {
   updatePanelStatus();
 }
 
-/** Update the status line without recreating the rest of the panel controls. */
+/** Update the status line (and auto-resolution readout) without recreating controls. */
 function updatePanelStatus(): void {
   const status = panelContainer?.querySelector<HTMLElement>("[data-dggrid-status]");
   if (!status) {
@@ -874,6 +874,16 @@ function updatePanelStatus(): void {
   }
   status.textContent = currentError ?? labels.cellCount(currentGrid.features.length);
   status.style.color = currentError ? "#dc2626" : "";
+  if (settings.autoResolution) {
+    const shown = String(effectiveResolution());
+    const resolution = panelContainer?.querySelector<HTMLInputElement>("[data-dggrid-resolution]");
+    const resolutionValue = panelContainer?.querySelector<HTMLElement>("[data-dggrid-resolution-value]");
+    if (resolution) {
+      resolution.value = shown;
+      resolution.title = shown;
+    }
+    if (resolutionValue) resolutionValue.textContent = shown;
+  }
 }
 
 /**
@@ -1054,11 +1064,11 @@ function renderPanel(container: HTMLElement): void {
   );
   row(labels.autoResolution, autoResolution);
 
-  // In automatic mode the slider becomes a read-only indicator of the
-  // zoom-derived resolution; refresh() re-renders the panel on every moveend,
-  // so it tracks zoom gestures.
+  // In automatic mode the slider is a read-only indicator of the zoom-derived
+  // resolution; updatePanelStatus() keeps it in sync on every moveend.
   const shownResolution = effectiveResolution();
   const resolution = document.createElement("input");
+  resolution.dataset.dggridResolution = "";
   resolution.type = "range";
   resolution.min = "0";
   resolution.max = String(MAX_DGGRID_RESOLUTION);
@@ -1077,6 +1087,7 @@ function renderPanel(container: HTMLElement): void {
   resolutionWrap.style.gap = "6px";
   resolutionWrap.style.opacity = settings.autoResolution ? "0.6" : "1";
   const resolutionValue = document.createElement("strong");
+  resolutionValue.dataset.dggridResolutionValue = "";
   resolutionValue.textContent = String(shownResolution);
   resolution.addEventListener("input", () => {
     resolutionValue.textContent = resolution.value;