refactor: tool options components

src/components/options/CheckboxWithDesc.tsx

@@ -0,0 +1,34 @@
+import React from 'react';
+import { Box, Checkbox, FormControlLabel, Typography } from '@mui/material';
+
+const CheckboxWithDesc = ({
+  title,
+  description,
+  checked,
+  onChange
+}: {
+  title: string;
+  description: string;
+  checked: boolean;
+  onChange: (value: boolean) => void;
+}) => {
+  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    onChange(event.target.checked);
+  };
+
+  return (
+    <Box>
+      <FormControlLabel
+        control={
+          <Checkbox defaultChecked checked={checked} onChange={handleChange} />
+        }
+        label={title}
+      />
+      <Typography fontSize={12} mt={1}>
+        {description}
+      </Typography>
+    </Box>
+  );
+};
+
+export default CheckboxWithDesc;