From 6bfd64cb2c84cf7c093bd724c3cedacd0da2e1dd Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 09:44:40 -0600
Subject: [PATCH 01/11] asset feature image download

---
 .../components/AssetDetail/AssetButton.tsx    | 21 ++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/react/src/components/AssetDetail/AssetButton.tsx b/react/src/components/AssetDetail/AssetButton.tsx
index f9f546dd..a6ad2b0f 100644
--- a/react/src/components/AssetDetail/AssetButton.tsx
+++ b/react/src/components/AssetDetail/AssetButton.tsx
@@ -1,13 +1,18 @@
 import React, { useState } from 'react';
 import DOMPurify from 'dompurify';
-import { Button } from '@tacc/core-components';
+// import { Button } from '@tacc/core-components';
+import { Button } from 'antd';
 import { Feature, FeatureType } from '@hazmapper/types';
 import {
   getFeatureType,
   IFileImportRequest,
   TapisFilePath,
 } from '@hazmapper/types';
-import { useImportFeatureAsset, useNotification } from '@hazmapper/hooks';
+import {
+  useImportFeatureAsset,
+  useNotification,
+  useFeatureAssetSourcePath,
+} from '@hazmapper/hooks';
 import FileBrowserModal from '../FileBrowserModal/FileBrowserModal';
 import { IMPORTABLE_FEATURE_ASSET_TYPES } from '@hazmapper/utils/fileUtils';
 
@@ -32,6 +37,8 @@ const AssetButton: React.FC<AssetButtonProps> = ({
   const featureId = selectedFeature.id;
   const { mutate: importFeatureAsset, isPending: isImporting } =
     useImportFeatureAsset(projectId, featureId);
+  const getFeatureAssetSourcePath = useFeatureAssetSourcePath(selectedFeature);
+  const featureAssetSourcePath = getFeatureAssetSourcePath();
 
   const handleSubmit = (files: TapisFilePath[]) => {
     for (const file of files) {
@@ -59,7 +66,15 @@ const AssetButton: React.FC<AssetButtonProps> = ({
   return (
     <>
       {featureType === FeatureType.Image && (
-        <Button /*TODO add Download*/ type="primary">Download</Button>
+        <Button
+          type="primary"
+          href={featureAssetSourcePath}
+          download={`feature-${selectedFeature.id}.jpeg`}
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          Download
+        </Button>
       )}
       {featureType === FeatureType.PointCloud && (
         <a href={pointCloudURL} target="_blank" rel="noreferrer">

From 9f712232f727297bc23b08ad5955ca5236e36b06 Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 09:48:22 -0600
Subject: [PATCH 02/11] fix

---
 react/src/components/AssetDetail/AssetButton.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/react/src/components/AssetDetail/AssetButton.tsx b/react/src/components/AssetDetail/AssetButton.tsx
index a6ad2b0f..c6dfebcd 100644
--- a/react/src/components/AssetDetail/AssetButton.tsx
+++ b/react/src/components/AssetDetail/AssetButton.tsx
@@ -1,6 +1,5 @@
 import React, { useState } from 'react';
 import DOMPurify from 'dompurify';
-// import { Button } from '@tacc/core-components';
 import { Button } from 'antd';
 import { Feature, FeatureType } from '@hazmapper/types';
 import {
@@ -91,7 +90,7 @@ const AssetButton: React.FC<AssetButtonProps> = ({
         <Button
           type="primary"
           onClick={() => setIsModalOpen(true)}
-          isLoading={isImporting}
+          loading={isImporting}
           disabled={isImporting}
         >
           Add Asset from DesignSafe

From d019e1f810e8ad3cac972d564703347babe79e65 Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 09:49:10 -0600
Subject: [PATCH 03/11] remove comment

---
 react/src/components/AssetDetail/AssetButton.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/react/src/components/AssetDetail/AssetButton.tsx b/react/src/components/AssetDetail/AssetButton.tsx
index c6dfebcd..4b8a16ee 100644
--- a/react/src/components/AssetDetail/AssetButton.tsx
+++ b/react/src/components/AssetDetail/AssetButton.tsx
@@ -86,7 +86,6 @@ const AssetButton: React.FC<AssetButtonProps> = ({
         </Button>
       )}
       {featureType.includes(selectedFeature.geometry.type) && !isPublicView && (
-        //TODO
         <Button
           type="primary"
           onClick={() => setIsModalOpen(true)}

From c18503cd46880bb78032b87bb44f51cd2f6d0fdd Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 10:24:48 -0600
Subject: [PATCH 04/11] fix basepath

---
 react/src/AppRouter.tsx                       |  5 +++-
 .../AssetDetail/AssetDetail.test.tsx          |  1 +
 react/src/hooks/environment/getBasePath.ts    | 24 +++++++++++++++
 react/src/hooks/environment/index.ts          |  2 +-
 .../hooks/environment/useAppConfiguration.ts  |  4 +--
 react/src/hooks/environment/useBasePath.ts    | 30 -------------------
 6 files changed, 32 insertions(+), 34 deletions(-)
 create mode 100644 react/src/hooks/environment/getBasePath.ts
 delete mode 100644 react/src/hooks/environment/useBasePath.ts

diff --git a/react/src/AppRouter.tsx b/react/src/AppRouter.tsx
index c79f83af..e5cbac7d 100644
--- a/react/src/AppRouter.tsx
+++ b/react/src/AppRouter.tsx
@@ -10,6 +10,7 @@ import Callback from '@hazmapper/pages/Callback/Callback';
 import StreetviewCallback from '@hazmapper/pages/StreetviewCallback/StreetviewCallback';
 import { RootState } from '@hazmapper/redux/store';
 import { isTokenValid } from '@hazmapper/utils/authUtils';
+import { getBasePath } from './hooks';
 
 interface ProtectedRouteProps {
   children: ReactElement;
@@ -29,6 +30,8 @@ const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
   return children;
 };
 
+const basePath = getBasePath();
+
 export const appRouter = createBrowserRouter(
   [
     {
@@ -78,5 +81,5 @@ export const appRouter = createBrowserRouter(
       ],
     },
   ],
-  { basename: '/' }
+  { basename: basePath }
 );
diff --git a/react/src/components/AssetDetail/AssetDetail.test.tsx b/react/src/components/AssetDetail/AssetDetail.test.tsx
index 6d23e41b..90cab527 100644
--- a/react/src/components/AssetDetail/AssetDetail.test.tsx
+++ b/react/src/components/AssetDetail/AssetDetail.test.tsx
@@ -5,6 +5,7 @@ import AssetDetail from './AssetDetail';
 import {
   mockImgFeature,
   mockPointFeature,
+  featureCollection,
 } from '@hazmapper/__fixtures__/featuresFixture';
 import AssetGeometry from './AssetGeometry';
 
diff --git a/react/src/hooks/environment/getBasePath.ts b/react/src/hooks/environment/getBasePath.ts
new file mode 100644
index 00000000..4a1b029c
--- /dev/null
+++ b/react/src/hooks/environment/getBasePath.ts
@@ -0,0 +1,24 @@
+/**
+ * Computes the base path for the application based on the current URL.
+ */
+const getBasePath = (): string => {
+  // note that path order matters
+  // as we use startsWith to find a match
+  const paths: string[] = [
+    '/hazmapper-react',
+    '/staging-react',
+    '/dev-react',
+    '/exp-react',
+    '/hazmapper',
+    '/staging',
+    '/dev',
+    '/exp',
+  ];
+  const currentPath: string = window.location.pathname;
+  const base: string | undefined = paths.find((path) =>
+    currentPath.startsWith(path)
+  );
+  return base || '/';
+};
+
+export default getBasePath;
diff --git a/react/src/hooks/environment/index.ts b/react/src/hooks/environment/index.ts
index 0c1cd9b5..86e7f9e0 100644
--- a/react/src/hooks/environment/index.ts
+++ b/react/src/hooks/environment/index.ts
@@ -1,2 +1,2 @@
-export { default as useBasePath } from './useBasePath';
+export { default as getBasePath } from './getBasePath';
 export { default as useAppConfiguration } from './useAppConfiguration';
diff --git a/react/src/hooks/environment/useAppConfiguration.ts b/react/src/hooks/environment/useAppConfiguration.ts
index 0500d972..64531470 100644
--- a/react/src/hooks/environment/useAppConfiguration.ts
+++ b/react/src/hooks/environment/useAppConfiguration.ts
@@ -7,7 +7,7 @@ import {
   DesignSafePortalEnvironment,
 } from '@hazmapper/types';
 import { getGeoapiUrl, getDesignsafePortalUrl } from './utils';
-import useBasePath from './useBasePath';
+import getBasePath from './getBasePath';
 import { getLocalAppConfiguration } from './getLocalAppConfiguration';
 
 /**
@@ -20,7 +20,7 @@ import { getLocalAppConfiguration } from './getLocalAppConfiguration';
  * - Production (hazmapper.tacc.utexas.edu without path prefix)
  */
 export const useAppConfiguration = (): AppConfiguration => {
-  const basePath = useBasePath();
+  const basePath = getBasePath();
 
   const appConfiguration = useMemo(() => {
     const hostname = window && window.location && window.location.hostname;
diff --git a/react/src/hooks/environment/useBasePath.ts b/react/src/hooks/environment/useBasePath.ts
deleted file mode 100644
index a14ea248..00000000
--- a/react/src/hooks/environment/useBasePath.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import { useMemo } from 'react';
-
-/**
- * Computes the base path for the application based on the current URL.
- */
-const useBasePath = (): string => {
-  const basePath = useMemo(() => {
-    // note that path order matters
-    // as we use startsWith to find a match
-    const paths: string[] = [
-      '/hazmapper-react',
-      '/staging-react',
-      '/dev-react',
-      '/exp-react',
-      '/hazmapper',
-      '/staging',
-      '/dev',
-      '/exp',
-    ];
-    const currentPath: string = window.location.pathname;
-    const base: string | undefined = paths.find((path) =>
-      currentPath.startsWith(path)
-    );
-    return base || '/';
-  }, []);
-
-  return basePath;
-};
-
-export default useBasePath;

From f39560c5c517134e9cb233b3c506db58f2f46a9d Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 10:40:04 -0600
Subject: [PATCH 05/11] fix test; fix router redirect

---
 react/src/AppRouter.tsx                               |  2 +-
 react/src/components/AssetDetail/AssetButton.tsx      | 10 ++--------
 react/src/components/AssetDetail/AssetDetail.test.tsx |  1 -
 3 files changed, 3 insertions(+), 10 deletions(-)

diff --git a/react/src/AppRouter.tsx b/react/src/AppRouter.tsx
index e5cbac7d..2d88d8c8 100644
--- a/react/src/AppRouter.tsx
+++ b/react/src/AppRouter.tsx
@@ -76,7 +76,7 @@ export const appRouter = createBrowserRouter(
         },
         {
           path: '*',
-          element: <Navigate to={'/'} replace={true} />,
+          element: <Navigate to={basePath} replace={true} />,
         },
       ],
     },
diff --git a/react/src/components/AssetDetail/AssetButton.tsx b/react/src/components/AssetDetail/AssetButton.tsx
index 4b8a16ee..10ea12ac 100644
--- a/react/src/components/AssetDetail/AssetButton.tsx
+++ b/react/src/components/AssetDetail/AssetButton.tsx
@@ -7,11 +7,7 @@ import {
   IFileImportRequest,
   TapisFilePath,
 } from '@hazmapper/types';
-import {
-  useImportFeatureAsset,
-  useNotification,
-  useFeatureAssetSourcePath,
-} from '@hazmapper/hooks';
+import { useImportFeatureAsset, useNotification } from '@hazmapper/hooks';
 import FileBrowserModal from '../FileBrowserModal/FileBrowserModal';
 import { IMPORTABLE_FEATURE_ASSET_TYPES } from '@hazmapper/utils/fileUtils';
 
@@ -36,8 +32,6 @@ const AssetButton: React.FC<AssetButtonProps> = ({
   const featureId = selectedFeature.id;
   const { mutate: importFeatureAsset, isPending: isImporting } =
     useImportFeatureAsset(projectId, featureId);
-  const getFeatureAssetSourcePath = useFeatureAssetSourcePath(selectedFeature);
-  const featureAssetSourcePath = getFeatureAssetSourcePath();
 
   const handleSubmit = (files: TapisFilePath[]) => {
     for (const file of files) {
@@ -67,7 +61,7 @@ const AssetButton: React.FC<AssetButtonProps> = ({
       {featureType === FeatureType.Image && (
         <Button
           type="primary"
-          href={featureAssetSourcePath}
+          href={featureSource}
           download={`feature-${selectedFeature.id}.jpeg`}
           target="_blank"
           rel="noopener noreferrer"
diff --git a/react/src/components/AssetDetail/AssetDetail.test.tsx b/react/src/components/AssetDetail/AssetDetail.test.tsx
index 90cab527..6d23e41b 100644
--- a/react/src/components/AssetDetail/AssetDetail.test.tsx
+++ b/react/src/components/AssetDetail/AssetDetail.test.tsx
@@ -5,7 +5,6 @@ import AssetDetail from './AssetDetail';
 import {
   mockImgFeature,
   mockPointFeature,
-  featureCollection,
 } from '@hazmapper/__fixtures__/featuresFixture';
 import AssetGeometry from './AssetGeometry';
 

From 7ed4bc315d07ae13767dd2ae228d3618bbb64362 Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 11:01:09 -0600
Subject: [PATCH 06/11] fix systemFilename validation; allow periods, fix modal
 reset on close

---
 react/src/components/CreateMapModal/CreateMapModal.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/react/src/components/CreateMapModal/CreateMapModal.tsx b/react/src/components/CreateMapModal/CreateMapModal.tsx
index bc4aaa16..c726c23e 100644
--- a/react/src/components/CreateMapModal/CreateMapModal.tsx
+++ b/react/src/components/CreateMapModal/CreateMapModal.tsx
@@ -31,8 +31,8 @@ const validationSchema = z.object({
   systemFile: z
     .string()
     .regex(
-      /^[A-Za-z0-9-_]+$/,
-      'Only letters, numbers, hyphens, and underscores are allowed'
+      /^[A-Za-z0-9-_.]+$/,
+      'Only letters, numbers, hyphens, underscores, and periods are allowed'
     )
     .nonempty('File name is required'),
 });
@@ -59,6 +59,7 @@ const CreateMapModal = ({ isOpen, closeModal }: CreateMapModalProps) => {
     reset,
     watch,
     setValue,
+    trigger,
     getValues,
   } = methods;
 
@@ -84,6 +85,7 @@ const CreateMapModal = ({ isOpen, closeModal }: CreateMapModalProps) => {
     const systemFile = getValues('systemFile');
     if (systemFile === oldName && systemFile !== systemFilename) {
       setValue('systemFile', systemFilename);
+      trigger('systemFile');
       oldSystemFilename.current = systemFilename;
     }
   }, [getValues, mapName, setValue]);
@@ -92,6 +94,7 @@ const CreateMapModal = ({ isOpen, closeModal }: CreateMapModalProps) => {
     setErrorMessage('');
     closeModal();
     reset();
+    oldSystemFilename.current = '';
   };
 
   const handleDirectoryChange = (directory: string) => {

From e817b03da1900db1ab1abba7cea77cc213238de9 Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 11:21:22 -0600
Subject: [PATCH 07/11] fix export to geojson button

---
 .../components/AssetsPanel/AssetsPanel.tsx    | 43 +++++++++++--------
 1 file changed, 25 insertions(+), 18 deletions(-)

diff --git a/react/src/components/AssetsPanel/AssetsPanel.tsx b/react/src/components/AssetsPanel/AssetsPanel.tsx
index ab75c901..328ce7d9 100644
--- a/react/src/components/AssetsPanel/AssetsPanel.tsx
+++ b/react/src/components/AssetsPanel/AssetsPanel.tsx
@@ -29,7 +29,11 @@ const DownloadFeaturesButton: React.FC<DownloadFeaturesButtonProps> = ({
   isPublicView,
   disabled,
 }) => {
-  const { isLoading: isDownloading, refetch: triggerDownload } = useFeatures({
+  const {
+    data,
+    isLoading: isDownloading,
+    refetch,
+  } = useFeatures({
     projectId: project.id,
     isPublicView: isPublicView,
     assetTypes: [], // Empty array to get all features
@@ -37,26 +41,29 @@ const DownloadFeaturesButton: React.FC<DownloadFeaturesButtonProps> = ({
       enabled: false, // Only fetch when triggered by user clicking button
       gcTime: 0,
       staleTime: 0,
-      onSuccess: (data: FeatureCollection) => {
-        // Create and trigger download
-        const blob = new Blob([JSON.stringify(data)], {
-          type: 'application/json',
-        });
-
-        const url = window.URL.createObjectURL(blob);
-        const link = document.createElement('a');
-        link.href = url;
-        link.download = getFilename(project.name);
-
-        document.body.appendChild(link);
-        link.click();
-
-        document.body.removeChild(link);
-        window.URL.revokeObjectURL(url);
-      },
     },
   });
 
+  const triggerDownload = () => {
+    refetch();
+
+    // Create and trigger download
+    const blob = new Blob([JSON.stringify(data)], {
+      type: 'application/json',
+    });
+
+    const url = window.URL.createObjectURL(blob);
+    const link = document.createElement('a');
+    link.href = url;
+    link.download = getFilename(project.name);
+
+    document.body.appendChild(link);
+    link.click();
+
+    document.body.removeChild(link);
+    window.URL.revokeObjectURL(url);
+  };
+
   return (
     <Button
       loading={isDownloading}

From 35fd65b73b5c82bd4e612dc53b1a2e5795aaa0e5 Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 11:28:20 -0600
Subject: [PATCH 08/11] fix test

---
 react/src/components/CreateMapModal/CreateMapModal.test.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/react/src/components/CreateMapModal/CreateMapModal.test.tsx b/react/src/components/CreateMapModal/CreateMapModal.test.tsx
index 199135a7..cb3ae3e2 100644
--- a/react/src/components/CreateMapModal/CreateMapModal.test.tsx
+++ b/react/src/components/CreateMapModal/CreateMapModal.test.tsx
@@ -147,7 +147,7 @@ describe('CreateMapModal', () => {
     await waitFor(() => {
       expect(
         screen.getByText(
-          'Only letters, numbers, hyphens, and underscores are allowed'
+          'Only letters, numbers, hyphens, underscores, and periods are allowed'
         )
       ).toBeTruthy();
     });

From a1dd68efeb599469f9e37ce4d44ea3fce41a6a54 Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 11:42:33 -0600
Subject: [PATCH 09/11] fix asset panel when feature tree collapses and opens

---
 react/src/components/AssetsPanel/AssetsPanel.module.css         | 2 +-
 react/src/components/FeatureFileTree/FeatureFileTree.module.css | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/react/src/components/AssetsPanel/AssetsPanel.module.css b/react/src/components/AssetsPanel/AssetsPanel.module.css
index 7945164c..d87c4d2c 100644
--- a/react/src/components/AssetsPanel/AssetsPanel.module.css
+++ b/react/src/components/AssetsPanel/AssetsPanel.module.css
@@ -14,7 +14,7 @@
 }
 
 .middleSection {
-  flex: 0 1 auto;
+  flex: 1 1 auto;
   overflow: auto;
   min-height: 10rem;
   display: flex;
diff --git a/react/src/components/FeatureFileTree/FeatureFileTree.module.css b/react/src/components/FeatureFileTree/FeatureFileTree.module.css
index 4a5702b9..49b71940 100644
--- a/react/src/components/FeatureFileTree/FeatureFileTree.module.css
+++ b/react/src/components/FeatureFileTree/FeatureFileTree.module.css
@@ -1,5 +1,6 @@
 .root {
   width: 100%;
+  flex: 1;
   overflow: visible;
 
   :global(.ant-tree .ant-tree-treenode) {

From abd11eb95cc6fa32ecc40424882eee37527713fc Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 11:50:32 -0600
Subject: [PATCH 10/11] do not render certain buttons when isPublicView

---
 .../components/AssetsPanel/AssetsPanel.tsx    | 15 ++++--
 .../components/LayersPanel/LayersPanel.tsx    | 47 ++++++++++---------
 2 files changed, 35 insertions(+), 27 deletions(-)

diff --git a/react/src/components/AssetsPanel/AssetsPanel.tsx b/react/src/components/AssetsPanel/AssetsPanel.tsx
index 328ce7d9..931ef720 100644
--- a/react/src/components/AssetsPanel/AssetsPanel.tsx
+++ b/react/src/components/AssetsPanel/AssetsPanel.tsx
@@ -130,11 +130,16 @@ const AssetsPanel: React.FC<Props> = ({
   return (
     <>
       <Flex vertical className={styles.root}>
-        <Header className={styles.topSection}>
-          <Button onClick={() => setIsModalOpen(true)} icon={<PlusOutlined />}>
-            Import from DesignSafe
-          </Button>
-        </Header>
+        {!isPublicView && (
+          <Header className={styles.topSection}>
+            <Button
+              onClick={() => setIsModalOpen(true)}
+              icon={<PlusOutlined />}
+            >
+              Import from DesignSafe
+            </Button>
+          </Header>
+        )}
         <Content className={styles.middleSection}>
           <FeatureFileTree
             projectId={project.id}
diff --git a/react/src/components/LayersPanel/LayersPanel.tsx b/react/src/components/LayersPanel/LayersPanel.tsx
index bb9ea213..4b0283f0 100644
--- a/react/src/components/LayersPanel/LayersPanel.tsx
+++ b/react/src/components/LayersPanel/LayersPanel.tsx
@@ -266,28 +266,31 @@ const LayersPanel: React.FC<{
                                   )}
                                 </Flex>
                                 <Flex align="center">
-                                  <Button
-                                    type="text"
-                                    icon={
-                                      editLayerField[layerName] ? (
-                                        <CheckOutlined />
-                                      ) : (
-                                        <EditFilled />
-                                      )
-                                    }
-                                    title="Rename Layer"
-                                    size="small"
-                                    disabled={
-                                      editLayerField[layerName] &&
-                                      getFieldState(layerName).invalid
-                                    }
-                                    onClick={() =>
-                                      setEditLayerField({
-                                        ...editLayerField,
-                                        [layerName]: !editLayerField[layerName],
-                                      })
-                                    }
-                                  />
+                                  {!isPublicView && (
+                                    <Button
+                                      type="text"
+                                      icon={
+                                        editLayerField[layerName] ? (
+                                          <CheckOutlined />
+                                        ) : (
+                                          <EditFilled />
+                                        )
+                                      }
+                                      title="Rename Layer"
+                                      size="small"
+                                      disabled={
+                                        editLayerField[layerName] &&
+                                        getFieldState(layerName).invalid
+                                      }
+                                      onClick={() =>
+                                        setEditLayerField({
+                                          ...editLayerField,
+                                          [layerName]:
+                                            !editLayerField[layerName],
+                                        })
+                                      }
+                                    />
+                                  )}
                                   <FormItem
                                     control={control}
                                     name={`tileLayers.${index}.layer.uiOptions.showDescription`}

From e71aeb5e77c92fe4946ed9d8afc5f3e1ad0ea118 Mon Sep 17 00:00:00 2001
From: Sal Tijerina <r.sal.tijerina@gmail.com>
Date: Tue, 18 Feb 2025 12:00:51 -0600
Subject: [PATCH 11/11] add tooltip to View private map button

---
 .../MapControlBar/MapControlbar.module.css    |  1 +
 .../MapControlBar/MapControlbar.tsx           | 31 +++++++++++--------
 2 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/react/src/components/MapControlBar/MapControlbar.module.css b/react/src/components/MapControlBar/MapControlbar.module.css
index 3d0e0437..ff9c3e42 100644
--- a/react/src/components/MapControlBar/MapControlbar.module.css
+++ b/react/src/components/MapControlBar/MapControlbar.module.css
@@ -42,6 +42,7 @@
   display: flex;
   overflow: hidden;
   gap: 10px; /* space between the map name and DS project name */
+  align-items: center;
 }
 
 .coordinatesDisplay {
diff --git a/react/src/components/MapControlBar/MapControlbar.tsx b/react/src/components/MapControlBar/MapControlbar.tsx
index 81c977ae..9b979544 100644
--- a/react/src/components/MapControlBar/MapControlbar.tsx
+++ b/react/src/components/MapControlBar/MapControlbar.tsx
@@ -5,9 +5,9 @@ import { useNavigate } from 'react-router-dom';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faArrowLeft, faLock } from '@fortawesome/free-solid-svg-icons';
 
-import { Button, LoadingSpinner } from '@tacc/core-components';
+import { LoadingSpinner } from '@tacc/core-components';
 
-import { Typography } from 'antd';
+import { Typography, Button, Tooltip } from 'antd';
 
 const { Text } = Typography;
 
@@ -116,17 +116,22 @@ const MapControlbar: React.FC<Props> = ({ activeProject, isPublicView }) => {
           </Text>
         )}
         {canSwitchToPrivateMap && (
-          // TODO_REACT: Add tooltip "View private map" to this button
-          <Button
-            onClick={() => {
-              const { pathname, search } = window.location;
-              const newPath = pathname.replace('/project-public/', '/project/');
-              navigate(`${newPath}${search}`);
-            }}
-            type="link"
-          >
-            <FontAwesomeIcon icon={faLock} />
-          </Button>
+          <Tooltip title="View private map">
+            <Button
+              onClick={() => {
+                const { pathname, search } = window.location;
+                const newPath = pathname.replace(
+                  '/project-public/',
+                  '/project/'
+                );
+                navigate(`${newPath}${search}`);
+              }}
+              type="link"
+              title="View private map"
+            >
+              <FontAwesomeIcon icon={faLock} />
+            </Button>
+          </Tooltip>
         )}
         {isFeaturesLoading && (
           <div className={styles.loadingData}>