Render Appropriately in Embedded Mode

[TaiWilkin]

Overview

When OAR is acting as an embedded map, various components should be hidden or behave differently.

Page

• Remove header and footer

Sidebar:

• Remove contributor filter
• Remove contributor type filter
• Remove report link.
• Remove Guide tab
• Remove the "The open map of..." Header
• Remove actions: Claim, Suggest an Edit, Report as Closed and replace with 'view in OAR' link (target=)
• Make contributor links plain text

Connects #1256

Demo

Testing Instructions

• Run ./scripts/server in vagrant
• Navigate to http://localhost:6543/
  • The site should behave as before
• Navigate to http://localhost:6543/?contributors=8&embed=1
• Navigate to http://localhost:6543/?contributors=8&embed=1
  • The page header and footer should not be displayed
  • The contributor and contributor type filters should not be displayed
  • The guide tab should not be displayed
  • The sidebar OAR header should not be displayed
  • The ‘report a problem’ link should not be displayed
• Click the ’share search’ button
  • The current page link with the embed code removed should be added to the clipboard
• Navigate to a facility
  • The contributor names should be plain text
  • The action links (claim, suggest an edit, report as closed) should be replaced with a single ‘view in OAR’
• Click the ‘view in OAR’ link
  • It should open the same page in a new tab without the ‘embed’ code

Checklist

• fixup! commits have been squashed
• CI passes after rebase
• CHANGELOG.md updated with summary of features or fixes, following Keep a Changelog guidelines

[jwalgran]

Looking at this now.

[jwalgran]

Nice and complete implementation of a "laundry list" feature with lots of concerns. 👍

[jwalgran]

Curious about this empty div. Traditionally we return null from our ternary expressions to skip rendering a component.

[TaiWilkin]

This is to maintain styling - having no component here caused the search/reset buttons to shift left. I could rewrite the styling code explicitly instead, if desired

[lederer]

2 cents: As a rule of thumb, best to avoid spacer divs and make the styling resilient to (expected) DOM variations. But not a huge deal here, and it should disappear anyway when we do a more holistic update to the search form to accommodate additional functionality.

[lederer]

👀

[lederer]

Heads up, I'm seeing a console warning when I open the facility detail view – both in embed and regular mode. But it's also present on develop so I reckon it's out of scope.

Failed prop type: The prop `children` is marked as required in `FeatureFlag`, but its value is `null`.
    in FeatureFlag (created by Connect(FeatureFlag))
    in Connect(FeatureFlag) (at FacilityDetailSidebar.jsx:360)
    in div (at FacilityDetailSidebar.jsx:359)
    in div (at FacilityDetailSidebar.jsx:298)
...

[lederer]

👍 Works as described.