yashwin/VMS-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add backend filters

Browse Source
This commit is contained in:
NlightN22 2025-02-01 15:45:39 +07:00
parent 321d9bf7f5
commit 82998eb2ea
3 changed files with 24 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/pages/MainPage.tsx
View File

@ -42,10 +42,21 @@ const MainPage = () => {
if (!isProduction) console.log('Realmuser:', realmUser)
const { data: cameras, isPending, isError, refetch } = useQuery({
queryKey: [frigateQueryKeys.getCamerasWHost],
queryFn: frigateApi.getCamerasWHost
queryKey: [frigateQueryKeys.getCamerasWHost, selectedHostId, searchQuery, selectedTags],
queryFn: () =>
frigateApi.getCamerasWHost({
name: searchQuery, // filter by camera name
frigateHostId: selectedHostId, // filter by host id
tagIds: selectedTags, // filter by tag id(s)
// offset and limit can be added later for pagination
}),
})
useEffect(() => {
setFilteredCameras(cameras || []);
setVisibleCameras([]); // reset visible cameras for pagination
}, [cameras]);
useEffect(() => {
const pageSize = 20;
if (inView && filteredCameras.length > visibleCameras.length) {
@ -75,23 +86,6 @@ const MainPage = () => {
return () => setRightChildren(null);
}, []);
useEffect(() => {
if (!cameras) {
setFilteredCameras([])
return
}
const filterCameras = (camera: GetCameraWHostWConfig) => {
const matchesHostId = selectedHostId ? camera.frigateHost?.id === selectedHostId : true
const matchesSearchQuery = searchQuery ? camera.name.toLowerCase().includes(searchQuery.toLowerCase()) : true
const matchesTags = selectedTags ? selectedTags.length === 0 || camera.tags.some(tag => selectedTags.includes(tag.id)) : true
return matchesHostId && matchesSearchQuery && matchesTags
}
setFilteredCameras(cameras.filter(filterCameras))
setVisibleCameras([])
}, [searchQuery, cameras, selectedHostId, selectedTags])
const debouncedHandleSearchQuery = useDebounce((value: string) => {
mainStore.setSearchQuery(value, navigate);

11
src/services/frigate.proxy/frigate.api.ts
View File

@ -46,7 +46,16 @@ export const frigateApi = {
getHost: (id: string) => instanceApi.get<GetFrigateHost>(`apiv1/frigate-hosts/${id}`).then(res => res.data),
getCameraById: (cameraId: string) => instanceApi.get<GetCameraWHostWConfig>(`apiv1/cameras/${cameraId}`).then(res => res.data),
getCamerasByHostId: (hostId: string) => instanceApi.get<GetCameraWHostWConfig[]>(`apiv1/cameras/host/${hostId}`).then(res => res.data),
getCamerasWHost: () => instanceApi.get<GetCameraWHostWConfig[]>(`apiv1/cameras`).then(res => res.data),
getCamerasWHost: (params: {
name?: string | null | undefined;
frigateHostId?: string | null | undefined;
tagIds?: string | string[];
offset?: number;
limit?: number;
} = {}) =>
instanceApi
.get<GetCameraWHostWConfig[]>('apiv1/cameras', { params })
.then(res => res.data),
getCameraWHost: (id: string) => instanceApi.get<GetCameraWHostWConfig>(`apiv1/cameras/${id}`).then(res => res.data),
putHosts: (hosts: PutFrigateHost[]) => instanceApi.put<GetFrigateHost[]>('apiv1/frigate-hosts', hosts).then(res => res.data),
deleteHosts: (hosts: DeleteFrigateHost[]) => instanceApi.delete<GetFrigateHost[]>('apiv1/frigate-hosts', { data: hosts }).then(res => res.data),

2
src/shared/components/CamerasTransferList.tsx
View File

@ -18,7 +18,7 @@ const CamerasTransferList = ({
const queryClient = useQueryClient()
const { data: cameras, isPending, isError, refetch } = useQuery({
queryKey: [frigateQueryKeys.getCamerasWHost, roleId],
queryFn: frigateApi.getCamerasWHost
queryFn: () => frigateApi.getCamerasWHost()
})
const [lists, setLists] = useState<[TransferListItem[], TransferListItem[]]>([[], []])