useApiQuery type improvements

lib/api/useApiQuery.tsx

@@ -6,7 +6,7 @@ import type { Params as ApiFetchParams } from './useApiFetch';
 import useApiFetch from './useApiFetch';
 
 export interface Params<R extends ResourceName, E = unknown> extends ApiFetchParams<R> {
-  queryOptions?: Omit<UseQueryOptions<unknown, ResourceError<E>, ResourcePayload<R>>, 'queryKey' | 'queryFn'>;
+  queryOptions?: Omit<UseQueryOptions<ResourcePayload<R>, ResourceError<E>, ResourcePayload<R>>, 'queryKey' | 'queryFn'>;
 }
 
 export function getResourceKey<R extends ResourceName>(resource: R, { pathParams, queryParams }: Params<R> = {}) {
@@ -23,9 +23,12 @@ export default function useApiQuery<R extends ResourceName, E = unknown>(
 ) {
   const apiFetch = useApiFetch();
 
-  return useQuery<unknown, ResourceError<E>, ResourcePayload<R>>(
+  return useQuery<ResourcePayload<R>, ResourceError<E>, ResourcePayload<R>>(
     getResourceKey(resource, { pathParams, queryParams }),
     async() => {
-      return apiFetch<R, ResourcePayload<R>, ResourceError>(resource, { pathParams, queryParams, fetchParams });
+      // all errors and error typing is handled by react-query
+      // so error response will never go to the data
+      // that's why we are safe here to do type conversion "as Promise<ResourcePayload<R>>"
+      return apiFetch(resource, { pathParams, queryParams, fetchParams }) as Promise<ResourcePayload<R>>;
     }, queryOptions);
 }

ui/pages/ContractVerification.tsx

@@ -2,7 +2,7 @@ import { Text } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
-import type { SmartContractVerificationConfigRaw, SmartContractVerificationMethod } from 'types/api/contract';
+import type { SmartContractVerificationMethod } from 'types/api/contract';
 
 import useApiQuery from 'lib/api/useApiQuery';
 import { useAppContext } from 'lib/appContext';
@@ -39,11 +39,10 @@ const ContractVerification = () => {
 
   const configQuery = useApiQuery('contract_verification_config', {
     queryOptions: {
-      select: (data: unknown) => {
-        const _data = data as SmartContractVerificationConfigRaw;
+      select: (data) => {
         return {
-          ..._data,
-          verification_options: _data.verification_options.filter(isValidVerificationMethod).sort(sortVerificationMethods),
+          ...data,
+          verification_options: data.verification_options.filter(isValidVerificationMethod).sort(sortVerificationMethods),
         };
       },
       enabled: Boolean(hash),