I am trying to get the highest number from 5 dice. I call pips as eyes in this code. Here's my code:

// get the highest count
  // https://stackoverflow.com/questions/63098129/typescript-get-max-value-from-a-mixed-array
  getHighestNumber(dice: Die[]): number {
    return dice.reduce(
      (a: number, b: any, i: number, arr: any[]) =>
        arr.filter(x => x.eyes === a).length >=
        arr.filter(x => x.eyes === b.eyes).length ? a : b.eyes, null);
  }

The errors I'm getting:

Type 'Die' is not assignable to type 'number'.ts(2322)
No overload matches this call.
  Overload 1 of 3, '(callbackfn: (previousValue: Die, currentValue: Die, currentIndex: number, array: Die[]) => Die, initialValue: Die): Die', gave the following error.
    Argument of type '(a: number, b: any, i: number, arr: any[]) => any' is not assignable to parameter of type '(previousValue: Die, currentValue: Die, currentIndex: number, array: Die[]) => Die'.
      Types of parameters 'a' and 'previousValue' are incompatible.
        Type 'Die' is not assignable to type 'number'.
  Overload 2 of 3, '(callbackfn: (previousValue: number, currentValue: Die, currentIndex: number, array: Die[]) => number, initialValue: number): number', gave the following error.
    Argument of type 'null' is not assignable to parameter of type 'number'.ts(2769)

How do you fix this primitive logic? It's for a dice game called Yathzee and I'm developing it using the latest stable TypeScript version and newest stable Angular version.

I've tried the quick fix, which for some reason adds an underscore for i, didn't help, setting the type for b didn't help either...

My die data model looks like this:

export interface Die {
    eyes: number;
    locked: boolean;
}