2
0
mirror of https://github.com/inventree/InvenTree.git synced 2025-04-28 11:36:44 +00:00

Fix related field (#5524)

- Bug fix for "related field" component
This commit is contained in:
Oliver 2023-09-11 11:36:08 +10:00 committed by GitHub
parent a210e905dc
commit 2ea3499c48
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -4,14 +4,7 @@ import { UseFormReturnType } from '@mantine/form';
import { useDebouncedValue } from '@mantine/hooks'; import { useDebouncedValue } from '@mantine/hooks';
import { useId } from '@mantine/hooks'; import { useId } from '@mantine/hooks';
import { useQuery, useQueryClient } from '@tanstack/react-query'; import { useQuery, useQueryClient } from '@tanstack/react-query';
import { import { ReactNode, useEffect, useMemo, useState } from 'react';
ReactNode,
useCallback,
useEffect,
useMemo,
useRef,
useState
} from 'react';
import Select from 'react-select'; import Select from 'react-select';
import { api } from '../../../App'; import { api } from '../../../App';
@ -97,16 +90,6 @@ export function RelatedModelField({
const [value, setValue] = useState<string>(''); const [value, setValue] = useState<string>('');
const [searchText, cancelSearchText] = useDebouncedValue(value, 250); const [searchText, cancelSearchText] = useDebouncedValue(value, 250);
// Query controller
const abortControllerRef = useRef<AbortController | null>(null);
const getAbortController = useCallback(() => {
if (!abortControllerRef.current) {
abortControllerRef.current = new AbortController();
}
return abortControllerRef.current;
}, []);
const selectQuery = useQuery({ const selectQuery = useQuery({
enabled: !definition.disabled && !!definition.api_url && !definition.hidden, enabled: !definition.disabled && !!definition.api_url && !definition.hidden,
queryKey: [`related-field-${fieldName}`, offset, searchText], queryKey: [`related-field-${fieldName}`, offset, searchText],
@ -122,20 +105,21 @@ export function RelatedModelField({
url = url.substring(4); url = url.substring(4);
} }
let params = {
...definition.filters,
search: searchText,
offset: offset,
limit: limit
};
return api return api
.get(url, { .get(url, {
signal: getAbortController().signal, params: params
params: {
...definition.filters,
search: searchText,
offset: offset,
limit: limit
}
}) })
.then((response) => { .then((response) => {
let values: any[] = [...data]; let values: any[] = [...data];
let results = response.data?.results ?? []; let results = response.data?.results ?? response.data ?? [];
results.forEach((item: any) => { results.forEach((item: any) => {
values.push({ values.push({
@ -193,7 +177,6 @@ export function RelatedModelField({
options={data} options={data}
filterOption={null} filterOption={null}
onInputChange={(value: any) => { onInputChange={(value: any) => {
getAbortController().abort();
setValue(value); setValue(value);
setOffset(0); setOffset(0);
setData([]); setData([]);