React Query Context Identity Issue with `@kubernetesjs/react` in Next.js

### Summary

We're encountering a **React context identity issue** in the **Next.js dashboard app** when using hooks from the `@kubernetesjs/react` package. These hooks use TanStack Query (`@tanstack/react-query`) under the hood, but in the context of Next.js (especially with SSR), React treats the context reference as different — even when a `QueryClientProvider` is present at the top level of the app.

This results in `useQuery()` or `useMutation()` calls inside the imported hooks acting as if there's **no provider**, causing errors or undefined results.

---

### 💡 Temporary Fix

The working workaround is to **explicitly pass `context: defaultContext`** in the `options` of every hook usage:

```ts
import { defaultContext } from '@tanstack/react-query';
import { useReadCoreV1NamespacedConfigMapQuery } from '@kubernetesjs/react';

const result = useReadCoreV1NamespacedConfigMapQuery({
path: { namespace: 'default', name: 'my-config' },
options: {
context: defaultContext,
enabled: true,
},
});
```

This ensures the hook uses the same `QueryClient` context as the one provided by the app.

---

### 🤯 Root Cause

React (and TanStack Query) rely on **reference identity** for context propagation. If the `QueryClientProvider` and the internal hook reference **don’t come from the same in-memory `Context` object**, React treats them as separate — even if the versions match.

In this case:

* The app provides a `QueryClientProvider` with `defaultContext`.
* The hook, compiled into `@kubernetesjs/react`, may reference a different `Context` (e.g. due to bundling or module boundary).
* Result: `useQuery` sees no provider.

This is especially problematic in SSR and Next.js environments where module scoping, ESM/CJS boundaries, or Webpack deduping can misalign.

---

### 🛠 Proposed Solutions

1. **Short-term**: Keep using `context: defaultContext` for all hook usages.

2. **Package fix (in `@kubernetesjs/react`)**:

* Export `defaultContext` from the package to ensure unified usage.

```ts
export { defaultContext } from '@tanstack/react-query';
```
* (Optional) Wrap all generated hooks using a helper like `withDefaultContext(hook)` to apply it automatically.

3. **Ensure `@tanstack/react-query` is a peer dependency** in `@kubernetesjs/react`, not a bundled dependency:

```json
"peerDependencies": {
"@tanstack/react-query": "^5.x"
}
```

4. **Enforce module resolution** in the dashboard app’s `next.config.js`:

```js
// next.config.js
webpack: (config) => {
config.resolve.alias['@tanstack/react-query'] = require.resolve(
'next/node_modules/@tanstack/react-query'
);
return config;
};
```

---

### ✅ Action Items

* [ ] Add `context: defaultContext` to all uses of hooks from `@kubernetesjs/react`
* [ ] Audit hook generator or export points in `@kubernetesjs/react` for re-usable context
* [ ] Confirm peer dependency setup in the package
* [ ] Investigate automating context injection in the dashboard app via a wrapper