`useResource$` which runs on the Client only

[nidomiro]

Is your feature request related to a problem?

I'm currently writing a sample app of how to implement a selfservice-ui for Ory Kratos in qwik. At first I used useResource$ to make the api-call. It worked only with CSR, but not with SSR. To be more specific the call and the hook worked, but there was something missing, so that the second call, to submit the login-form, failed due to an CSRF-issue.

My assumption is, that cookies where not set correctly wen rendered on the server.

Describe the solution you'd like

In my opinion there are two solutions:

1. Implementing a useClientResource$ that only runs on the client. Then cookies are no problem. The problem is, that this would effectively disable SSR for this usecase.
2. Forward cookies from requests to the client. This would be a transparent solution, which would still enable SSR, but harder to implement.

Describe alternatives you've considered

My current workaround is to use useClientEffect$ in conjunction with useStore. This is not a good solution, as it is way lass readable and does not support loading states out of the box.

Additional context

The current workaround implementation: https://github.com/nidomiro/qwik-ory-selfservice-ui/blob/a2e5f857ad22a472cbaad74db8598b86b1773821/src/routes/auth/login/index.tsx

[nnelgxorz]

I'm wondering if a new api is acutally needed. It seems like the bigger issue is that cookies aren't being set correctly on the Response. If the cookie issue was fixed, would that resolve your problem?

[nidomiro]

@nnelgxorz sorry for the late reply.

I just checked it again. Use resource does not set (forward) any cookies. So yes, forwarding the cookies would solve that issue without implementing another api.

[manucorporat]

We will not add more hooks, this can be solved by doing:

import { isBrowser } from '@builder.io/qwik/build';

useResource$(() => {
  if (isBrowser) {
    // code here
  }
});