chore: Fix broken eslint rule

.eslintrc.js

@@ -116,7 +116,9 @@ module.exports = {
           {
             extendDefaults: true,
             types: {
-              "{}": false,
+              "{}": {
+                fixWith: "Record<string, unknown>",
+              },
               object: {
                 fixWith: "Record<string, unknown>",
               },

packages/create-gatsby/src/index.ts

@@ -307,7 +307,7 @@ ${center(c.blueBright.bold.underline(`Welcome to Gatsby!`))}
 
     trackCli(`CREATE_GATSBY_SET_PLUGINS_START`)
 
-    const enquirer = new Enquirer<Record<string, {}>>()
+    const enquirer = new Enquirer<Record<string, Record<string, unknown>>>()
     enquirer.use(plugin)
 
     pluginConfig = { ...pluginConfig, ...(await enquirer.prompt(config)) }

packages/gatsby-admin/src/components/plugin-search.tsx

@@ -37,7 +37,7 @@ const SearchCombobox: React.FC<{
 ))
 
 // the search bar holds the Search component in the InstantSearch widget
-const PluginSearchInput: React.FC<{}> = () => (
+const PluginSearchInput: React.FC<Record<string, unknown>> = () => (
   <div>
     <InstantSearchProvider>
       <SearchCombobox

packages/gatsby-admin/src/components/providers.tsx

@@ -133,7 +133,7 @@ const theme = merge(recipesTheme, {
   },
 })
 
-const GraphQLProvider: React.FC<{}> = ({ children }) => {
+const GraphQLProvider: React.FC<Record<string, unknown>> = ({ children }) => {
   const services = useServices()
   const [client, setClient] = React.useState<Client | null>(() =>
     services
@@ -158,7 +158,7 @@ const GraphQLProvider: React.FC<{}> = ({ children }) => {
   return <Provider value={client}>{children}</Provider>
 }
 
-const Providers: React.FC<{}> = ({ children }) => (
+const Providers: React.FC<Record<string, unknown>> = ({ children }) => (
   <StrictUIProvider theme={theme}>
     <ThemeProvider theme={theme}>
       {/* NOTE(@mxstbr): The GraphQLProvider needs to be in the ServicesProvider */}

packages/gatsby-admin/src/utils/use-npm-data.tsx

@@ -19,7 +19,7 @@ export default function useNpmPackageData(
 ): IUseNpmPackageDataResult {
   const [fetching, setFetching] = React.useState(true)
   const [error, setError] = React.useState<Error | null>(null)
-  const [data, setData] = React.useState<{} | null>(null)
+  const [data, setData] = React.useState<Record<string, unknown> | null>(null)
 
   React.useEffect(() => {
     setFetching(true)

packages/gatsby-cli/src/reporter/reporter.ts

@@ -109,7 +109,7 @@ class Reporter {
   ): IStructuredError | Array<IStructuredError> => {
     let details: {
       error?: Error
-      context: {}
+      context: Record<string, string>
     } = {
       context: {},
     }

packages/gatsby-plugin-image/src/components/hooks.ts

@@ -126,7 +126,7 @@ export interface IUrlBuilderArgs<OptionsType> {
   format: ImageFormat
   options: OptionsType
 }
-export interface IGetImageDataArgs<OptionsType = {}> {
+export interface IGetImageDataArgs<OptionsType = Record<string, unknown>> {
   baseUrl: string
   /**
    * For constrained and fixed images, the size of the image element

packages/gatsby-plugin-image/src/components/later-hydrator.tsx

@@ -1,7 +1,7 @@
 import * as React from "react"
 export function LaterHydrator({
   children,
-}: React.PropsWithChildren<{}>): React.ReactNode {
+}: React.PropsWithChildren<Record<string, unknown>>): React.ReactNode {
   React.useEffect(() => {
     // eslint-disable-next-line no-unused-expressions
     import(`./lazy-hydrate`)

packages/gatsby-plugin-image/src/components/placeholder.tsx

@@ -2,7 +2,7 @@ import React, { FunctionComponent, ImgHTMLAttributes } from "react"
 import * as PropTypes from "prop-types"
 import { Picture, SourceProps } from "./picture"
 
-export type PlaceholderProps = ImgHTMLAttributes<{}> & {
+export type PlaceholderProps = ImgHTMLAttributes<HTMLImageElement> & {
   fallback?: string
   sources?: Array<SourceProps>
 }

packages/gatsby/src/redux/actions/restricted.ts

@@ -264,10 +264,12 @@ export const actions = {
     extension: GraphQLFieldExtensionDefinition,
     plugin: IGatsbyPlugin,
     traceId?: string
-  ): ThunkAction<void, IGatsbyState, {}, ICreateFieldExtension> => (
-    dispatch,
-    getState
-  ): void => {
+  ): ThunkAction<
+    void,
+    IGatsbyState,
+    Record<string, unknown>,
+    ICreateFieldExtension
+  > => (dispatch, getState): void => {
     const { name } = extension || {}
     const { fieldExtensions } = getState().schemaCustomization
 
@@ -389,9 +391,12 @@ export const actions = {
     context: IGatsbyPluginContext,
     plugin: IGatsbyPlugin,
     traceId?: string
-  ): ThunkAction<void, IGatsbyState, {}, ICreateResolverContext> => (
-    dispatch
-  ): void => {
+  ): ThunkAction<
+    void,
+    IGatsbyState,
+    Record<string, unknown>,
+    ICreateResolverContext
+  > => (dispatch): void => {
     if (!context || typeof context !== `object`) {
       report.error(
         `Expected context value passed to \`createResolverContext\` to be an object. Received "${context}".`

packages/gatsby/src/utils/webpack-utils.ts

@@ -21,12 +21,14 @@ import { builtinPlugins } from "./webpack-plugins"
 import { IProgram, Stage } from "../commands/types"
 import { eslintConfig, eslintRequiredConfig } from "./eslint-config"
 
-type LoaderResolver<T = {}> = (options?: T) => Loader
+type LoaderResolver<T = Record<string, unknown>> = (options?: T) => Loader
 
 type LoaderOptions = Record<string, any>
-type RuleFactory<T = {}> = (options?: T & LoaderOptions) => RuleSetRule
+type RuleFactory<T = Record<string, unknown>> = (
+  options?: T & LoaderOptions
+) => RuleSetRule
 
-type ContextualRuleFactory<T = {}> = RuleFactory<T> & {
+type ContextualRuleFactory<T = Record<string, unknown>> = RuleFactory<T> & {
   internal?: RuleFactory<T>
   external?: RuleFactory<T>
 }