diff --git a/apps/ssr/client/App.tsx b/apps/ssr/client/App.tsx
index fe7f29d65..f39d3e85d 100644
--- a/apps/ssr/client/App.tsx
+++ b/apps/ssr/client/App.tsx
@@ -1,3 +1,4 @@
+import * as React from "react"
 import { Outlet } from "react-router"
 
 import { RootProviders } from "./providers/root-providers"
diff --git a/apps/ssr/client/components/common/404.tsx b/apps/ssr/client/components/common/404.tsx
index 7c23a3796..607916320 100644
--- a/apps/ssr/client/components/common/404.tsx
+++ b/apps/ssr/client/components/common/404.tsx
@@ -5,6 +5,7 @@ import { Button } from "@follow/components/ui/button/index.jsx"
 import { useSyncThemeWebApp, useTitle } from "@follow/hooks"
 import { m, useAnimationControls } from "motion/react"
 import { Fragment, useEffect, useState } from "react"
+import * as React from "react"
 
 const NotFoundContent = () => {
   const [glitchText, setGlitchText] = useState("404")
diff --git a/apps/ssr/client/components/common/PoweredByFooter.tsx b/apps/ssr/client/components/common/PoweredByFooter.tsx
index 6ab09475f..4282f2d01 100644
--- a/apps/ssr/client/components/common/PoweredByFooter.tsx
+++ b/apps/ssr/client/components/common/PoweredByFooter.tsx
@@ -1,5 +1,6 @@
 import { SocialMediaLinks } from "@follow/constants"
 import { cn } from "@follow/utils/utils"
+import * as React from "react"
 
 export const PoweredByFooter: Component = ({ className }) => (
   <footer className={cn("border-border/40 bg-background/60 border-t backdrop-blur-sm", className)}>
diff --git a/apps/ssr/client/components/items/grid.tsx b/apps/ssr/client/components/items/grid.tsx
index 4287fac95..655a28a35 100644
--- a/apps/ssr/client/components/items/grid.tsx
+++ b/apps/ssr/client/components/items/grid.tsx
@@ -3,6 +3,7 @@ import { TitleMarquee } from "@follow/components/ui/marquee/index.jsx"
 import type { ParsedEntry } from "@follow-app/client-sdk"
 import dayjs from "dayjs"
 import type { FC } from "react"
+import * as React from "react"
 
 import { FeedIcon } from "../ui/feed-icon"
 import { LazyImage } from "../ui/image"
diff --git a/apps/ssr/client/components/items/index.tsx b/apps/ssr/client/components/items/index.tsx
index c4e6affa2..bced1c56e 100644
--- a/apps/ssr/client/components/items/index.tsx
+++ b/apps/ssr/client/components/items/index.tsx
@@ -6,6 +6,7 @@ import { FeedViewType } from "@follow/constants"
 import type { ParsedEntry } from "@follow-app/client-sdk"
 import type { FC } from "react"
 import { useMemo } from "react"
+import * as React from "react"
 
 const viewsRenderType = {
   Normal: [
diff --git a/apps/ssr/client/components/items/normal.tsx b/apps/ssr/client/components/items/normal.tsx
index 4efcd3e1e..1df2067d8 100644
--- a/apps/ssr/client/components/items/normal.tsx
+++ b/apps/ssr/client/components/items/normal.tsx
@@ -3,6 +3,7 @@ import { EllipsisHorizontalTextWithTooltip } from "@follow/components/ui/typogra
 import { cn } from "@follow/utils/utils"
 import type { FeedSchema, ParsedEntry } from "@follow-app/client-sdk"
 import { memo } from "react"
+import * as React from "react"
 
 import { FeedIcon } from "../ui/feed-icon"
 import { LazyImage } from "../ui/image"
diff --git a/apps/ssr/client/components/items/picture.tsx b/apps/ssr/client/components/items/picture.tsx
index e09d7bd26..04647e028 100644
--- a/apps/ssr/client/components/items/picture.tsx
+++ b/apps/ssr/client/components/items/picture.tsx
@@ -21,6 +21,7 @@ import type { RenderComponentProps } from "masonic"
 import { AnimatePresence, m } from "motion/react"
 import type { FC, PropsWithChildren } from "react"
 import { memo, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react"
+import * as React from "react"
 import { PhotoProvider, PhotoView } from "react-photo-view"
 import inlineStyle from "react-photo-view/dist/react-photo-view.css?raw"
 
diff --git a/apps/ssr/client/components/ui/feed-certification.tsx b/apps/ssr/client/components/ui/feed-certification.tsx
index a3a7d3a28..dba1920bb 100644
--- a/apps/ssr/client/components/ui/feed-certification.tsx
+++ b/apps/ssr/client/components/ui/feed-certification.tsx
@@ -8,6 +8,7 @@ import {
 } from "@follow/components/ui/tooltip/index.jsx"
 import { cn } from "@follow/utils/utils"
 import type { FeedSchema } from "@follow-app/client-sdk"
+import * as React from "react"
 import { useTranslation } from "react-i18next"
 
 export const FeedCertification = ({
diff --git a/apps/ssr/client/components/ui/feed-icon.tsx b/apps/ssr/client/components/ui/feed-icon.tsx
index 745884e0a..3a23044ac 100644
--- a/apps/ssr/client/components/ui/feed-icon.tsx
+++ b/apps/ssr/client/components/ui/feed-icon.tsx
@@ -8,6 +8,7 @@ import type { MediaModel } from "@folo-services/drizzle"
 import { m } from "motion/react"
 import type { ReactNode } from "react"
 import { useMemo } from "react"
+import * as React from "react"
 
 const getFeedIconSrc = ({
   src,
diff --git a/apps/ssr/client/components/ui/image.tsx b/apps/ssr/client/components/ui/image.tsx
index a4e594b8c..ad48f022c 100644
--- a/apps/ssr/client/components/ui/image.tsx
+++ b/apps/ssr/client/components/ui/image.tsx
@@ -3,6 +3,7 @@ import { cn } from "@follow/utils/utils"
 import * as Avatar from "@radix-ui/react-avatar"
 import type { MouseEvent, PropsWithChildren } from "react"
 import { useMemo } from "react"
+import * as React from "react"
 import { Blurhash } from "react-blurhash"
 
 type LazyImageProps = PropsWithChildren<{
diff --git a/apps/ssr/client/components/ui/user-avatar.tsx b/apps/ssr/client/components/ui/user-avatar.tsx
index 57f66933d..be926cfe7 100644
--- a/apps/ssr/client/components/ui/user-avatar.tsx
+++ b/apps/ssr/client/components/ui/user-avatar.tsx
@@ -4,6 +4,7 @@ import { UserRole } from "@follow/constants"
 import { getBackgroundGradient } from "@follow/utils/color"
 import { cn } from "@follow/utils/utils"
 import { useMemo } from "react"
+import * as React from "react"
 
 export const UserAvatar = ({ className }: { className?: string }) => {
   let user = useWhoami()
diff --git a/apps/ssr/client/modules/login/index.tsx b/apps/ssr/client/modules/login/index.tsx
index 307baa9d0..3924284b0 100644
--- a/apps/ssr/client/modules/login/index.tsx
+++ b/apps/ssr/client/modules/login/index.tsx
@@ -24,6 +24,7 @@ import { cn } from "@follow/utils/utils"
 import HCaptcha from "@hcaptcha/react-hcaptcha"
 import { zodResolver } from "@hookform/resolvers/zod"
 import { useCallback, useEffect, useMemo, useRef, useState } from "react"
+import * as React from "react"
 import { useForm } from "react-hook-form"
 import { Trans, useTranslation } from "react-i18next"
 import { Link, useLocation, useNavigate } from "react-router"
diff --git a/apps/ssr/client/modules/referral/index.tsx b/apps/ssr/client/modules/referral/index.tsx
index 24221344e..a7abcfee4 100644
--- a/apps/ssr/client/modules/referral/index.tsx
+++ b/apps/ssr/client/modules/referral/index.tsx
@@ -15,6 +15,7 @@ import { cn } from "@follow/utils/utils"
 import { zodResolver } from "@hookform/resolvers/zod"
 import { useQuery } from "@tanstack/react-query"
 import { useEffect } from "react"
+import * as React from "react"
 import { useForm } from "react-hook-form"
 import { useTranslation } from "react-i18next"
 import { z } from "zod"
diff --git a/apps/ssr/client/pages/(login)/forget-password.tsx b/apps/ssr/client/pages/(login)/forget-password.tsx
index b4cf9a72b..bd835274f 100644
--- a/apps/ssr/client/pages/(login)/forget-password.tsx
+++ b/apps/ssr/client/pages/(login)/forget-password.tsx
@@ -21,6 +21,7 @@ import HCaptcha from "@hcaptcha/react-hcaptcha"
 import { zodResolver } from "@hookform/resolvers/zod"
 import { useMutation } from "@tanstack/react-query"
 import { useRef } from "react"
+import * as React from "react"
 import { useForm } from "react-hook-form"
 import { useTranslation } from "react-i18next"
 import { useNavigate } from "react-router"
diff --git a/apps/ssr/client/pages/(login)/layout.tsx b/apps/ssr/client/pages/(login)/layout.tsx
index afe93c7d2..e4e4e89e5 100644
--- a/apps/ssr/client/pages/(login)/layout.tsx
+++ b/apps/ssr/client/pages/(login)/layout.tsx
@@ -3,6 +3,7 @@ import { setIntegrationIdentify } from "@client/initialize/helper"
 import { useSession } from "@client/query/auth"
 import type { AuthUser } from "@follow-app/client-sdk"
 import { useEffect } from "react"
+import * as React from "react"
 import { Outlet } from "react-router"
 
 export function Component() {
diff --git a/apps/ssr/client/pages/(login)/login/index.tsx b/apps/ssr/client/pages/(login)/login/index.tsx
index 280f89782..a21c5b722 100644
--- a/apps/ssr/client/pages/(login)/login/index.tsx
+++ b/apps/ssr/client/pages/(login)/login/index.tsx
@@ -1,4 +1,5 @@
 import { Login } from "@client/modules/login"
+import * as React from "react"
 
 export function Component() {
   return <Login />
diff --git a/apps/ssr/client/pages/(login)/register.tsx b/apps/ssr/client/pages/(login)/register.tsx
index 1be575dcb..5e74e0033 100644
--- a/apps/ssr/client/pages/(login)/register.tsx
+++ b/apps/ssr/client/pages/(login)/register.tsx
@@ -21,6 +21,7 @@ import { cn } from "@follow/utils/utils"
 import HCaptcha from "@hcaptcha/react-hcaptcha"
 import { zodResolver } from "@hookform/resolvers/zod"
 import { useRef, useState } from "react"
+import * as React from "react"
 import { useForm } from "react-hook-form"
 import { Trans, useTranslation } from "react-i18next"
 import { useNavigate } from "react-router"
diff --git a/apps/ssr/client/pages/(login)/reset-password.tsx b/apps/ssr/client/pages/(login)/reset-password.tsx
index 70822e794..e3be97868 100644
--- a/apps/ssr/client/pages/(login)/reset-password.tsx
+++ b/apps/ssr/client/pages/(login)/reset-password.tsx
@@ -18,6 +18,7 @@ import {
 import { Input } from "@follow/components/ui/input/index.js"
 import { zodResolver } from "@hookform/resolvers/zod"
 import { useMutation } from "@tanstack/react-query"
+import * as React from "react"
 import { useForm } from "react-hook-form"
 import { useTranslation } from "react-i18next"
 import { useNavigate } from "react-router"
diff --git a/apps/ssr/client/pages/(main)/index.tsx b/apps/ssr/client/pages/(main)/index.tsx
index ea309d157..edb411f50 100644
--- a/apps/ssr/client/pages/(main)/index.tsx
+++ b/apps/ssr/client/pages/(main)/index.tsx
@@ -1,3 +1,5 @@
+import * as React from "react"
+
 export const Component = () => {
   return <div>(*‘ v`*) Hello, Folo</div>
 }
diff --git a/apps/ssr/client/pages/(main)/layout.tsx b/apps/ssr/client/pages/(main)/layout.tsx
index 816b07e97..c41a84648 100644
--- a/apps/ssr/client/pages/(main)/layout.tsx
+++ b/apps/ssr/client/pages/(main)/layout.tsx
@@ -1,4 +1,5 @@
 import { NotFound } from "@client/components/common/404"
+import * as React from "react"
 import { Outlet } from "react-router"
 
 export const Component = () => {
diff --git a/apps/ssr/client/pages/(main)/share/feeds/[id]/index.tsx b/apps/ssr/client/pages/(main)/share/feeds/[id]/index.tsx
index 14d883670..cc8a1745d 100644
--- a/apps/ssr/client/pages/(main)/share/feeds/[id]/index.tsx
+++ b/apps/ssr/client/pages/(main)/share/feeds/[id]/index.tsx
@@ -11,6 +11,7 @@ import { useTitle } from "@follow/hooks"
 import { cn } from "@follow/utils/utils"
 import type { FeedSchema } from "@follow-app/client-sdk"
 import { Fragment } from "react"
+import * as React from "react"
 import { useTranslation } from "react-i18next"
 import { useParams, useSearchParams } from "react-router"
 
diff --git a/apps/ssr/client/pages/(main)/share/lists/[id]/index.tsx b/apps/ssr/client/pages/(main)/share/lists/[id]/index.tsx
index 890367615..125f39436 100644
--- a/apps/ssr/client/pages/(main)/share/lists/[id]/index.tsx
+++ b/apps/ssr/client/pages/(main)/share/lists/[id]/index.tsx
@@ -11,6 +11,7 @@ import { useTitle } from "@follow/hooks"
 import { cn, formatNumber } from "@follow/utils/utils"
 import type { FeedSchema } from "@follow-app/client-sdk"
 import { Fragment, memo } from "react"
+import * as React from "react"
 import { useTranslation } from "react-i18next"
 import { useParams } from "react-router"
 
diff --git a/apps/ssr/client/pages/(main)/share/users/[id]/index.tsx b/apps/ssr/client/pages/(main)/share/users/[id]/index.tsx
index bbf2b81ac..968c0568c 100644
--- a/apps/ssr/client/pages/(main)/share/users/[id]/index.tsx
+++ b/apps/ssr/client/pages/(main)/share/users/[id]/index.tsx
@@ -10,6 +10,7 @@ import { LoadingCircle } from "@follow/components/ui/loading/index.jsx"
 import { useTitle } from "@follow/hooks"
 import { cn } from "@follow/utils/utils"
 import type { SubscriptionWithFeed, UserProfile } from "@follow-app/client-sdk"
+import * as React from "react"
 import { Fragment, memo, useState } from "react"
 import { useParams } from "react-router"
 
diff --git a/apps/ssr/client/pages/layout.tsx b/apps/ssr/client/pages/layout.tsx
index 28cf2938d..846e8b812 100644
--- a/apps/ssr/client/pages/layout.tsx
+++ b/apps/ssr/client/pages/layout.tsx
@@ -1,6 +1,7 @@
 import { PoweredByFooter } from "@client/components/common/PoweredByFooter"
 import { Header } from "@client/components/layout/header"
 import { MemoedDangerousHTMLStyle } from "@follow/components/common/MemoedDangerousHTMLStyle.jsx"
+import * as React from "react"
 import { Outlet } from "react-router"
 
 export const Component = () => {
diff --git a/apps/ssr/client/providers/root-providers.tsx b/apps/ssr/client/providers/root-providers.tsx
index 2864f1e4d..38a70c7ca 100644
--- a/apps/ssr/client/providers/root-providers.tsx
+++ b/apps/ssr/client/providers/root-providers.tsx
@@ -7,6 +7,7 @@ import { QueryClientProvider } from "@tanstack/react-query"
 import { Provider } from "jotai"
 import { ModalStackContainer } from "rc-modal-sheet/m"
 import type { FC, PropsWithChildren } from "react"
+import * as React from "react"
 
 import { queryClient } from "../lib/query-client"
 import { jotaiStore } from "../lib/store"
diff --git a/apps/ssr/client/router.tsx b/apps/ssr/client/router.tsx
index e633126ae..329bb6818 100644
--- a/apps/ssr/client/router.tsx
+++ b/apps/ssr/client/router.tsx
@@ -1,4 +1,5 @@
 import { wrapCreateBrowserRouterV7 } from "@sentry/react"
+import * as React from "react"
 import { createBrowserRouter, createHashRouter } from "react-router"
 
 import { NotFound } from "./components/common/404"
diff --git a/packages/internal/components/src/common/MemoedDangerousHTMLStyle.tsx b/packages/internal/components/src/common/MemoedDangerousHTMLStyle.tsx
index cad4cf7d5..618ea89c4 100644
--- a/packages/internal/components/src/common/MemoedDangerousHTMLStyle.tsx
+++ b/packages/internal/components/src/common/MemoedDangerousHTMLStyle.tsx
@@ -1,5 +1,6 @@
 import type { FC } from "react"
 import { memo, useMemo } from "react"
+import * as React from "react"
 
 export const MemoedDangerousHTMLStyle: FC<
   {
diff --git a/packages/internal/components/src/common/MotionProvider.tsx b/packages/internal/components/src/common/MotionProvider.tsx
index d2fb812d6..ca94029db 100644
--- a/packages/internal/components/src/common/MotionProvider.tsx
+++ b/packages/internal/components/src/common/MotionProvider.tsx
@@ -1,4 +1,5 @@
 import { domMax, LazyMotion, MotionConfig } from "motion/react"
+import * as React from "react"
 
 export const MotionProvider = ({ children }: { children: React.ReactNode }) => {
   return (
diff --git a/packages/internal/components/src/icons/follow.tsx b/packages/internal/components/src/icons/follow.tsx
index 3128b6f80..853260eeb 100644
--- a/packages/internal/components/src/icons/follow.tsx
+++ b/packages/internal/components/src/icons/follow.tsx
@@ -1,3 +1,5 @@
+import * as React from "react"
+
 export const FollowIcon: Component = (props) => (
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" {...props}>
     <path
diff --git a/packages/internal/components/src/icons/folo.tsx b/packages/internal/components/src/icons/folo.tsx
index 846fd11a1..84f39c393 100644
--- a/packages/internal/components/src/icons/folo.tsx
+++ b/packages/internal/components/src/icons/folo.tsx
@@ -1,3 +1,5 @@
+import * as React from "react"
+
 export const Folo = ({
   ref,
   ...props
diff --git a/packages/internal/components/src/icons/logo.tsx b/packages/internal/components/src/icons/logo.tsx
index 8dcb80525..fd37f53f4 100644
--- a/packages/internal/components/src/icons/logo.tsx
+++ b/packages/internal/components/src/icons/logo.tsx
@@ -1,3 +1,5 @@
+import * as React from "react"
+
 export const Logo = ({
   ref,
   ...props
diff --git a/packages/internal/components/src/ui/datetime/index.tsx b/packages/internal/components/src/ui/datetime/index.tsx
index a01f56e6d..279ef7c60 100644
--- a/packages/internal/components/src/ui/datetime/index.tsx
+++ b/packages/internal/components/src/ui/datetime/index.tsx
@@ -1,6 +1,7 @@
 import { stopPropagation } from "@follow/utils/dom"
 import dayjs from "dayjs"
 import type { FC } from "react"
+import * as React from "react"
 import { useEffect, useRef, useState } from "react"
 import { useTranslation } from "react-i18next"
 
diff --git a/packages/internal/components/src/ui/divider/Divider.tsx b/packages/internal/components/src/ui/divider/Divider.tsx
index 3f0e899f3..a1241f55d 100644
--- a/packages/internal/components/src/ui/divider/Divider.tsx
+++ b/packages/internal/components/src/ui/divider/Divider.tsx
@@ -1,5 +1,6 @@
 import { cn } from "@follow/utils/utils"
 import type { DetailedHTMLProps, FC, HTMLAttributes } from "react"
+import * as React from "react"
 
 export const Divider: FC<DetailedHTMLProps<HTMLAttributes<HTMLHRElement>, HTMLHRElement>> = (
   props,
diff --git a/packages/internal/components/src/ui/input/DateTimePicker.tsx b/packages/internal/components/src/ui/input/DateTimePicker.tsx
index 817a26b4b..3e337e115 100644
--- a/packages/internal/components/src/ui/input/DateTimePicker.tsx
+++ b/packages/internal/components/src/ui/input/DateTimePicker.tsx
@@ -2,6 +2,7 @@ import { cn } from "@follow/utils/utils"
 import { useDatePicker } from "@rehookify/datepicker"
 import dayjs from "dayjs"
 import { memo, useMemo, useState } from "react"
+import * as React from "react"
 
 import { Button } from "../button"
 import { Popover, PopoverContent, PopoverTrigger } from "../popover"
diff --git a/packages/internal/components/src/ui/input/Input.tsx b/packages/internal/components/src/ui/input/Input.tsx
index 2da3e2732..3d5c92a36 100644
--- a/packages/internal/components/src/ui/input/Input.tsx
+++ b/packages/internal/components/src/ui/input/Input.tsx
@@ -2,7 +2,7 @@ import { useInputComposition } from "@follow/hooks"
 import { stopPropagation } from "@follow/utils/dom"
 import { cn } from "@follow/utils/utils"
 import type { DetailedHTMLProps, InputHTMLAttributes } from "react"
-
+import * as React from "react"
 // This composition handler is not perfect
 // @see https://foxact.skk.moe/use-composition-input
 export const Input = ({
diff --git a/packages/internal/components/src/ui/input/InputV2.tsx b/packages/internal/components/src/ui/input/InputV2.tsx
index 3898b54f1..78ebec586 100644
--- a/packages/internal/components/src/ui/input/InputV2.tsx
+++ b/packages/internal/components/src/ui/input/InputV2.tsx
@@ -2,6 +2,7 @@ import { useInputComposition } from "@follow/hooks"
 import { cn, stopPropagation } from "@follow/utils"
 import type { DetailedHTMLProps, InputHTMLAttributes, ReactNode } from "react"
 import { useState } from "react"
+import * as React from "react"
 
 export const InputV2 = ({
   ref,
diff --git a/packages/internal/components/src/ui/input/TextArea.tsx b/packages/internal/components/src/ui/input/TextArea.tsx
index 0bd7cceea..2f9c11883 100644
--- a/packages/internal/components/src/ui/input/TextArea.tsx
+++ b/packages/internal/components/src/ui/input/TextArea.tsx
@@ -5,6 +5,7 @@ import clsx from "clsx"
 import { useMotionValue } from "motion/react"
 import type { DetailedHTMLProps, PropsWithChildren, TextareaHTMLAttributes } from "react"
 import { useCallback, useState } from "react"
+import * as React from "react"
 
 const roundedMap = {
   sm: "rounded-sm",
diff --git a/packages/internal/components/src/ui/input/TimeSelect.tsx b/packages/internal/components/src/ui/input/TimeSelect.tsx
index 9e57365de..599c400ce 100644
--- a/packages/internal/components/src/ui/input/TimeSelect.tsx
+++ b/packages/internal/components/src/ui/input/TimeSelect.tsx
@@ -1,5 +1,6 @@
 import { cn } from "@follow/utils/utils"
 import { memo, useMemo } from "react"
+import * as React from "react"
 
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../select"
 
diff --git a/packages/internal/components/src/ui/marquee/index.tsx b/packages/internal/components/src/ui/marquee/index.tsx
index a0c928ea1..3a60b9dfd 100644
--- a/packages/internal/components/src/ui/marquee/index.tsx
+++ b/packages/internal/components/src/ui/marquee/index.tsx
@@ -1,4 +1,5 @@
 import type { PropsWithChildren } from "react"
+import * as React from "react"
 import { useCallback, useRef, useState } from "react"
 import type { MarqueeProps } from "react-fast-marquee"
 import Marquee from "react-fast-marquee"
diff --git a/packages/internal/components/src/ui/platform-icon/index.tsx b/packages/internal/components/src/ui/platform-icon/index.tsx
index 498d8d9e8..252cd482c 100644
--- a/packages/internal/components/src/ui/platform-icon/index.tsx
+++ b/packages/internal/components/src/ui/platform-icon/index.tsx
@@ -2,6 +2,7 @@ import * as LinkParsers from "@follow/utils/link-parser"
 import { cn } from "@follow/utils/utils"
 import { Slot } from "@radix-ui/react-slot"
 import type { FC } from "react"
+import * as React from "react"
 
 import { getSupportedPlatformIconName } from "./utils"
 
diff --git a/packages/internal/components/src/ui/toast/index.tsx b/packages/internal/components/src/ui/toast/index.tsx
index aa3afd925..856d25054 100644
--- a/packages/internal/components/src/ui/toast/index.tsx
+++ b/packages/internal/components/src/ui/toast/index.tsx
@@ -1,4 +1,5 @@
 import { useIsDark } from "@follow/hooks"
+import * as React from "react"
 import { Toaster as Sonner } from "sonner"
 
 import { ZIndexProvider } from "../z-index"
diff --git a/packages/internal/components/src/ui/typography/EllipsisWithTooltip.tsx b/packages/internal/components/src/ui/typography/EllipsisWithTooltip.tsx
index b770013d8..27d8ecac4 100644
--- a/packages/internal/components/src/ui/typography/EllipsisWithTooltip.tsx
+++ b/packages/internal/components/src/ui/typography/EllipsisWithTooltip.tsx
@@ -1,5 +1,6 @@
 import { cn } from "@follow/utils/utils"
 import type { PropsWithChildren } from "react"
+import * as React from "react"
 import { useEffect, useState } from "react"
 
 import { Tooltip, TooltipContent, TooltipPortal, TooltipTrigger } from "../tooltip"
diff --git a/packages/internal/components/src/ui/z-index/index.tsx b/packages/internal/components/src/ui/z-index/index.tsx
index afc934528..4d8b90e97 100644
--- a/packages/internal/components/src/ui/z-index/index.tsx
+++ b/packages/internal/components/src/ui/z-index/index.tsx
@@ -1,3 +1,5 @@
+import * as React from "react"
+
 import { ZIndexContext } from "./ctx"
 
 export const ZIndexProvider: Component<{