reactjs - Error response type error in createAsyncThunk from redux-toolkit (SOLVED)

Question

What's the h*ll? Why err is error for typescipt? There is such problem:

ESLint: Unsafe member access .response on an any value.(@typescript-eslint/no-unsafe-member-access)

here is main part of problem code:

 } catch (err) {
         // Here is problem
          if (!err.response) {
            throw err;
          }
          return rejectWithValue(err);
        }

Here is full code:

export const actionFetchDataUser = createAsyncThunk(
  'data/user',
  async (formVal: TformVal, { rejectWithValue }) => {
    try {
      const GoogleAuth = window.gapi.auth2.getAuthInstance();
      const profileMail = await GoogleAuth.signIn({
        scope: 'profile email',
      });
      const googleEmail = profileMail.getBasicProfile().getEmail();
      if (googleEmail !== formVal.email) {
        throw Error('There is NO email');
      }
      return {
        name: profileMail.getBasicProfile().getName(),
        ava: profileMail.getBasicProfile().getImageUrl(),
      };
    } catch (err) {
     // Here is problem
      if (!err.response) {
        throw err;
      }
      return rejectWithValue(err);
    }
  },
);

Answer 1

In TypeScript, everything in a catch block is always typed any before you do any assertions on it - as literally anything could be thrown in any function called from the try block. You could throw 5 in there, you could throw new Error("foo") in there, you could throw new Date() in there, TypeScript doesn't know.

So, you are accessing any.response there - and while that is perfectly valid TypeScript, you have configured your linter in a way that it warns you about it. If you want to do that access, either disable that lint rule (assuming you gain no value from it anywhere else), or do a type assertion like (err as Something).response here.

The whole issue has no correlation to React or Redux though.