Feat: Set the color of the canvas's control button #3851 (#4053)

### What problem does this PR solve?

Feat: Set the color of the canvas's control button #3851

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/components/theme-provider.tsx

@@ -58,3 +58,9 @@ export const useTheme = () => {
 
   return context;
 };
+
+export const useIsDarkTheme = () => {
+  const { theme } = useTheme();
+
+  return theme === 'dark';
+};

web/src/pages/flow/canvas/index.tsx

@@ -103,6 +103,8 @@ function FlowCanvas({ drawerVisible, hideDrawer }: IProps) {
     hideSingleDebugDrawer,
   } = useShowSingleDebugDrawer();
 
+  const controlIconClassname = 'text-black';
+
   const { formDrawerVisible, hideFormDrawer, showFormDrawer, clickedNode } =
     useShowFormDrawer();
 
@@ -229,7 +231,7 @@ function FlowCanvas({ drawerVisible, hideDrawer }: IProps) {
             <TooltipProvider>
               <Tooltip>
                 <TooltipTrigger asChild>
-                  <FolderInput />
+                  <FolderInput className={controlIconClassname} />
                 </TooltipTrigger>
                 <TooltipContent>Import</TooltipContent>
               </Tooltip>
@@ -239,7 +241,7 @@ function FlowCanvas({ drawerVisible, hideDrawer }: IProps) {
             <TooltipProvider>
               <Tooltip>
                 <TooltipTrigger asChild>
-                  <FolderOutput />
+                  <FolderOutput className={controlIconClassname} />
                 </TooltipTrigger>
                 <TooltipContent>Export</TooltipContent>
               </Tooltip>