diff --git a/projects/js-packages/ai-client/changelog/update-eslint-config-for-ts-files b/projects/js-packages/ai-client/changelog/update-eslint-config-for-ts-files new file mode 100644 index 0000000000000..fefec667583fd --- /dev/null +++ b/projects/js-packages/ai-client/changelog/update-eslint-config-for-ts-files @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +Fixed lints following ESLint rule changes for TS diff --git a/projects/js-packages/ai-client/src/logo-generator/components/fair-usage-notice.tsx b/projects/js-packages/ai-client/src/logo-generator/components/fair-usage-notice.tsx index e1f40497fd1dc..ca633457d6846 100644 --- a/projects/js-packages/ai-client/src/logo-generator/components/fair-usage-notice.tsx +++ b/projects/js-packages/ai-client/src/logo-generator/components/fair-usage-notice.tsx @@ -1,9 +1,5 @@ import { Notice } from '@wordpress/components'; import useFairUsageNoticeMessage from '../hooks/use-fair-usage-notice-message.js'; -/** - * Types - */ -import type { ReactElement } from 'react'; type FairUsageNoticeProps = { variant?: 'error' | 'muted'; @@ -13,7 +9,7 @@ type FairUsageNoticeProps = { * The fair usage notice component. * @param {FairUsageNoticeProps} props - Fair usage notice component props. * @param {FairUsageNoticeProps.variant} props.variant - The variant of the notice to render. - * @return {ReactElement} the Notice component with the fair usage message. + * @return the Notice component with the fair usage message. */ export const FairUsageNotice = ( { variant = 'error' }: FairUsageNoticeProps ) => { const useFairUsageNoticeMessageElement = useFairUsageNoticeMessage(); diff --git a/projects/js-packages/ai-client/src/logo-generator/store/reducer.ts b/projects/js-packages/ai-client/src/logo-generator/store/reducer.ts index 9322c3c21a0b4..bca78da21df96 100644 --- a/projects/js-packages/ai-client/src/logo-generator/store/reducer.ts +++ b/projects/js-packages/ai-client/src/logo-generator/store/reducer.ts @@ -30,12 +30,7 @@ import { ACTION_SET_IS_LOADING_HISTORY, } from './constants.js'; import INITIAL_STATE from './initial-state.js'; -import type { - AiFeatureStateProps, - LogoGeneratorStateProp, - RequestError, - TierLimitProp, -} from './types.js'; +import type { AiFeatureStateProps, RequestError, TierLimitProp } from './types.js'; import type { SiteDetails } from '../types.js'; /** diff --git a/projects/js-packages/charts/changelog/update-eslint-config-for-ts-files b/projects/js-packages/charts/changelog/update-eslint-config-for-ts-files new file mode 100644 index 0000000000000..fefec667583fd --- /dev/null +++ b/projects/js-packages/charts/changelog/update-eslint-config-for-ts-files @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +Fixed lints following ESLint rule changes for TS diff --git a/projects/js-packages/components/changelog/update-eslint-config-for-ts-files b/projects/js-packages/components/changelog/update-eslint-config-for-ts-files new file mode 100644 index 0000000000000..454c3dde47017 --- /dev/null +++ b/projects/js-packages/components/changelog/update-eslint-config-for-ts-files @@ -0,0 +1,5 @@ +Significance: patch +Type: fixed +Comment: Fixed ESLint warning + + diff --git a/projects/js-packages/components/components/boost-score-graph/annotations-plugin.ts b/projects/js-packages/components/components/boost-score-graph/annotations-plugin.ts index a0cfe290c84fc..5c4e51486e1b9 100644 --- a/projects/js-packages/components/components/boost-score-graph/annotations-plugin.ts +++ b/projects/js-packages/components/components/boost-score-graph/annotations-plugin.ts @@ -3,11 +3,12 @@ import { Annotation } from '.'; import './style-annotation.scss'; -// eslint-disable-next-line jsdoc/require-returns /** * Custom tooltips plugin for uPlot. * - * @param {Annotation[]} annotations - The periods to display in the tooltip. + * @param annotations - The periods to display in the tooltip. + * + * @return The plugin object. */ export function annotationsPlugin( annotations: Annotation[] ) { let containerEl, annotationsContainer; diff --git a/projects/js-packages/components/components/boost-score-graph/tooltips-plugin.ts b/projects/js-packages/components/components/boost-score-graph/tooltips-plugin.ts index 9ed7f91c1ecb4..88efb26f6b8b2 100644 --- a/projects/js-packages/components/components/boost-score-graph/tooltips-plugin.ts +++ b/projects/js-packages/components/components/boost-score-graph/tooltips-plugin.ts @@ -6,10 +6,10 @@ import { Period } from '.'; /** * Custom tooltips plugin for uPlot. * - * @param {Period[]} periods - The periods to display in the tooltip. - * @return {object} The uPlot plugin object with hooks. + * @param periods - The periods to display in the tooltip. + * @return The uPlot plugin object with hooks. */ -export function tooltipsPlugin( periods ) { +export function tooltipsPlugin( periods: Period[] ) { const reactRoot = document.createElement( 'div' ); const container = document.createElement( 'div' ); let reactDom; diff --git a/projects/packages/jetpack-mu-wpcom/changelog/update-eslint-config-for-ts-files b/projects/packages/jetpack-mu-wpcom/changelog/update-eslint-config-for-ts-files new file mode 100644 index 0000000000000..fefec667583fd --- /dev/null +++ b/projects/packages/jetpack-mu-wpcom/changelog/update-eslint-config-for-ts-files @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +Fixed lints following ESLint rule changes for TS diff --git a/projects/packages/jetpack-mu-wpcom/eslint.config.mjs b/projects/packages/jetpack-mu-wpcom/eslint.config.mjs index 7f678302d6651..de5062933307c 100644 --- a/projects/packages/jetpack-mu-wpcom/eslint.config.mjs +++ b/projects/packages/jetpack-mu-wpcom/eslint.config.mjs @@ -1,4 +1,4 @@ -import makeBaseConfig, { typescriptFiles, makeEnvConfig } from 'jetpack-js-tools/eslintrc/base.mjs'; +import makeBaseConfig, { makeEnvConfig } from 'jetpack-js-tools/eslintrc/base.mjs'; export default [ ...makeBaseConfig( import.meta.url ), @@ -9,12 +9,4 @@ export default [ 'react/jsx-no-bind': 'off', }, }, - { - files: typescriptFiles, - rules: { - // Not needed for TypeScript. - 'jsdoc/require-param-type': 'off', - 'jsdoc/require-returns-type': 'off', - }, - }, ]; diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/auto-firewall-status.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/auto-firewall-status.tsx index 5ab7c3638f187..79a5c4238a446 100644 --- a/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/auto-firewall-status.tsx +++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/auto-firewall-status.tsx @@ -9,7 +9,6 @@ import ShieldInactive from './assets/shield-inactive.svg'; import ShieldOff from './assets/shield-off.svg'; import ShieldSuccess from './assets/shield-success.svg'; import { useProtectTooltipCopy } from './use-protect-tooltip-copy'; -import type { ReactElement, PropsWithChildren } from 'react'; export const AutoFirewallStatus = () => { const slug = 'protect'; @@ -35,10 +34,10 @@ export const AutoFirewallStatus = () => { /** * WafStatus component * - * @param {PropsWithChildren} props - The component props - * @param {'active' | 'inactive' | 'off'} props.status - The status of the WAF + * @param props - The component props + * @param props.status - The status of the WAF * - * @return {ReactElement} rendered component + * @return rendered component */ function WafStatus( { status }: { status: 'active' | 'inactive' | 'off' } ) { const slug = 'protect'; diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/logins-blocked-status.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/logins-blocked-status.tsx index 62af60d35f2bd..384fe1329ce4b 100644 --- a/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/logins-blocked-status.tsx +++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/logins-blocked-status.tsx @@ -10,7 +10,6 @@ import baseStyles from '../style.module.scss'; import ShieldOff from './assets/shield-off.svg'; import ShieldPartial from './assets/shield-partial.svg'; import { useProtectTooltipCopy } from './use-protect-tooltip-copy'; -import type { ReactElement, PropsWithChildren } from 'react'; export const LoginsBlockedStatus = () => { const slug = 'protect'; @@ -43,10 +42,10 @@ export const LoginsBlockedStatus = () => { /** * BlockedStatus component * - * @param {PropsWithChildren} props - The component props - * @param {'active' | 'inactive' | 'off'} props.status - The status of Brute Force Protection + * @param props - The component props + * @param props.status - The status of Brute Force Protection * - * @return {ReactElement} rendered component + * @return rendered component */ function BlockedStatus( { status }: { status: 'active' | 'inactive' | 'off' } ) { const { diff --git a/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/scan-threats-status.tsx b/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/scan-threats-status.tsx index 4349419dc95f3..af25fe770b8e0 100644 --- a/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/scan-threats-status.tsx +++ b/projects/packages/my-jetpack/_inc/components/product-cards-section/protect-card/scan-threats-status.tsx @@ -14,7 +14,6 @@ import ShieldOff from './assets/shield-off.svg'; import ShieldPartial from './assets/shield-partial.svg'; import ShieldSuccess from './assets/shield-success.svg'; import { useProtectTooltipCopy } from './use-protect-tooltip-copy'; -import type { PropsWithChildren, ReactElement } from 'react'; export const ScanAndThreatStatus = () => { const slug = 'protect'; @@ -69,11 +68,11 @@ export const ScanAndThreatStatus = () => { /** * ThreatStatus component * - * @param {PropsWithChildren} props - The component props - * @param {number} props.numThreats - The number of threats - * @param {number} props.criticalThreatCount - The number of critical threats + * @param props - The component props + * @param props.numThreats - The number of threats + * @param props.criticalThreatCount - The number of critical threats * - * @return {ReactElement} rendered component + * @return rendered component */ function ThreatStatus( { numThreats, @@ -171,10 +170,10 @@ function ThreatStatus( { /** * ScanStatus component * - * @param {PropsWithChildren} props - The component props - * @param {'success' | 'partial' | 'off'} props.status - The number of threats + * @param props - The component props + * @param props.status - The number of threats * - * @return { ReactElement} rendered component + * @return rendered component */ function ScanStatus( { status }: { status: 'success' | 'partial' | 'off' } ) { const tooltipContent = useProtectTooltipCopy(); diff --git a/projects/packages/my-jetpack/_inc/data/use-simple-mutation.ts b/projects/packages/my-jetpack/_inc/data/use-simple-mutation.ts index 2dad31322e13a..2e6b056e68fce 100644 --- a/projects/packages/my-jetpack/_inc/data/use-simple-mutation.ts +++ b/projects/packages/my-jetpack/_inc/data/use-simple-mutation.ts @@ -2,12 +2,7 @@ import { useMutation } from '@tanstack/react-query'; import apiFetch from '@wordpress/api-fetch'; import { addQueryArgs } from '@wordpress/url'; import { useFetchingErrorNotice } from './notices/use-fetching-error-notice'; -import type { - UseMutationOptions, - UseMutateFunction, - // This variable is being used as a type declaration - UseMutationResult, -} from '@tanstack/react-query'; +import type { UseMutationOptions, UseMutateFunction } from '@tanstack/react-query'; import type { APIFetchOptions } from '@wordpress/api-fetch'; export type APIFetchOptionsWithQueryParams = APIFetchOptions & { @@ -33,7 +28,7 @@ export type MutateCallback = UseMutateFunction< * @param {APIFetchOptions} params.query - The options to be passed to the API fetch function for the mutation. * @param {Pick} [params.options] - Optional. Mutation options from react-query, currently supports only the 'onSuccess' option. * @param {string} [params.errorMessage] - Optional. A custom error message that can be displayed if the mutation fails. - * @return {UseMutationResult} The result object from the useMutation hook, containing data and state information about the mutation (e.g., isPending, isError). + * @return {import('@tanstack/react-query').UseMutationResult} The result object from the useMutation hook, containing data and state information about the mutation (e.g., isPending, isError). */ type QueryParams< T, E, V > = { diff --git a/projects/packages/my-jetpack/_inc/data/use-simple-query.ts b/projects/packages/my-jetpack/_inc/data/use-simple-query.ts index 541ec6b8ed4af..f42c3b802a86b 100644 --- a/projects/packages/my-jetpack/_inc/data/use-simple-query.ts +++ b/projects/packages/my-jetpack/_inc/data/use-simple-query.ts @@ -2,7 +2,7 @@ import { useQuery } from '@tanstack/react-query'; import apiFetch from '@wordpress/api-fetch'; import { useFetchingErrorNotice } from './notices/use-fetching-error-notice'; import type { WP_Error } from './types'; -import type { UseQueryOptions, UseQueryResult } from '@tanstack/react-query'; +import type { UseQueryOptions } from '@tanstack/react-query'; import type { APIFetchOptions } from '@wordpress/api-fetch'; /** @@ -18,7 +18,7 @@ import type { APIFetchOptions } from '@wordpress/api-fetch'; * @param {APIFetchOptions} params.query - The options to be passed to the API fetch function. * @param {Pick} [params.options] - Optional. Query options from react-query, currently supports only the 'enabled' option. * @param {string} [params.errorMessage] - Optional. A custom error message that can be displayed if the query fails. - * @return {UseQueryResult} The result object from the useQuery hook, containing data and state information about the query (e.g., isLoading, isError). + * @return {import('@tanstack/react-query').UseQueryResult} The result object from the useQuery hook, containing data and state information about the query (e.g., isLoading, isError). */ type QueryParams = { name: string; diff --git a/projects/packages/my-jetpack/changelog/update-eslint-config-for-ts-files b/projects/packages/my-jetpack/changelog/update-eslint-config-for-ts-files new file mode 100644 index 0000000000000..fefec667583fd --- /dev/null +++ b/projects/packages/my-jetpack/changelog/update-eslint-config-for-ts-files @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +Fixed lints following ESLint rule changes for TS diff --git a/projects/packages/videopress/changelog/update-eslint-config-for-ts-files b/projects/packages/videopress/changelog/update-eslint-config-for-ts-files new file mode 100644 index 0000000000000..fefec667583fd --- /dev/null +++ b/projects/packages/videopress/changelog/update-eslint-config-for-ts-files @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +Fixed lints following ESLint rule changes for TS diff --git a/projects/packages/videopress/src/client/admin/components/video-thumbnail-selector-modal/index.tsx b/projects/packages/videopress/src/client/admin/components/video-thumbnail-selector-modal/index.tsx index b6f57cd06f4ec..2df7e69402573 100644 --- a/projects/packages/videopress/src/client/admin/components/video-thumbnail-selector-modal/index.tsx +++ b/projects/packages/videopress/src/client/admin/components/video-thumbnail-selector-modal/index.tsx @@ -5,7 +5,7 @@ import { Button, ThemeProvider, useBreakpointMatch } from '@automattic/jetpack-c import { Modal } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import clsx from 'clsx'; -import { useState, ReactNode } from 'react'; +import { useState } from 'react'; /** * Internal dependencies */ @@ -17,7 +17,7 @@ import { VideoThumbnailSelectorModalProps } from './types'; * Video Thumbnail Selector component * * @param {VideoThumbnailSelectorModalProps} props - Component props. - * @return {ReactNode} - VideoThumbnailSelector react component. + * @return - VideoThumbnailSelector react component. */ const VideoThumbnailSelectorModal = ( { url, diff --git a/projects/packages/videopress/src/client/admin/components/video-upload-area/index.tsx b/projects/packages/videopress/src/client/admin/components/video-upload-area/index.tsx index 6631bba41c3ef..8ef3dbf654ad3 100644 --- a/projects/packages/videopress/src/client/admin/components/video-upload-area/index.tsx +++ b/projects/packages/videopress/src/client/admin/components/video-upload-area/index.tsx @@ -13,16 +13,12 @@ import { usePlan } from '../../hooks/use-plan'; import useSelectVideoFiles from '../../hooks/use-select-video-files'; import styles from './style.module.scss'; import { VideoUploadAreaProps } from './types'; -/** - * Types - */ -import type { ReactNode } from 'react'; /** * Video Upload Area component * * @param {VideoUploadAreaProps} props - Component props. - * @return {ReactNode} - VideoUploadArea react component. + * @return - VideoUploadArea react component. */ const VideoUploadArea = ( { className, onSelectFiles }: VideoUploadAreaProps ) => { const [ isSm ] = useBreakpointMatch( 'sm' ); diff --git a/projects/plugins/crm/changelog/update-eslint-config-for-ts-files b/projects/plugins/crm/changelog/update-eslint-config-for-ts-files new file mode 100644 index 0000000000000..fefec667583fd --- /dev/null +++ b/projects/plugins/crm/changelog/update-eslint-config-for-ts-files @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +Fixed lints following ESLint rule changes for TS diff --git a/projects/plugins/crm/src/js/data/hooks/queries.ts b/projects/plugins/crm/src/js/data/hooks/queries.ts index 39fd92d046965..818b74e80e79d 100644 --- a/projects/plugins/crm/src/js/data/hooks/queries.ts +++ b/projects/plugins/crm/src/js/data/hooks/queries.ts @@ -1,4 +1,4 @@ -import { useQuery, UseQueryResult } from '@tanstack/react-query'; +import { useQuery } from '@tanstack/react-query'; import { getAutomationWorkflows } from 'crm/data/query-functions'; import { Workflow } from 'crm/state/automations-admin/types'; @@ -6,7 +6,7 @@ import { Workflow } from 'crm/state/automations-admin/types'; * Gets the Automation Workflows. * * @param {Function} hydrate - A function which takes an array of workflows and hydrates the store with them. - * @return {UseQueryResult} - The result of the query. + * @return {import('@tanstack/react-query').UseQueryResult} - The result of the query. */ export const useGetAutomationWorkflows = ( hydrate: ( workflows: Workflow[] ) => void ) => useQuery( { diff --git a/projects/plugins/crm/src/js/state/automations-admin/util.ts b/projects/plugins/crm/src/js/state/automations-admin/util.ts index 3f863aad39b8f..5be9d472a9746 100644 --- a/projects/plugins/crm/src/js/state/automations-admin/util.ts +++ b/projects/plugins/crm/src/js/state/automations-admin/util.ts @@ -1,10 +1,10 @@ -import { Workflow, ServerPreparedWorkflow } from 'crm/state/automations-admin/types'; +import { Workflow } from 'crm/state/automations-admin/types'; /** * Gets a workflow which has been prepared for sending to the server. * * @param {Workflow} workflow - The workflow to prepare - * @return {ServerPreparedWorkflow} The prepared workflow + * @return {import('crm/state/automations-admin/types').ServerPreparedWorkflow} The prepared workflow */ export const getServerPreparedWorkflow = ( workflow: Workflow ) => { return { diff --git a/projects/plugins/jetpack/changelog/update-eslint-config-for-ts-files b/projects/plugins/jetpack/changelog/update-eslint-config-for-ts-files new file mode 100644 index 0000000000000..fb360f8080b3e --- /dev/null +++ b/projects/plugins/jetpack/changelog/update-eslint-config-for-ts-files @@ -0,0 +1,4 @@ +Significance: patch +Type: other + +Fixed lints following ESLint rule changes for TS diff --git a/projects/plugins/jetpack/extensions/blocks/ai-assistant/components/ai-assistant-toolbar-dropdown/index.tsx b/projects/plugins/jetpack/extensions/blocks/ai-assistant/components/ai-assistant-toolbar-dropdown/index.tsx index 8f30ed0e5f9c4..d2aea65e0221b 100644 --- a/projects/plugins/jetpack/extensions/blocks/ai-assistant/components/ai-assistant-toolbar-dropdown/index.tsx +++ b/projects/plugins/jetpack/extensions/blocks/ai-assistant/components/ai-assistant-toolbar-dropdown/index.tsx @@ -23,7 +23,6 @@ import './style.scss'; import type { AiAssistantDropdownOnChangeOptionsArgProps } from './dropdown-content'; import type { ExtendedBlockProp } from '../../extensions/constants'; import type { PromptTypeProp } from '../../lib/prompt'; -import type { ReactElement } from 'react'; const debug = debugFactory( 'jetpack-ai-assistant:dropdown' ); @@ -35,7 +34,7 @@ type AiAssistantBlockToolbarDropdownContentProps = { /** * The dropdown component with logic for the AI Assistant block. * @param {AiAssistantBlockToolbarDropdownContentProps} props - The props. - * @return {ReactElement} The React content of the dropdown. + * @return The React content of the dropdown. */ function AiAssistantBlockToolbarDropdownContent( { onClose, @@ -165,7 +164,7 @@ type AiAssistantBlockToolbarDropdownProps = { /** * The AI Assistant dropdown component. * @param {AiAssistantBlockToolbarDropdownProps} props - The props. - * @return {ReactElement} The AI Assistant dropdown component. + * @return The AI Assistant dropdown component. */ export default function AiAssistantBlockToolbarDropdown( { blockType, diff --git a/tools/js-tools/eslintrc/base.mjs b/tools/js-tools/eslintrc/base.mjs index cc5937304c99c..8f0228389bed9 100644 --- a/tools/js-tools/eslintrc/base.mjs +++ b/tools/js-tools/eslintrc/base.mjs @@ -325,6 +325,13 @@ export default function makeBaseConfig( configurl, opts = {} ) { 'error', { allowInterfaces: 'with-single-extends' }, ], + // Mark types in jsdoc as used without reporting about any that are undefined. + 'jsdoc/no-undefined-types': [ 'warn', { disableReporting: true } ], + // TS should mostly have the type set. + 'jsdoc/require-param-type': 'off', + 'jsdoc/require-property-type': 'off', + // Let us use TS return type for better inference + 'jsdoc/require-returns-type': 'off', }, } ), // Jest.