Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[🐞] Limit on dynamic routes does not work #5080

Closed
anartzdev opened this issue Sep 1, 2023 · 2 comments · Fixed by #5112
Closed

[🐞] Limit on dynamic routes does not work #5080

anartzdev opened this issue Sep 1, 2023 · 2 comments · Fixed by #5112
Labels
TYPE: bug Something isn't working

Comments

@anartzdev
Copy link
Contributor

Which component is affected?

Qwik City (routing)

Describe the bug

Good morning,

I was configuring the dynamic routes theme of my project along with establishing a limit route, as could be done in previous versions and unfortunately I see that it does not work, that it does not correctly detect that limit.

It is true that I see in the documentation that this option is no longer described, perhaps it has been removed and I have not realized it, it would be a shame if it were removed, it seemed super useful to me.

What happens is that if I have a structure like this:

Reproduction

https://github.com/Qwik-Spanish/qwik-routing-bug

Steps to reproduce

  1. Create project with npm create qwik@latest
  2. Select Empty App template.
  3. Create this routes folders and files.
src/
  └── routes/
      └── product/
          └── [...productIds]/
                |── index.tsx
                └── details/
                    └──index.tsx
  1. Add content to src/routes/product/[...productIds]/index.tsx:
import { component$ } from '@builder.io/qwik';
import { useLocation } from '@builder.io/qwik-city';

export default component$(() => {
  const location = useLocation();
  return (
    <>
      <div>Product Item [...productIds] - Principal Page</div>
      <p>Href: {location.url.href}</p>
      <p>Pathname: {location.url.pathname}</p>
      <p>Product Id:</p>{' '}
      <ul>
        {location.params.productIds.split('/').map((id, index) => {
            return (id !== '') ? (
                <li>
                  Product select ({index + 1}): {id}
                </li> 
              ): undefined
        })}
      </ul>
    </>
  );
});
  1. Add content to src/routes/product/[...productIds]/details/index.tsx:
import { component$ } from '@builder.io/qwik';
import { useLocation } from '@builder.io/qwik-city';

export default component$(() => {
  const location = useLocation();
  return (
    <>
      <div>Product - Page Details</div>
      <p>Href: {location.url.href}</p>
      <p>Pathname: {location.url.pathname}</p>
      <p>Product Id:</p>{' '}
      <ul>
        {location.params.productIds.split('/').map((id, index) => {
            return (id !== '') ? (
                <li>
                  Producto seleccionado ({index + 1}): {id}
                </li> 
              ): undefined
        })}
      </ul>
    </>
  );
});

Now, when I start testing the routes, if I do enter "ids" up to "n" times like:

  1. /product/2292
  2. /product/2/2/3/3/3839
  3. /product/25/29/2/233
    This will render it correctly by taking the corresponding to src/routes/product/[...productIds]/index.tsx

The extract info productIds

  1. 2292
  2. 2/2/3/3/3839
  3. 25/29/2/233

On the other hand, in previous versions if you did, taking into account that the details directory is a child element, if we put "details" at the end of any of the continuation of the previous routes, apart from not showing "details", it did like a kind of limit.

Example:

  1. /product/2292/details
  2. /product/2/2/3/3/3839/details
  3. /product/25/29/2/233/details

Previously it would return us by entering these routes

  1. 2292
  2. 2/2/3/3/3839
  3. 25/29/2/233

Currently returns this, without limiting it

  1. 2292/details
  2. 2/2/3/3/3839/details
  3. 25/29/2/233/details

This has changed? Or is there some problem in operation?

Thank you very much, I hope I have provided enough information and if you have removed this functionality, apologies in advance, I have not found out :(

System Info

System:
    OS: Linux 5.15 Ubuntu 20.04.4 LTS (Focal Fossa)
    CPU: (8) x64 11th Gen Intel(R) Core(TM) i7-1165G7 @ 2.80GHz
    Memory: 5.47 GB / 7.61 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 16.19.0 - ~/.nvm/versions/node/v16.19.0/bin/node
    Yarn: 1.22.18 - /usr/bin/yarn
    npm: 8.19.3 - ~/.nvm/versions/node/v16.19.0/bin/npm
  npmPackages:
    @builder.io/qwik: ^1.2.10 => 1.2.10
    @builder.io/qwik-city: ^1.2.10 => 1.2.10
    undici: 5.22.1 => 5.22.1
    vite: 4.4.7 => 4.4.7

Additional Information

No response

@anartzdev anartzdev added STATUS-1: needs triage New issue which needs to be triaged TYPE: bug Something isn't working labels Sep 1, 2023
@mhevery mhevery removed the STATUS-1: needs triage New issue which needs to be triaged label Sep 1, 2023
@mhevery
Copy link
Contributor

mhevery commented Sep 1, 2023

Hmm, I thought I fixed it with #5054 but upgrading to this version still fails...

@anartzdev
Copy link
Contributor Author

Hello Misko,
Thanks for responding, so as I see it has not been removed by will, that is, it does not work correctly unfortunately :(

I will be attentive to new events, thank you very much for the great work you do, greetings

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
TYPE: bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants