Feature: support redirect param on creation page, redirect to the Safe app page if Safe was created from the landing

[mmv08]

What it solves

Resolves safe-global/safe-react-apps#417

How this PR fixes it

Adds new redirect param for the safe creation route. If the URL string has a template for Safe Route, it populates it with the address.

How to test it

1. Create a safe from https://pr3790--safereact.review-safe.gnosisdev.com/app/share/safe-app?appUrl=https%3A%2F%2Fapps.gnosis-safe.io%2Ftx-builder&chainId=4
2. After the creation, it should take you to the tx builder app

[github-actions]

CLA Assistant Lite All Contributors have signed the CLA.

[github-actions]

ESLint Summary View Full Report

Annotations are provided inline on the Files Changed tab. You can also see all annotations that were generated on the annotations page.

Type	Occurrences	Fixable
Errors	0	0
Warnings	0	0
Ignored	1	N/A

• Result: ✅ success
• Annotations: 0 total

---

^{Report generated by eslint-plus-action}

[github-actions]

Deployment links

🟠 Rinkeby	⚪ Mainnet	🟣 Polygon	🟡 BSC	⚫ Arbitrum	🟢 Gnosis Chain

[katspaugh]

Looks good!

[DaniSomoza]

This edge case is already addressed in the first useEffect right?

What is your opinion about to remove this redundant redirection and keep showing the Loader? (and restore this 2 lines in the unit tests?)

[mmv08]

I don't think addressing it in useEffect is the way to go. We don't need to render anything if there's no safeAppUrl. This is also better for types stuff, because query.get returns string | undefined and this narrows it to string, making it easer for subsequent access

[DaniSomoza]

Then maybe makes sense update both useEffect ?. Something like this:

const SafeAppLandingPage = (): ReactElement => {
  const query = useQuery()
  const safeAppChainId = query.get('chainId')
  const safeAppUrl = query.get('appUrl')

  useEffect(() => {
    if (isValidChainId(safeAppChainId)) {
      setChainId(safeAppChainId)
    }
  }, [safeAppChainId])

  [...] // other stuff

  // the second useEffect is unnecessary, and instead, do:

  const isSafeAppMissing = !isLoading && !safeAppDetails && isManifestError

  if (!safeAppUrl || !safeAppChainId || isSafeAppMissing) {
    return <Redirect to={WELCOME_ROUTE} />
  }

  const availableChains = safeAppDetails?.chainIds || []

  const showLoader = isLoading || !safeAppDetails

  return (
    <Container>
      <StyledCard>
            [...]

[mmv08]

done senor

[github-actions]

ESLint Summary View Full Report

Annotations are provided inline on the Files Changed tab. You can also see all annotations that were generated on the annotations page.

Type	Occurrences	Fixable
Errors	0	0
Warnings	0	0
Ignored	1	N/A

• Result: ✅ success
• Annotations: 0 total

---

^{Report generated by eslint-plus-action}