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

Better typescript support #84

Open
TimurKr opened this issue Feb 27, 2024 · 2 comments
Open

Better typescript support #84

TimurKr opened this issue Feb 27, 2024 · 2 comments

Comments

@TimurKr
Copy link

TimurKr commented Feb 27, 2024

rxdb-hooks are super useful, but they miss the type of support I am looking for right now. Also this library seems a little dormant, as last commit was over a year ago, so a proper update of dependencies might be nice.

Issues

In the limited time I have been trying to use this library with full typescript support I encountered one issue:

  • The main issue is that using .findOne() still returns a type of array, even though the actual value is not an array.

Improvements

  • Add support for rxdb 15 and typescript 5
  • Add a hookBuilder<Collections>() function, that returns all of the hooks, but fully typed, so that you can only specify actual collections and the results are automatically typed.

I am willing to open a pull request and implement these changes (if I am able to get them to work), but I first wanted to get your opinion.

Should I try to get this working and open a pull request?

@emab
Copy link

emab commented May 25, 2024

I've been playing around with this myself, as RxDB looks great and having better type support via hooks would be great.

https://github.com/emab/rxdb-hooks-todo/blob/dcd4f8a6c60ee9898db075f1cff2cc5396fa0a1f/src/Todo.tsx

Here's an example Todo application, with some hooks. The typing right now is baked into the hooks - so thinking of a way of handling this would be great.

In Redux you often export your own versions of a useSelector hook, providing your store type with them:

import { useDispatch, useSelector, useStore } from 'react-redux'
import type { AppDispatch, AppStore, RootState } from './store'

// Use throughout your app instead of plain `useDispatch` and `useSelector`
export const useAppDispatch = useDispatch.withTypes<AppDispatch>()
export const useAppSelector = useSelector.withTypes<RootState>()
export const useAppStore = useStore.withTypes<AppStore>()

I'm thinking if I take what I have now and apply this methodology we should end up with nicely typed hooks.

The next step would be getting them more feature complete - so maybe doing this approach in this repo would be better.

@TimurKr
Copy link
Author

TimurKr commented May 25, 2024

Hey @emab, I am glad someone is still looking into this.

I got this working really well in my repo, but I never got around to actually making a PR and I am not working on the project where I did this already, so I guess I never will... Maybe someone else could take it over the finish line, or at least be inspired by my approach, so here is the repo. Check out the /rxdb-hooks/hooks.tsx file for the definition of the typed hook builder and the rxdb/db.tsx for the usage.

The project is also using supabase replication, so if that is your case, there is a custom script that introspects your supabase and generates the schemas for you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants