complete installation page - create reusable table - install and config react query

src/components/installation-reports/index.tsx

@@ -0,0 +1,19 @@
+import { useQuery } from "@tanstack/react-query"
+import { installationReportsCol } from "../../utility/reports"
+import { Table } from "../common/table"
+import { getReportsList } from "../../services/api"
+import { useState } from "react"
+import { SortingState } from "@tanstack/react-table"
+
+export const InstallationReports = () => {
+    const [sorting, setSorting] = useState<SortingState>([])
+    const { data, isLoading } = useQuery({
+        queryKey: ["installation-reports-list"],
+        queryFn: getReportsList
+    })
+
+    if (isLoading) return <p>LODING .....</p>
+    return (
+        <Table columns={installationReportsCol} data={data?.data} sorting={sorting} setSorting={setSorting} />
+    )
+}