Does gqless have API to assert data to be loaded?

[bglgwyng]

const App = () => {
  const query = useQuery();
  const { me: { name, age } } = query;

  assertLoaded(query);

  return (
    <div>
      Hello {name}!
      I'm {age} years old.
    </div>
  );
};

Here you can see assertLoaded as lazy prepare. const { me: { name, age } } = query this destructring notices gqless what to query. And then assertLoaded throws suspension until the following query is fetched.

{
  me {
    name
    age
  }
}

Does gqless have aserrtLoaded like API?

[outerlook]

Doesn't React version already supports suspense out of the box? I don't think this api exists, as this already suspends

https://gqless.com/react/fetching-data

Edit. You have to include the suspense: true

[bglgwyng]

Sorry, my question was bit vague.

const App = () => {
  const query = useQuery();
  const { me: { name, age } } = query;

  console.log(name);

In this case, we can see that the value of name is undefined in the first rendering.
I want to prevent console.log(name) from executing by injecting assertLoaded before it.
assertLoaded should throw suspense until the accessed fields got their value.
I set suspense to true and checked the behavior. But it wasn't working in the way I want.

[outerlook]

Oh, alright! You would like to interrupt the component rendering before executing the rest. That's it?

Although you should keep in mind this would create some network cascading problems if you try to access some data after the assertion, right?

There would be no such problem if you let your function try to render freely. If that's not an issue, never mind.

I think currently there's no assertLoaded built in. But I know useQuery exposes something like $isLoading which could be used to build an assertLoaded function, no?

[bglgwyng]

Thank you for your reply.
The problem I have is that I need to put fetched data into some hooks as arguments.
More concretely, I'm using Formik and trying to put data from gqless into Formik instance's initial values.
AFAIK, there is no way to prevent Formik instance is initiated with undefined values in the current situation.
This is the reason I think that I need a barrier function like assertLoaded, which protects following logics from using undefined values from gqless.

I think currently there's no assertLoaded built in. But I know useQuery exposes something like $isLoading which could be used to build an assertLoaded function, no?

I can check if it's loading or not with $isLoading. However, I don't know the way to throw suspend to wait until gqless loads the required data.

[outerlook]

Would it be ok to first populate formik with undefined then set values after fetching?

There is a function called resolved on core that transforms gqless functions into promises.

If you have a defined function to convert database data to form called fromDB(data), the example would be something like

useEffect(() => {
  resolved(() => fromDB(data)).then(fetchedData => setFields(fetchedData)
},[]) 

Edit. Doesn't preload function also helps in this case?