From 76fa003189cedbacdac6d962e0a8b254330c7b38 Mon Sep 17 00:00:00 2001
From: QiShaoXuan <qishaoxuan777@gmail.com>
Date: Thu, 11 Aug 2022 21:27:57 +0800
Subject: [PATCH 1/5] feat: update help info of pendant field title

---
 .../src/block-pendant/PendantTag.tsx          |  7 +-----
 .../CreatePendantPanel.tsx                    | 21 +++-------------
 .../FieldTitleInput.tsx                       | 24 +++++++++++++++++++
 .../UpdatePendantPanel.tsx                    | 16 +++----------
 4 files changed, 31 insertions(+), 37 deletions(-)
 create mode 100644 libs/components/editor-core/src/block-pendant/pendant-operation-panel/FieldTitleInput.tsx

diff --git a/libs/components/editor-core/src/block-pendant/PendantTag.tsx b/libs/components/editor-core/src/block-pendant/PendantTag.tsx
index 52d5bfc14d..4c2f788a60 100644
--- a/libs/components/editor-core/src/block-pendant/PendantTag.tsx
+++ b/libs/components/editor-core/src/block-pendant/PendantTag.tsx
@@ -1,9 +1,4 @@
-import React, {
-    FC,
-    FunctionComponent,
-    PropsWithChildren,
-    CSSProperties,
-} from 'react';
+import React from 'react';
 import { Tag, type TagProps } from '@toeverything/components/ui';
 import {
     DateValue,
diff --git a/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx
index 6135d2b3c6..42e36e063f 100644
--- a/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx
+++ b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/CreatePendantPanel.tsx
@@ -1,12 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import {
-    Input,
-    message,
-    Option,
-    Select,
-    Tooltip,
-} from '@toeverything/components/ui';
-import { HelpCenterIcon } from '@toeverything/components/icons';
+import { message, Option, Select } from '@toeverything/components/ui';
 import { AsyncBlock } from '../../editor';
 
 import { IconMap, pendantOptions } from '../config';
@@ -14,7 +7,6 @@ import { PendantOptions } from '../types';
 import { PendantModifyPanel } from '../pendant-modify-panel';
 import {
     StyledDivider,
-    StyledInputEndAdornment,
     StyledOperationLabel,
     StyledOperationTitle,
     StyledPopoverSubTitle,
@@ -26,6 +18,7 @@ import {
     getPendantConfigByType,
     checkPendantForm,
 } from '../utils';
+import { FieldTitleInput } from './FieldTitleInput';
 import { useOnCreateSure } from './hooks';
 
 export const CreatePendantPanel = ({
@@ -74,19 +67,11 @@ export const CreatePendantPanel = ({
                 })}
             </Select>
             <StyledOperationLabel>Field Title</StyledOperationLabel>
-            <Input
+            <FieldTitleInput
                 value={fieldName}
-                placeholder="Input your field name here"
                 onChange={e => {
                     setFieldName(e.target.value);
                 }}
-                endAdornment={
-                    <Tooltip content="Help info here" placement="top">
-                        <StyledInputEndAdornment>
-                            <HelpCenterIcon />
-                        </StyledInputEndAdornment>
-                    </Tooltip>
-                }
             />
             {selectedOption ? (
                 <>
diff --git a/libs/components/editor-core/src/block-pendant/pendant-operation-panel/FieldTitleInput.tsx b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/FieldTitleInput.tsx
new file mode 100644
index 0000000000..6a11bf20d1
--- /dev/null
+++ b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/FieldTitleInput.tsx
@@ -0,0 +1,24 @@
+import React from 'react';
+import { Input, Tooltip, InputProps } from '@toeverything/components/ui';
+import { StyledInputEndAdornment } from '../StyledComponent';
+import { HelpCenterIcon } from '@toeverything/components/icons';
+
+export const FieldTitleInput = (props: InputProps) => {
+    return (
+        <Input
+            placeholder="Input your field name here"
+            endAdornment={
+                <Tooltip
+                    offset={[15, -5]}
+                    content="Name your tag of the current series"
+                    placement="top"
+                >
+                    <StyledInputEndAdornment>
+                        <HelpCenterIcon />
+                    </StyledInputEndAdornment>
+                </Tooltip>
+            }
+            {...props}
+        />
+    );
+};
diff --git a/libs/components/editor-core/src/block-pendant/pendant-operation-panel/UpdatePendantPanel.tsx b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/UpdatePendantPanel.tsx
index 2ff5515bab..5b968d33b8 100644
--- a/libs/components/editor-core/src/block-pendant/pendant-operation-panel/UpdatePendantPanel.tsx
+++ b/libs/components/editor-core/src/block-pendant/pendant-operation-panel/UpdatePendantPanel.tsx
@@ -1,6 +1,5 @@
 import { useState } from 'react';
-import { Input, message, Tooltip } from '@toeverything/components/ui';
-import { HelpCenterIcon } from '@toeverything/components/icons';
+import { message } from '@toeverything/components/ui';
 import { PendantModifyPanel } from '../pendant-modify-panel';
 import type { AsyncBlock } from '../../editor';
 import {
@@ -12,13 +11,12 @@ import { checkPendantForm, getPendantConfigByType } from '../utils';
 import {
     StyledPopoverWrapper,
     StyledOperationLabel,
-    StyledInputEndAdornment,
     StyledDivider,
     StyledPopoverContent,
     StyledPopoverSubTitle,
 } from '../StyledComponent';
 import { IconMap, pendantOptions } from '../config';
-
+import { FieldTitleInput } from './FieldTitleInput';
 import { useOnUpdateSure } from './hooks';
 
 type Props = {
@@ -63,19 +61,11 @@ export const UpdatePendantPanel = ({
             </StyledPopoverContent>
             <StyledOperationLabel>Field Title</StyledOperationLabel>
             {titleEditable ? (
-                <Input
+                <FieldTitleInput
                     value={fieldName}
-                    placeholder="Input your field name here"
                     onChange={e => {
                         setFieldName(e.target.value);
                     }}
-                    endAdornment={
-                        <Tooltip content="Help info here" placement="top">
-                            <StyledInputEndAdornment>
-                                <HelpCenterIcon />
-                            </StyledInputEndAdornment>
-                        </Tooltip>
-                    }
                 />
             ) : (
                 <StyledPopoverContent>{property.name}</StyledPopoverContent>

From d8b176a329230aea8329654921f11e40c812382d Mon Sep 17 00:00:00 2001
From: DarkSky <darksky2048@gmail.com>
Date: Thu, 11 Aug 2022 23:02:36 +0800
Subject: [PATCH 2/5] chore: login condition

---
 libs/components/account/src/login/index.tsx | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/libs/components/account/src/login/index.tsx b/libs/components/account/src/login/index.tsx
index e29b84f12e..82f460c786 100644
--- a/libs/components/account/src/login/index.tsx
+++ b/libs/components/account/src/login/index.tsx
@@ -49,14 +49,14 @@ export function Login() {
                             width: '100px',
                         }}
                     />
-                    {/* {((process.env['NX_LOCAL'] || true) && ( */}
-                    <FileSystem onError={onError} />
-                    {/* )) ||
-                    null}
-                {((!process.env['NX_LOCAL'] || true) && ( */}
-                    <Firebase onError={onError} />
-                    {/* )) ||
-                    null} */}{' '}
+                    {(process.env['NX_LOCAL'] && (
+                        <FileSystem onError={onError} />
+                    )) ||
+                        null}
+                    {(!process.env['NX_LOCAL'] && (
+                        <Firebase onError={onError} />
+                    )) ||
+                        null}
                 </MuiBox>
             </MuiGrid>
         </MuiGrid>

From f81c600aaf55da87de623472545a99dc1b96a29f Mon Sep 17 00:00:00 2001
From: Bryan Lee <doslby@gmail.com>
Date: Fri, 12 Aug 2022 00:55:52 +0800
Subject: [PATCH 3/5] fix: type error

---
 .../editor-blocks/src/blocks/todo/CheckBox.tsx         | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/libs/components/editor-blocks/src/blocks/todo/CheckBox.tsx b/libs/components/editor-blocks/src/blocks/todo/CheckBox.tsx
index badd4f6a60..59d0d20fb8 100644
--- a/libs/components/editor-blocks/src/blocks/todo/CheckBox.tsx
+++ b/libs/components/editor-blocks/src/blocks/todo/CheckBox.tsx
@@ -9,19 +9,19 @@ interface CheckBoxProps {
 }
 
 export const CheckBox: FC<CheckBoxProps> = ({
-    size = '16px',
-    height = '23px',
+    size = 16,
+    height = 23,
     checked,
     onChange,
 }) => {
     const dynamic_style = useMemo(
         () => ({
             height: {
-                height,
+                height: `${height}px`,
             },
             size: {
-                width: size,
-                height: size,
+                width: `${size}px`,
+                height: `${size}px`,
             },
         }),
         [height, size]

From 40b617c42944f1cc12a11482fa2a5b9283cc3fec Mon Sep 17 00:00:00 2001
From: DarkSky <darksky2048@gmail.com>
Date: Fri, 12 Aug 2022 01:26:27 +0800
Subject: [PATCH 4/5] chore: reduce code by
 gndelia/codemod-replace-react-fc-typescript

---
 apps/ligo-virgo/src/pages/tools/icons/Icons.tsx  |  4 ++--
 .../command-panel/BorderColorConfig.tsx          |  5 +----
 .../components/command-panel/CommandPanel.tsx    |  2 +-
 .../components/command-panel/DeleteOperation.tsx |  2 +-
 .../components/command-panel/FillColorConfig.tsx |  5 +----
 .../components/command-panel/FontSizeConfig.tsx  |  2 +-
 .../command-panel/FrameFillColorConfig.tsx       |  4 ++--
 .../components/command-panel/GroupOperation.tsx  |  4 ++--
 .../components/command-panel/LockOperation.tsx   |  4 ++--
 .../stroke-line-style-config/LineStyle.tsx       |  4 ++--
 .../StrokeLineStyleConfig.tsx                    |  4 ++--
 .../src/components/context-menu/context-menu.tsx |  2 +-
 .../src/components/palette/Palette.tsx           |  4 ++--
 .../src/components/tools-panel/LineTools.tsx     |  2 +-
 .../src/components/tools-panel/ShapeTools.tsx    |  2 +-
 .../src/components/tools-panel/ToolsPanel.tsx    |  2 +-
 .../src/components/tools-panel/pen-tools/Pen.tsx |  4 ++--
 .../tools-panel/pen-tools/PenTools.tsx           |  2 +-
 .../src/components/zoom-bar/ZoomBar.tsx          |  2 +-
 .../src/components/zoom-bar/mini-map/MiniMap.tsx |  2 +-
 .../zoom-bar/mini-map/SimplifiedShape.tsx        |  4 ++--
 .../components/zoom-bar/mini-map/Viewport.tsx    |  4 ++--
 .../src/blocks/bullet/BulletView.tsx             |  2 +-
 .../editor-blocks/src/blocks/code/CodeView.tsx   |  2 +-
 .../src/blocks/divider/divider-view.tsx          |  2 +-
 .../src/blocks/embed-link/EmbedLinkView.tsx      |  2 +-
 .../editor-blocks/src/blocks/figma/FigmaView.tsx |  2 +-
 .../editor-blocks/src/blocks/file/FileView.tsx   |  2 +-
 .../src/blocks/grid-item/GridItem.tsx            |  2 +-
 .../src/blocks/grid-item/GridItemRender.tsx      |  2 +-
 .../editor-blocks/src/blocks/grid/GirdHandle.tsx |  4 ++--
 .../editor-blocks/src/blocks/grid/Grid.tsx       |  2 +-
 .../editor-blocks/src/blocks/group/GroupView.tsx |  2 +-
 .../editor-blocks/src/blocks/group/ScenePage.tsx |  2 +-
 .../src/blocks/group/SceneTable.tsx              |  2 +-
 .../src/blocks/groupDvider/groupDividerView.tsx  |  2 +-
 .../editor-blocks/src/blocks/image/ImageView.tsx |  2 +-
 .../src/blocks/numbered/NumberedView.tsx         |  2 +-
 .../editor-blocks/src/blocks/page/PageView.tsx   |  2 +-
 .../src/blocks/ref-link/ref-link-view.tsx        |  2 +-
 .../editor-blocks/src/blocks/text/TextView.tsx   |  4 ++--
 .../editor-blocks/src/blocks/toc/toc-view.tsx    |  2 +-
 .../editor-blocks/src/blocks/todo/CheckBox.tsx   |  4 ++--
 .../editor-blocks/src/blocks/todo/TodoView.tsx   |  2 +-
 .../src/blocks/youtube/YoutubeView.tsx           |  2 +-
 .../components/BlockContainer/BlockContainer.tsx |  4 ++--
 .../src/components/ImageView/ImageView.tsx       |  2 +-
 .../components/IndentWrapper/IndentWrapper.tsx   |  2 +-
 .../src/components/editable/editable.tsx         |  2 +-
 .../src/components/source-view/SourceView.tsx    |  2 +-
 .../src/components/table/basic-table.tsx         | 16 ++++++++++------
 .../table/custom-cell/check-box/index.tsx        |  4 ++--
 .../src/components/table/custom-cell/index.tsx   |  4 ++--
 .../table/custom-cell/select/index.tsx           |  4 ++--
 .../editor-blocks/src/components/table/table.tsx |  2 +-
 .../src/components/upload/upload.tsx             |  2 +-
 libs/components/editor-core/src/RenderRoot.tsx   |  4 ++--
 .../src/block-pendant/BlockPendantProvider.tsx   |  4 ++--
 .../pendant-popover/PendantPopover.tsx           |  6 +++---
 .../editor-core/src/render-block/RenderBlock.tsx |  4 ++--
 .../src/render-block/RenderBlockChildren.tsx     |  2 +-
 .../src/menu/left-menu/LeftMenuDraggable.tsx     |  2 +-
 .../header/EditorBoardSwitcher/StatusTrack.tsx   |  2 +-
 .../settings-sidebar/Settings/footer/Footer.tsx  |  2 +-
 .../Settings/footer/LastModified.tsx             |  2 +-
 .../settings-sidebar/Settings/footer/Logout.tsx  |  2 +-
 libs/components/ui/src/button/IconButton.tsx     |  4 ++--
 libs/components/ui/src/divider/Divider.tsx       |  4 ++--
 libs/components/ui/src/list/ListItem.tsx         |  4 ++--
 libs/components/ui/src/select/OldSelect.tsx      |  7 +------
 libs/components/ui/src/slider/Slider.tsx         |  2 +-
 libs/components/ui/src/tag/Tag.tsx               |  4 ++--
 libs/components/ui/src/theme/utils.tsx           |  2 +-
 73 files changed, 108 insertions(+), 115 deletions(-)

diff --git a/apps/ligo-virgo/src/pages/tools/icons/Icons.tsx b/apps/ligo-virgo/src/pages/tools/icons/Icons.tsx
index a496a58676..9a3ba16830 100644
--- a/apps/ligo-virgo/src/pages/tools/icons/Icons.tsx
+++ b/apps/ligo-virgo/src/pages/tools/icons/Icons.tsx
@@ -3,7 +3,7 @@ import * as uiIcons from '@toeverything/components/icons';
 import { message, styled } from '@toeverything/components/ui';
 import { copy } from './copy';
 
-const IconBooth: FC<{ name: string; Icon: FC<any> }> = ({ name, Icon }) => {
+const IconBooth = ({ name, Icon }: { name: string; Icon: FC<any> }) => {
     const on_click = () => {
         copy(`<${name} />`);
         message.success('Copied ~');
@@ -18,7 +18,7 @@ const IconBooth: FC<{ name: string; Icon: FC<any> }> = ({ name, Icon }) => {
 
 const _icons = Object.entries(uiIcons).filter(([key]) => key !== 'timestamp');
 
-export const Icons: FC = () => {
+export const Icons = () => {
     const ref = useRef<HTMLHeadingElement>(null);
     return (
         <Container>
diff --git a/libs/components/board-draw/src/components/command-panel/BorderColorConfig.tsx b/libs/components/board-draw/src/components/command-panel/BorderColorConfig.tsx
index 9810dcaf37..8b13982b83 100644
--- a/libs/components/board-draw/src/components/command-panel/BorderColorConfig.tsx
+++ b/libs/components/board-draw/src/components/command-panel/BorderColorConfig.tsx
@@ -34,10 +34,7 @@ const _getIconRenderColor = (shapes: TDShape[]) => {
     return max[0];
 };
 
-export const BorderColorConfig: FC<BorderColorConfigProps> = ({
-    app,
-    shapes,
-}) => {
+export const BorderColorConfig = ({ app, shapes }: BorderColorConfigProps) => {
     const setBorderColor = (color: string) => {
         app.style({ stroke: color }, getShapeIds(shapes));
     };
diff --git a/libs/components/board-draw/src/components/command-panel/CommandPanel.tsx b/libs/components/board-draw/src/components/command-panel/CommandPanel.tsx
index 1e73889fb2..6c45bfc4e6 100644
--- a/libs/components/board-draw/src/components/command-panel/CommandPanel.tsx
+++ b/libs/components/board-draw/src/components/command-panel/CommandPanel.tsx
@@ -13,7 +13,7 @@ import { DeleteShapes } from './DeleteOperation';
 import { Lock, Unlock } from './LockOperation';
 import { FrameFillColorConfig } from './FrameFillColorConfig';
 
-export const CommandPanel: FC<{ app: TldrawApp }> = ({ app }) => {
+export const CommandPanel = ({ app }: { app: TldrawApp }) => {
     const state = app.useStore();
     const bounds = TLDR.get_selected_bounds(state);
     const camera = app.useStore(
diff --git a/libs/components/board-draw/src/components/command-panel/DeleteOperation.tsx b/libs/components/board-draw/src/components/command-panel/DeleteOperation.tsx
index c93d022546..050c1e23d7 100644
--- a/libs/components/board-draw/src/components/command-panel/DeleteOperation.tsx
+++ b/libs/components/board-draw/src/components/command-panel/DeleteOperation.tsx
@@ -10,7 +10,7 @@ interface DeleteShapesProps {
     shapes: TDShape[];
 }
 
-export const DeleteShapes: FC<DeleteShapesProps> = ({ app, shapes }) => {
+export const DeleteShapes = ({ app, shapes }: DeleteShapesProps) => {
     const deleteShapes = () => {
         app.delete(getShapeIds(shapes));
     };
diff --git a/libs/components/board-draw/src/components/command-panel/FillColorConfig.tsx b/libs/components/board-draw/src/components/command-panel/FillColorConfig.tsx
index 1c8ce36601..57c6a68d13 100644
--- a/libs/components/board-draw/src/components/command-panel/FillColorConfig.tsx
+++ b/libs/components/board-draw/src/components/command-panel/FillColorConfig.tsx
@@ -41,10 +41,7 @@ const _getIconRenderColor = (shapes: TDShape[]) => {
     return max[0];
 };
 
-export const FillColorConfig: FC<BorderColorConfigProps> = ({
-    app,
-    shapes,
-}) => {
+export const FillColorConfig = ({ app, shapes }: BorderColorConfigProps) => {
     const theme = useTheme();
     const setFillColor = (color: ColorType) => {
         app.style(
diff --git a/libs/components/board-draw/src/components/command-panel/FontSizeConfig.tsx b/libs/components/board-draw/src/components/command-panel/FontSizeConfig.tsx
index 86d23a4331..dfb6252290 100644
--- a/libs/components/board-draw/src/components/command-panel/FontSizeConfig.tsx
+++ b/libs/components/board-draw/src/components/command-panel/FontSizeConfig.tsx
@@ -51,7 +51,7 @@ const _getFontSize = (shapes: TDShape[]): FontSizeStyle => {
     return max[0] as unknown as FontSizeStyle;
 };
 
-export const FontSizeConfig: FC<FontSizeConfigProps> = ({ app, shapes }) => {
+export const FontSizeConfig = ({ app, shapes }: FontSizeConfigProps) => {
     const setFontSize = (size: FontSizeStyle) => {
         app.style({ fontSize: size }, getShapeIds(shapes));
     };
diff --git a/libs/components/board-draw/src/components/command-panel/FrameFillColorConfig.tsx b/libs/components/board-draw/src/components/command-panel/FrameFillColorConfig.tsx
index e8cbe07279..7e325a06f3 100644
--- a/libs/components/board-draw/src/components/command-panel/FrameFillColorConfig.tsx
+++ b/libs/components/board-draw/src/components/command-panel/FrameFillColorConfig.tsx
@@ -40,10 +40,10 @@ const _getIconRenderColor = (shapes: TDShape[]) => {
     return max[0];
 };
 
-export const FrameFillColorConfig: FC<BorderColorConfigProps> = ({
+export const FrameFillColorConfig = ({
     app,
     shapes,
-}) => {
+}: BorderColorConfigProps) => {
     const theme = useTheme();
     const setFillColor = (color: ColorType) => {
         app.style(
diff --git a/libs/components/board-draw/src/components/command-panel/GroupOperation.tsx b/libs/components/board-draw/src/components/command-panel/GroupOperation.tsx
index 8a9b3f3ac5..6e6a0fcc93 100644
--- a/libs/components/board-draw/src/components/command-panel/GroupOperation.tsx
+++ b/libs/components/board-draw/src/components/command-panel/GroupOperation.tsx
@@ -10,7 +10,7 @@ interface GroupAndUnGroupProps {
     shapes: TDShape[];
 }
 
-export const Group: FC<GroupAndUnGroupProps> = ({ app, shapes }) => {
+export const Group = ({ app, shapes }: GroupAndUnGroupProps) => {
     const group = () => {
         app.group(getShapeIds(shapes));
     };
@@ -23,7 +23,7 @@ export const Group: FC<GroupAndUnGroupProps> = ({ app, shapes }) => {
     );
 };
 
-export const UnGroup: FC<GroupAndUnGroupProps> = ({ app, shapes }) => {
+export const UnGroup = ({ app, shapes }: GroupAndUnGroupProps) => {
     const ungroup = () => {
         app.ungroup(getShapeIds(shapes));
     };
diff --git a/libs/components/board-draw/src/components/command-panel/LockOperation.tsx b/libs/components/board-draw/src/components/command-panel/LockOperation.tsx
index aeb59b2cf8..c03ec01e1b 100644
--- a/libs/components/board-draw/src/components/command-panel/LockOperation.tsx
+++ b/libs/components/board-draw/src/components/command-panel/LockOperation.tsx
@@ -10,7 +10,7 @@ interface GroupAndUnGroupProps {
     shapes: TDShape[];
 }
 
-export const Lock: FC<GroupAndUnGroupProps> = ({ app, shapes }) => {
+export const Lock = ({ app, shapes }: GroupAndUnGroupProps) => {
     const lock = () => {
         app.lock(getShapeIds(shapes));
     };
@@ -23,7 +23,7 @@ export const Lock: FC<GroupAndUnGroupProps> = ({ app, shapes }) => {
     );
 };
 
-export const Unlock: FC<GroupAndUnGroupProps> = ({ app, shapes }) => {
+export const Unlock = ({ app, shapes }: GroupAndUnGroupProps) => {
     const unlock = () => {
         app.unlock(getShapeIds(shapes));
     };
diff --git a/libs/components/board-draw/src/components/command-panel/stroke-line-style-config/LineStyle.tsx b/libs/components/board-draw/src/components/command-panel/stroke-line-style-config/LineStyle.tsx
index ee54446d01..e68df6c280 100644
--- a/libs/components/board-draw/src/components/command-panel/stroke-line-style-config/LineStyle.tsx
+++ b/libs/components/board-draw/src/components/command-panel/stroke-line-style-config/LineStyle.tsx
@@ -44,12 +44,12 @@ interface LineStyleProps {
     onStrokeWidthChange: (width: StrokeWidth) => void;
 }
 
-export const LineStyle: FC<LineStyleProps> = ({
+export const LineStyle = ({
     strokeStyle,
     onStrokeStyleChange,
     strokeWidth,
     onStrokeWidthChange,
-}) => {
+}: LineStyleProps) => {
     return (
         <Container>
             <Title>Stroke Style</Title>
diff --git a/libs/components/board-draw/src/components/command-panel/stroke-line-style-config/StrokeLineStyleConfig.tsx b/libs/components/board-draw/src/components/command-panel/stroke-line-style-config/StrokeLineStyleConfig.tsx
index 5a47534d53..fb9bea617c 100644
--- a/libs/components/board-draw/src/components/command-panel/stroke-line-style-config/StrokeLineStyleConfig.tsx
+++ b/libs/components/board-draw/src/components/command-panel/stroke-line-style-config/StrokeLineStyleConfig.tsx
@@ -24,10 +24,10 @@ interface BorderColorConfigProps {
     shapes: TDShape[];
 }
 
-export const StrokeLineStyleConfig: FC<BorderColorConfigProps> = ({
+export const StrokeLineStyleConfig = ({
     app,
     shapes,
-}) => {
+}: BorderColorConfigProps) => {
     const strokeStyle = _getStrokeStyle(shapes);
     const strokeWidth = _getStrokeWidth(shapes);
     const setStrokeLineStyle = (style: DashStyle) => {
diff --git a/libs/components/board-draw/src/components/context-menu/context-menu.tsx b/libs/components/board-draw/src/components/context-menu/context-menu.tsx
index 82f1c37ce6..6d8bb5c007 100644
--- a/libs/components/board-draw/src/components/context-menu/context-menu.tsx
+++ b/libs/components/board-draw/src/components/context-menu/context-menu.tsx
@@ -1,5 +1,5 @@
 import type { FC, ReactNode } from 'react';
 
-export const ContextMenu: FC<{ children: ReactNode }> = ({ children }) => {
+export const ContextMenu = ({ children }: { children: ReactNode }) => {
     return <div>{children}</div>;
 };
diff --git a/libs/components/board-draw/src/components/palette/Palette.tsx b/libs/components/board-draw/src/components/palette/Palette.tsx
index 34021444a4..f89decdd2b 100644
--- a/libs/components/board-draw/src/components/palette/Palette.tsx
+++ b/libs/components/board-draw/src/components/palette/Palette.tsx
@@ -26,11 +26,11 @@ const formatColors = (colors: ColorValue[]): ColorObject[] => {
     });
 };
 
-export const Palette: FC<PaletteProps> = ({
+export const Palette = ({
     colors: propColors,
     selected,
     onSelect,
-}) => {
+}: PaletteProps) => {
     const colorObjects = useMemo(() => formatColors(propColors), [propColors]);
     return (
         <Container>
diff --git a/libs/components/board-draw/src/components/tools-panel/LineTools.tsx b/libs/components/board-draw/src/components/tools-panel/LineTools.tsx
index 3959e36296..ea54a20145 100644
--- a/libs/components/board-draw/src/components/tools-panel/LineTools.tsx
+++ b/libs/components/board-draw/src/components/tools-panel/LineTools.tsx
@@ -33,7 +33,7 @@ const shapes = [
 
 const activeToolSelector = (s: TDSnapshot) => s.appState.activeTool;
 
-export const LineTools: FC<{ app: TldrawApp }> = ({ app }) => {
+export const LineTools = ({ app }: { app: TldrawApp }) => {
     const activeTool = app.useStore(activeToolSelector);
 
     const [lastActiveTool, setLastActiveTool] = useState<ShapeTypes>(
diff --git a/libs/components/board-draw/src/components/tools-panel/ShapeTools.tsx b/libs/components/board-draw/src/components/tools-panel/ShapeTools.tsx
index c042d860f5..32f8a5ba9a 100644
--- a/libs/components/board-draw/src/components/tools-panel/ShapeTools.tsx
+++ b/libs/components/board-draw/src/components/tools-panel/ShapeTools.tsx
@@ -69,7 +69,7 @@ const shapes = [
 
 const activeToolSelector = (s: TDSnapshot) => s.appState.activeTool;
 
-export const ShapeTools: FC<{ app: TldrawApp }> = ({ app }) => {
+export const ShapeTools = ({ app }: { app: TldrawApp }) => {
     const activeTool = app.useStore(activeToolSelector);
 
     const [lastActiveTool, setLastActiveTool] = useState<ShapeTypes>(
diff --git a/libs/components/board-draw/src/components/tools-panel/ToolsPanel.tsx b/libs/components/board-draw/src/components/tools-panel/ToolsPanel.tsx
index e8d10e1f7d..f650f8dd8c 100644
--- a/libs/components/board-draw/src/components/tools-panel/ToolsPanel.tsx
+++ b/libs/components/board-draw/src/components/tools-panel/ToolsPanel.tsx
@@ -68,7 +68,7 @@ const tools: Array<{
     },
 ];
 
-export const ToolsPanel: FC<{ app: TldrawApp }> = ({ app }) => {
+export const ToolsPanel = ({ app }: { app: TldrawApp }) => {
     const activeTool = app.useStore(activeToolSelector);
 
     const isToolLocked = app.useStore(toolLockedSelector);
diff --git a/libs/components/board-draw/src/components/tools-panel/pen-tools/Pen.tsx b/libs/components/board-draw/src/components/tools-panel/pen-tools/Pen.tsx
index 94d83774f5..bcfc0b3bdf 100644
--- a/libs/components/board-draw/src/components/tools-panel/pen-tools/Pen.tsx
+++ b/libs/components/board-draw/src/components/tools-panel/pen-tools/Pen.tsx
@@ -9,13 +9,13 @@ interface PenProps {
     onClick: () => void;
 }
 
-export const Pen: FC<PenProps> = ({
+export const Pen = ({
     name,
     icon,
     primaryColor,
     secondaryColor,
     onClick,
-}) => {
+}: PenProps) => {
     return (
         <Tooltip content={name}>
             <StyledIconButton
diff --git a/libs/components/board-draw/src/components/tools-panel/pen-tools/PenTools.tsx b/libs/components/board-draw/src/components/tools-panel/pen-tools/PenTools.tsx
index f951f12697..e634ddfef3 100644
--- a/libs/components/board-draw/src/components/tools-panel/pen-tools/PenTools.tsx
+++ b/libs/components/board-draw/src/components/tools-panel/pen-tools/PenTools.tsx
@@ -105,7 +105,7 @@ const PENCIL_CONFIGS_MAP = PENCIL_CONFIGS.reduce<
     return acc;
 }, {} as Record<TDToolType, PencilConfig>);
 
-export const PenTools: FC<{ app: TldrawApp }> = ({ app }) => {
+export const PenTools = ({ app }: { app: TldrawApp }) => {
     const appCurrentTool = app.useStore(state => state.appState.activeTool);
     const chosenPen =
         PENCIL_CONFIGS.find(config => config.key === appCurrentTool) ||
diff --git a/libs/components/board-draw/src/components/zoom-bar/ZoomBar.tsx b/libs/components/board-draw/src/components/zoom-bar/ZoomBar.tsx
index 9a1693031d..ba05686c80 100644
--- a/libs/components/board-draw/src/components/zoom-bar/ZoomBar.tsx
+++ b/libs/components/board-draw/src/components/zoom-bar/ZoomBar.tsx
@@ -16,7 +16,7 @@ import { MiniMap } from './mini-map';
 const zoomSelector = (s: TDSnapshot) =>
     s.document.pageStates[s.appState.currentPageId].camera.zoom;
 
-export const ZoomBar: FC = () => {
+export const ZoomBar = () => {
     const app = useTldrawApp();
     const zoom = app.useStore(zoomSelector);
 
diff --git a/libs/components/board-draw/src/components/zoom-bar/mini-map/MiniMap.tsx b/libs/components/board-draw/src/components/zoom-bar/mini-map/MiniMap.tsx
index f3ad758434..0b950fe026 100644
--- a/libs/components/board-draw/src/components/zoom-bar/mini-map/MiniMap.tsx
+++ b/libs/components/board-draw/src/components/zoom-bar/mini-map/MiniMap.tsx
@@ -18,7 +18,7 @@ const getScaleToMap = (width: number, height: number) => {
     return scaleWidth > scaleHeight ? scaleWidth : scaleHeight;
 };
 
-export const MiniMap: FC = () => {
+export const MiniMap = () => {
     const app = useTldrawApp();
     const page = app.useStore(s => s.document.pages[s.appState.currentPageId]);
     const pageState = app.useStore(
diff --git a/libs/components/board-draw/src/components/zoom-bar/mini-map/SimplifiedShape.tsx b/libs/components/board-draw/src/components/zoom-bar/mini-map/SimplifiedShape.tsx
index e64cf18f72..9edb3eda65 100644
--- a/libs/components/board-draw/src/components/zoom-bar/mini-map/SimplifiedShape.tsx
+++ b/libs/components/board-draw/src/components/zoom-bar/mini-map/SimplifiedShape.tsx
@@ -6,13 +6,13 @@ interface SimplifiedShapeProps extends TLBounds {
     onClick?: () => void;
 }
 
-export const SimplifiedShape: FC<SimplifiedShapeProps> = ({
+export const SimplifiedShape = ({
     onClick,
     width,
     height,
     minX,
     minY,
-}) => {
+}: SimplifiedShapeProps) => {
     const style: CSSProperties = {
         width: `${width}px`,
         height: `${height}px`,
diff --git a/libs/components/board-draw/src/components/zoom-bar/mini-map/Viewport.tsx b/libs/components/board-draw/src/components/zoom-bar/mini-map/Viewport.tsx
index de923a6afd..7cd830f16d 100644
--- a/libs/components/board-draw/src/components/zoom-bar/mini-map/Viewport.tsx
+++ b/libs/components/board-draw/src/components/zoom-bar/mini-map/Viewport.tsx
@@ -8,13 +8,13 @@ interface ViewportProps extends TLBounds {
     onPan?: (delta: [number, number]) => void;
 }
 
-export const Viewport: FC<ViewportProps> = ({
+export const Viewport = ({
     onPan,
     width,
     height,
     minX,
     minY,
-}) => {
+}: ViewportProps) => {
     const style: CSSProperties = {
         width: `${width}px`,
         height: `${height}px`,
diff --git a/libs/components/editor-blocks/src/blocks/bullet/BulletView.tsx b/libs/components/editor-blocks/src/blocks/bullet/BulletView.tsx
index dee9042e7a..a2ef05300c 100644
--- a/libs/components/editor-blocks/src/blocks/bullet/BulletView.tsx
+++ b/libs/components/editor-blocks/src/blocks/bullet/BulletView.tsx
@@ -43,7 +43,7 @@ const todoIsEmpty = (contentValue: ContentColumnValue): boolean => {
 const BulletLeft = styled('div')(() => ({
     height: '22px',
 }));
-export const BulletView: FC<CreateView> = ({ block, editor }) => {
+export const BulletView = ({ block, editor }: CreateView) => {
     // block.remove();
     const properties = { ...defaultBulletProps, ...block.getProperties() };
     const textRef = useRef<ExtendedTextUtils>(null);
diff --git a/libs/components/editor-blocks/src/blocks/code/CodeView.tsx b/libs/components/editor-blocks/src/blocks/code/CodeView.tsx
index 9ce542acf2..2d421296ee 100644
--- a/libs/components/editor-blocks/src/blocks/code/CodeView.tsx
+++ b/libs/components/editor-blocks/src/blocks/code/CodeView.tsx
@@ -126,7 +126,7 @@ const CodeBlock = styled('div')(({ theme }) => ({
         outline: 'none !important',
     },
 }));
-export const CodeView: FC<CreateCodeView> = ({ block, editor }) => {
+export const CodeView = ({ block, editor }: CreateCodeView) => {
     const initValue: string = block.getProperty('text')?.value?.[0]?.text;
     const langType: string = block.getProperty('lang');
     const [extensions, setExtensions] = useState<Extension[]>();
diff --git a/libs/components/editor-blocks/src/blocks/divider/divider-view.tsx b/libs/components/editor-blocks/src/blocks/divider/divider-view.tsx
index 7611f78f32..293fd2c4cc 100644
--- a/libs/components/editor-blocks/src/blocks/divider/divider-view.tsx
+++ b/libs/components/editor-blocks/src/blocks/divider/divider-view.tsx
@@ -18,7 +18,7 @@ const Line = styled('div')({
     backgroundColor: '#e2e8f0',
 });
 
-export const DividerView: FC<CreateView> = ({ block, editor }) => {
+export const DividerView = ({ block, editor }: CreateView) => {
     const [isSelected, setIsSelected] = useState(false);
 
     useOnSelect(block.id, (isSelect: boolean) => {
diff --git a/libs/components/editor-blocks/src/blocks/embed-link/EmbedLinkView.tsx b/libs/components/editor-blocks/src/blocks/embed-link/EmbedLinkView.tsx
index da33c2be4a..e939f3951b 100644
--- a/libs/components/editor-blocks/src/blocks/embed-link/EmbedLinkView.tsx
+++ b/libs/components/editor-blocks/src/blocks/embed-link/EmbedLinkView.tsx
@@ -13,7 +13,7 @@ const MESSAGES = {
 };
 
 type EmbedLinkView = CreateView;
-export const EmbedLinkView: FC<EmbedLinkView> = props => {
+export const EmbedLinkView = (props: EmbedLinkView) => {
     const { block, editor } = props;
     const [isSelect, setIsSelect] = useState(false);
 
diff --git a/libs/components/editor-blocks/src/blocks/figma/FigmaView.tsx b/libs/components/editor-blocks/src/blocks/figma/FigmaView.tsx
index 2d12315235..ad2bf5720a 100644
--- a/libs/components/editor-blocks/src/blocks/figma/FigmaView.tsx
+++ b/libs/components/editor-blocks/src/blocks/figma/FigmaView.tsx
@@ -16,7 +16,7 @@ const MESSAGES = {
 interface FigmaView extends CreateView {
     figmaUrl?: string;
 }
-export const FigmaView: FC<FigmaView> = ({ block, editor }) => {
+export const FigmaView = ({ block, editor }: FigmaView) => {
     const [figmaUrl, setFigmaUrl] = useState<string>(
         block.getProperty('embedLink')?.value
     );
diff --git a/libs/components/editor-blocks/src/blocks/file/FileView.tsx b/libs/components/editor-blocks/src/blocks/file/FileView.tsx
index 819bb5a5dc..32dfe08432 100644
--- a/libs/components/editor-blocks/src/blocks/file/FileView.tsx
+++ b/libs/components/editor-blocks/src/blocks/file/FileView.tsx
@@ -48,7 +48,7 @@ const FileViewContainer = styled('div')<{ isSelected: boolean }>(
         };
     }
 );
-export const FileView: FC<FileView> = ({ block, editor }) => {
+export const FileView = ({ block, editor }: FileView) => {
     const [fileUrl, setFileUrl] = useState<string>();
     const fileInfo = block.getProperty('file') || ({} as FileColumnValue);
     const file_id = fileInfo.value;
diff --git a/libs/components/editor-blocks/src/blocks/grid-item/GridItem.tsx b/libs/components/editor-blocks/src/blocks/grid-item/GridItem.tsx
index 4273e7c5d1..770d3792a4 100644
--- a/libs/components/editor-blocks/src/blocks/grid-item/GridItem.tsx
+++ b/libs/components/editor-blocks/src/blocks/grid-item/GridItem.tsx
@@ -7,7 +7,7 @@ import { GRID_PROPERTY_KEY, removePercent } from '../grid';
 export const GRID_ITEM_CLASS_NAME = 'grid-item';
 export const GRID_ITEM_CONTENT_CLASS_NAME = `${GRID_ITEM_CLASS_NAME}-content`;
 
-export const GridItem: FC<ChildrenView> = function (props) {
+export const GridItem = function (props: ChildrenView) {
     const { children, block, editor } = props;
     const RENDER_DELAY_TIME = 100;
     const ref = useRef<HTMLDivElement>();
diff --git a/libs/components/editor-blocks/src/blocks/grid-item/GridItemRender.tsx b/libs/components/editor-blocks/src/blocks/grid-item/GridItemRender.tsx
index ee7146879f..0d945b88ef 100644
--- a/libs/components/editor-blocks/src/blocks/grid-item/GridItemRender.tsx
+++ b/libs/components/editor-blocks/src/blocks/grid-item/GridItemRender.tsx
@@ -3,7 +3,7 @@ import { RenderBlock } from '@toeverything/components/editor-core';
 import { ChildrenView, CreateView } from '@toeverything/framework/virgo';
 
 export const GridItemRender = function (creator: FC<ChildrenView>) {
-    const GridItem: FC<CreateView> = function (props) {
+    const GridItem = function (props: CreateView) {
         const { block } = props;
         const children = (
             <>
diff --git a/libs/components/editor-blocks/src/blocks/grid/GirdHandle.tsx b/libs/components/editor-blocks/src/blocks/grid/GirdHandle.tsx
index 687cc28735..f87e1c8995 100644
--- a/libs/components/editor-blocks/src/blocks/grid/GirdHandle.tsx
+++ b/libs/components/editor-blocks/src/blocks/grid/GirdHandle.tsx
@@ -16,7 +16,7 @@ type GridHandleProps = {
     onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
 };
 
-export const GridHandle: FC<GridHandleProps> = function ({
+export const GridHandle = function ({
     blockId,
     editor,
     enabledAddItem,
@@ -25,7 +25,7 @@ export const GridHandle: FC<GridHandleProps> = function ({
     draggable,
     alertHandleId,
     onMouseEnter,
-}) {
+}: GridHandleProps) {
     const [isMouseDown, setIsMouseDown] = useState<boolean>(false);
     const handleMouseDown: React.MouseEventHandler<HTMLDivElement> = e => {
         if (draggable) {
diff --git a/libs/components/editor-blocks/src/blocks/grid/Grid.tsx b/libs/components/editor-blocks/src/blocks/grid/Grid.tsx
index ec06c1049f..79ab22d0ad 100644
--- a/libs/components/editor-blocks/src/blocks/grid/Grid.tsx
+++ b/libs/components/editor-blocks/src/blocks/grid/Grid.tsx
@@ -20,7 +20,7 @@ export function removePercent(str: string) {
     return str.replace('%', '');
 }
 
-export const Grid: FC<CreateView> = function (props) {
+export const Grid = function (props: CreateView) {
     const { block, editor } = props;
     const gridItemMinWidth = editor.configManager.grid.gridItemMinWidth;
     const [isOnDrag, setIsOnDrag] = useState<boolean>(false);
diff --git a/libs/components/editor-blocks/src/blocks/group/GroupView.tsx b/libs/components/editor-blocks/src/blocks/group/GroupView.tsx
index b990d1aa5a..9ab7dec7ca 100644
--- a/libs/components/editor-blocks/src/blocks/group/GroupView.tsx
+++ b/libs/components/editor-blocks/src/blocks/group/GroupView.tsx
@@ -78,7 +78,7 @@ const GroupContainer = styled('div')<{ isSelect?: boolean }>(
     })
 );
 
-export const GroupView: FC<CreateView> = props => {
+export const GroupView = (props: CreateView) => {
     const { block, editor } = props;
     const [currentView] = useCurrentView();
     const [groupIsSelect, setGroupIsSelect] = useState(false);
diff --git a/libs/components/editor-blocks/src/blocks/group/ScenePage.tsx b/libs/components/editor-blocks/src/blocks/group/ScenePage.tsx
index 2ff26ba55d..ba73bcd6b7 100644
--- a/libs/components/editor-blocks/src/blocks/group/ScenePage.tsx
+++ b/libs/components/editor-blocks/src/blocks/group/ScenePage.tsx
@@ -2,6 +2,6 @@ import { RenderBlockChildren } from '@toeverything/components/editor-core';
 import type { CreateView } from '@toeverything/framework/virgo';
 import { FC } from 'react';
 
-export const ScenePage: FC<CreateView> = ({ block }) => {
+export const ScenePage = ({ block }: CreateView) => {
     return <RenderBlockChildren block={block} />;
 };
diff --git a/libs/components/editor-blocks/src/blocks/group/SceneTable.tsx b/libs/components/editor-blocks/src/blocks/group/SceneTable.tsx
index 6b7a56cb54..f7a3422bcf 100644
--- a/libs/components/editor-blocks/src/blocks/group/SceneTable.tsx
+++ b/libs/components/editor-blocks/src/blocks/group/SceneTable.tsx
@@ -5,7 +5,7 @@ import type { CreateView } from '@toeverything/framework/virgo';
 import type { TableColumn, TableRow } from '../../components/table';
 import { Table, CustomCell } from '../../components/table';
 
-export const SceneTable: FC<CreateView> = ({ block, columns, editor }) => {
+export const SceneTable = ({ block, columns, editor }: CreateView) => {
     const [rows, set_rows] = useState<TableRow[]>([]);
     const data_columns = useMemo<TableColumn[]>(() => {
         return (columns || [])
diff --git a/libs/components/editor-blocks/src/blocks/groupDvider/groupDividerView.tsx b/libs/components/editor-blocks/src/blocks/groupDvider/groupDividerView.tsx
index c14d4bbf01..bb5d1f3c9c 100644
--- a/libs/components/editor-blocks/src/blocks/groupDvider/groupDividerView.tsx
+++ b/libs/components/editor-blocks/src/blocks/groupDvider/groupDividerView.tsx
@@ -1,6 +1,6 @@
 import { FC } from 'react';
 import { CreateView } from '@toeverything/framework/virgo';
 
-export const GroupDividerView: FC<CreateView> = ({ block, editor }) => {
+export const GroupDividerView = ({ block, editor }: CreateView) => {
     return <></>;
 };
diff --git a/libs/components/editor-blocks/src/blocks/image/ImageView.tsx b/libs/components/editor-blocks/src/blocks/image/ImageView.tsx
index 369dceac87..3a7eb0fbc7 100644
--- a/libs/components/editor-blocks/src/blocks/image/ImageView.tsx
+++ b/libs/components/editor-blocks/src/blocks/image/ImageView.tsx
@@ -54,7 +54,7 @@ const KanbanImageContainer = styled('div')<{ isSelected: boolean }>(
         };
     }
 );
-export const ImageView: FC<ImageView> = ({ block, editor }) => {
+export const ImageView = ({ block, editor }: ImageView) => {
     const workspace = editor.workspace;
     const [imgUrl, set_image_url] = useState<string>();
     const [imgWidth, setImgWidth] = useState<number>(0);
diff --git a/libs/components/editor-blocks/src/blocks/numbered/NumberedView.tsx b/libs/components/editor-blocks/src/blocks/numbered/NumberedView.tsx
index 2f8f29b706..80fd350776 100644
--- a/libs/components/editor-blocks/src/blocks/numbered/NumberedView.tsx
+++ b/libs/components/editor-blocks/src/blocks/numbered/NumberedView.tsx
@@ -40,7 +40,7 @@ const todoIsEmpty = (contentValue: ContentColumnValue): boolean => {
     );
 };
 
-export const NumberedView: FC<CreateView> = ({ block, editor }) => {
+export const NumberedView = ({ block, editor }: CreateView) => {
     // block.remove();
     const properties = { ...defaultTodoProps, ...block.getProperties() };
     const [number, set_number] = useState<number>(1);
diff --git a/libs/components/editor-blocks/src/blocks/page/PageView.tsx b/libs/components/editor-blocks/src/blocks/page/PageView.tsx
index 17ad6cae9c..64ea3c9536 100644
--- a/libs/components/editor-blocks/src/blocks/page/PageView.tsx
+++ b/libs/components/editor-blocks/src/blocks/page/PageView.tsx
@@ -15,7 +15,7 @@ import {
     type ExtendedTextUtils,
 } from '../../components/text-manage';
 
-export const PageView: FC<CreateView> = ({ block, editor }) => {
+export const PageView = ({ block, editor }: CreateView) => {
     const { workspace_id } = useParams();
     const textRef = useRef<ExtendedTextUtils>(null);
     const [backLinks, setBackLinks] =
diff --git a/libs/components/editor-blocks/src/blocks/ref-link/ref-link-view.tsx b/libs/components/editor-blocks/src/blocks/ref-link/ref-link-view.tsx
index 80e035775e..07d66175f8 100644
--- a/libs/components/editor-blocks/src/blocks/ref-link/ref-link-view.tsx
+++ b/libs/components/editor-blocks/src/blocks/ref-link/ref-link-view.tsx
@@ -5,7 +5,7 @@ import { CreateView } from '@toeverything/framework/virgo';
 
 type RefLinkView = CreateView;
 
-export const RefLinkView: FC<RefLinkView> = ({ block, editor }) => {
+export const RefLinkView = ({ block, editor }: RefLinkView) => {
     const page_id = useMemo(() => block.getProperty('reference'), [block]);
 
     const [block_content, set_block] =
diff --git a/libs/components/editor-blocks/src/blocks/text/TextView.tsx b/libs/components/editor-blocks/src/blocks/text/TextView.tsx
index 2f26e17c38..5f55e6d649 100644
--- a/libs/components/editor-blocks/src/blocks/text/TextView.tsx
+++ b/libs/components/editor-blocks/src/blocks/text/TextView.tsx
@@ -51,11 +51,11 @@ const TextBlock = styled(TextManage)<{ type: string }>(({ theme, type }) => {
     }
 });
 
-export const TextView: FC<CreateTextView> = ({
+export const TextView = ({
     block,
     editor,
     containerClassName,
-}) => {
+}: CreateTextView) => {
     const [isSelect, setIsSelect] = useState<boolean>();
     useOnSelect(block.id, (is_select: boolean) => {
         setIsSelect(is_select);
diff --git a/libs/components/editor-blocks/src/blocks/toc/toc-view.tsx b/libs/components/editor-blocks/src/blocks/toc/toc-view.tsx
index 6e16889b21..bc1b5397b4 100644
--- a/libs/components/editor-blocks/src/blocks/toc/toc-view.tsx
+++ b/libs/components/editor-blocks/src/blocks/toc/toc-view.tsx
@@ -11,7 +11,7 @@ const INITIAL_LIST: MenuItem[] = [];
 const MESSAGES = {
     NO_HEADINGS_FOUND: 'No headings found',
 };
-export const TocView: FC<CreateView> = ({ block, editor }) => {
+export const TocView = ({ block, editor }: CreateView) => {
     const [list, setList] = useState(INITIAL_LIST);
     useEffect(() => {
         const sync_toc = async () => {
diff --git a/libs/components/editor-blocks/src/blocks/todo/CheckBox.tsx b/libs/components/editor-blocks/src/blocks/todo/CheckBox.tsx
index 59d0d20fb8..67641c8bb5 100644
--- a/libs/components/editor-blocks/src/blocks/todo/CheckBox.tsx
+++ b/libs/components/editor-blocks/src/blocks/todo/CheckBox.tsx
@@ -8,12 +8,12 @@ interface CheckBoxProps {
     onChange: (checked: boolean) => void;
 }
 
-export const CheckBox: FC<CheckBoxProps> = ({
+export const CheckBox = ({
     size = 16,
     height = 23,
     checked,
     onChange,
-}) => {
+}: CheckBoxProps) => {
     const dynamic_style = useMemo(
         () => ({
             height: {
diff --git a/libs/components/editor-blocks/src/blocks/todo/TodoView.tsx b/libs/components/editor-blocks/src/blocks/todo/TodoView.tsx
index e5588d46f4..cf16857099 100644
--- a/libs/components/editor-blocks/src/blocks/todo/TodoView.tsx
+++ b/libs/components/editor-blocks/src/blocks/todo/TodoView.tsx
@@ -33,7 +33,7 @@ const todoIsEmpty = (contentValue: ContentColumnValue): boolean => {
     );
 };
 
-export const TodoView: FC<CreateView> = ({ block, editor }) => {
+export const TodoView = ({ block, editor }: CreateView) => {
     const properties = { ...defaultTodoProps, ...block.getProperties() };
     const text_ref = useRef<ExtendedTextUtils>(null);
 
diff --git a/libs/components/editor-blocks/src/blocks/youtube/YoutubeView.tsx b/libs/components/editor-blocks/src/blocks/youtube/YoutubeView.tsx
index d761e8e108..d5b385fbdf 100644
--- a/libs/components/editor-blocks/src/blocks/youtube/YoutubeView.tsx
+++ b/libs/components/editor-blocks/src/blocks/youtube/YoutubeView.tsx
@@ -10,7 +10,7 @@ const _messages = {
 };
 
 type YoutubeView = CreateView;
-export const YoutubeView: FC<YoutubeView> = ({ block }) => {
+export const YoutubeView = ({ block }: YoutubeView) => {
     const [youtubeUrl, setYoutubeUrl] = useState<string>(
         block.getProperty('embedLink')?.value
     );
diff --git a/libs/components/editor-blocks/src/components/BlockContainer/BlockContainer.tsx b/libs/components/editor-blocks/src/components/BlockContainer/BlockContainer.tsx
index dbe12277b6..603846a5a6 100644
--- a/libs/components/editor-blocks/src/components/BlockContainer/BlockContainer.tsx
+++ b/libs/components/editor-blocks/src/components/BlockContainer/BlockContainer.tsx
@@ -7,13 +7,13 @@ type BlockContainerProps = Parameters<typeof Container>[0] & {
     editor: BlockEditor;
 };
 
-export const BlockContainer: FC<BlockContainerProps> = function ({
+export const BlockContainer = function ({
     block,
     children,
     className,
     editor,
     ...restProps
-}) {
+}: BlockContainerProps) {
     return (
         <Container
             className={`${className || ''} block_container`}
diff --git a/libs/components/editor-blocks/src/components/ImageView/ImageView.tsx b/libs/components/editor-blocks/src/components/ImageView/ImageView.tsx
index 24ffac6f29..54acf2bdbe 100644
--- a/libs/components/editor-blocks/src/components/ImageView/ImageView.tsx
+++ b/libs/components/editor-blocks/src/components/ImageView/ImageView.tsx
@@ -33,7 +33,7 @@ const ImageContainer = styled('div')<{ isSelected: boolean }>(
         };
     }
 );
-export const Image: FC<Props> = props => {
+export const Image = (props: Props) => {
     const { link, viewStyle, isSelected, block } = props;
     const on_resize_end = (e: any, data: any) => {
         block.setProperty('image_style', data.size);
diff --git a/libs/components/editor-blocks/src/components/IndentWrapper/IndentWrapper.tsx b/libs/components/editor-blocks/src/components/IndentWrapper/IndentWrapper.tsx
index f342d28ba6..b8ff537d96 100644
--- a/libs/components/editor-blocks/src/components/IndentWrapper/IndentWrapper.tsx
+++ b/libs/components/editor-blocks/src/components/IndentWrapper/IndentWrapper.tsx
@@ -5,7 +5,7 @@ import { styled } from '@toeverything/components/ui';
 /**
  * Indent rendering child nodes
  */
-export const IndentWrapper: FC<PropsWithChildren> = props => {
+export const IndentWrapper = (props: PropsWithChildren) => {
     return <StyledIdentWrapper>{props.children}</StyledIdentWrapper>;
 };
 
diff --git a/libs/components/editor-blocks/src/components/editable/editable.tsx b/libs/components/editor-blocks/src/components/editable/editable.tsx
index 5354b08699..fbf80482f8 100644
--- a/libs/components/editor-blocks/src/components/editable/editable.tsx
+++ b/libs/components/editor-blocks/src/components/editable/editable.tsx
@@ -9,7 +9,7 @@ import { ErrorBoundary } from '@toeverything/utils';
 //     onChange: () => void;
 // }
 
-export const Editable: FC = () => {
+export const Editable = () => {
     const editor = useMemo(() => withReact(createEditor()), []);
     return (
         <ErrorBoundary
diff --git a/libs/components/editor-blocks/src/components/source-view/SourceView.tsx b/libs/components/editor-blocks/src/components/source-view/SourceView.tsx
index 4dbb488850..5a4488cf3f 100644
--- a/libs/components/editor-blocks/src/components/source-view/SourceView.tsx
+++ b/libs/components/editor-blocks/src/components/source-view/SourceView.tsx
@@ -156,7 +156,7 @@ const LoadingContiner = () => {
     return <Loading>loading...</Loading>;
 };
 
-export const SourceView: FC<Props> = props => {
+export const SourceView = (props: Props) => {
     const { link, isSelected, block, editorElement } = props;
     const src = formatUrl(link);
     // let iframeShow = useLazyIframe(src, 3000, iframeContainer);
diff --git a/libs/components/editor-blocks/src/components/table/basic-table.tsx b/libs/components/editor-blocks/src/components/table/basic-table.tsx
index 61373017ac..875e560514 100644
--- a/libs/components/editor-blocks/src/components/table/basic-table.tsx
+++ b/libs/components/editor-blocks/src/components/table/basic-table.tsx
@@ -64,8 +64,13 @@ export const DEFAULT_RENDER_CELL: CustomCell = ({ value }) => {
     return <span>{value ? String(value) : '--'}</span>;
 };
 
-const Cell: FC<GridChildComponentProps<TableData>> = memo(
-    ({ data, rowIndex, columnIndex, style }) => {
+const Cell = memo(
+    ({
+        data,
+        rowIndex,
+        columnIndex,
+        style,
+    }: GridChildComponentProps<TableData>) => {
         const column = data.columns[columnIndex];
         const row = data.rows[rowIndex];
         const is_first_column = columnIndex === 0;
@@ -89,18 +94,17 @@ const Cell: FC<GridChildComponentProps<TableData>> = memo(
                 />
             </div>
         );
-    },
-    areEqual
+    }
 );
 
-export const BasicTable: FC<BasicTableProps> = ({
+export const BasicTable = ({
     columns,
     rows,
     headerHeight = DEFAULT_ROW_HEIGHT,
     rowKey,
     border = true,
     renderCell = DEFAULT_RENDER_CELL,
-}) => {
+}: BasicTableProps) => {
     const container_ref = useRef<HTMLDivElement>();
     const [table_width, set_table_width] = useState(0);
 
diff --git a/libs/components/editor-blocks/src/components/table/custom-cell/check-box/index.tsx b/libs/components/editor-blocks/src/components/table/custom-cell/check-box/index.tsx
index 37361f78f1..423f0cc29c 100644
--- a/libs/components/editor-blocks/src/components/table/custom-cell/check-box/index.tsx
+++ b/libs/components/editor-blocks/src/components/table/custom-cell/check-box/index.tsx
@@ -6,10 +6,10 @@ import type { CellProps } from '../types';
 /**
  * @deprecated
  */
-export const CheckBoxCell: FC<CellProps<BooleanColumnValue>> = ({
+export const CheckBoxCell = ({
     value,
     onChange,
-}) => {
+}: CellProps<BooleanColumnValue>) => {
     return (
         <Checkbox
             checked={value?.value}
diff --git a/libs/components/editor-blocks/src/components/table/custom-cell/index.tsx b/libs/components/editor-blocks/src/components/table/custom-cell/index.tsx
index 1591dfa721..9669917564 100644
--- a/libs/components/editor-blocks/src/components/table/custom-cell/index.tsx
+++ b/libs/components/editor-blocks/src/components/table/custom-cell/index.tsx
@@ -9,7 +9,7 @@ import type { CellProps } from './types';
 /**
  * @deprecated
  */
-const DefaultCell: FC<CellProps> = ({ onChange, ...props }) => {
+const DefaultCell = ({ onChange, ...props }: CellProps) => {
     return <DEFAULT_RENDER_CELL {...props} />;
 };
 
@@ -33,7 +33,7 @@ interface CustomCellProps extends TableCustomCellProps<unknown> {
     onChange: (data: TableCustomCellProps<unknown>) => void;
 }
 
-export const CustomCell: FC<CustomCellProps> = props => {
+export const CustomCell = (props: CustomCellProps) => {
     const View =
         props.rowIndex === 0
             ? DefaultCell
diff --git a/libs/components/editor-blocks/src/components/table/custom-cell/select/index.tsx b/libs/components/editor-blocks/src/components/table/custom-cell/select/index.tsx
index e5175533e1..ed20999507 100644
--- a/libs/components/editor-blocks/src/components/table/custom-cell/select/index.tsx
+++ b/libs/components/editor-blocks/src/components/table/custom-cell/select/index.tsx
@@ -8,11 +8,11 @@ import type { CellProps } from '../types';
 /**
  * @deprecated
  */
-export const SelectCell: FC<CellProps<EnumColumnValue>> = ({
+export const SelectCell = ({
     value,
     column,
     onChange,
-}) => {
+}: CellProps<EnumColumnValue>) => {
     const options = useMemo(() => {
         if (isEnumColumn(column.columnConfig)) {
             return column.columnConfig.options.map(option => {
diff --git a/libs/components/editor-blocks/src/components/table/table.tsx b/libs/components/editor-blocks/src/components/table/table.tsx
index 1c65c63b52..73dd421081 100644
--- a/libs/components/editor-blocks/src/components/table/table.tsx
+++ b/libs/components/editor-blocks/src/components/table/table.tsx
@@ -6,7 +6,7 @@ interface TableProps extends BasicTableProps {
     addon?: ReactNode;
 }
 
-export const Table: FC<TableProps> = ({ addon, ...props }) => {
+export const Table = ({ addon, ...props }: TableProps) => {
     return (
         <div>
             {addon}
diff --git a/libs/components/editor-blocks/src/components/upload/upload.tsx b/libs/components/editor-blocks/src/components/upload/upload.tsx
index 02066bd2b8..279a74f2c9 100644
--- a/libs/components/editor-blocks/src/components/upload/upload.tsx
+++ b/libs/components/editor-blocks/src/components/upload/upload.tsx
@@ -71,7 +71,7 @@ const UploadBox = styled('div')<{ isSelected: boolean }>(
 );
 
 const button_styles: SxProps = { width: '60%', fontSize: '12px' };
-export const Upload: FC<Props> = props => {
+export const Upload = (props: Props) => {
     const {
         fileChange,
         size,
diff --git a/libs/components/editor-core/src/RenderRoot.tsx b/libs/components/editor-core/src/RenderRoot.tsx
index caa840cb39..8930160084 100644
--- a/libs/components/editor-core/src/RenderRoot.tsx
+++ b/libs/components/editor-core/src/RenderRoot.tsx
@@ -24,11 +24,11 @@ interface RenderRootProps {
 const MAX_PAGE_WIDTH = 5000;
 export const MIN_PAGE_WIDTH = 1480;
 
-export const RenderRoot: FC<PropsWithChildren<RenderRootProps>> = ({
+export const RenderRoot = ({
     editor,
     editorElement,
     children,
-}) => {
+}: PropsWithChildren<RenderRootProps>) => {
     const selectionRef = useRef<SelectionRef>(null);
     const triggeredBySelect = useRef(false);
     const [pageWidth, setPageWidth] = useState<number>(MIN_PAGE_WIDTH);
diff --git a/libs/components/editor-core/src/block-pendant/BlockPendantProvider.tsx b/libs/components/editor-core/src/block-pendant/BlockPendantProvider.tsx
index 70c56af04c..d9dcdd57cc 100644
--- a/libs/components/editor-core/src/block-pendant/BlockPendantProvider.tsx
+++ b/libs/components/editor-core/src/block-pendant/BlockPendantProvider.tsx
@@ -12,10 +12,10 @@ interface BlockTagProps {
     block: AsyncBlock;
 }
 
-export const BlockPendantProvider: FC<PropsWithChildren<BlockTagProps>> = ({
+export const BlockPendantProvider = ({
     block,
     children,
-}) => {
+}: PropsWithChildren<BlockTagProps>) => {
     const triggerRef = useRef<HTMLDivElement>();
     const { getProperties } = useRecastBlockMeta();
     const properties = getProperties();
diff --git a/libs/components/editor-core/src/block-pendant/pendant-popover/PendantPopover.tsx b/libs/components/editor-core/src/block-pendant/pendant-popover/PendantPopover.tsx
index 9ec79d03e0..d92a2ab8b4 100644
--- a/libs/components/editor-core/src/block-pendant/pendant-popover/PendantPopover.tsx
+++ b/libs/components/editor-core/src/block-pendant/pendant-popover/PendantPopover.tsx
@@ -8,11 +8,11 @@ import {
 } from '@toeverything/components/ui';
 import { AddPendantPopover } from '../AddPendantPopover';
 
-export const PendantPopover: FC<
-    {
+export const PendantPopover = (
+    props: {
         block: AsyncBlock;
     } & Omit<PopperProps, 'content'>
-> = props => {
+) => {
     const { block, ...popoverProps } = props;
     const popoverHandlerRef = useRef<PopperHandler>();
     return (
diff --git a/libs/components/editor-core/src/render-block/RenderBlock.tsx b/libs/components/editor-core/src/render-block/RenderBlock.tsx
index 74f6c659cf..426b270533 100644
--- a/libs/components/editor-core/src/render-block/RenderBlock.tsx
+++ b/libs/components/editor-core/src/render-block/RenderBlock.tsx
@@ -10,10 +10,10 @@ interface RenderBlockProps {
     hasContainer?: boolean;
 }
 
-export const RenderBlock: FC<RenderBlockProps> = ({
+export const RenderBlock = ({
     blockId,
     hasContainer = true,
-}) => {
+}: RenderBlockProps) => {
     const { editor, editorElement } = useEditor();
     const { block } = useBlock(blockId);
     const blockRef = useRef<HTMLDivElement>(null);
diff --git a/libs/components/editor-core/src/render-block/RenderBlockChildren.tsx b/libs/components/editor-core/src/render-block/RenderBlockChildren.tsx
index 23391057f2..96dc07676a 100644
--- a/libs/components/editor-core/src/render-block/RenderBlockChildren.tsx
+++ b/libs/components/editor-core/src/render-block/RenderBlockChildren.tsx
@@ -6,7 +6,7 @@ interface RenderChildrenProps {
     block: AsyncBlock;
 }
 
-export const RenderBlockChildren: FC<RenderChildrenProps> = ({ block }) => {
+export const RenderBlockChildren = ({ block }: RenderChildrenProps) => {
     return block.childrenIds.length ? (
         <>
             {block.childrenIds.map(childId => {
diff --git a/libs/components/editor-plugins/src/menu/left-menu/LeftMenuDraggable.tsx b/libs/components/editor-plugins/src/menu/left-menu/LeftMenuDraggable.tsx
index 750490650c..f07380e0b9 100644
--- a/libs/components/editor-plugins/src/menu/left-menu/LeftMenuDraggable.tsx
+++ b/libs/components/editor-plugins/src/menu/left-menu/LeftMenuDraggable.tsx
@@ -128,7 +128,7 @@ function DragComponent(props: {
     );
 }
 
-export const LeftMenuDraggable: FC<LeftMenuProps> = props => {
+export const LeftMenuDraggable = (props: LeftMenuProps) => {
     const { editor, blockInfo, defaultVisible, lineInfo } = props;
     const [visible, setVisible] = useState(defaultVisible);
     const [anchorEl, setAnchorEl] = useState<Element>();
diff --git a/libs/components/layout/src/header/EditorBoardSwitcher/StatusTrack.tsx b/libs/components/layout/src/header/EditorBoardSwitcher/StatusTrack.tsx
index 839c429daa..c4c0503ddf 100644
--- a/libs/components/layout/src/header/EditorBoardSwitcher/StatusTrack.tsx
+++ b/libs/components/layout/src/header/EditorBoardSwitcher/StatusTrack.tsx
@@ -8,7 +8,7 @@ interface StatusTrackProps {
     onClick: () => void;
 }
 
-export const StatusTrack: FC<StatusTrackProps> = ({ mode, onClick }) => {
+export const StatusTrack = ({ mode, onClick }: StatusTrackProps) => {
     return (
         <Container onClick={onClick}>
             <StatusIcon mode={mode} />
diff --git a/libs/components/layout/src/settings-sidebar/Settings/footer/Footer.tsx b/libs/components/layout/src/settings-sidebar/Settings/footer/Footer.tsx
index 712fe2a599..ab2a976624 100644
--- a/libs/components/layout/src/settings-sidebar/Settings/footer/Footer.tsx
+++ b/libs/components/layout/src/settings-sidebar/Settings/footer/Footer.tsx
@@ -3,7 +3,7 @@ import { styled } from '@toeverything/components/ui';
 import { LastModified } from './LastModified';
 import { Logout } from './Logout';
 
-export const Footer: FC = () => {
+export const Footer = () => {
     return (
         <Container>
             <LastModified />
diff --git a/libs/components/layout/src/settings-sidebar/Settings/footer/LastModified.tsx b/libs/components/layout/src/settings-sidebar/Settings/footer/LastModified.tsx
index 3bac52c47d..e7e937a90f 100644
--- a/libs/components/layout/src/settings-sidebar/Settings/footer/LastModified.tsx
+++ b/libs/components/layout/src/settings-sidebar/Settings/footer/LastModified.tsx
@@ -4,7 +4,7 @@ import { Typography, styled } from '@toeverything/components/ui';
 import { useUserAndSpaces } from '@toeverything/datasource/state';
 import { usePageLastUpdated, useWorkspaceAndPageId } from '../util';
 
-export const LastModified: FC = () => {
+export const LastModified = () => {
     const { user } = useUserAndSpaces();
     const username = user ? user.nickname : 'Anonymous';
     const { workspaceId, pageId } = useWorkspaceAndPageId();
diff --git a/libs/components/layout/src/settings-sidebar/Settings/footer/Logout.tsx b/libs/components/layout/src/settings-sidebar/Settings/footer/Logout.tsx
index 361ad8475c..0acd0b3e6a 100644
--- a/libs/components/layout/src/settings-sidebar/Settings/footer/Logout.tsx
+++ b/libs/components/layout/src/settings-sidebar/Settings/footer/Logout.tsx
@@ -21,7 +21,7 @@ const logout = () => {
     window.location.href = '/';
 };
 
-export const Logout: FC = () => {
+export const Logout = () => {
     return (
         <ListItem onClick={logout}>
             <StyledIcon />
diff --git a/libs/components/ui/src/button/IconButton.tsx b/libs/components/ui/src/button/IconButton.tsx
index 77e1f08a6e..ab66b36cfc 100644
--- a/libs/components/ui/src/button/IconButton.tsx
+++ b/libs/components/ui/src/button/IconButton.tsx
@@ -39,13 +39,13 @@ interface IconButtonProps {
     hoverColor?: string;
 }
 
-export const IconButton: FC<PropsWithChildren<IconButtonProps>> = ({
+export const IconButton = ({
     children,
     disabled,
     onClick,
     className,
     ...props
-}) => {
+}: PropsWithChildren<IconButtonProps>) => {
     return (
         <Container
             {...props}
diff --git a/libs/components/ui/src/divider/Divider.tsx b/libs/components/ui/src/divider/Divider.tsx
index 62b74c4eb3..f25834bd14 100644
--- a/libs/components/ui/src/divider/Divider.tsx
+++ b/libs/components/ui/src/divider/Divider.tsx
@@ -20,11 +20,11 @@ const _textAlignMap: Record<
     end: 'right',
 };
 
-export const Divider: FC<DividerProps> = ({
+export const Divider = ({
     orientation = 'horizontal',
     textAlign = 'center',
     children,
-}) => {
+}: DividerProps) => {
     return (
         <StyledMuiDivider
             orientation={orientation}
diff --git a/libs/components/ui/src/list/ListItem.tsx b/libs/components/ui/src/list/ListItem.tsx
index 2aa0dbae99..9b002db372 100644
--- a/libs/components/ui/src/list/ListItem.tsx
+++ b/libs/components/ui/src/list/ListItem.tsx
@@ -9,13 +9,13 @@ interface ListItemProps {
     style?: CSSProperties;
 }
 
-export const ListItem: FC<PropsWithChildren<ListItemProps>> = ({
+export const ListItem = ({
     active,
     children,
     onClick,
     className,
     style,
-}) => {
+}: PropsWithChildren<ListItemProps>) => {
     return (
         <Container
             active={active}
diff --git a/libs/components/ui/src/select/OldSelect.tsx b/libs/components/ui/src/select/OldSelect.tsx
index 79b486ef5e..d10989a1ad 100644
--- a/libs/components/ui/src/select/OldSelect.tsx
+++ b/libs/components/ui/src/select/OldSelect.tsx
@@ -17,12 +17,7 @@ interface Props {
     extraStyle?: CSSProperties;
 }
 
-export const OldSelect: FC<Props> = ({
-    value,
-    options,
-    onChange,
-    extraStyle,
-}: Props) => {
+export const OldSelect = ({ value, options, onChange, extraStyle }: Props) => {
     const onSelectChange = useCallback(
         (e: ChangeEvent<HTMLSelectElement>) => {
             onChange(e.target.value);
diff --git a/libs/components/ui/src/slider/Slider.tsx b/libs/components/ui/src/slider/Slider.tsx
index b9cb98bb89..2e22114e77 100644
--- a/libs/components/ui/src/slider/Slider.tsx
+++ b/libs/components/ui/src/slider/Slider.tsx
@@ -14,7 +14,7 @@ interface SliderProps {
     onChange?: SliderUnstyledProps['onChange'];
 }
 
-export const Slider: FC<SliderProps> = props => {
+export const Slider = (props: SliderProps) => {
     return <StyledSlider {...props} />;
 };
 
diff --git a/libs/components/ui/src/tag/Tag.tsx b/libs/components/ui/src/tag/Tag.tsx
index 7ef614e815..70ffc2aa7c 100644
--- a/libs/components/ui/src/tag/Tag.tsx
+++ b/libs/components/ui/src/tag/Tag.tsx
@@ -19,7 +19,7 @@ export interface TagProps {
     endElement?: ReactNode;
 }
 
-export const Tag: FC<PropsWithChildren<TagProps>> = ({
+export const Tag = ({
     onClick,
     style,
     children,
@@ -27,7 +27,7 @@ export const Tag: FC<PropsWithChildren<TagProps>> = ({
     onClose,
     startElement,
     endElement,
-}) => {
+}: PropsWithChildren<TagProps>) => {
     return (
         <StyledTag
             className={`affine-tag ${closeable ? 'affine-tag--closeable' : ''}`}
diff --git a/libs/components/ui/src/theme/utils.tsx b/libs/components/ui/src/theme/utils.tsx
index 35d6148e58..5bccadf10b 100644
--- a/libs/components/ui/src/theme/utils.tsx
+++ b/libs/components/ui/src/theme/utils.tsx
@@ -23,7 +23,7 @@ const theme = createTheme({
     affine: Theme,
 });
 
-export const ThemeProvider: FC<{ children?: ReactNode }> = ({ children }) => {
+export const ThemeProvider = ({ children }: { children?: ReactNode }) => {
     return <MuiThemeProvider theme={theme}>{children}</MuiThemeProvider>;
 };
 

From d3b4906da91da50627a0cf3e5bf5665ff6c2cd61 Mon Sep 17 00:00:00 2001
From: DarkSky <darksky2048@gmail.com>
Date: Fri, 12 Aug 2022 01:42:17 +0800
Subject: [PATCH 5/5] chore: reduce code for icons

---
 .../icons/src/auto-icons/add-view/add-view.tsx           | 7 ++-----
 libs/components/icons/src/auto-icons/add/add.tsx         | 7 ++-----
 .../icons/src/auto-icons/align-center/align-center.tsx   | 7 ++-----
 .../icons/src/auto-icons/align-justify/align-justify.tsx | 7 ++-----
 .../icons/src/auto-icons/align-left/align-left.tsx       | 7 ++-----
 .../icons/src/auto-icons/align-right/align-right.tsx     | 7 ++-----
 .../icons/src/auto-icons/arrow-big/arrow-big.tsx         | 7 ++-----
 .../src/auto-icons/arrow-drop-down/arrow-drop-down.tsx   | 7 ++-----
 .../icons/src/auto-icons/arrow-right/arrow-right.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/arrow/arrow.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/at/at.tsx           | 7 ++-----
 .../icons/src/auto-icons/backlinks/backlinks.tsx         | 7 ++-----
 .../icons/src/auto-icons/backward-undo/backward-undo.tsx | 7 ++-----
 libs/components/icons/src/auto-icons/blocks/blocks.tsx   | 7 ++-----
 .../icons/src/auto-icons/board-view/board-view.tsx       | 7 ++-----
 .../border-color-duotone/border-color-duotone.tsx        | 7 ++-----
 .../auto-icons/border-color-none/border-color-none.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/brush/brush.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/bullet/bullet.tsx   | 7 ++-----
 .../src/auto-icons/bulleted-list-1/bulleted-list-1.tsx   | 7 ++-----
 .../src/auto-icons/bulleted-list-2/bulleted-list-2.tsx   | 7 ++-----
 .../src/auto-icons/bulleted-list-3/bulleted-list-3.tsx   | 7 ++-----
 .../src/auto-icons/bulleted-list-4/bulleted-list-4.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/callout/callout.tsx | 7 ++-----
 libs/components/icons/src/auto-icons/card/card.tsx       | 7 ++-----
 .../src/auto-icons/check-box-check/check-box-check.tsx   | 7 ++-----
 .../auto-icons/check-box-uncheck/check-box-uncheck.tsx   | 7 ++-----
 .../icons/src/auto-icons/code-block/code-block.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/code/code.tsx       | 7 ++-----
 .../icons/src/auto-icons/collaborator/collaborator.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/comment/comment.tsx | 7 ++-----
 .../src/auto-icons/conector-arrow/conector-arrow.svg     | 2 +-
 .../src/auto-icons/conector-arrow/conector-arrow.tsx     | 9 +++------
 .../icons/src/auto-icons/conector-line/conector-line.tsx | 7 ++-----
 .../icons/src/auto-icons/connector/connector.tsx         | 7 ++-----
 .../icons/src/auto-icons/dash-line/dash-line.tsx         | 7 ++-----
 libs/components/icons/src/auto-icons/date/date.tsx       | 7 ++-----
 .../src/auto-icons/delete-cash-bin/delete-cash-bin.tsx   | 7 ++-----
 .../src/auto-icons/delete-small-tag/delete-small-tag.tsx | 7 ++-----
 libs/components/icons/src/auto-icons/divider/divider.tsx | 7 ++-----
 .../icons/src/auto-icons/doc-view/doc-view.tsx           | 7 ++-----
 libs/components/icons/src/auto-icons/done/done.tsx       | 7 ++-----
 .../icons/src/auto-icons/duplicate/duplicate.tsx         | 7 ++-----
 libs/components/icons/src/auto-icons/edit/edit.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/ellipse/ellipse.tsx | 7 ++-----
 libs/components/icons/src/auto-icons/email/email.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/embed/embed.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/eraser/eraser.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/figma/figma.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/file/file.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/filter/filter.tsx   | 7 ++-----
 .../auto-icons/format-background/format-background.tsx   | 7 ++-----
 .../format-bold-emphasis/format-bold-emphasis.tsx        | 7 ++-----
 .../icons/src/auto-icons/format-clear/format-clear.tsx   | 7 ++-----
 .../auto-icons/format-color-text/format-color-text.tsx   | 7 ++-----
 .../icons/src/auto-icons/format-italic/format-italic.tsx | 7 ++-----
 .../format-strikethrough/format-strikethrough.tsx        | 7 ++-----
 .../icons/src/auto-icons/forward-redo/forward-redo.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/frame/frame.tsx     | 7 ++-----
 .../icons/src/auto-icons/full-screen/full-screen.tsx     | 7 ++-----
 .../icons/src/auto-icons/group-by/group-by.tsx           | 7 ++-----
 libs/components/icons/src/auto-icons/group/group.tsx     | 7 ++-----
 .../icons/src/auto-icons/hand-tool/hand-tool.tsx         | 7 ++-----
 .../icons/src/auto-icons/handle-child/handle-child.tsx   | 7 ++-----
 .../icons/src/auto-icons/handle-parent/handle-parent.tsx | 7 ++-----
 .../icons/src/auto-icons/heading-one/heading-one.tsx     | 7 ++-----
 .../icons/src/auto-icons/heading-three/heading-three.tsx | 7 ++-----
 .../icons/src/auto-icons/heading-two/heading-two.tsx     | 7 ++-----
 .../icons/src/auto-icons/help-center/help-center.tsx     | 7 ++-----
 .../highlighter-duotone/highlighter-duotone.tsx          | 7 ++-----
 .../icons/src/auto-icons/hover-frame/hover-frame.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/image/image.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/index.ts            | 2 +-
 .../icons/src/auto-icons/information/information.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/kan-ban/kan-ban.tsx | 7 ++-----
 .../auto-icons/laser-pen-duotone/laser-pen-duotone.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/layout/layout.tsx   | 7 ++-----
 .../icons/src/auto-icons/line-none/line-none.tsx         | 7 ++-----
 libs/components/icons/src/auto-icons/link/link.tsx       | 7 ++-----
 .../icons/src/auto-icons/location/location.tsx           | 7 ++-----
 libs/components/icons/src/auto-icons/lock/lock.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/log-out/log-out.tsx | 7 ++-----
 libs/components/icons/src/auto-icons/logo/logo.tsx       | 7 ++-----
 .../more-tags-an-subblocks/more-tags-an-subblocks.tsx    | 7 ++-----
 libs/components/icons/src/auto-icons/more/more.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/move-to/move-to.tsx | 7 ++-----
 .../icons/src/auto-icons/multi-select/multi-select.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/number/number.tsx   | 7 ++-----
 .../icons/src/auto-icons/page-duallink/page-duallink.tsx | 7 ++-----
 .../auto-icons/page-in-page-tree/page-in-page-tree.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/pages/pages.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/pen/pen.tsx         | 7 ++-----
 .../src/auto-icons/pencil-duotone/pencil-duotone.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/phone/phone.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/pin/pin.tsx         | 7 ++-----
 .../icons/src/auto-icons/point-line/point-line.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/polygon/polygon.tsx | 7 ++-----
 libs/components/icons/src/auto-icons/quote/quote.tsx     | 7 ++-----
 .../icons/src/auto-icons/reaction/reaction.tsx           | 7 ++-----
 .../icons/src/auto-icons/rectangle-93/rectangle-93.tsx   | 7 ++-----
 .../icons/src/auto-icons/rectangle/rectangle.tsx         | 7 ++-----
 libs/components/icons/src/auto-icons/search/search.tsx   | 7 ++-----
 .../auto-icons/select-box-select/select-box-select.tsx   | 7 ++-----
 .../select-box-unselect/select-box-unselect.tsx          | 7 ++-----
 libs/components/icons/src/auto-icons/select/select.tsx   | 7 ++-----
 .../icons/src/auto-icons/settings/settings.tsx           | 7 ++-----
 .../shape-color-duotone/shape-color-duotone.tsx          | 7 ++-----
 .../src/auto-icons/shape-color-none/shape-color-none.tsx | 7 ++-----
 libs/components/icons/src/auto-icons/shape/shape.tsx     | 7 ++-----
 .../side-bar-view-close/side-bar-view-close.tsx          | 7 ++-----
 .../icons/src/auto-icons/side-bar-view/side-bar-view.tsx | 7 ++-----
 .../icons/src/auto-icons/single-select/single-select.tsx | 7 ++-----
 .../icons/src/auto-icons/solid-line/solid-line.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/sort/sort.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/sql/sql.tsx         | 7 ++-----
 libs/components/icons/src/auto-icons/stamp/stamp.tsx     | 7 ++-----
 libs/components/icons/src/auto-icons/star/star.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/status/status.tsx   | 7 ++-----
 .../auto-icons/switch-off-duotone/switch-off-duotone.tsx | 7 ++-----
 .../auto-icons/switch-on-duotone/switch-on-duotone.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/table/table.tsx     | 7 ++-----
 .../src/auto-icons/tag-add-duotone/tag-add-duotone.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/tags/tags.tsx       | 7 ++-----
 .../icons/src/auto-icons/text-font/text-font.tsx         | 7 ++-----
 libs/components/icons/src/auto-icons/text/text.tsx       | 7 ++-----
 libs/components/icons/src/auto-icons/to-do/to-do.tsx     | 7 ++-----
 .../icons/src/auto-icons/todo-list/todo-list.tsx         | 7 ++-----
 .../icons/src/auto-icons/triangle/triangle.tsx           | 7 ++-----
 .../icons/src/auto-icons/turn-into/turn-into.tsx         | 7 ++-----
 libs/components/icons/src/auto-icons/ungroup/ungroup.tsx | 7 ++-----
 libs/components/icons/src/auto-icons/unlock/unlock.tsx   | 7 ++-----
 libs/components/icons/src/auto-icons/web-app/web-app.tsx | 7 ++-----
 libs/components/icons/src/auto-icons/youtube/youtube.tsx | 7 ++-----
 tools/executors/figmaRes/figma/generateReactIcon.js      | 9 +++------
 tools/executors/svgOptimize/svgo.js                      | 4 ----
 135 files changed, 268 insertions(+), 668 deletions(-)

diff --git a/libs/components/icons/src/auto-icons/add-view/add-view.tsx b/libs/components/icons/src/auto-icons/add-view/add-view.tsx
index 17d4395708..268eaf8e63 100644
--- a/libs/components/icons/src/auto-icons/add-view/add-view.tsx
+++ b/libs/components/icons/src/auto-icons/add-view/add-view.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface AddViewIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const AddViewIcon: FC<AddViewIconProps> = ({ color, style, ...props}) => {
+export const AddViewIcon = ({ color, style, ...props}: AddViewIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/add/add.tsx b/libs/components/icons/src/auto-icons/add/add.tsx
index 59e6fc0721..016f9fb9b6 100644
--- a/libs/components/icons/src/auto-icons/add/add.tsx
+++ b/libs/components/icons/src/auto-icons/add/add.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface AddIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const AddIcon: FC<AddIconProps> = ({ color, style, ...props}) => {
+export const AddIcon = ({ color, style, ...props}: AddIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/align-center/align-center.tsx b/libs/components/icons/src/auto-icons/align-center/align-center.tsx
index 1a87ccc297..71bcaac6e2 100644
--- a/libs/components/icons/src/auto-icons/align-center/align-center.tsx
+++ b/libs/components/icons/src/auto-icons/align-center/align-center.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface AlignCenterIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const AlignCenterIcon: FC<AlignCenterIconProps> = ({ color, style, ...props}) => {
+export const AlignCenterIcon = ({ color, style, ...props}: AlignCenterIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/align-justify/align-justify.tsx b/libs/components/icons/src/auto-icons/align-justify/align-justify.tsx
index 50a97b9f31..86dfcc43e8 100644
--- a/libs/components/icons/src/auto-icons/align-justify/align-justify.tsx
+++ b/libs/components/icons/src/auto-icons/align-justify/align-justify.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface AlignJustifyIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const AlignJustifyIcon: FC<AlignJustifyIconProps> = ({ color, style, ...props}) => {
+export const AlignJustifyIcon = ({ color, style, ...props}: AlignJustifyIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/align-left/align-left.tsx b/libs/components/icons/src/auto-icons/align-left/align-left.tsx
index d00f9c9eec..d697280cac 100644
--- a/libs/components/icons/src/auto-icons/align-left/align-left.tsx
+++ b/libs/components/icons/src/auto-icons/align-left/align-left.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface AlignLeftIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const AlignLeftIcon: FC<AlignLeftIconProps> = ({ color, style, ...props}) => {
+export const AlignLeftIcon = ({ color, style, ...props}: AlignLeftIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/align-right/align-right.tsx b/libs/components/icons/src/auto-icons/align-right/align-right.tsx
index b4674bf939..759688c4ec 100644
--- a/libs/components/icons/src/auto-icons/align-right/align-right.tsx
+++ b/libs/components/icons/src/auto-icons/align-right/align-right.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface AlignRightIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const AlignRightIcon: FC<AlignRightIconProps> = ({ color, style, ...props}) => {
+export const AlignRightIcon = ({ color, style, ...props}: AlignRightIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/arrow-big/arrow-big.tsx b/libs/components/icons/src/auto-icons/arrow-big/arrow-big.tsx
index 2ab1222fd8..439eca1b3c 100644
--- a/libs/components/icons/src/auto-icons/arrow-big/arrow-big.tsx
+++ b/libs/components/icons/src/auto-icons/arrow-big/arrow-big.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ArrowBigIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ArrowBigIcon: FC<ArrowBigIconProps> = ({ color, style, ...props}) => {
+export const ArrowBigIcon = ({ color, style, ...props}: ArrowBigIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/arrow-drop-down/arrow-drop-down.tsx b/libs/components/icons/src/auto-icons/arrow-drop-down/arrow-drop-down.tsx
index 94d8e9b845..27c7dd003e 100644
--- a/libs/components/icons/src/auto-icons/arrow-drop-down/arrow-drop-down.tsx
+++ b/libs/components/icons/src/auto-icons/arrow-drop-down/arrow-drop-down.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ArrowDropDownIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ArrowDropDownIcon: FC<ArrowDropDownIconProps> = ({ color, style, ...props}) => {
+export const ArrowDropDownIcon = ({ color, style, ...props}: ArrowDropDownIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/arrow-right/arrow-right.tsx b/libs/components/icons/src/auto-icons/arrow-right/arrow-right.tsx
index 284a7fec9c..bbe7057e0a 100644
--- a/libs/components/icons/src/auto-icons/arrow-right/arrow-right.tsx
+++ b/libs/components/icons/src/auto-icons/arrow-right/arrow-right.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ArrowRightIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ArrowRightIcon: FC<ArrowRightIconProps> = ({ color, style, ...props}) => {
+export const ArrowRightIcon = ({ color, style, ...props}: ArrowRightIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/arrow/arrow.tsx b/libs/components/icons/src/auto-icons/arrow/arrow.tsx
index 0446fee915..f8519c54a5 100644
--- a/libs/components/icons/src/auto-icons/arrow/arrow.tsx
+++ b/libs/components/icons/src/auto-icons/arrow/arrow.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ArrowIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ArrowIcon: FC<ArrowIconProps> = ({ color, style, ...props}) => {
+export const ArrowIcon = ({ color, style, ...props}: ArrowIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/at/at.tsx b/libs/components/icons/src/auto-icons/at/at.tsx
index 2eef208e8d..212686d726 100644
--- a/libs/components/icons/src/auto-icons/at/at.tsx
+++ b/libs/components/icons/src/auto-icons/at/at.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface AtIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const AtIcon: FC<AtIconProps> = ({ color, style, ...props}) => {
+export const AtIcon = ({ color, style, ...props}: AtIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/backlinks/backlinks.tsx b/libs/components/icons/src/auto-icons/backlinks/backlinks.tsx
index 4ba3cc7c97..fbfd454bce 100644
--- a/libs/components/icons/src/auto-icons/backlinks/backlinks.tsx
+++ b/libs/components/icons/src/auto-icons/backlinks/backlinks.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BacklinksIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BacklinksIcon: FC<BacklinksIconProps> = ({ color, style, ...props}) => {
+export const BacklinksIcon = ({ color, style, ...props}: BacklinksIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/backward-undo/backward-undo.tsx b/libs/components/icons/src/auto-icons/backward-undo/backward-undo.tsx
index 58d8daa112..4d099e4279 100644
--- a/libs/components/icons/src/auto-icons/backward-undo/backward-undo.tsx
+++ b/libs/components/icons/src/auto-icons/backward-undo/backward-undo.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BackwardUndoIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BackwardUndoIcon: FC<BackwardUndoIconProps> = ({ color, style, ...props}) => {
+export const BackwardUndoIcon = ({ color, style, ...props}: BackwardUndoIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/blocks/blocks.tsx b/libs/components/icons/src/auto-icons/blocks/blocks.tsx
index f175a64e6a..e454b05b27 100644
--- a/libs/components/icons/src/auto-icons/blocks/blocks.tsx
+++ b/libs/components/icons/src/auto-icons/blocks/blocks.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BlocksIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BlocksIcon: FC<BlocksIconProps> = ({ color, style, ...props}) => {
+export const BlocksIcon = ({ color, style, ...props}: BlocksIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/board-view/board-view.tsx b/libs/components/icons/src/auto-icons/board-view/board-view.tsx
index 372feee005..98753e90e7 100644
--- a/libs/components/icons/src/auto-icons/board-view/board-view.tsx
+++ b/libs/components/icons/src/auto-icons/board-view/board-view.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BoardViewIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BoardViewIcon: FC<BoardViewIconProps> = ({ color, style, ...props}) => {
+export const BoardViewIcon = ({ color, style, ...props}: BoardViewIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/border-color-duotone/border-color-duotone.tsx b/libs/components/icons/src/auto-icons/border-color-duotone/border-color-duotone.tsx
index fb97c5379e..4c79d4e65c 100644
--- a/libs/components/icons/src/auto-icons/border-color-duotone/border-color-duotone.tsx
+++ b/libs/components/icons/src/auto-icons/border-color-duotone/border-color-duotone.tsx
@@ -1,16 +1,13 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BorderColorDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     color0?: string
     primaryColor?: string
 }
 
-export const BorderColorDuotoneIcon: FC<BorderColorDuotoneIconProps> = ({ color0, primaryColor, style, ...props}) => {
+export const BorderColorDuotoneIcon = ({ color0, primaryColor, style, ...props}: BorderColorDuotoneIconProps) => {
     const propsStyles = {"--color-0": color0 || primaryColor};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/border-color-none/border-color-none.tsx b/libs/components/icons/src/auto-icons/border-color-none/border-color-none.tsx
index 105b3754ee..9602fed80b 100644
--- a/libs/components/icons/src/auto-icons/border-color-none/border-color-none.tsx
+++ b/libs/components/icons/src/auto-icons/border-color-none/border-color-none.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BorderColorNoneIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BorderColorNoneIcon: FC<BorderColorNoneIconProps> = ({ color, style, ...props}) => {
+export const BorderColorNoneIcon = ({ color, style, ...props}: BorderColorNoneIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/brush/brush.tsx b/libs/components/icons/src/auto-icons/brush/brush.tsx
index 716b9e74b3..8164d8edcb 100644
--- a/libs/components/icons/src/auto-icons/brush/brush.tsx
+++ b/libs/components/icons/src/auto-icons/brush/brush.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BrushIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BrushIcon: FC<BrushIconProps> = ({ color, style, ...props}) => {
+export const BrushIcon = ({ color, style, ...props}: BrushIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/bullet/bullet.tsx b/libs/components/icons/src/auto-icons/bullet/bullet.tsx
index 126e1321eb..a07f6e2841 100644
--- a/libs/components/icons/src/auto-icons/bullet/bullet.tsx
+++ b/libs/components/icons/src/auto-icons/bullet/bullet.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BulletIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BulletIcon: FC<BulletIconProps> = ({ color, style, ...props}) => {
+export const BulletIcon = ({ color, style, ...props}: BulletIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/bulleted-list-1/bulleted-list-1.tsx b/libs/components/icons/src/auto-icons/bulleted-list-1/bulleted-list-1.tsx
index 59dddc056e..1acb76f304 100644
--- a/libs/components/icons/src/auto-icons/bulleted-list-1/bulleted-list-1.tsx
+++ b/libs/components/icons/src/auto-icons/bulleted-list-1/bulleted-list-1.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BulletedList_1IconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BulletedList_1Icon: FC<BulletedList_1IconProps> = ({ color, style, ...props}) => {
+export const BulletedList_1Icon = ({ color, style, ...props}: BulletedList_1IconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/bulleted-list-2/bulleted-list-2.tsx b/libs/components/icons/src/auto-icons/bulleted-list-2/bulleted-list-2.tsx
index f5a8be5de1..f4d1e2a23f 100644
--- a/libs/components/icons/src/auto-icons/bulleted-list-2/bulleted-list-2.tsx
+++ b/libs/components/icons/src/auto-icons/bulleted-list-2/bulleted-list-2.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BulletedList_2IconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BulletedList_2Icon: FC<BulletedList_2IconProps> = ({ color, style, ...props}) => {
+export const BulletedList_2Icon = ({ color, style, ...props}: BulletedList_2IconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/bulleted-list-3/bulleted-list-3.tsx b/libs/components/icons/src/auto-icons/bulleted-list-3/bulleted-list-3.tsx
index 44d6862559..161c14fae9 100644
--- a/libs/components/icons/src/auto-icons/bulleted-list-3/bulleted-list-3.tsx
+++ b/libs/components/icons/src/auto-icons/bulleted-list-3/bulleted-list-3.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BulletedList_3IconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BulletedList_3Icon: FC<BulletedList_3IconProps> = ({ color, style, ...props}) => {
+export const BulletedList_3Icon = ({ color, style, ...props}: BulletedList_3IconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/bulleted-list-4/bulleted-list-4.tsx b/libs/components/icons/src/auto-icons/bulleted-list-4/bulleted-list-4.tsx
index 9c54e61181..ab1b42a459 100644
--- a/libs/components/icons/src/auto-icons/bulleted-list-4/bulleted-list-4.tsx
+++ b/libs/components/icons/src/auto-icons/bulleted-list-4/bulleted-list-4.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface BulletedList_4IconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const BulletedList_4Icon: FC<BulletedList_4IconProps> = ({ color, style, ...props}) => {
+export const BulletedList_4Icon = ({ color, style, ...props}: BulletedList_4IconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/callout/callout.tsx b/libs/components/icons/src/auto-icons/callout/callout.tsx
index 469a5baf7f..228025affb 100644
--- a/libs/components/icons/src/auto-icons/callout/callout.tsx
+++ b/libs/components/icons/src/auto-icons/callout/callout.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface CalloutIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const CalloutIcon: FC<CalloutIconProps> = ({ color, style, ...props}) => {
+export const CalloutIcon = ({ color, style, ...props}: CalloutIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/card/card.tsx b/libs/components/icons/src/auto-icons/card/card.tsx
index 8c72501655..2f67f5e960 100644
--- a/libs/components/icons/src/auto-icons/card/card.tsx
+++ b/libs/components/icons/src/auto-icons/card/card.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface CardIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const CardIcon: FC<CardIconProps> = ({ color, style, ...props}) => {
+export const CardIcon = ({ color, style, ...props}: CardIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/check-box-check/check-box-check.tsx b/libs/components/icons/src/auto-icons/check-box-check/check-box-check.tsx
index b2cc8fb7be..ca724e4c3e 100644
--- a/libs/components/icons/src/auto-icons/check-box-check/check-box-check.tsx
+++ b/libs/components/icons/src/auto-icons/check-box-check/check-box-check.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface CheckBoxCheckIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const CheckBoxCheckIcon: FC<CheckBoxCheckIconProps> = ({ color, style, ...props}) => {
+export const CheckBoxCheckIcon = ({ color, style, ...props}: CheckBoxCheckIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/check-box-uncheck/check-box-uncheck.tsx b/libs/components/icons/src/auto-icons/check-box-uncheck/check-box-uncheck.tsx
index 56fae78198..f44864cb5d 100644
--- a/libs/components/icons/src/auto-icons/check-box-uncheck/check-box-uncheck.tsx
+++ b/libs/components/icons/src/auto-icons/check-box-uncheck/check-box-uncheck.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface CheckBoxUncheckIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const CheckBoxUncheckIcon: FC<CheckBoxUncheckIconProps> = ({ color, style, ...props}) => {
+export const CheckBoxUncheckIcon = ({ color, style, ...props}: CheckBoxUncheckIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/code-block/code-block.tsx b/libs/components/icons/src/auto-icons/code-block/code-block.tsx
index f2807ea6b5..6a6ae7d6c7 100644
--- a/libs/components/icons/src/auto-icons/code-block/code-block.tsx
+++ b/libs/components/icons/src/auto-icons/code-block/code-block.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface CodeBlockIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const CodeBlockIcon: FC<CodeBlockIconProps> = ({ color, style, ...props}) => {
+export const CodeBlockIcon = ({ color, style, ...props}: CodeBlockIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/code/code.tsx b/libs/components/icons/src/auto-icons/code/code.tsx
index f20f5a7090..4fbf675194 100644
--- a/libs/components/icons/src/auto-icons/code/code.tsx
+++ b/libs/components/icons/src/auto-icons/code/code.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface CodeIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const CodeIcon: FC<CodeIconProps> = ({ color, style, ...props}) => {
+export const CodeIcon = ({ color, style, ...props}: CodeIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/collaborator/collaborator.tsx b/libs/components/icons/src/auto-icons/collaborator/collaborator.tsx
index 99413bff22..6e76a68fb7 100644
--- a/libs/components/icons/src/auto-icons/collaborator/collaborator.tsx
+++ b/libs/components/icons/src/auto-icons/collaborator/collaborator.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface CollaboratorIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const CollaboratorIcon: FC<CollaboratorIconProps> = ({ color, style, ...props}) => {
+export const CollaboratorIcon = ({ color, style, ...props}: CollaboratorIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/comment/comment.tsx b/libs/components/icons/src/auto-icons/comment/comment.tsx
index e8186e6e1e..e85904b02f 100644
--- a/libs/components/icons/src/auto-icons/comment/comment.tsx
+++ b/libs/components/icons/src/auto-icons/comment/comment.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface CommentIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const CommentIcon: FC<CommentIconProps> = ({ color, style, ...props}) => {
+export const CommentIcon = ({ color, style, ...props}: CommentIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/conector-arrow/conector-arrow.svg b/libs/components/icons/src/auto-icons/conector-arrow/conector-arrow.svg
index c9a63d7ded..f494ee9779 100644
--- a/libs/components/icons/src/auto-icons/conector-arrow/conector-arrow.svg
+++ b/libs/components/icons/src/auto-icons/conector-arrow/conector-arrow.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M20.8 9V4.1a.9.9 0 0 0-.9-.9H15v1.6h3.2L4.8 18.2V15H3.2v4.9a.9.9 0 0 0 .9.9H9v-1.6H6.063L19.2 6.063V9h1.6Z" clip-rule="evenodd"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M20.8 9V4.1a.9.9 0 0 0-.9-.9H15v1.6h3.2L4 19l1.131 1.131L19.2 6.063V9h1.6Z" clip-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/libs/components/icons/src/auto-icons/conector-arrow/conector-arrow.tsx b/libs/components/icons/src/auto-icons/conector-arrow/conector-arrow.tsx
index d04fb4bd30..3aa9ccb3c0 100644
--- a/libs/components/icons/src/auto-icons/conector-arrow/conector-arrow.tsx
+++ b/libs/components/icons/src/auto-icons/conector-arrow/conector-arrow.tsx
@@ -1,21 +1,18 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ConectorArrowIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ConectorArrowIcon: FC<ConectorArrowIconProps> = ({ color, style, ...props}) => {
+export const ConectorArrowIcon = ({ color, style, ...props}: ConectorArrowIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
     return (
         <SvgIcon style={styles} {...props}>
-        <path fillRule="evenodd" d="M20.8 9V4.1a.9.9 0 0 0-.9-.9H15v1.6h3.2L4.8 18.2V15H3.2v4.9a.9.9 0 0 0 .9.9H9v-1.6H6.063L19.2 6.063V9h1.6Z" clipRule="evenodd" />
+        <path fillRule="evenodd" d="M20.8 9V4.1a.9.9 0 0 0-.9-.9H15v1.6h3.2L4 19l1.131 1.131L19.2 6.063V9h1.6Z" clipRule="evenodd" />
         </SvgIcon>
     )
 };
diff --git a/libs/components/icons/src/auto-icons/conector-line/conector-line.tsx b/libs/components/icons/src/auto-icons/conector-line/conector-line.tsx
index c2b492e527..61607a68b9 100644
--- a/libs/components/icons/src/auto-icons/conector-line/conector-line.tsx
+++ b/libs/components/icons/src/auto-icons/conector-line/conector-line.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ConectorLineIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ConectorLineIcon: FC<ConectorLineIconProps> = ({ color, style, ...props}) => {
+export const ConectorLineIcon = ({ color, style, ...props}: ConectorLineIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/connector/connector.tsx b/libs/components/icons/src/auto-icons/connector/connector.tsx
index 18f11e3aab..6b498795b9 100644
--- a/libs/components/icons/src/auto-icons/connector/connector.tsx
+++ b/libs/components/icons/src/auto-icons/connector/connector.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ConnectorIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ConnectorIcon: FC<ConnectorIconProps> = ({ color, style, ...props}) => {
+export const ConnectorIcon = ({ color, style, ...props}: ConnectorIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/dash-line/dash-line.tsx b/libs/components/icons/src/auto-icons/dash-line/dash-line.tsx
index 71b889c453..13b226010a 100644
--- a/libs/components/icons/src/auto-icons/dash-line/dash-line.tsx
+++ b/libs/components/icons/src/auto-icons/dash-line/dash-line.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface DashLineIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const DashLineIcon: FC<DashLineIconProps> = ({ color, style, ...props}) => {
+export const DashLineIcon = ({ color, style, ...props}: DashLineIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/date/date.tsx b/libs/components/icons/src/auto-icons/date/date.tsx
index 02e74a09fc..a39ebcf27d 100644
--- a/libs/components/icons/src/auto-icons/date/date.tsx
+++ b/libs/components/icons/src/auto-icons/date/date.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface DateIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const DateIcon: FC<DateIconProps> = ({ color, style, ...props}) => {
+export const DateIcon = ({ color, style, ...props}: DateIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/delete-cash-bin/delete-cash-bin.tsx b/libs/components/icons/src/auto-icons/delete-cash-bin/delete-cash-bin.tsx
index 8ae563568e..f2611bf76e 100644
--- a/libs/components/icons/src/auto-icons/delete-cash-bin/delete-cash-bin.tsx
+++ b/libs/components/icons/src/auto-icons/delete-cash-bin/delete-cash-bin.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface DeleteCashBinIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const DeleteCashBinIcon: FC<DeleteCashBinIconProps> = ({ color, style, ...props}) => {
+export const DeleteCashBinIcon = ({ color, style, ...props}: DeleteCashBinIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/delete-small-tag/delete-small-tag.tsx b/libs/components/icons/src/auto-icons/delete-small-tag/delete-small-tag.tsx
index 7260c5db46..ac3a393270 100644
--- a/libs/components/icons/src/auto-icons/delete-small-tag/delete-small-tag.tsx
+++ b/libs/components/icons/src/auto-icons/delete-small-tag/delete-small-tag.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface DeleteSmallTagIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const DeleteSmallTagIcon: FC<DeleteSmallTagIconProps> = ({ color, style, ...props}) => {
+export const DeleteSmallTagIcon = ({ color, style, ...props}: DeleteSmallTagIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/divider/divider.tsx b/libs/components/icons/src/auto-icons/divider/divider.tsx
index 08009a3e79..e3711fcea8 100644
--- a/libs/components/icons/src/auto-icons/divider/divider.tsx
+++ b/libs/components/icons/src/auto-icons/divider/divider.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface DividerIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const DividerIcon: FC<DividerIconProps> = ({ color, style, ...props}) => {
+export const DividerIcon = ({ color, style, ...props}: DividerIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/doc-view/doc-view.tsx b/libs/components/icons/src/auto-icons/doc-view/doc-view.tsx
index a75e9f2f5c..aecd5a446d 100644
--- a/libs/components/icons/src/auto-icons/doc-view/doc-view.tsx
+++ b/libs/components/icons/src/auto-icons/doc-view/doc-view.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface DocViewIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const DocViewIcon: FC<DocViewIconProps> = ({ color, style, ...props}) => {
+export const DocViewIcon = ({ color, style, ...props}: DocViewIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/done/done.tsx b/libs/components/icons/src/auto-icons/done/done.tsx
index 1550405f82..a873678882 100644
--- a/libs/components/icons/src/auto-icons/done/done.tsx
+++ b/libs/components/icons/src/auto-icons/done/done.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface DoneIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const DoneIcon: FC<DoneIconProps> = ({ color, style, ...props}) => {
+export const DoneIcon = ({ color, style, ...props}: DoneIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/duplicate/duplicate.tsx b/libs/components/icons/src/auto-icons/duplicate/duplicate.tsx
index 8421aa6ca9..1a97e5b5a7 100644
--- a/libs/components/icons/src/auto-icons/duplicate/duplicate.tsx
+++ b/libs/components/icons/src/auto-icons/duplicate/duplicate.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface DuplicateIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const DuplicateIcon: FC<DuplicateIconProps> = ({ color, style, ...props}) => {
+export const DuplicateIcon = ({ color, style, ...props}: DuplicateIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/edit/edit.tsx b/libs/components/icons/src/auto-icons/edit/edit.tsx
index 25a1238e17..b744f552cb 100644
--- a/libs/components/icons/src/auto-icons/edit/edit.tsx
+++ b/libs/components/icons/src/auto-icons/edit/edit.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface EditIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const EditIcon: FC<EditIconProps> = ({ color, style, ...props}) => {
+export const EditIcon = ({ color, style, ...props}: EditIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/ellipse/ellipse.tsx b/libs/components/icons/src/auto-icons/ellipse/ellipse.tsx
index e77a909250..24265258d8 100644
--- a/libs/components/icons/src/auto-icons/ellipse/ellipse.tsx
+++ b/libs/components/icons/src/auto-icons/ellipse/ellipse.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface EllipseIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const EllipseIcon: FC<EllipseIconProps> = ({ color, style, ...props}) => {
+export const EllipseIcon = ({ color, style, ...props}: EllipseIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/email/email.tsx b/libs/components/icons/src/auto-icons/email/email.tsx
index 8d70689434..f5da3eb785 100644
--- a/libs/components/icons/src/auto-icons/email/email.tsx
+++ b/libs/components/icons/src/auto-icons/email/email.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface EmailIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const EmailIcon: FC<EmailIconProps> = ({ color, style, ...props}) => {
+export const EmailIcon = ({ color, style, ...props}: EmailIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/embed/embed.tsx b/libs/components/icons/src/auto-icons/embed/embed.tsx
index 6b81186291..d3a4e0d649 100644
--- a/libs/components/icons/src/auto-icons/embed/embed.tsx
+++ b/libs/components/icons/src/auto-icons/embed/embed.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface EmbedIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const EmbedIcon: FC<EmbedIconProps> = ({ color, style, ...props}) => {
+export const EmbedIcon = ({ color, style, ...props}: EmbedIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/eraser/eraser.tsx b/libs/components/icons/src/auto-icons/eraser/eraser.tsx
index a6b4a504e1..7337f52610 100644
--- a/libs/components/icons/src/auto-icons/eraser/eraser.tsx
+++ b/libs/components/icons/src/auto-icons/eraser/eraser.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface EraserIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const EraserIcon: FC<EraserIconProps> = ({ color, style, ...props}) => {
+export const EraserIcon = ({ color, style, ...props}: EraserIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/figma/figma.tsx b/libs/components/icons/src/auto-icons/figma/figma.tsx
index ebd0c50d74..4651659fa7 100644
--- a/libs/components/icons/src/auto-icons/figma/figma.tsx
+++ b/libs/components/icons/src/auto-icons/figma/figma.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FigmaIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FigmaIcon: FC<FigmaIconProps> = ({ color, style, ...props}) => {
+export const FigmaIcon = ({ color, style, ...props}: FigmaIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/file/file.tsx b/libs/components/icons/src/auto-icons/file/file.tsx
index 7c8d5a5649..26c44ffa7a 100644
--- a/libs/components/icons/src/auto-icons/file/file.tsx
+++ b/libs/components/icons/src/auto-icons/file/file.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FileIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FileIcon: FC<FileIconProps> = ({ color, style, ...props}) => {
+export const FileIcon = ({ color, style, ...props}: FileIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/filter/filter.tsx b/libs/components/icons/src/auto-icons/filter/filter.tsx
index 72bd22d751..a95c552424 100644
--- a/libs/components/icons/src/auto-icons/filter/filter.tsx
+++ b/libs/components/icons/src/auto-icons/filter/filter.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FilterIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FilterIcon: FC<FilterIconProps> = ({ color, style, ...props}) => {
+export const FilterIcon = ({ color, style, ...props}: FilterIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/format-background/format-background.tsx b/libs/components/icons/src/auto-icons/format-background/format-background.tsx
index 6baf1ba3cd..1c3a24d1c3 100644
--- a/libs/components/icons/src/auto-icons/format-background/format-background.tsx
+++ b/libs/components/icons/src/auto-icons/format-background/format-background.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FormatBackgroundIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FormatBackgroundIcon: FC<FormatBackgroundIconProps> = ({ color, style, ...props}) => {
+export const FormatBackgroundIcon = ({ color, style, ...props}: FormatBackgroundIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/format-bold-emphasis/format-bold-emphasis.tsx b/libs/components/icons/src/auto-icons/format-bold-emphasis/format-bold-emphasis.tsx
index 849681b6fe..b6b35cb75d 100644
--- a/libs/components/icons/src/auto-icons/format-bold-emphasis/format-bold-emphasis.tsx
+++ b/libs/components/icons/src/auto-icons/format-bold-emphasis/format-bold-emphasis.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FormatBoldEmphasisIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FormatBoldEmphasisIcon: FC<FormatBoldEmphasisIconProps> = ({ color, style, ...props}) => {
+export const FormatBoldEmphasisIcon = ({ color, style, ...props}: FormatBoldEmphasisIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/format-clear/format-clear.tsx b/libs/components/icons/src/auto-icons/format-clear/format-clear.tsx
index a4da1e465e..e85483e690 100644
--- a/libs/components/icons/src/auto-icons/format-clear/format-clear.tsx
+++ b/libs/components/icons/src/auto-icons/format-clear/format-clear.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FormatClearIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FormatClearIcon: FC<FormatClearIconProps> = ({ color, style, ...props}) => {
+export const FormatClearIcon = ({ color, style, ...props}: FormatClearIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/format-color-text/format-color-text.tsx b/libs/components/icons/src/auto-icons/format-color-text/format-color-text.tsx
index aa68b248f2..1ce7a0d7eb 100644
--- a/libs/components/icons/src/auto-icons/format-color-text/format-color-text.tsx
+++ b/libs/components/icons/src/auto-icons/format-color-text/format-color-text.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FormatColorTextIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FormatColorTextIcon: FC<FormatColorTextIconProps> = ({ color, style, ...props}) => {
+export const FormatColorTextIcon = ({ color, style, ...props}: FormatColorTextIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/format-italic/format-italic.tsx b/libs/components/icons/src/auto-icons/format-italic/format-italic.tsx
index ba3a82b166..1ed8ff0fbb 100644
--- a/libs/components/icons/src/auto-icons/format-italic/format-italic.tsx
+++ b/libs/components/icons/src/auto-icons/format-italic/format-italic.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FormatItalicIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FormatItalicIcon: FC<FormatItalicIconProps> = ({ color, style, ...props}) => {
+export const FormatItalicIcon = ({ color, style, ...props}: FormatItalicIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/format-strikethrough/format-strikethrough.tsx b/libs/components/icons/src/auto-icons/format-strikethrough/format-strikethrough.tsx
index 1868a9a165..72057b538c 100644
--- a/libs/components/icons/src/auto-icons/format-strikethrough/format-strikethrough.tsx
+++ b/libs/components/icons/src/auto-icons/format-strikethrough/format-strikethrough.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FormatStrikethroughIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FormatStrikethroughIcon: FC<FormatStrikethroughIconProps> = ({ color, style, ...props}) => {
+export const FormatStrikethroughIcon = ({ color, style, ...props}: FormatStrikethroughIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/forward-redo/forward-redo.tsx b/libs/components/icons/src/auto-icons/forward-redo/forward-redo.tsx
index 52e5893e47..98dbdca1e5 100644
--- a/libs/components/icons/src/auto-icons/forward-redo/forward-redo.tsx
+++ b/libs/components/icons/src/auto-icons/forward-redo/forward-redo.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ForwardRedoIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ForwardRedoIcon: FC<ForwardRedoIconProps> = ({ color, style, ...props}) => {
+export const ForwardRedoIcon = ({ color, style, ...props}: ForwardRedoIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/frame/frame.tsx b/libs/components/icons/src/auto-icons/frame/frame.tsx
index 295410dd75..9e64227b60 100644
--- a/libs/components/icons/src/auto-icons/frame/frame.tsx
+++ b/libs/components/icons/src/auto-icons/frame/frame.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FrameIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FrameIcon: FC<FrameIconProps> = ({ color, style, ...props}) => {
+export const FrameIcon = ({ color, style, ...props}: FrameIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/full-screen/full-screen.tsx b/libs/components/icons/src/auto-icons/full-screen/full-screen.tsx
index 614d4a5988..90a6f7d480 100644
--- a/libs/components/icons/src/auto-icons/full-screen/full-screen.tsx
+++ b/libs/components/icons/src/auto-icons/full-screen/full-screen.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface FullScreenIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const FullScreenIcon: FC<FullScreenIconProps> = ({ color, style, ...props}) => {
+export const FullScreenIcon = ({ color, style, ...props}: FullScreenIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/group-by/group-by.tsx b/libs/components/icons/src/auto-icons/group-by/group-by.tsx
index 36a029891a..7289a982b2 100644
--- a/libs/components/icons/src/auto-icons/group-by/group-by.tsx
+++ b/libs/components/icons/src/auto-icons/group-by/group-by.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface GroupByIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const GroupByIcon: FC<GroupByIconProps> = ({ color, style, ...props}) => {
+export const GroupByIcon = ({ color, style, ...props}: GroupByIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/group/group.tsx b/libs/components/icons/src/auto-icons/group/group.tsx
index abf8a00805..4c913180bc 100644
--- a/libs/components/icons/src/auto-icons/group/group.tsx
+++ b/libs/components/icons/src/auto-icons/group/group.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface GroupIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const GroupIcon: FC<GroupIconProps> = ({ color, style, ...props}) => {
+export const GroupIcon = ({ color, style, ...props}: GroupIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/hand-tool/hand-tool.tsx b/libs/components/icons/src/auto-icons/hand-tool/hand-tool.tsx
index 33566d7950..8a71600ea2 100644
--- a/libs/components/icons/src/auto-icons/hand-tool/hand-tool.tsx
+++ b/libs/components/icons/src/auto-icons/hand-tool/hand-tool.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface HandToolIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const HandToolIcon: FC<HandToolIconProps> = ({ color, style, ...props}) => {
+export const HandToolIcon = ({ color, style, ...props}: HandToolIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/handle-child/handle-child.tsx b/libs/components/icons/src/auto-icons/handle-child/handle-child.tsx
index 94b45e7bd7..46e42ee9fd 100644
--- a/libs/components/icons/src/auto-icons/handle-child/handle-child.tsx
+++ b/libs/components/icons/src/auto-icons/handle-child/handle-child.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface HandleChildIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const HandleChildIcon: FC<HandleChildIconProps> = ({ color, style, ...props}) => {
+export const HandleChildIcon = ({ color, style, ...props}: HandleChildIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/handle-parent/handle-parent.tsx b/libs/components/icons/src/auto-icons/handle-parent/handle-parent.tsx
index 0703b8b71b..545b5fcde8 100644
--- a/libs/components/icons/src/auto-icons/handle-parent/handle-parent.tsx
+++ b/libs/components/icons/src/auto-icons/handle-parent/handle-parent.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface HandleParentIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const HandleParentIcon: FC<HandleParentIconProps> = ({ color, style, ...props}) => {
+export const HandleParentIcon = ({ color, style, ...props}: HandleParentIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/heading-one/heading-one.tsx b/libs/components/icons/src/auto-icons/heading-one/heading-one.tsx
index 357c943f20..7b4025c208 100644
--- a/libs/components/icons/src/auto-icons/heading-one/heading-one.tsx
+++ b/libs/components/icons/src/auto-icons/heading-one/heading-one.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface HeadingOneIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const HeadingOneIcon: FC<HeadingOneIconProps> = ({ color, style, ...props}) => {
+export const HeadingOneIcon = ({ color, style, ...props}: HeadingOneIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/heading-three/heading-three.tsx b/libs/components/icons/src/auto-icons/heading-three/heading-three.tsx
index 1e10e1f1ad..60bb5b9ba6 100644
--- a/libs/components/icons/src/auto-icons/heading-three/heading-three.tsx
+++ b/libs/components/icons/src/auto-icons/heading-three/heading-three.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface HeadingThreeIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const HeadingThreeIcon: FC<HeadingThreeIconProps> = ({ color, style, ...props}) => {
+export const HeadingThreeIcon = ({ color, style, ...props}: HeadingThreeIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/heading-two/heading-two.tsx b/libs/components/icons/src/auto-icons/heading-two/heading-two.tsx
index f41b618e45..b6de565ea1 100644
--- a/libs/components/icons/src/auto-icons/heading-two/heading-two.tsx
+++ b/libs/components/icons/src/auto-icons/heading-two/heading-two.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface HeadingTwoIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const HeadingTwoIcon: FC<HeadingTwoIconProps> = ({ color, style, ...props}) => {
+export const HeadingTwoIcon = ({ color, style, ...props}: HeadingTwoIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/help-center/help-center.tsx b/libs/components/icons/src/auto-icons/help-center/help-center.tsx
index 73e836d13c..a6e412892f 100644
--- a/libs/components/icons/src/auto-icons/help-center/help-center.tsx
+++ b/libs/components/icons/src/auto-icons/help-center/help-center.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface HelpCenterIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const HelpCenterIcon: FC<HelpCenterIconProps> = ({ color, style, ...props}) => {
+export const HelpCenterIcon = ({ color, style, ...props}: HelpCenterIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/highlighter-duotone/highlighter-duotone.tsx b/libs/components/icons/src/auto-icons/highlighter-duotone/highlighter-duotone.tsx
index 506f45454e..d2f6f44c54 100644
--- a/libs/components/icons/src/auto-icons/highlighter-duotone/highlighter-duotone.tsx
+++ b/libs/components/icons/src/auto-icons/highlighter-duotone/highlighter-duotone.tsx
@@ -1,9 +1,6 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface HighlighterDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     color0?: string
@@ -12,7 +9,7 @@ export interface HighlighterDuotoneIconProps extends Omit<SvgIconProps, 'color'>
     secondaryColor?: string
 }
 
-export const HighlighterDuotoneIcon: FC<HighlighterDuotoneIconProps> = ({ color0, primaryColor, color1, secondaryColor, style, ...props}) => {
+export const HighlighterDuotoneIcon = ({ color0, primaryColor, color1, secondaryColor, style, ...props}: HighlighterDuotoneIconProps) => {
     const propsStyles = {"--color-0": color0 || primaryColor, "--color-1": color1 || secondaryColor};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/hover-frame/hover-frame.tsx b/libs/components/icons/src/auto-icons/hover-frame/hover-frame.tsx
index 2e80468f9c..9159e957dd 100644
--- a/libs/components/icons/src/auto-icons/hover-frame/hover-frame.tsx
+++ b/libs/components/icons/src/auto-icons/hover-frame/hover-frame.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface HoverFrameIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const HoverFrameIcon: FC<HoverFrameIconProps> = ({ color, style, ...props}) => {
+export const HoverFrameIcon = ({ color, style, ...props}: HoverFrameIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/image/image.tsx b/libs/components/icons/src/auto-icons/image/image.tsx
index 23f79a4d0f..569df1b590 100644
--- a/libs/components/icons/src/auto-icons/image/image.tsx
+++ b/libs/components/icons/src/auto-icons/image/image.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ImageIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ImageIcon: FC<ImageIconProps> = ({ color, style, ...props}) => {
+export const ImageIcon = ({ color, style, ...props}: ImageIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/index.ts b/libs/components/icons/src/auto-icons/index.ts
index 4ea171d7b5..f59db7967f 100644
--- a/libs/components/icons/src/auto-icons/index.ts
+++ b/libs/components/icons/src/auto-icons/index.ts
@@ -1,4 +1,4 @@
-export const timestamp = 1659423582387;
+export const timestamp = 1660239514133;
 export * from './image/image';
 export * from './format-clear/format-clear';
 export * from './backward-undo/backward-undo';
diff --git a/libs/components/icons/src/auto-icons/information/information.tsx b/libs/components/icons/src/auto-icons/information/information.tsx
index 73bd081092..22484790d0 100644
--- a/libs/components/icons/src/auto-icons/information/information.tsx
+++ b/libs/components/icons/src/auto-icons/information/information.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface InformationIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const InformationIcon: FC<InformationIconProps> = ({ color, style, ...props}) => {
+export const InformationIcon = ({ color, style, ...props}: InformationIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/kan-ban/kan-ban.tsx b/libs/components/icons/src/auto-icons/kan-ban/kan-ban.tsx
index b3b351ee04..a0f07a8fe0 100644
--- a/libs/components/icons/src/auto-icons/kan-ban/kan-ban.tsx
+++ b/libs/components/icons/src/auto-icons/kan-ban/kan-ban.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface KanBanIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const KanBanIcon: FC<KanBanIconProps> = ({ color, style, ...props}) => {
+export const KanBanIcon = ({ color, style, ...props}: KanBanIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/laser-pen-duotone/laser-pen-duotone.tsx b/libs/components/icons/src/auto-icons/laser-pen-duotone/laser-pen-duotone.tsx
index b7d924edb5..483ef807f3 100644
--- a/libs/components/icons/src/auto-icons/laser-pen-duotone/laser-pen-duotone.tsx
+++ b/libs/components/icons/src/auto-icons/laser-pen-duotone/laser-pen-duotone.tsx
@@ -1,9 +1,6 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface LaserPenDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     color0?: string
@@ -12,7 +9,7 @@ export interface LaserPenDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     secondaryColor?: string
 }
 
-export const LaserPenDuotoneIcon: FC<LaserPenDuotoneIconProps> = ({ color0, primaryColor, color1, secondaryColor, style, ...props}) => {
+export const LaserPenDuotoneIcon = ({ color0, primaryColor, color1, secondaryColor, style, ...props}: LaserPenDuotoneIconProps) => {
     const propsStyles = {"--color-0": color0 || primaryColor, "--color-1": color1 || secondaryColor};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/layout/layout.tsx b/libs/components/icons/src/auto-icons/layout/layout.tsx
index 9a03e4d6e1..6285edba47 100644
--- a/libs/components/icons/src/auto-icons/layout/layout.tsx
+++ b/libs/components/icons/src/auto-icons/layout/layout.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface LayoutIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const LayoutIcon: FC<LayoutIconProps> = ({ color, style, ...props}) => {
+export const LayoutIcon = ({ color, style, ...props}: LayoutIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/line-none/line-none.tsx b/libs/components/icons/src/auto-icons/line-none/line-none.tsx
index 862879f120..14ef03c1cb 100644
--- a/libs/components/icons/src/auto-icons/line-none/line-none.tsx
+++ b/libs/components/icons/src/auto-icons/line-none/line-none.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface LineNoneIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const LineNoneIcon: FC<LineNoneIconProps> = ({ color, style, ...props}) => {
+export const LineNoneIcon = ({ color, style, ...props}: LineNoneIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/link/link.tsx b/libs/components/icons/src/auto-icons/link/link.tsx
index 9828e59427..9fa4d328c6 100644
--- a/libs/components/icons/src/auto-icons/link/link.tsx
+++ b/libs/components/icons/src/auto-icons/link/link.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface LinkIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const LinkIcon: FC<LinkIconProps> = ({ color, style, ...props}) => {
+export const LinkIcon = ({ color, style, ...props}: LinkIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/location/location.tsx b/libs/components/icons/src/auto-icons/location/location.tsx
index 7988b3c383..6a22f62e03 100644
--- a/libs/components/icons/src/auto-icons/location/location.tsx
+++ b/libs/components/icons/src/auto-icons/location/location.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface LocationIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const LocationIcon: FC<LocationIconProps> = ({ color, style, ...props}) => {
+export const LocationIcon = ({ color, style, ...props}: LocationIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/lock/lock.tsx b/libs/components/icons/src/auto-icons/lock/lock.tsx
index c2637b240f..4b7b67c672 100644
--- a/libs/components/icons/src/auto-icons/lock/lock.tsx
+++ b/libs/components/icons/src/auto-icons/lock/lock.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface LockIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const LockIcon: FC<LockIconProps> = ({ color, style, ...props}) => {
+export const LockIcon = ({ color, style, ...props}: LockIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/log-out/log-out.tsx b/libs/components/icons/src/auto-icons/log-out/log-out.tsx
index a7844fe2c0..b48528fe19 100644
--- a/libs/components/icons/src/auto-icons/log-out/log-out.tsx
+++ b/libs/components/icons/src/auto-icons/log-out/log-out.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface LogOutIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const LogOutIcon: FC<LogOutIconProps> = ({ color, style, ...props}) => {
+export const LogOutIcon = ({ color, style, ...props}: LogOutIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/logo/logo.tsx b/libs/components/icons/src/auto-icons/logo/logo.tsx
index cbf840ee7e..716bc0d1c1 100644
--- a/libs/components/icons/src/auto-icons/logo/logo.tsx
+++ b/libs/components/icons/src/auto-icons/logo/logo.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface LogoIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const LogoIcon: FC<LogoIconProps> = ({ color, style, ...props}) => {
+export const LogoIcon = ({ color, style, ...props}: LogoIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/more-tags-an-subblocks/more-tags-an-subblocks.tsx b/libs/components/icons/src/auto-icons/more-tags-an-subblocks/more-tags-an-subblocks.tsx
index c631600a86..73c5ee52f6 100644
--- a/libs/components/icons/src/auto-icons/more-tags-an-subblocks/more-tags-an-subblocks.tsx
+++ b/libs/components/icons/src/auto-icons/more-tags-an-subblocks/more-tags-an-subblocks.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface MoreTagsAnSubblocksIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const MoreTagsAnSubblocksIcon: FC<MoreTagsAnSubblocksIconProps> = ({ color, style, ...props}) => {
+export const MoreTagsAnSubblocksIcon = ({ color, style, ...props}: MoreTagsAnSubblocksIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/more/more.tsx b/libs/components/icons/src/auto-icons/more/more.tsx
index 643779bb84..31a3bcbb7b 100644
--- a/libs/components/icons/src/auto-icons/more/more.tsx
+++ b/libs/components/icons/src/auto-icons/more/more.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface MoreIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const MoreIcon: FC<MoreIconProps> = ({ color, style, ...props}) => {
+export const MoreIcon = ({ color, style, ...props}: MoreIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/move-to/move-to.tsx b/libs/components/icons/src/auto-icons/move-to/move-to.tsx
index a1a5f9b444..3a95826f81 100644
--- a/libs/components/icons/src/auto-icons/move-to/move-to.tsx
+++ b/libs/components/icons/src/auto-icons/move-to/move-to.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface MoveToIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const MoveToIcon: FC<MoveToIconProps> = ({ color, style, ...props}) => {
+export const MoveToIcon = ({ color, style, ...props}: MoveToIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/multi-select/multi-select.tsx b/libs/components/icons/src/auto-icons/multi-select/multi-select.tsx
index a56de13a02..b8f325e3f8 100644
--- a/libs/components/icons/src/auto-icons/multi-select/multi-select.tsx
+++ b/libs/components/icons/src/auto-icons/multi-select/multi-select.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface MultiSelectIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const MultiSelectIcon: FC<MultiSelectIconProps> = ({ color, style, ...props}) => {
+export const MultiSelectIcon = ({ color, style, ...props}: MultiSelectIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/number/number.tsx b/libs/components/icons/src/auto-icons/number/number.tsx
index b636516b87..48d708b634 100644
--- a/libs/components/icons/src/auto-icons/number/number.tsx
+++ b/libs/components/icons/src/auto-icons/number/number.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface NumberIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const NumberIcon: FC<NumberIconProps> = ({ color, style, ...props}) => {
+export const NumberIcon = ({ color, style, ...props}: NumberIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/page-duallink/page-duallink.tsx b/libs/components/icons/src/auto-icons/page-duallink/page-duallink.tsx
index da28fe455f..cfe410eccf 100644
--- a/libs/components/icons/src/auto-icons/page-duallink/page-duallink.tsx
+++ b/libs/components/icons/src/auto-icons/page-duallink/page-duallink.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface PageDuallinkIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const PageDuallinkIcon: FC<PageDuallinkIconProps> = ({ color, style, ...props}) => {
+export const PageDuallinkIcon = ({ color, style, ...props}: PageDuallinkIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/page-in-page-tree/page-in-page-tree.tsx b/libs/components/icons/src/auto-icons/page-in-page-tree/page-in-page-tree.tsx
index 9d404fb4ed..d11ae048ef 100644
--- a/libs/components/icons/src/auto-icons/page-in-page-tree/page-in-page-tree.tsx
+++ b/libs/components/icons/src/auto-icons/page-in-page-tree/page-in-page-tree.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface PageInPageTreeIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const PageInPageTreeIcon: FC<PageInPageTreeIconProps> = ({ color, style, ...props}) => {
+export const PageInPageTreeIcon = ({ color, style, ...props}: PageInPageTreeIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/pages/pages.tsx b/libs/components/icons/src/auto-icons/pages/pages.tsx
index f62e5c1425..48c0bc81b6 100644
--- a/libs/components/icons/src/auto-icons/pages/pages.tsx
+++ b/libs/components/icons/src/auto-icons/pages/pages.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface PagesIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const PagesIcon: FC<PagesIconProps> = ({ color, style, ...props}) => {
+export const PagesIcon = ({ color, style, ...props}: PagesIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/pen/pen.tsx b/libs/components/icons/src/auto-icons/pen/pen.tsx
index ad0751641a..827078d228 100644
--- a/libs/components/icons/src/auto-icons/pen/pen.tsx
+++ b/libs/components/icons/src/auto-icons/pen/pen.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface PenIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const PenIcon: FC<PenIconProps> = ({ color, style, ...props}) => {
+export const PenIcon = ({ color, style, ...props}: PenIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/pencil-duotone/pencil-duotone.tsx b/libs/components/icons/src/auto-icons/pencil-duotone/pencil-duotone.tsx
index bd18d7caca..63a193490d 100644
--- a/libs/components/icons/src/auto-icons/pencil-duotone/pencil-duotone.tsx
+++ b/libs/components/icons/src/auto-icons/pencil-duotone/pencil-duotone.tsx
@@ -1,9 +1,6 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface PencilDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     color0?: string
@@ -12,7 +9,7 @@ export interface PencilDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     secondaryColor?: string
 }
 
-export const PencilDuotoneIcon: FC<PencilDuotoneIconProps> = ({ color0, primaryColor, color1, secondaryColor, style, ...props}) => {
+export const PencilDuotoneIcon = ({ color0, primaryColor, color1, secondaryColor, style, ...props}: PencilDuotoneIconProps) => {
     const propsStyles = {"--color-0": color0 || primaryColor, "--color-1": color1 || secondaryColor};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/phone/phone.tsx b/libs/components/icons/src/auto-icons/phone/phone.tsx
index 691aaa6df0..f915615fe3 100644
--- a/libs/components/icons/src/auto-icons/phone/phone.tsx
+++ b/libs/components/icons/src/auto-icons/phone/phone.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface PhoneIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const PhoneIcon: FC<PhoneIconProps> = ({ color, style, ...props}) => {
+export const PhoneIcon = ({ color, style, ...props}: PhoneIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/pin/pin.tsx b/libs/components/icons/src/auto-icons/pin/pin.tsx
index 60f1db57f2..327de5a24a 100644
--- a/libs/components/icons/src/auto-icons/pin/pin.tsx
+++ b/libs/components/icons/src/auto-icons/pin/pin.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface PinIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const PinIcon: FC<PinIconProps> = ({ color, style, ...props}) => {
+export const PinIcon = ({ color, style, ...props}: PinIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/point-line/point-line.tsx b/libs/components/icons/src/auto-icons/point-line/point-line.tsx
index e2818689f5..c4c32ad443 100644
--- a/libs/components/icons/src/auto-icons/point-line/point-line.tsx
+++ b/libs/components/icons/src/auto-icons/point-line/point-line.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface PointLineIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const PointLineIcon: FC<PointLineIconProps> = ({ color, style, ...props}) => {
+export const PointLineIcon = ({ color, style, ...props}: PointLineIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/polygon/polygon.tsx b/libs/components/icons/src/auto-icons/polygon/polygon.tsx
index 29e820aca1..9544d79d76 100644
--- a/libs/components/icons/src/auto-icons/polygon/polygon.tsx
+++ b/libs/components/icons/src/auto-icons/polygon/polygon.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface PolygonIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const PolygonIcon: FC<PolygonIconProps> = ({ color, style, ...props}) => {
+export const PolygonIcon = ({ color, style, ...props}: PolygonIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/quote/quote.tsx b/libs/components/icons/src/auto-icons/quote/quote.tsx
index 403fec355c..bdbd9a4417 100644
--- a/libs/components/icons/src/auto-icons/quote/quote.tsx
+++ b/libs/components/icons/src/auto-icons/quote/quote.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface QuoteIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const QuoteIcon: FC<QuoteIconProps> = ({ color, style, ...props}) => {
+export const QuoteIcon = ({ color, style, ...props}: QuoteIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/reaction/reaction.tsx b/libs/components/icons/src/auto-icons/reaction/reaction.tsx
index e50612e3fd..a36c87639e 100644
--- a/libs/components/icons/src/auto-icons/reaction/reaction.tsx
+++ b/libs/components/icons/src/auto-icons/reaction/reaction.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ReactionIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ReactionIcon: FC<ReactionIconProps> = ({ color, style, ...props}) => {
+export const ReactionIcon = ({ color, style, ...props}: ReactionIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/rectangle-93/rectangle-93.tsx b/libs/components/icons/src/auto-icons/rectangle-93/rectangle-93.tsx
index beb3b61b55..5a327a1c83 100644
--- a/libs/components/icons/src/auto-icons/rectangle-93/rectangle-93.tsx
+++ b/libs/components/icons/src/auto-icons/rectangle-93/rectangle-93.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface Rectangle_93IconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const Rectangle_93Icon: FC<Rectangle_93IconProps> = ({ color, style, ...props}) => {
+export const Rectangle_93Icon = ({ color, style, ...props}: Rectangle_93IconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/rectangle/rectangle.tsx b/libs/components/icons/src/auto-icons/rectangle/rectangle.tsx
index cdd56157b2..39bca5eb4a 100644
--- a/libs/components/icons/src/auto-icons/rectangle/rectangle.tsx
+++ b/libs/components/icons/src/auto-icons/rectangle/rectangle.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface RectangleIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const RectangleIcon: FC<RectangleIconProps> = ({ color, style, ...props}) => {
+export const RectangleIcon = ({ color, style, ...props}: RectangleIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/search/search.tsx b/libs/components/icons/src/auto-icons/search/search.tsx
index e19e5b6306..c352b447b2 100644
--- a/libs/components/icons/src/auto-icons/search/search.tsx
+++ b/libs/components/icons/src/auto-icons/search/search.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SearchIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SearchIcon: FC<SearchIconProps> = ({ color, style, ...props}) => {
+export const SearchIcon = ({ color, style, ...props}: SearchIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/select-box-select/select-box-select.tsx b/libs/components/icons/src/auto-icons/select-box-select/select-box-select.tsx
index e2207f52aa..b2bc838f3c 100644
--- a/libs/components/icons/src/auto-icons/select-box-select/select-box-select.tsx
+++ b/libs/components/icons/src/auto-icons/select-box-select/select-box-select.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SelectBoxSelectIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SelectBoxSelectIcon: FC<SelectBoxSelectIconProps> = ({ color, style, ...props}) => {
+export const SelectBoxSelectIcon = ({ color, style, ...props}: SelectBoxSelectIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/select-box-unselect/select-box-unselect.tsx b/libs/components/icons/src/auto-icons/select-box-unselect/select-box-unselect.tsx
index 6d4f5838b7..58e5a44b13 100644
--- a/libs/components/icons/src/auto-icons/select-box-unselect/select-box-unselect.tsx
+++ b/libs/components/icons/src/auto-icons/select-box-unselect/select-box-unselect.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SelectBoxUnselectIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SelectBoxUnselectIcon: FC<SelectBoxUnselectIconProps> = ({ color, style, ...props}) => {
+export const SelectBoxUnselectIcon = ({ color, style, ...props}: SelectBoxUnselectIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/select/select.tsx b/libs/components/icons/src/auto-icons/select/select.tsx
index eaa55cf47f..cc3d8a88de 100644
--- a/libs/components/icons/src/auto-icons/select/select.tsx
+++ b/libs/components/icons/src/auto-icons/select/select.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SelectIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SelectIcon: FC<SelectIconProps> = ({ color, style, ...props}) => {
+export const SelectIcon = ({ color, style, ...props}: SelectIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/settings/settings.tsx b/libs/components/icons/src/auto-icons/settings/settings.tsx
index d75d48e7e3..94d4e7f4b2 100644
--- a/libs/components/icons/src/auto-icons/settings/settings.tsx
+++ b/libs/components/icons/src/auto-icons/settings/settings.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SettingsIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SettingsIcon: FC<SettingsIconProps> = ({ color, style, ...props}) => {
+export const SettingsIcon = ({ color, style, ...props}: SettingsIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/shape-color-duotone/shape-color-duotone.tsx b/libs/components/icons/src/auto-icons/shape-color-duotone/shape-color-duotone.tsx
index cb44911c6c..fd15d8ab47 100644
--- a/libs/components/icons/src/auto-icons/shape-color-duotone/shape-color-duotone.tsx
+++ b/libs/components/icons/src/auto-icons/shape-color-duotone/shape-color-duotone.tsx
@@ -1,16 +1,13 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ShapeColorDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     color0?: string
     primaryColor?: string
 }
 
-export const ShapeColorDuotoneIcon: FC<ShapeColorDuotoneIconProps> = ({ color0, primaryColor, style, ...props}) => {
+export const ShapeColorDuotoneIcon = ({ color0, primaryColor, style, ...props}: ShapeColorDuotoneIconProps) => {
     const propsStyles = {"--color-0": color0 || primaryColor};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/shape-color-none/shape-color-none.tsx b/libs/components/icons/src/auto-icons/shape-color-none/shape-color-none.tsx
index 18340931c1..4c278955fb 100644
--- a/libs/components/icons/src/auto-icons/shape-color-none/shape-color-none.tsx
+++ b/libs/components/icons/src/auto-icons/shape-color-none/shape-color-none.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ShapeColorNoneIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ShapeColorNoneIcon: FC<ShapeColorNoneIconProps> = ({ color, style, ...props}) => {
+export const ShapeColorNoneIcon = ({ color, style, ...props}: ShapeColorNoneIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/shape/shape.tsx b/libs/components/icons/src/auto-icons/shape/shape.tsx
index 3e6a38d5af..8e811d30a3 100644
--- a/libs/components/icons/src/auto-icons/shape/shape.tsx
+++ b/libs/components/icons/src/auto-icons/shape/shape.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ShapeIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ShapeIcon: FC<ShapeIconProps> = ({ color, style, ...props}) => {
+export const ShapeIcon = ({ color, style, ...props}: ShapeIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/side-bar-view-close/side-bar-view-close.tsx b/libs/components/icons/src/auto-icons/side-bar-view-close/side-bar-view-close.tsx
index dcca9989ea..5967965a5e 100644
--- a/libs/components/icons/src/auto-icons/side-bar-view-close/side-bar-view-close.tsx
+++ b/libs/components/icons/src/auto-icons/side-bar-view-close/side-bar-view-close.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SideBarViewCloseIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SideBarViewCloseIcon: FC<SideBarViewCloseIconProps> = ({ color, style, ...props}) => {
+export const SideBarViewCloseIcon = ({ color, style, ...props}: SideBarViewCloseIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/side-bar-view/side-bar-view.tsx b/libs/components/icons/src/auto-icons/side-bar-view/side-bar-view.tsx
index ecd466c8c2..8f69dcf714 100644
--- a/libs/components/icons/src/auto-icons/side-bar-view/side-bar-view.tsx
+++ b/libs/components/icons/src/auto-icons/side-bar-view/side-bar-view.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SideBarViewIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SideBarViewIcon: FC<SideBarViewIconProps> = ({ color, style, ...props}) => {
+export const SideBarViewIcon = ({ color, style, ...props}: SideBarViewIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/single-select/single-select.tsx b/libs/components/icons/src/auto-icons/single-select/single-select.tsx
index 3f7bdc99d3..3b355bca38 100644
--- a/libs/components/icons/src/auto-icons/single-select/single-select.tsx
+++ b/libs/components/icons/src/auto-icons/single-select/single-select.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SingleSelectIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SingleSelectIcon: FC<SingleSelectIconProps> = ({ color, style, ...props}) => {
+export const SingleSelectIcon = ({ color, style, ...props}: SingleSelectIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/solid-line/solid-line.tsx b/libs/components/icons/src/auto-icons/solid-line/solid-line.tsx
index 331fde47c9..883a2ddc48 100644
--- a/libs/components/icons/src/auto-icons/solid-line/solid-line.tsx
+++ b/libs/components/icons/src/auto-icons/solid-line/solid-line.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SolidLineIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SolidLineIcon: FC<SolidLineIconProps> = ({ color, style, ...props}) => {
+export const SolidLineIcon = ({ color, style, ...props}: SolidLineIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/sort/sort.tsx b/libs/components/icons/src/auto-icons/sort/sort.tsx
index 8b7f1f3273..a42f0e8b2b 100644
--- a/libs/components/icons/src/auto-icons/sort/sort.tsx
+++ b/libs/components/icons/src/auto-icons/sort/sort.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SortIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SortIcon: FC<SortIconProps> = ({ color, style, ...props}) => {
+export const SortIcon = ({ color, style, ...props}: SortIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/sql/sql.tsx b/libs/components/icons/src/auto-icons/sql/sql.tsx
index d8d613db14..b2e12d4c10 100644
--- a/libs/components/icons/src/auto-icons/sql/sql.tsx
+++ b/libs/components/icons/src/auto-icons/sql/sql.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SqlIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const SqlIcon: FC<SqlIconProps> = ({ color, style, ...props}) => {
+export const SqlIcon = ({ color, style, ...props}: SqlIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/stamp/stamp.tsx b/libs/components/icons/src/auto-icons/stamp/stamp.tsx
index ec6a69d853..8ce6881927 100644
--- a/libs/components/icons/src/auto-icons/stamp/stamp.tsx
+++ b/libs/components/icons/src/auto-icons/stamp/stamp.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface StampIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const StampIcon: FC<StampIconProps> = ({ color, style, ...props}) => {
+export const StampIcon = ({ color, style, ...props}: StampIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/star/star.tsx b/libs/components/icons/src/auto-icons/star/star.tsx
index ef3e355bd1..104b6a2144 100644
--- a/libs/components/icons/src/auto-icons/star/star.tsx
+++ b/libs/components/icons/src/auto-icons/star/star.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface StarIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const StarIcon: FC<StarIconProps> = ({ color, style, ...props}) => {
+export const StarIcon = ({ color, style, ...props}: StarIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/status/status.tsx b/libs/components/icons/src/auto-icons/status/status.tsx
index c2a5d672ad..3c9a70ad9c 100644
--- a/libs/components/icons/src/auto-icons/status/status.tsx
+++ b/libs/components/icons/src/auto-icons/status/status.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface StatusIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const StatusIcon: FC<StatusIconProps> = ({ color, style, ...props}) => {
+export const StatusIcon = ({ color, style, ...props}: StatusIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/switch-off-duotone/switch-off-duotone.tsx b/libs/components/icons/src/auto-icons/switch-off-duotone/switch-off-duotone.tsx
index 277e26eb89..be39640e9f 100644
--- a/libs/components/icons/src/auto-icons/switch-off-duotone/switch-off-duotone.tsx
+++ b/libs/components/icons/src/auto-icons/switch-off-duotone/switch-off-duotone.tsx
@@ -1,9 +1,6 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SwitchOffDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     color0?: string
@@ -13,7 +10,7 @@ export interface SwitchOffDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     color2?: string
 }
 
-export const SwitchOffDuotoneIcon: FC<SwitchOffDuotoneIconProps> = ({ color0, primaryColor, color1, secondaryColor, color2, style, ...props}) => {
+export const SwitchOffDuotoneIcon = ({ color0, primaryColor, color1, secondaryColor, color2, style, ...props}: SwitchOffDuotoneIconProps) => {
     const propsStyles = {"--color-0": color0 || primaryColor, "--color-1": color1 || secondaryColor, "--color-2": color2};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/switch-on-duotone/switch-on-duotone.tsx b/libs/components/icons/src/auto-icons/switch-on-duotone/switch-on-duotone.tsx
index 4ac41c5320..b4f381cedd 100644
--- a/libs/components/icons/src/auto-icons/switch-on-duotone/switch-on-duotone.tsx
+++ b/libs/components/icons/src/auto-icons/switch-on-duotone/switch-on-duotone.tsx
@@ -1,9 +1,6 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface SwitchOnDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     color0?: string
@@ -12,7 +9,7 @@ export interface SwitchOnDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     secondaryColor?: string
 }
 
-export const SwitchOnDuotoneIcon: FC<SwitchOnDuotoneIconProps> = ({ color0, primaryColor, color1, secondaryColor, style, ...props}) => {
+export const SwitchOnDuotoneIcon = ({ color0, primaryColor, color1, secondaryColor, style, ...props}: SwitchOnDuotoneIconProps) => {
     const propsStyles = {"--color-0": color0 || primaryColor, "--color-1": color1 || secondaryColor};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/table/table.tsx b/libs/components/icons/src/auto-icons/table/table.tsx
index 0534eadd60..08f5a66011 100644
--- a/libs/components/icons/src/auto-icons/table/table.tsx
+++ b/libs/components/icons/src/auto-icons/table/table.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface TableIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const TableIcon: FC<TableIconProps> = ({ color, style, ...props}) => {
+export const TableIcon = ({ color, style, ...props}: TableIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/tag-add-duotone/tag-add-duotone.tsx b/libs/components/icons/src/auto-icons/tag-add-duotone/tag-add-duotone.tsx
index 045115b9e3..2948399592 100644
--- a/libs/components/icons/src/auto-icons/tag-add-duotone/tag-add-duotone.tsx
+++ b/libs/components/icons/src/auto-icons/tag-add-duotone/tag-add-duotone.tsx
@@ -1,9 +1,6 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface TagAddDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     color0?: string
@@ -12,7 +9,7 @@ export interface TagAddDuotoneIconProps extends Omit<SvgIconProps, 'color'> {
     secondaryColor?: string
 }
 
-export const TagAddDuotoneIcon: FC<TagAddDuotoneIconProps> = ({ color0, primaryColor, color1, secondaryColor, style, ...props}) => {
+export const TagAddDuotoneIcon = ({ color0, primaryColor, color1, secondaryColor, style, ...props}: TagAddDuotoneIconProps) => {
     const propsStyles = {"--color-0": color0 || primaryColor, "--color-1": color1 || secondaryColor};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/tags/tags.tsx b/libs/components/icons/src/auto-icons/tags/tags.tsx
index 4d79fa6ed2..b2f4ab7e43 100644
--- a/libs/components/icons/src/auto-icons/tags/tags.tsx
+++ b/libs/components/icons/src/auto-icons/tags/tags.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface TagsIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const TagsIcon: FC<TagsIconProps> = ({ color, style, ...props}) => {
+export const TagsIcon = ({ color, style, ...props}: TagsIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/text-font/text-font.tsx b/libs/components/icons/src/auto-icons/text-font/text-font.tsx
index 84188037f0..5900812435 100644
--- a/libs/components/icons/src/auto-icons/text-font/text-font.tsx
+++ b/libs/components/icons/src/auto-icons/text-font/text-font.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface TextFontIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const TextFontIcon: FC<TextFontIconProps> = ({ color, style, ...props}) => {
+export const TextFontIcon = ({ color, style, ...props}: TextFontIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/text/text.tsx b/libs/components/icons/src/auto-icons/text/text.tsx
index 3500e23560..38ebf85471 100644
--- a/libs/components/icons/src/auto-icons/text/text.tsx
+++ b/libs/components/icons/src/auto-icons/text/text.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface TextIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const TextIcon: FC<TextIconProps> = ({ color, style, ...props}) => {
+export const TextIcon = ({ color, style, ...props}: TextIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/to-do/to-do.tsx b/libs/components/icons/src/auto-icons/to-do/to-do.tsx
index 4db46b78bc..03253fa6e7 100644
--- a/libs/components/icons/src/auto-icons/to-do/to-do.tsx
+++ b/libs/components/icons/src/auto-icons/to-do/to-do.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ToDoIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const ToDoIcon: FC<ToDoIconProps> = ({ color, style, ...props}) => {
+export const ToDoIcon = ({ color, style, ...props}: ToDoIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/todo-list/todo-list.tsx b/libs/components/icons/src/auto-icons/todo-list/todo-list.tsx
index c34489080c..164fbd0005 100644
--- a/libs/components/icons/src/auto-icons/todo-list/todo-list.tsx
+++ b/libs/components/icons/src/auto-icons/todo-list/todo-list.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface TodoListIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const TodoListIcon: FC<TodoListIconProps> = ({ color, style, ...props}) => {
+export const TodoListIcon = ({ color, style, ...props}: TodoListIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/triangle/triangle.tsx b/libs/components/icons/src/auto-icons/triangle/triangle.tsx
index 4eea5fc3c4..dd27616522 100644
--- a/libs/components/icons/src/auto-icons/triangle/triangle.tsx
+++ b/libs/components/icons/src/auto-icons/triangle/triangle.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface TriangleIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const TriangleIcon: FC<TriangleIconProps> = ({ color, style, ...props}) => {
+export const TriangleIcon = ({ color, style, ...props}: TriangleIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/turn-into/turn-into.tsx b/libs/components/icons/src/auto-icons/turn-into/turn-into.tsx
index bc1e24cde2..a9773ac4ad 100644
--- a/libs/components/icons/src/auto-icons/turn-into/turn-into.tsx
+++ b/libs/components/icons/src/auto-icons/turn-into/turn-into.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface TurnIntoIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const TurnIntoIcon: FC<TurnIntoIconProps> = ({ color, style, ...props}) => {
+export const TurnIntoIcon = ({ color, style, ...props}: TurnIntoIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/ungroup/ungroup.tsx b/libs/components/icons/src/auto-icons/ungroup/ungroup.tsx
index 1b5ecb9b27..d1c3c3be15 100644
--- a/libs/components/icons/src/auto-icons/ungroup/ungroup.tsx
+++ b/libs/components/icons/src/auto-icons/ungroup/ungroup.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface UngroupIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const UngroupIcon: FC<UngroupIconProps> = ({ color, style, ...props}) => {
+export const UngroupIcon = ({ color, style, ...props}: UngroupIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/unlock/unlock.tsx b/libs/components/icons/src/auto-icons/unlock/unlock.tsx
index 05fde07d9b..55219afb13 100644
--- a/libs/components/icons/src/auto-icons/unlock/unlock.tsx
+++ b/libs/components/icons/src/auto-icons/unlock/unlock.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface UnlockIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const UnlockIcon: FC<UnlockIconProps> = ({ color, style, ...props}) => {
+export const UnlockIcon = ({ color, style, ...props}: UnlockIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/web-app/web-app.tsx b/libs/components/icons/src/auto-icons/web-app/web-app.tsx
index ee1bcba6eb..ccb93a04d4 100644
--- a/libs/components/icons/src/auto-icons/web-app/web-app.tsx
+++ b/libs/components/icons/src/auto-icons/web-app/web-app.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface WebAppIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const WebAppIcon: FC<WebAppIconProps> = ({ color, style, ...props}) => {
+export const WebAppIcon = ({ color, style, ...props}: WebAppIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/libs/components/icons/src/auto-icons/youtube/youtube.tsx b/libs/components/icons/src/auto-icons/youtube/youtube.tsx
index 0f81383299..cd22e2bc2f 100644
--- a/libs/components/icons/src/auto-icons/youtube/youtube.tsx
+++ b/libs/components/icons/src/auto-icons/youtube/youtube.tsx
@@ -1,15 +1,12 @@
 
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface YoutubeIconProps extends Omit<SvgIconProps, 'color'> {
     color?: string
 }
 
-export const YoutubeIcon: FC<YoutubeIconProps> = ({ color, style, ...props}) => {
+export const YoutubeIcon = ({ color, style, ...props}: YoutubeIconProps) => {
     const propsStyles = {"color": color};
     const customStyles = {};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/tools/executors/figmaRes/figma/generateReactIcon.js b/tools/executors/figmaRes/figma/generateReactIcon.js
index dfc481f646..48dfe88a04 100644
--- a/tools/executors/figmaRes/figma/generateReactIcon.js
+++ b/tools/executors/figmaRes/figma/generateReactIcon.js
@@ -100,19 +100,16 @@ module.exports = async function generateReactIcon(name, svgCode, customStyles) {
     const colors = getColors(colorIdx);
 
     return `
-import { FC } from 'react';
 // eslint-disable-next-line no-restricted-imports
-import { SvgIcon } from '@mui/material';
-// eslint-disable-next-line no-restricted-imports
-import type { SvgIconProps } from '@mui/material';
+import { SvgIcon, SvgIconProps } from '@mui/material';
 
 export interface ${name}IconProps extends Omit<SvgIconProps, 'color'> {
     ${getColorsInterfaceProps(colors)}
 }
 
-export const ${name}Icon: FC<${name}IconProps> = ({ ${getRestColors(
+export const ${name}Icon = ({ ${getRestColors(
         colors
-    )}, style, ...props}) => {
+    )}, style, ...props}: ${name}IconProps) => {
     const propsStyles = ${getPropNameToColorValue(colors)};
     const customStyles = ${JSON.stringify(customStyles || {})};
     const styles = {...propsStyles, ...customStyles, ...style}
diff --git a/tools/executors/svgOptimize/svgo.js b/tools/executors/svgOptimize/svgo.js
index 6235fadb64..0f8902ed86 100644
--- a/tools/executors/svgOptimize/svgo.js
+++ b/tools/executors/svgOptimize/svgo.js
@@ -4,10 +4,6 @@ const { readdir, readFile, writeFile, exists } = require('fs/promises');
 const { pascalCase, paramCase } = require('change-case');
 const svgr = require('@svgr/core');
 
-function isDuotone(name) {
-    return name.endsWith('Duotone');
-}
-
 async function optimizeSvg(folder) {
     try {
         const icons = await readdir(folder);