# @leather-wallet/query

> Leather query

Latest version **0.8.10** (published 2024-06-20) · MIT license · 0 weekly downloads

## Install

```sh
npm install @leather-wallet/query
pnpm add @leather-wallet/query
yarn add @leather-wallet/query
bun add @leather-wallet/query
```

## Health

**Score 35/100 (D)** — status: abandoned.

Positive: esm support; no vulnerabilities; high maintenance score.

Warnings: low downloads; no types; pre 1.0.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.8.10 |
| Published | 2024-06-20 |
| First published | 2024-04-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM |
| Dependencies | 25 |
| Unpacked size | 465 KB |
| Known vulnerabilities | 0 (+29 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 28 |
| Author | Leather.io contact@leather.io |
| Keywords | leather, leather wallet, query |

## Links

- npm: https://www.npmjs.com/package/@leather-wallet/query
- Repository: https://github.com/leather-wallet/mono
- Homepage: https://github.com/leather-wallet/mono/tree/dev/packages/query
- Issues: https://github.com/leather-wallet/mono/issues
- npm.io page: https://npm.io/package/@leather-wallet/query

## Dependencies (25)

- [yup](https://npm.io/package/yup.md) 1.3.3
- [zod](https://npm.io/package/zod.md) 3.23.6
- [axios](https://npm.io/package/axios.md) 1.6.7
- [p-queue](https://npm.io/package/p-queue.md) 8.0.1
- [alex-sdk](https://npm.io/package/alex-sdk.md) 0.1.26
- [url-join](https://npm.io/package/url-join.md) 5.0.0
- [lodash.get](https://npm.io/package/lodash.get.md) 4.4.2
- [@scure/base](https://npm.io/package/@scure/base.md) 1.1.6
- [@scure/bip32](https://npm.io/package/@scure/bip32.md) 1.4.0
- [bignumber.js](https://npm.io/package/bignumber.js.md) 9.1.2
- [@noble/hashes](https://npm.io/package/@noble/hashes.md) 1.4.0
- [@stacks/common](https://npm.io/package/@stacks/common.md) 6.13.0
- [@stacks/connect](https://npm.io/package/@stacks/connect.md) 7.4.0
- [@scure/btc-signer](https://npm.io/package/@scure/btc-signer.md) 1.3.2
- [@stacks/rpc-client](https://npm.io/package/@stacks/rpc-client.md) 1.0.3
- [@leather-wallet/rpc](https://npm.io/package/@leather-wallet/rpc.md) 1.0.4
- [@stacks/transactions](https://npm.io/package/@stacks/transactions.md) 6.15.0
- [@leather-wallet/utils](https://npm.io/package/@leather-wallet/utils.md) 0.8.3
- [@tanstack/react-query](https://npm.io/package/@tanstack/react-query.md) 5.45.1
- [@leather-wallet/models](https://npm.io/package/@leather-wallet/models.md) 0.9.0
- [@leather-wallet/bitcoin](https://npm.io/package/@leather-wallet/bitcoin.md) 0.7.4
- [@leather-wallet/constants](https://npm.io/package/@leather-wallet/constants.md) 0.7.0
- [@fungible-systems/zone-file](https://npm.io/package/@fungible-systems/zone-file.md) 2.0.0
- [@stacks/stacks-blockchain-api-types](https://npm.io/package/@stacks/stacks-blockchain-api-types.md) 7.8.2
- [@hirosystems/token-metadata-api-client](https://npm.io/package/@hirosystems/token-metadata-api-client.md) 1.2.0

## Alternatives

- [gamedig](https://npm.io/package/gamedig.md) — 29.3K weekly downloads
- [join-monster](https://npm.io/package/join-monster.md) — 12.8K weekly downloads
- [masked](https://npm.io/package/masked.md) — 5.5K weekly downloads
- [@comunica/actor-query-process-explain-logical](https://npm.io/package/@comunica/actor-query-process-explain-logical.md) — 4.7K weekly downloads
- [@veracity/vui](https://npm.io/package/@veracity/vui.md) — 4.6K weekly downloads

## Recent versions

- 0.8.10 (latest) — 2024-06-20
- 0.8.9 — 2024-06-20
- 0.8.8 — 2024-06-17
- 0.8.7 — 2024-06-12
- 0.8.6 — 2024-06-11
- 0.8.5 — 2024-06-11
- 0.8.4 — 2024-06-11
- 0.8.3 — 2024-06-10
- 0.8.2 — 2024-06-08
- 0.8.1 — 2024-06-07
- 0.8.0 — 2024-06-07
- 0.7.1 — 2024-06-07
- 0.7.0 — 2024-06-07
- 0.6.12 — 2024-06-05
- 0.6.11 — 2024-06-05
- … 19 more at https://npm.io/package/@leather-wallet/query/versions

## README

# @leather-wallet/queries

We use `React Query` to fetch APIs and to manage the cache of the responses.

Code practices:

1. Create custom hooks for queries, don't use plain `useQuery` in components.
2. Treat the query key like a dependency array. queryFn should receive same arguments as a queryKey.
3. Use selectors to transform the data before usage. Example:

```jsx
export const useTodosQuery = select =>
  useQuery({
    queryKey: ['todos'],
    queryFn: fetchTodos,
    select,
  });

export const useTodosCount = () => useTodosQuery(data => data.length);
export const useTodo = id => useTodosQuery(data => data.find(todo => todo.id === id));
```

4. Keep api layer separate from the queries (queryFn separate from useQueries). Example:

```jsx
function fetchGroups(): Promise<Group[]> {
  return axios.get('groups').then((response) => response.data)
}

// ✅ data will be `Group[] | undefined` here
function useGroups() {
  return useQuery({ queryKey: ['groups'], queryFn: fetchGroups })
}

// ✅ data will be `number | undefined` here
function useGroupCount() {
  return useQuery({
    queryKey: ['groups'],
    queryFn: fetchGroups,
    select: (groups) => groups.length,
  })
}
```

5. Structure your Query Keys from most generic to most specific. Example:

```jsx
['todos', 'list', { filters: 'all' }][('todos', 'list', { filters: 'done' })][
  ('todos', 'detail', 1)
][('todos', 'detail', 2)];
```

6. Optional: we might want to try the concept of query key factory: https://tkdodo.eu/blog/effective-react-query-keys#use-query-key-factories

Reference: https://tkdodo.eu/blog/practical-react-query

---
_Source: https://npm.io/package/@leather-wallet/query · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._