error when creating an atom containing an object from a type: property does not exist in type 'Read<Type, never>'

[biskyy]

Bug Description

i'm creating an atom that contains an object that should follow a type but it's complaining about property 'x' not existing in type 'Read<DisplayedSong, never>'

interface DisplayedSong {
  song: number;
  bookFirstIndex: number;
  bookLastIndex: number;
  currentReport?: any;
}

const displayedSongInfoAtom = atom<DisplayedSong>({
  song: 1, // <- here it's giving an error
  bookFirstIndex: undefined,
  bookLastIndex: undefined,
  currentReport: undefined,
});

interface MyObject {
  first: number;
  index: number;
}

const myObject = atom<MyObject>({ 
  first: 1, // <- here it isn't
  index: -1 
});

the error is:

 No overload matches this call.
     Overload 1 of 5, '(read: Read<DisplayedSong, never>): Atom<DisplayedSong>', gave the following error.
       Object literal may only specify known properties, and 'song' does not exist in type 'Read<DisplayedSong, never>'. [2769]

i have set strict and strictNullChecks to true in tsconfig.json

i have provided a repro in the App.tsx file of the stackblitz project

Reproduction Link

https://stackblitz.com/edit/vitejs-vite-qkuuzp9l?file=src%2FApp.tsx

[dai-shi]

It's because your initial value doesn't match with your type.
This fixes it: https://tsplay.dev/NaM02N

import { atom } from 'jotai';

interface DisplayedSong {
  song: number;
  bookFirstIndex: number | undefined; // <- accept undefined
  bookLastIndex: number | undefined;
  currentReport?: any;
}

const displayedSongInfoAtom = atom<DisplayedSong>({
  song: 1, // <- here it's giving an error
  bookFirstIndex: undefined,
  bookLastIndex: undefined,
  currentReport: undefined,
});

interface MyObject {
  first: number;
  index: number;
}

const myObject = atom<MyObject>({ 
  first: 1, // <- here it isn't
  index: -1 
});

I agree the TS error message isn't very understandable, but I'm not sure if it can be helped.

[biskyy]

hi thanks for helping out!
first, it seems like david deleted his comment? i wanted to reply but i had to leave my pc. the first method proposed by him worked:

export const displayedSongInfoAtom = atom({
  song: undefined,
  bookFirstIndex: undefined,
  bookLastIndex: undefined,
  currentReport: undefined,
} satisfies DisplayedSong);

the other one didnt.

second: yep, you are right. i also discovered this but couldnt comment. if you assign undefined to a property it will give that overload error to the property above. very weird.

thanks again daishi and david 👍