feat: refactor ClientSelect to use ObjectSelect for improved client selection

This commit is contained in:
2025-09-02 06:11:24 +03:00
parent 9dde9041b1
commit bdbdd10231
2 changed files with 12 additions and 65 deletions

View File

@@ -1,75 +1,23 @@
import { FC, ReactNode, useEffect, useState } from "react";
import { Select, Text } from "@mantine/core";
import { FC } from "react";
import { ClientSchema } from "../../../client";
import useClientsList from "../../../pages/ClientsPage/hooks/useClientsList.tsx";
import ObjectSelect, { ObjectSelectProps } from "../../ObjectSelect/ObjectSelect.tsx";
type Props = {
value?: ClientSchema;
onChange: (client: ClientSchema) => void;
withLabel?: boolean;
error?: string;
inputContainer?: (children: ReactNode) => ReactNode;
disabled?: boolean;
};
type Props = Omit<
ObjectSelectProps<ClientSchema>,
"data" | "getLabelFn" | "getValueFn"
>;
type Option = {
label: string;
value: string;
};
const ClientSelect: FC<Props> = ({ value, onChange, error, inputContainer, withLabel = false, disabled = false }) => {
const ClientSelect: FC<Props> = (props: Props) => {
const { clients } = useClientsList({ all: true });
const [options, setOptions] = useState<Option[]>([]);
const [deletedClientIds, setDeletedClientIds] = useState<Set<number>>(new Set());
const [errorMsg, setErrorMsg] = useState<string>("");
useEffect(() => {
const options = clients
.filter(client => !client.isDeleted)
.map(client => ({
label: client.name,
value: client.id.toString(),
}));
setOptions(options);
const deletedClientIds = clients.filter(client => client.isDeleted).map(client => client.id);
setDeletedClientIds(new Set(deletedClientIds));
}, [options]);
useEffect(() => {
if (value && deletedClientIds.has(value.id)) {
setErrorMsg("Выбран удаленный клиент");
} else {
setErrorMsg("");
}
}, [value, deletedClientIds]);
return (
<>
<Select
searchable
placeholder={"Выберите клиента"}
value={
value &&
options.find(client => client.value == value.id.toString())
?.value
}
onChange={event => {
if (!event) return;
const client = clients.find(
client => client.id == parseInt(event),
);
if (!client) return;
onChange(client);
}}
data={options}
label={withLabel && "Клиент"}
error={error}
inputContainer={inputContainer}
disabled={disabled}
/>
{errorMsg && <Text size={"sm"} c={"red"}>{errorMsg}</Text>}
</>
<ObjectSelect
{...props}
placeholder={"Выберите клиента"}
data={clients.filter(cl => !cl.isDeleted)}
/>
);
};
export default ClientSelect;

View File

@@ -149,7 +149,6 @@ const ClientTab = () => {
<ClientSelect
value={client}
onChange={setClient}
withLabel
disabled={!isEqual(initialValues, form.values) || !!card?.chat}
/>
{!card?.chat && (