cannot use an array of data

[itaysmalia]

I have a very simple component:

<script lang="typescript">
  import { gql } from "@apollo/client";
  import { query } from "svelte-apollo";
  interface User {
    name: string;
    id: number;
  }

  let users = query<{ users: User[] }>(gql`
    {
      users {
        id
        name
      }
    }
  `);
</script>

{#if $users.loading}
  <h1>Loading</h1>
{:else if $users.error}
  <h2>{$users.error}</h2>
{:else if $users.data}
  {#each $users.data.users as user (user.id)}
    <li>{user.name}</li>
  {/each}
{/if}
<ul />

and I have a super annoying ts warning that says Object is possibly 'null' or 'undefined'.ts(2533) on $users.data.users inside the #each loop.

[itaysmalia]

I think it might be a svelte-typescript issue...
I will post the issue in the svelte repo and close this one, I'll update this one for any update in the new one.

[rarenatoe]

Can you point us where the fix to this is?

I am new to typescript and I keep getting similar errors:

/Users/.../project/src/routes/index.svelte:61:10
Error: Object is of type 'unknown'. (ts)
        {:else}
                {#each $products.data.products as product}
                        <li>{product.title} by {product.author.name}</li>

It throws it at the call of $products.data, and both calls of product.

[bompi88]

Yes, I get this as well