react-navigation icon indicating copy to clipboard operation
react-navigation copied to clipboard

Linking: Params are not parsed correctly when a screen appears in multiple configs

Open bviebahn opened this issue 3 years ago • 2 comments

Current behavior

I have this config:

const config = {
  screens: {
    Tabs: {
      screens: {
        Sortiment: {
          path: "sortiment",
          screens: {
            Category: {
              path: "k/:category?",
              exact: true
            }
          }
        },
        Home: {
          path: "home",
          screens: {
            Category: "category"
          }
        }
      }
    }
  }
};

And I'm trying to parse this path:

const path = "k/categoryParam?x=x";

The state object that is returned when I call getStateFromPath(path, state) looks like this:

{
    "routes": [
        {
            "name": "Tabs",
            "state": {
                "routes": [
                    {
                        "name": "Sortiment",
                        "state": {
                            "routes": [
                                {
                                    "name": "Category",
                                    "path": "k/categoryParam?x=x",
                                    "params": {
                                        "x": "x"
                                    }
                                }
                            ]
                        }
                    }
                ]
            }
        }
    ]
}

Notice how categoryParam is not included in the routes params. If you remove the second path config inside the "Home" config, the params are parsed correctly.

I tracked the problem down to this line: https://github.com/react-navigation/react-navigation/blob/838842e85fffd56a3a64a1f4e969318998217c7a/packages/core/src/getStateFromPath.tsx#L287

In this case there are two configs that can be found here, and the wrong one is used to construct the params.

Expected behavior

params should include the category param and look like this:

{
     "category": "categoryParam",
     "x": "x"
}

Reproduction

https://codesandbox.io/s/npm-playground-forked-pnv716?file=/src/index.js

Platform

  • [ ] Android
  • [ ] iOS
  • [X] Web
  • [ ] Windows
  • [ ] MacOS

Packages

  • [ ] @react-navigation/​bottom-tabs
  • [ ] @react-navigation/​drawer
  • [ ] @react-navigation/​material-bottom-tabs
  • [ ] @react-navigation/​material-top-tabs
  • [ ] @react-navigation/​stack
  • [ ] @react-navigation/​native-stack

Environment

  • [x] I've removed the packages that I don't use
package version
node v16.13.2
yarn 1.22.15

bviebahn avatar Aug 10 '22 09:08 bviebahn

Couldn't find version numbers for the following packages in the issue:

  • @react-navigation/native

Can you update the issue to include version numbers for those packages? The version numbers must match the format 1.2.3.

github-actions[bot] avatar Aug 10 '22 09:08 github-actions[bot]

Hey! Thanks for opening the issue. The issue doesn't seem to contain a link to a repro (a snack.expo.dev link, a www.typescriptlang.org/play link or link to a GitHub repo under your username).

Can you provide a minimal repro which demonstrates the issue? Please try to keep the repro as small as possible and make sure that we can run it without additional setup.

A repro will help us debug the issue. The issue will be closed automatically after a while if you don't provide a repro.

github-actions[bot] avatar Aug 10 '22 09:08 github-actions[bot]