refactor: remove React.FC for component package (#3575)

packages/component/src/components/share-menu/export.tsx

@@ -1,5 +1,4 @@
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import type { FC } from 'react';
 
 import {
   ExportToHtmlMenuItem,
@@ -8,9 +7,9 @@ import {
   ExportToPngMenuItem,
 } from '../page-list/operation-menu-items/export';
 import { actionsStyle, descriptionStyle, menuItemStyle } from './index.css';
-import type { ShareMenuProps } from './share-menu';
+// import type { ShareMenuProps } from './share-menu';
 
-export const Export: FC<ShareMenuProps> = () => {
+export const Export = () => {
   const t = useAFFiNEI18N();
   return (
     <div className={menuItemStyle}>

packages/component/src/components/share-menu/share-menu.tsx

@@ -5,8 +5,7 @@ import type {
 import { ExportIcon, PublishIcon, ShareIcon } from '@blocksuite/icons';
 import type { Page } from '@blocksuite/store';
 import { useBlockSuiteWorkspacePageIsPublic } from '@toeverything/hooks/use-block-suite-workspace-page-is-public';
-import type { FC } from 'react';
-import { useRef } from 'react';
+import { type ReactElement, useRef } from 'react';
 import { useCallback, useState } from 'react';
 
 import { Button } from '../../ui/button';
@@ -16,22 +15,27 @@ import { containerStyle, indicatorContainerStyle, tabStyle } from './index.css';
 import { SharePage } from './share-page';
 import { ShareWorkspace } from './share-workspace';
 import { StyledIndicator, TabItem } from './styles';
+
 type SharePanel = 'SharePage' | 'Export' | 'ShareWorkspace';
-const MenuItems: Record<SharePanel, FC<ShareMenuProps>> = {
+type ShareMenuComponent<T> = (props: T) => ReactElement;
+
+const MenuItems: Record<SharePanel, ShareMenuComponent<ShareMenuProps>> = {
   SharePage: SharePage,
   Export: Export,
   ShareWorkspace: ShareWorkspace,
 };
+
 const tabIcons = {
   SharePage: <ShareIcon />,
   Export: <ExportIcon />,
   ShareWorkspace: <PublishIcon />,
 };
-export type ShareMenuProps<
+
+export interface ShareMenuProps<
   Workspace extends AffineCloudWorkspace | LocalWorkspace =
     | AffineCloudWorkspace
     | LocalWorkspace,
-> = {
+> {
   workspace: Workspace;
   currentPage: Page;
   onEnableAffineCloud: (workspace: LocalWorkspace) => void;
@@ -41,7 +45,7 @@ export type ShareMenuProps<
     workspace: Workspace,
     publish: boolean
   ) => Promise<void>;
-};
+}
 
 function assertInstanceOf<T, U extends T>(
   obj: T,
@@ -52,7 +56,7 @@ function assertInstanceOf<T, U extends T>(
   }
 }
 
-export const ShareMenu: FC<ShareMenuProps> = props => {
+export const ShareMenu = (props: ShareMenuProps) => {
   const [activeItem, setActiveItem] = useState<SharePanel>('SharePage');
   const [isPublic] = useBlockSuiteWorkspacePageIsPublic(props.currentPage);
   const [open, setOpen] = useState(false);
@@ -84,7 +88,7 @@ export const ShareMenu: FC<ShareMenuProps> = props => {
     activeItem: SharePanel;
     onChangeTab: (selectedItem: SharePanel) => void;
   }
-  const ShareMenu: FC<ShareMenuProps> = ({ activeItem, onChangeTab }) => {
+  const ShareMenu = ({ activeItem, onChangeTab }: ShareMenuProps) => {
     const handleButtonClick = (itemName: SharePanel) => {
       onChangeTab(itemName);
       setActiveItem(itemName);

packages/component/src/components/share-menu/share-page.tsx

@@ -3,7 +3,6 @@ import { WorkspaceFlavour } from '@affine/env/workspace';
 import { Trans } from '@affine/i18n';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
 import { useBlockSuiteWorkspacePageIsPublic } from '@toeverything/hooks/use-block-suite-workspace-page-is-public';
-import type { FC } from 'react';
 import { useState } from 'react';
 import { useCallback, useMemo } from 'react';
 
@@ -17,7 +16,7 @@ import {
 import type { ShareMenuProps } from './share-menu';
 import { StyledDisableButton, StyledInput, StyledLinkSpan } from './styles';
 
-export const LocalSharePage: FC<ShareMenuProps> = props => {
+export const LocalSharePage = (props: ShareMenuProps) => {
   const t = useAFFiNEI18N();
   return (
     <div className={menuItemStyle}>
@@ -35,7 +34,7 @@ export const LocalSharePage: FC<ShareMenuProps> = props => {
   );
 };
 
-export const AffineSharePage: FC<ShareMenuProps> = props => {
+export const AffineSharePage = (props: ShareMenuProps) => {
   const [isPublic, setIsPublic] = useBlockSuiteWorkspacePageIsPublic(
     props.currentPage
   );
@@ -123,7 +122,7 @@ export const AffineSharePage: FC<ShareMenuProps> = props => {
   );
 };
 
-export const SharePage: FC<ShareMenuProps> = props => {
+export const SharePage = (props: ShareMenuProps) => {
   if (props.workspace.flavour === WorkspaceFlavour.LOCAL) {
     return <LocalSharePage {...props} />;
   } else if (props.workspace.flavour === WorkspaceFlavour.AFFINE_CLOUD) {

packages/component/src/components/share-menu/share-workspace.tsx

@@ -4,13 +4,12 @@ import type {
 } from '@affine/env/workspace';
 import { WorkspaceFlavour } from '@affine/env/workspace';
 import { useAFFiNEI18N } from '@affine/i18n/hooks';
-import type { FC } from 'react';
 
 import { Button } from '../../ui/button';
 import { descriptionStyle, menuItemStyle } from './index.css';
 import type { ShareMenuProps } from './share-menu';
 
-const ShareLocalWorkspace: FC<ShareMenuProps<LocalWorkspace>> = props => {
+const ShareLocalWorkspace = (props: ShareMenuProps<LocalWorkspace>) => {
   const t = useAFFiNEI18N();
   return (
     <div className={menuItemStyle}>
@@ -29,9 +28,7 @@ const ShareLocalWorkspace: FC<ShareMenuProps<LocalWorkspace>> = props => {
   );
 };
 
-const ShareAffineWorkspace: FC<
-  ShareMenuProps<AffineCloudWorkspace>
-> = props => {
+const ShareAffineWorkspace = (props: ShareMenuProps<AffineCloudWorkspace>) => {
   // fixme: regression
   const isPublicWorkspace = false;
   const t = useAFFiNEI18N();
@@ -54,7 +51,7 @@ const ShareAffineWorkspace: FC<
   );
 };
 
-export const ShareWorkspace: FC<ShareMenuProps> = props => {
+export const ShareWorkspace = (props: ShareMenuProps) => {
   if (props.workspace.flavour === WorkspaceFlavour.LOCAL) {
     return (
       <ShareLocalWorkspace {...(props as ShareMenuProps<LocalWorkspace>)} />