Enable "explore in tool" on dev place pages (datacommonsorg#4785)

Adds the "explore in [timeline/map] tool" to chart footers in the dev place pages. Also sorts fields alphabetically for codacy code quality. Example: ![Screenshot 2024-12-11 at 10 00 48 AM](https://github.com/user-attachments/assets/260d9429-989b-4a0d-a8e5-f93a132c3a55)
gmechali · Dec 11, 2024 · dfe8688 · dfe8688
1 parent 7c4dc36
commit dfe8688
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 4 deletions.
diff --git a/server/webdriver/shared_tests/place_explorer_test.py b/server/webdriver/shared_tests/place_explorer_test.py
@@ -301,3 +301,17 @@ def test_dev_place_overview_california(self):
     related_places_callout_el = WebDriverWait(
         self.driver, self.TIMEOUT_SEC).until(related_places_callout_el_present)
     self.assertEqual(related_places_callout_el.text, 'Places in California')
+
+    # Assert the "Download" link is present in charts
+    download_link_present = EC.presence_of_element_located(
+        (By.CLASS_NAME, 'download-outlink'))
+    download_link_el = WebDriverWait(
+        self.driver, self.TIMEOUT_SEC).until(download_link_present)
+    self.assertTrue('Download' in download_link_el.text)
+
+    # Assert the "Explore in ... Tool" link is present in charts
+    explore_in_link_present = EC.presence_of_element_located(
+        (By.CLASS_NAME, 'explore-in-outlink'))
+    explore_in_link_el = WebDriverWait(
+        self.driver, self.TIMEOUT_SEC).until(explore_in_link_present)
+    self.assertTrue('Explore in' in explore_in_link_el.text)
diff --git a/static/js/components/tiles/chart_footer.tsx b/static/js/components/tiles/chart_footer.tsx
@@ -49,7 +49,7 @@ export function ChartFooter(props: ChartFooterPropType): JSX.Element {
         <div className="main-footer-section">
           <div className="outlinks">
             {props.handleEmbed && (
-              <div className="outlink-item">
+              <div className="outlink-item download-outlink">
                 <span className="material-icons-outlined">download</span>
                 <a
                   href="#"
@@ -66,7 +66,7 @@ export function ChartFooter(props: ChartFooterPropType): JSX.Element {
               </div>
             )}
             {props.exploreLink && (
-              <div className="outlink-item">
+              <div className="outlink-item explore-in-outlink">
                 <span className="material-icons-outlined">timeline</span>
                 <a
                   href={props.exploreLink.url}

diff --git a/static/js/place/dev_place_main.tsx b/static/js/place/dev_place_main.tsx
@@ -471,10 +471,11 @@ const PlaceCharts = (props: {
   return (
     <div className="charts-container">
       <SubjectPageMainPane
+        defaultEnclosedPlaceType={childPlaceType}
         id="place-subject-page"
-        place={place}
         pageConfig={pageConfig}
-        defaultEnclosedPlaceType={childPlaceType}
+        place={place}
+        showExploreMore={true}
       />
     </div>
   );