Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

TypeScript error with Object.fromEntries from fetched data

requests = { name: url, name: url, …}
I’ve tried to fetch every url and return { name: data, name: data, …}

Code

async function fetchMovies(url: string) {
  const data = await fetch(baseURL + url).then((r) => r.json());
  return data.results;
}

export const getMovies = createAsyncThunk("movies/getMovies", async () => {
  const responses = Object.entries(requests).map(async ([key, value]) => {
    try {
      const response = await fetchMovies(value);
      return [key, response];
    } catch (e: unknown) {
      if (e instanceof Error) {
        console.log(e.message);
      }
    }
  });

  const results = await Promise.all(responses);
  console.log(results); // [[string, SomeType[]], [string, SomeType[]], ...]
  return Object.fromEntries(results); // error
});

console.log(results)

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

Array (8)
 0 ["netflixOriginals", Array] (2)
 1 ["trending", Array] (2)
 2 ["topRated", Array] (2)
 3 ["action", Array] (2)
 4 ["comedy", Array] (2)
 5 ["horror", Array] (2)
 6 ["romance", Array] (2)
 7 Array (2)
   0 "documentary"
   1 [Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, …] (20)

Error

TS2769: No overload matches this call.
  Overload 1 of 2, '(entries: Iterable<readonly [PropertyKey, any]>): { [k: string]: any; }', gave the following error.
    Argument of type '(any[] | undefined)[]' is not assignable to parameter of type 'Iterable<readonly [PropertyKey, any]>'.
      The types returned by '[Symbol.iterator]().next(...)' are incompatible between these types.
        Type 'IteratorResult<any[] | undefined, any>' is not assignable to type 'IteratorResult<readonly [PropertyKey, any], any>'.
          Type 'IteratorYieldResult<any[] | undefined>' is not assignable to type 'IteratorResult<readonly [PropertyKey, any], any>'.
            Type 'IteratorYieldResult<any[] | undefined>' is not assignable to type 'IteratorYieldResult<readonly [PropertyKey, any]>'.
              Type 'any[] | undefined' is not assignable to type 'readonly [PropertyKey, any]'.
                Type 'undefined' is not assignable to type 'readonly [PropertyKey, any]'.
  Overload 2 of 2, '(entries: Iterable<readonly any[]>): any', gave the following error.
    Argument of type '(any[] | undefined)[]' is not assignable to parameter of type 'Iterable<readonly any[]>'.
      The types returned by '[Symbol.iterator]().next(...)' are incompatible between these types.
        Type 'IteratorResult<any[] | undefined, any>' is not assignable to type 'IteratorResult<readonly any[], any>'.
          Type 'IteratorYieldResult<any[] | undefined>' is not assignable to type 'IteratorResult<readonly any[], any>'.
            Type 'IteratorYieldResult<any[] | undefined>' is not assignable to type 'IteratorYieldResult<readonly any[]>'.
              Type 'any[] | undefined' is not assignable to type 'readonly any[]'.
                Type 'undefined' is not assignable to type 'readonly any[]'.
    22 |   const results = await Promise.all(responses);
    23 |   console.log(results);
  > 24 |   return Object.fromEntries(results);
       |                             ^^^^^^^
    25 | });
    26 |

The only solution I have found is results:any[]. I’m not very good with TS, I’ve tried everything I know. Sorry for the stupid question

>Solution :

Since you didn’t specify type to responses object, it will automatically detect based on the return from its operation.

In your case,

  • you returned a array in try block which is any[]
  • nothing is returned in catch block so it may be undefined also

Hence, the responses type would be (any[] | undefined)[]

Do something about this, (like returning [key,value] inside catch also) then the type would be any[][]. Object.fromEntries() will accept this type.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading