github
/
portainer
mirror of https://github.com/portainer/portainer
1
0
Fork 0
Code Issues Releases Wiki Activity

fix(group): create group twice when associating devices [EE-7418] (#12092)

pull/12101/head
Oscar Zhou 2024-08-12 17:09:49 +12:00 committed by GitHub
parent aaec856282
commit 13d9b12a2e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 0 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
app/react/edge/edge-devices/WaitingRoomView/Datatable/AssignmentDialog/Selectors/GroupSelector.tsx
View File

@ -1,4 +1,3 @@
import { useCallback, useState } from 'react';
import { useField } from 'formik'; import { useField } from 'formik';
import { useGroups } from '@/react/portainer/environments/environment-groups/queries'; import { useGroups } from '@/react/portainer/environments/environment-groups/queries';
@ -7,7 +6,6 @@ import { useCreateGroupMutation } from '@/react/portainer/environments/environme
import { notifySuccess } from '@/portainer/services/notifications'; import { notifySuccess } from '@/portainer/services/notifications';
import { Select } from '@@/form-components/ReactSelect'; import { Select } from '@@/form-components/ReactSelect';
import { Option } from '@@/form-components/PortainerSelect';
import { FormValues } from '../types'; import { FormValues } from '../types';
@ -23,12 +21,6 @@ export function GroupSelector() {
.map((opt) => ({ label: opt.Name, value: opt.Id })), .map((opt) => ({ label: opt.Name, value: opt.Id })),
}); });
const { onInputChange, clearInputValue } = useCreateOnBlur({
options: groupsQuery.data || [],
setValue,
createValue: handleCreate,
});
if (!groupsQuery.data) { if (!groupsQuery.data) {
return null; return null;
} }
@ -47,7 +39,6 @@ export function GroupSelector() {
} }
onCreateOption={handleCreate} onCreateOption={handleCreate}
onChange={handleChange} onChange={handleChange}
onInputChange={onInputChange}
onBlur={onBlur} onBlur={onBlur}
isLoading={createMutation.isLoading} isLoading={createMutation.isLoading}
isDisabled={createMutation.isLoading} isDisabled={createMutation.isLoading}
@ -71,54 +62,5 @@ export function GroupSelector() {
function handleChange(value: { value: EnvironmentGroupId } | null) { function handleChange(value: { value: EnvironmentGroupId } | null) {
setValue(value ? value.value : 1); setValue(value ? value.value : 1);
clearInputValue();
} }
} }
function useCreateOnBlur({
options,
setValue,
createValue,
}: {
options: Option<number>[];
setValue: (value: number) => void;
createValue: (value: string) => void;
}) {
const [inputValue, setInputValue] = useState('');
const handleBlur = useCallback(() => {
const label = inputValue?.trim() || '';
if (!label) {
return;
}
const option = options.find((opt) => opt.label === label);
if (option) {
setValue(option.value);
} else {
createValue(label);
}
setInputValue('');
}, [createValue, inputValue, options, setValue]);
const handleInputChange = useCallback(
(inputValue, { action }) => {
if (action === 'input-change') {
setInputValue(inputValue);
}
if (action === 'input-blur') {
handleBlur();
}
},
[handleBlur]
);
const clearInputValue = useCallback(() => {
setInputValue('');
}, []);
return {
onInputChange: handleInputChange,
clearInputValue,
};
}