Giter Club home page Giter Club logo

elf-ng-router-store's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

elf-ng-router-store's Issues

selectParams not support optional parameters

Description

when I try to upgrade from akita-ng-router-store, I have using selectParams which the parameter is an optional and there have no problem because when the parameter is undefined, selectParams still will emit the value, but elf-ng-router-store not supporting this. I want to suggest remove the filterNil operator from the selectParams method.

Proposed solution

 selectParams<T extends string>(
names?: string | string[]
): Observable<T | T[] | Params | null> {
  if (names === undefined) {
    return store.pipe(sliceState('params'));
  }

const _select = (p: string) =>
  store.pipe(
    sliceState<RouterState>('params'),
    pluck(p),
    filterNil() <--- remove this line
  );

if (Array.isArray(names)) {
  const sources = names.map(_select);
  return combineLatest(sources);
}

return _select(names).pipe(distinctUntilChanged());

}

Alternatives considered

no other alternatives

Do you want to create a pull request?

No

Installation Issue

When I install the new version 1.0.3:

npm install @ngneat/elf-ng-router-store

node_modules/@ngneat/elf-ng-router-store only contains package.json. Nothing is installed.

support for @ngneat/elf 2.x ?

Description

Hi, i'm trying to use this library with a freshly created angular 13 and ngneat/elf@^2.1.0

But npm complains about peer dependencies


❯ npm i
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: @ngneat/[email protected]
npm ERR! Found: @ngneat/[email protected]
npm ERR! node_modules/@ngneat/elf
npm ERR!   @ngneat/elf@"^2.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @ngneat/elf@"^1.0.2" from @ngneat/[email protected]
npm ERR! node_modules/@ngneat/elf-ng-router-store
npm ERR!   @ngneat/elf-ng-router-store@"^1.0.4" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: @ngneat/[email protected]
npm ERR! node_modules/@ngneat/elf
npm ERR!   peer @ngneat/elf@"^1.0.2" from @ngneat/[email protected]
npm ERR!   node_modules/@ngneat/elf-ng-router-store
npm ERR!     @ngneat/elf-ng-router-store@"^1.0.4" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution. 

Proposed solution

Do you think we can bump elf version to ^2.0.0 without breaking changes ? or set peerDeps version to "*" ?

Alternatives considered

or set peerDeps version to "*" ?

i don't want to force or use legacy-peer-deps as it will come again next install

Do you want to create a pull request?

Yes

selectQueryParams return type

Looks like when we call selectQueryParams() without providing names parameter, it will return original params from the router. However, because the way the function is declared, it cause type error. For example:

routerRepo.selectQueryParams().subscribe(params => {

  // type error below, params is inferred as string or string[]
  if (params && params['year']) {
    ...
  }
})

I will have do const paramsMap = params as unknown as Params to bypass the type check. Is this behavior by design? Am I doing something wrong? What should I do if want to work on all params?

Thanks!

Route state gets stuck in Angular Universal

Is this a regression?

Not sure

Description

When using this library in a project with Angular Universal, the first page load in the SSR response loads the requested route, however, subsequent navigations always respond with the initial route from the server site, before CSR boots and navigated to the actual route.

I've traced it to navigateIfNeeded, here https://github.com/ngneat/elf-ng-router-store/blob/master/libs/ng-router-store/src/lib/router.service.ts#L115, it seems like something is happening with potential stale emissions from the router repository, where the update to the route that is being requested isn't in the store before the call to setUpStoreListener happens, resulting in navigateIfNeeded issuing a navigateByUrl to the previous route on the server side.

Please provide a link to a minimal reproduction of the bug

I'm attempting to create a reproduction of this issue on this stackblitz: https://stackblitz.com/edit/stackblitz-starters-5q2tm5?file=src%2Findex.html

That said, I've ran into issues with this where it seems to just get stuck in some kind of infinite loop on the server side that I've yet to be able to track down.

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in

My application is an MFE based angular app with multiple static remotes federated into a host app, some using names router outlets, and using the router store helps to ensure that all the MFEs see the same router state, as named router outlets result in things like ActivatedRoute not having the "real" URL represented in their state(s).

Anything else?

I've identified a workaround by adding the following code in the constructor of my AppModule:

if (isPlatformServer(this.platformId)) {
  this.routerRepository.update({ state: null, navigationId: null });
}

Additionally, moving the import of ElfNgRouterStoreModule from my host application, into each MFE's shell seems to at least sidestep the issue, as the above code was not reliably producing a fix. Not having the state clearing resulted in infinite navigation loops causing the SSR server to hang. That said, moving that import seems to produce multiple subscriptions to the router store and I saw multiple calls to navigateIfNeeded, that however all resulted in no navigation being performed. However I would imagine that all of this is less than ideal.

Do you want to create a pull request?

If I can figure out a fix to propose.

Cannot find module '@ngneat/elf-ng-router-store'

Is this a regression?

No

Description

Hi Iam new to state management with Elf and would like to use your plugin because it perfectly fits my requirements of reacting to changes in the router

Steps to reproduce:

  1. create a new Angular project using angular cli
  2. install elf using npx npx @ngneat/elf-cli install
    • I installed @ngneat/elf, @ngneat/elf-entities and @ngneat/elf-devtools. No external packages
  3. install elf-ng-router-store by running npm install @ngneat/elf-ng-router-store
  4. open app.module and add the following line
    • import { ElfNgRouterStoreModule } from '@elf/ng-router-store'; (from documentation)
    • this gives me the error: Cannot find module '@elf/ng-router-store' or its corresponding type declarations.

I think the import statement is not correct (so to say the reference in the documentation is not correct) but when I try to change the import to import { ElfNgRouterStoreModule } from '@ngneat/elf-ng-router-store'; (which I think is the correct import) typescript still cant find the module (same error as given above)

When I inspect my node_modules under @ngneat/elf-ng-router-store it displays only a package.json which could be the mistake.
grafik

Is this a bug or am I doing something wrong?

Nonetheless thanks for your work

Please provide a link to a minimal reproduction of the bug

see description above

Please provide the exception or error you saw

Cannot find module '@elf/ng-router-store' or its corresponding type declarations.

Please provide the environment you discovered this bug in

Angular 12
Typescript 4.2.3
@ngneat/elf-ng-router-store 1.0.1

Anything else?

No response

Do you want to create a pull request?

No

NPM install for Angular 12 fails

Is this a regression?

No

Description

I cannot install this package for any Angular 12 project with the following command: npm install @ngneat/[email protected]

It works for on Angular 13 though.

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: @angular/[email protected]
npm ERR! node_modules/@angular/common
npm ERR!   @angular/common@"12.0.4" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/common@"^13.0.0" from @ngneat/[email protected]
npm ERR! node_modules/@ngneat/elf-ng-router-store
npm ERR!   @ngneat/elf-ng-router-store@"^1.0.2" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

Please provide the environment you discovered this bug in

Angular 12.0.4
Typescript 4.2.4
rxjs 6.6.2
@ngneat/elf-ng-router-store 1.0.2

Anything else?

No response

Do you want to create a pull request?

No

Getting Auxiliary Route Date (outlet)

Description

I couldn't find a way to access the outlet data that is stored in the secondary uri. So when working with Auxiliary Routes im forced to use the angular Activated Route.

  import { ActivatedRoute } from '@angular/router';
  import { RouterRepository } from '@ngneat/elf-ng-router-store';
  
  routerData$ = this.routerStore.selectData();
  outletData$ = this.route.data;
  constructor(   private routerStore: RouterRepository, private route: ActivatedRoute){}

routerData and outletData gives me another result.
example route users/overview(side:create)

Proposed solution

Introduce Outlet into elf-ng-router-store
current output:

{
  router: {
    state: {
      url: '/users/overview(side:create)',
      urlAfterRedirects: '/users/overview(side:create)',
      params: {},
      queryParams: {},
      fragment: null,
      data: {
        application: 'account',
        menu: 'users',
      }
    },
    navigationId: 1
  }
}

requested output:

Introduce Outlet into elf-ng-router-store
current output:

{
router: {
state: {
url: '/users/overview(side:create)',
urlAfterRedirects: '/users/overview(side:create)',
params: {},
queryParams: {},
fragment: null,
data: {
application: 'account',
menu: 'users',
},
outlets: [
{ url: '/create', data: { type: 'human' } }
]
},
navigationId: 1
}
}



### Alternatives considered

any other options :P 

### Do you want to create a pull request?

No

Angular 15

Description

Can we add angular 15 to supported peer dependencies?

Proposed solution

Add angular 15 to supported peer dependencies

Alternatives considered

None

Do you want to create a pull request?

Yes

Getting data from lazy loaded child component doesn't work

Is this a regression?

No

Description

  • Set data in your lazy loaded route:

image

  • Subscribe to data changes:

image

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in

@ngneat/elf-ng-router-store: 1.0.4

Anything else?

No response

Do you want to create a pull request?

No

The automated release is failing 🚨

🚨 The automated release from the master branch failed. 🚨

I recommend you give this issue a high priority, so other packages depending on you can benefit from your bug fixes and new features again.

You can find below the list of errors reported by semantic-release. Each one of them has to be resolved in order to automatically publish your package. I’m sure you can fix this πŸ’ͺ.

Errors are usually caused by a misconfiguration or an authentication problem. With each error reported below you will find explanation and guidance to help you to resolve it.

Once all the errors are resolved, semantic-release will release your package the next time you push a commit to the master branch. You can also manually restart the failed CI job that runs semantic-release.

If you are not sure how to resolve this, here are some links that can help you:

If those don’t help, or if this issue is reporting something you think isn’t right, you can always ask the humans behind semantic-release.


No npm token specified.

An npm token must be created and set in the NPM_TOKEN environment variable on your CI environment.

Please make sure to create an npm token and to set it in the NPM_TOKEN environment variable on your CI environment. The token must allow to publish to the registry https://registry.npmjs.org/.


Good luck with your project ✨

Your semantic-release bot πŸ“¦πŸš€

Corect the document

Is this a regression?

Yes

Description

In: README.md

`import { ElfNgRouterStoreModule } from '@elf/elf-ng-router-store';

@NgModule({
imports: [
ElfNgRouterStoreModule
})
export class AppModule {
}`

'@elf/elf-ng-router-store' should be '@ngneat/elf-ng-router-store'

its very small, not really breaking issue just reporting

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in

No response

Anything else?

No response

Do you want to create a pull request?

Yes

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.