diff --git a/src/app/(main)/reports/ReportsDataTable.js b/src/app/(main)/reports/ReportsDataTable.js
index b1c058f1..0daa3d06 100644
--- a/src/app/(main)/reports/ReportsDataTable.js
+++ b/src/app/(main)/reports/ReportsDataTable.js
@@ -5,14 +5,16 @@ import useFilterQuery from 'components/hooks/useFilterQuery';
import DataTable from 'components/common/DataTable';
import useCache from 'store/cache';
-export default function ReportsDataTable() {
+export default function ReportsDataTable({ websiteId }) {
const { get } = useApi();
const modified = useCache(state => state?.reports);
- const queryResult = useFilterQuery(['reports', { modified }], params => get(`/reports`, params));
+ const queryResult = useFilterQuery(['reports', { websiteId, modified }], params =>
+ get(websiteId ? `/websites/${websiteId}/reports` : `/reports`, params),
+ );
return (
- {({ data }) => }
+ {({ data }) => }
);
}
diff --git a/src/app/(main)/reports/ReportsTable.js b/src/app/(main)/reports/ReportsTable.js
index a85b09e3..fd41f393 100644
--- a/src/app/(main)/reports/ReportsTable.js
+++ b/src/app/(main)/reports/ReportsTable.js
@@ -1,16 +1,17 @@
+import { GridColumn, GridTable, Icon, Icons, Text, useBreakpoint } from 'react-basics';
import LinkButton from 'components/common/LinkButton';
import { useMessages } from 'components/hooks';
import useUser from 'components/hooks/useUser';
-import { GridColumn, GridTable, Icon, Icons, Text } from 'react-basics';
import { REPORT_TYPES } from 'lib/constants';
import ReportDeleteButton from './ReportDeleteButton';
export function ReportsTable({ data = [], showDomain }) {
const { formatMessage, labels } = useMessages();
const { user } = useUser();
+ const breakpoint = useBreakpoint();
return (
-
+
diff --git a/src/app/(main)/websites/[id]/reports/WebsiteReports.js b/src/app/(main)/websites/[id]/reports/WebsiteReports.js
index 69654375..5ea6f614 100644
--- a/src/app/(main)/websites/[id]/reports/WebsiteReports.js
+++ b/src/app/(main)/websites/[id]/reports/WebsiteReports.js
@@ -1,34 +1,12 @@
'use client';
-import Page from 'components/layout/Page';
-import Empty from 'components/common/Empty';
-import ReportsTable from '../../../../(main)/reports/ReportsTable';
-import { useMessages, useWebsiteReports } from 'components/hooks';
import Link from 'next/link';
import { Button, Flexbox, Icon, Icons, Text } from 'react-basics';
+import { useMessages } from 'components/hooks';
import WebsiteHeader from '../WebsiteHeader';
+import ReportsDataTable from 'app/(main)/reports/ReportsDataTable';
export function WebsiteReports({ websiteId }) {
const { formatMessage, labels } = useMessages();
- const {
- reports,
- error,
- isLoading,
- deleteReport,
- filter,
- handleFilterChange,
- handlePageChange,
- handlePageSizeChange,
- } = useWebsiteReports(websiteId);
-
- const hasData = (reports && reports.data.length !== 0) || filter;
-
- const handleDelete = async id => {
- await deleteReport(id);
- };
-
- if (isLoading || error) {
- return ;
- }
return (
<>
@@ -43,17 +21,7 @@ export function WebsiteReports({ websiteId }) {
- {hasData && (
-
- )}
- {!hasData && }
+
>
);
}
diff --git a/src/components/hooks/index.js b/src/components/hooks/index.js
index 79c0937c..697d54c3 100644
--- a/src/components/hooks/index.js
+++ b/src/components/hooks/index.js
@@ -20,4 +20,3 @@ export * from './useTheme';
export * from './useTimezone';
export * from './useUser';
export * from './useWebsite';
-export * from './useWebsiteReports';
diff --git a/src/components/hooks/useWebsiteReports.js b/src/components/hooks/useWebsiteReports.js
deleted file mode 100644
index c637bc76..00000000
--- a/src/components/hooks/useWebsiteReports.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import { useState } from 'react';
-import useApi from './useApi';
-import useApiFilter from 'components/hooks/useApiFilter';
-
-export function useWebsiteReports(websiteId) {
- const [modified, setModified] = useState(Date.now());
- const { get, useQuery, del, useMutation } = useApi();
- const { mutate } = useMutation(reportId => del(`/reports/${reportId}`));
- const { filter, page, pageSize, handleFilterChange, handlePageChange, handlePageSizeChange } =
- useApiFilter();
- const { data, error, isLoading } = useQuery(
- ['reports:website', { websiteId, modified, filter, page, pageSize }],
- () => get(`/websites/${websiteId}/reports`, { websiteId, filter, page, pageSize }),
- );
-
- const deleteReport = id => {
- mutate(id, {
- onSuccess: () => {
- setModified(Date.now());
- },
- });
- };
-
- return {
- reports: data,
- error,
- isLoading,
- deleteReport,
- filter,
- page,
- pageSize,
- handleFilterChange,
- handlePageChange,
- handlePageSizeChange,
- };
-}
-
-export default useWebsiteReports;
diff --git a/src/index.ts b/src/index.ts
index 87f2c0d6..a6bb4c6c 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -20,7 +20,6 @@ export * from 'components/hooks/useTheme';
export * from 'components/hooks/useTimezone';
export * from 'components/hooks/useUser';
export * from 'components/hooks/useWebsite';
-export * from 'components/hooks/useWebsiteReports';
export * from './app/(main)/settings/teams/[id]/TeamWebsiteAddForm';
export * from 'app/(main)/settings/teams/[id]/TeamEditForm';
diff --git a/src/pages/api/websites/[id]/reports.ts b/src/pages/api/websites/[id]/reports.ts
index da6ef7f1..971797f1 100644
--- a/src/pages/api/websites/[id]/reports.ts
+++ b/src/pages/api/websites/[id]/reports.ts
@@ -1,3 +1,4 @@
+import * as yup from 'yup';
import { canViewWebsite } from 'lib/auth';
import { useAuth, useCors, useValidate } from 'lib/middleware';
import { NextApiRequestQueryBody, SearchFilter } from 'lib/types';
@@ -9,7 +10,6 @@ export interface ReportsRequestQuery extends SearchFilter {
id: string;
}
-import * as yup from 'yup';
const schema = {
GET: yup.object().shape({
id: yup.string().uuid().required(),