chore: lint require and how to import react (#30041)

web/app/components/base/markdown-blocks/audio-block.tsx

@@ -3,7 +3,8 @@
  * Extracted from the main markdown renderer for modularity.
  * Uses the AudioGallery component to display audio players.
  */
-import React, { memo } from 'react'
+import * as React from 'react'
+import { memo } from 'react'
 import AudioGallery from '@/app/components/base/audio-gallery'
 
 const AudioBlock: any = memo(({ node }: any) => {

web/app/components/base/markdown-blocks/form.tsx

@@ -1,4 +1,5 @@
-import React, { useEffect, useState } from 'react'
+import * as React from 'react'
+import { useEffect, useState } from 'react'
 import Button from '@/app/components/base/button'
 import { useChatContext } from '@/app/components/base/chat/chat/context'
 import Checkbox from '@/app/components/base/checkbox'

web/app/components/base/markdown-blocks/img.tsx

@@ -3,7 +3,7 @@
  * Extracted from the main markdown renderer for modularity.
  * Uses the ImageGallery component to display images.
  */
-import React from 'react'
+import * as React from 'react'
 import ImageGallery from '@/app/components/base/image-gallery'
 
 const Img = ({ src }: any) => {

web/app/components/base/markdown-blocks/link.tsx

@@ -3,7 +3,7 @@
  * Extracted from the main markdown renderer for modularity.
  * Handles special rendering for "abbr:" type links for interactive chat actions.
  */
-import React from 'react'
+import * as React from 'react'
 import { useChatContext } from '@/app/components/base/chat/chat/context'
 import { isValidUrl } from './utils'
 

web/app/components/base/markdown-blocks/paragraph.tsx

@@ -3,7 +3,7 @@
  * Extracted from the main markdown renderer for modularity.
  * Handles special rendering for paragraphs that directly contain an image.
  */
-import React from 'react'
+import * as React from 'react'
 import ImageGallery from '@/app/components/base/image-gallery'
 
 const Paragraph = (paragraph: any) => {

web/app/components/base/markdown-blocks/plugin-img.tsx

@@ -4,7 +4,8 @@ import type { SimplePluginInfo } from '../markdown/react-markdown-wrapper'
  * Extracted from the main markdown renderer for modularity.
  * Uses the ImageGallery component to display images.
  */
-import React, { useEffect, useMemo, useState } from 'react'
+import * as React from 'react'
+import { useEffect, useMemo, useState } from 'react'
 import ImageGallery from '@/app/components/base/image-gallery'
 import { usePluginReadmeAsset } from '@/service/use-plugins'
 import { getMarkdownImageURL } from './utils'

web/app/components/base/markdown-blocks/plugin-paragraph.tsx

@@ -1,5 +1,6 @@
 import type { SimplePluginInfo } from '../markdown/react-markdown-wrapper'
-import React, { useEffect, useMemo, useState } from 'react'
+import * as React from 'react'
+import { useEffect, useMemo, useState } from 'react'
 /**
  * @fileoverview Paragraph component for rendering <p> tags in Markdown.
  * Extracted from the main markdown renderer for modularity.

web/app/components/base/markdown-blocks/pre-code.tsx

@@ -3,7 +3,8 @@
  * Extracted from the main markdown renderer for modularity.
  * This is a simple wrapper around the HTML <pre> element.
  */
-import React, { useRef } from 'react'
+import * as React from 'react'
+import { useRef } from 'react'
 
 function PreCode(props: { children: any }) {
   const ref = useRef<HTMLPreElement>(null)

web/app/components/base/markdown-blocks/think-block.tsx

@@ -1,4 +1,5 @@
-import React, { useEffect, useRef, useState } from 'react'
+import * as React from 'react'
+import { useEffect, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { cn } from '@/utils/classnames'
 import { useChatContext } from '../chat/chat/context'

web/app/components/base/markdown-blocks/video-block.tsx

@@ -3,7 +3,8 @@
  * Extracted from the main markdown renderer for modularity.
  * Uses the VideoGallery component to display videos.
  */
-import React, { memo } from 'react'
+import * as React from 'react'
+import { memo } from 'react'
 import VideoGallery from '@/app/components/base/video-gallery'
 
 const VideoBlock: any = memo(({ node }: any) => {