64 lines
1.7 KiB
TypeScript
64 lines
1.7 KiB
TypeScript
import style from '../AdminTable/Admin.module.css';
|
||
import { getQueryValue } from '@/api/cache/query';
|
||
import type { ResponseQueries } from '@/api/cache/types';
|
||
import type { CollapseProps } from 'antd';
|
||
import { Button, Collapse } from 'antd';
|
||
import { useState } from 'react';
|
||
import styled from 'styled-components';
|
||
|
||
type IProps = {
|
||
readonly data: string;
|
||
readonly index: number;
|
||
readonly name: string;
|
||
readonly onClick: (name: string, key: string) => void;
|
||
};
|
||
|
||
const Wrapper = styled.div`
|
||
display: flex;
|
||
justify-content: space-between;
|
||
`;
|
||
|
||
export default function AdminRow(props: IProps) {
|
||
const { data, index, name, onClick } = props;
|
||
const defaultItems: CollapseProps['items'] = [
|
||
{
|
||
children: <p>{data}</p>,
|
||
key: index.toString(),
|
||
label: data,
|
||
},
|
||
];
|
||
|
||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||
const [queryText, setQueryText] = useState<ResponseQueries>({});
|
||
const [items, setItems] = useState<CollapseProps['items']>(defaultItems);
|
||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||
const [key, setKey] = useState(data);
|
||
|
||
const handleClick = () => {
|
||
onClick(name, key);
|
||
};
|
||
|
||
const handleChange = async () => {
|
||
const query = await getQueryValue(key);
|
||
setQueryText(query);
|
||
setItems(
|
||
[...items].map((obj) => ({
|
||
...obj,
|
||
children: <p>lolo</p>,
|
||
}))
|
||
);
|
||
};
|
||
|
||
return (
|
||
<Wrapper>
|
||
<Collapse className={style.collapse} onChange={handleChange} items={items} />
|
||
<Button onClick={handleClick}>Удалить</Button>
|
||
</Wrapper>
|
||
);
|
||
}
|
||
|
||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||
function addSlashToString(key: string) {
|
||
return key.replace(`"`, '"');
|
||
}
|