feat: Standardize IAIMantineSelect Component

This commit is contained in:
blessedcoolant 2023-06-12 21:25:37 +12:00 committed by psychedelicious
parent 32200efce8
commit 5fe674e223
4 changed files with 16 additions and 7 deletions

View File

@ -53,7 +53,7 @@ function ThemeLocaleProvider({ children }: ThemeLocaleProviderProps) {
}, [direction]);
return (
<MantineProvider withGlobalStyles withNormalizeCSS theme={mantineTheme}>
<MantineProvider withGlobalStyles theme={mantineTheme}>
<ChakraProvider theme={theme} colorModeManager={manager}>
{children}
</ChakraProvider>

View File

@ -0,0 +1,11 @@
import { Select, SelectProps } from '@mantine/core';
import { memo } from 'react';
type IAISelectProps = SelectProps;
const IAIMantineSelect = (props: IAISelectProps) => {
const { searchable = true, ...rest } = props;
return <Select searchable={searchable} {...rest} />;
};
export default memo(IAIMantineSelect);

View File

@ -1,8 +1,8 @@
import { Select } from '@mantine/core';
import { createSelector } from '@reduxjs/toolkit';
import { Scheduler } from 'app/constants';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
import IAIMantineSelect from 'common/components/IAIMantineSelect';
import { generationSelector } from 'features/parameters/store/generationSelectors';
import { setScheduler } from 'features/parameters/store/generationSlice';
import { uiSelector } from 'features/ui/store/uiSelectors';
@ -51,12 +51,11 @@ const ParamScheduler = () => {
// );
return (
<Select
<IAIMantineSelect
label={t('parameters.scheduler')}
value={scheduler}
validValues={allSchedulers}
onChange={handleChange}
searchable
/>
);

View File

@ -3,10 +3,10 @@ import { isEqual } from 'lodash-es';
import { ChangeEvent, memo, useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import { Select } from '@mantine/core';
import { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { IAICustomSelectOption } from 'common/components/IAICustomSelect';
import IAIMantineSelect from 'common/components/IAIMantineSelect';
import { generationSelector } from 'features/parameters/store/generationSelectors';
import { modelSelected } from 'features/parameters/store/generationSlice';
import { selectModelsAll, selectModelsById } from '../store/modelSlice';
@ -62,12 +62,11 @@ const ModelSelect = () => {
// );
return (
<Select
<IAIMantineSelect
label={t('modelManager.model')}
value={selectedModel?.name ?? ''}
placeholder="Pick one"
data={modelData}
searchable
onChange={handleChangeModel}
/>
);