feat(API): add support for filtering store components by is_component flag in getStoreComponents function

feat(StorePage): add support for filtering components by type (Flow or Component) in handleGetComponents and handleChangePagination functions
This commit is contained in:
cristhianzl 2023-10-31 20:08:27 -03:00
commit 7a9b972fb5
2 changed files with 32 additions and 12 deletions

View file

@ -589,11 +589,29 @@ export async function getFlowsStore(): Promise<AxiosResponse<FlowType[]>> {
return await api.get(`${BASE_URL_API}store/`);
}
export async function getStoreComponents(page: number = 1, limit: number = 10) {
export async function getStoreComponents(
page: number = 1,
limit: number = 10,
is_component?: boolean | null
) {
try {
const res = await api.get(
`${BASE_URL_API}store/components/?page=${page}&limit=${limit}`
);
let url = `${BASE_URL_API}store/components/`;
const queryParams: any = [];
if (page !== undefined) {
queryParams.push(`page=${page}`);
}
if (limit !== undefined) {
queryParams.push(`limit=${limit}`);
}
if (is_component !== null && is_component !== undefined) {
queryParams.push(`is_component=${is_component}`);
}
if (queryParams.length > 0) {
url += `?${queryParams.join("&")}`;
}
const res = await api.get(url);
if (res.status === 200) {
return res.data;
}

View file

@ -49,6 +49,7 @@ export default function StorePage(): JSX.Element {
const [tags, setTags] = useState<{ id: string; name: string }[]>([]);
const tagListId = useRef<{ id: string; name: string }[]>([]);
const [renderPagination, setRenderPagination] = useState(false);
const filterComponent = useRef<boolean | null>(null);
useEffect(() => {
getStoreTags().then((res) => {
@ -82,7 +83,8 @@ export default function StorePage(): JSX.Element {
const handleGetComponents = () => {
setLoading(true);
setRenderPagination(true);
getStoreComponents(index - 1, size)
getStoreComponents(index - 1, size, filterComponent.current)
.then((res) => {
setSearchData(res);
setData(res);
@ -121,7 +123,7 @@ export default function StorePage(): JSX.Element {
function handleChangePagination(pageIndex: number, pageSize: number) {
setLoading(true);
setRenderPagination(true);
getStoreComponents(pageIndex, pageSize)
getStoreComponents(pageIndex, pageSize, filterComponent.current)
.then((res) => {
setData(res);
setSearchData(res);
@ -218,15 +220,15 @@ export default function StorePage(): JSX.Element {
<Select
onValueChange={(value) => {
if (value === "Flow") {
setSearchData(data.filter((f) => f.is_component === false));
setRenderPagination(false);
filterComponent.current = false;
} else if (value === "Component") {
setSearchData(data.filter((f) => f.is_component === true));
setRenderPagination(false);
filterComponent.current = true;
} else {
setSearchData(data);
setRenderPagination(true);
filterComponent.current = null;
}
setPageIndex(1);
setPageSize(10);
handleGetComponents();
}}
>
<SelectTrigger className="w-[180px]">