refactor: remove unnecessary state and ui improvements

src/components/ToolContent.tsx

@@ -57,6 +57,7 @@ interface ToolContentProps<T, I> extends ToolComponentProps {
   setInput?: React.Dispatch<React.SetStateAction<I>>;
   validationSchema?: any;
   onValuesChange?: (values: T) => void;
+  verticalGroups?: boolean;
 }
 
 export default function ToolContent<T extends FormikValues, I>({
@@ -72,7 +73,8 @@ export default function ToolContent<T extends FormikValues, I>({
   setInput,
   validationSchema,
   renderCustomInput,
-  onValuesChange
+  onValuesChange,
+  verticalGroups
 }: ToolContentProps<T, I>) {
   return (
     <Box>
@@ -97,7 +99,7 @@ export default function ToolContent<T extends FormikValues, I>({
                 input={input}
                 onValuesChange={onValuesChange}
               />
-              <ToolOptions getGroups={getGroups} />
+              <ToolOptions getGroups={getGroups} vertical={verticalGroups} />
 
               {toolInfo && toolInfo.title && toolInfo.description && (
                 <ToolInfo

src/components/input/NumericInputWithUnit.tsx

@@ -143,8 +143,6 @@ export default function NumericInputWithUnit(props: {
         <Select
           fullWidth
           disabled={disableChangingUnit}
-          label="Prefix"
-          title="Prefix"
           value={prefix}
           onChange={(evt) => {
             handlePrefixChange(evt.target.value || '');

src/components/options/ToolOptions.tsx

@@ -13,10 +13,12 @@ export type GetGroupsType<T> = (
 
 export default function ToolOptions<T extends FormikValues>({
   children,
-  getGroups
+  getGroups,
+  vertical
 }: {
   children?: ReactNode;
   getGroups: GetGroupsType<T> | null;
+  vertical?: boolean;
 }) {
   const theme = useTheme();
   const formikContext = useFormikContext<T>();
@@ -49,6 +51,7 @@ export default function ToolOptions<T extends FormikValues>({
         <Stack direction={'row'} spacing={2}>
           <ToolOptionGroups
             groups={getGroups({ ...formikContext, updateField }) ?? []}
+            vertical={vertical}
           />
           {children}
         </Stack>