maproulette3 icon indicating copy to clipboard operation
maproulette3 copied to clipboard

Make link previews dynamic to each page

Open CollinBeczak opened this issue 2 years ago • 0 comments

This is ticket is building off of https://github.com/maproulette/maproulette3/issues/2248 & https://github.com/maproulette/maproulette3/issues/1755, Link previews have already been implemented already in this PR: https://github.com/maproulette/maproulette3/pull/2251, be we need to make these link previews dynamic to each page of the app.

We need different previews, (Including images, descriptions, and titles) for each of these pages:

  • Not found
  • Home
  • Dashboard
  • Browse
  • Task focused
  • (Possibly add manage and edit versions)
  • Challenge focused
  • (Possibly add manage and edit versions)
  • Project focused
  • (Possibly add manage and edit versions)
  • Leaderboard focused

Additional context Adding custom meta tags wouldn't be that big of an issue, react-helmet is a great library are using and can use to create those meta tags. However, there is a problem with how we need to pass props and the order of which the components of a page are rendered. The helmet has to have the props in order to set up dynamic meta tags, but also needs to run at the start of page rendering as link preview creation in other apps only read the initial render.

CollinBeczak avatar Jan 23 '24 19:01 CollinBeczak