Added search to metrics table.

This commit is contained in:
Mike Cao 2023-12-10 02:02:24 -08:00
parent 3a28fea8ac
commit cad719fd23
12 changed files with 111 additions and 60 deletions

View file

@ -6,7 +6,7 @@ import FilterTags from 'components/metrics/FilterTags';
import useNavigation from 'components/hooks/useNavigation';
import { useWebsite } from 'components/hooks';
import WebsiteChart from './WebsiteChart';
import WebsiteMenuView from './WebsiteMenuView';
import WebsiteExpandedView from './WebsiteExpandedView';
import WebsiteHeader from './WebsiteHeader';
import WebsiteMetricsBar from './WebsiteMetricsBar';
import WebsiteTableView from './WebsiteTableView';
@ -34,7 +34,7 @@ export default function WebsiteDetails({ websiteId }: { websiteId: string }) {
{website && (
<>
{!view && <WebsiteTableView websiteId={websiteId} />}
{view && <WebsiteMenuView websiteId={websiteId} />}
{view && <WebsiteExpandedView websiteId={websiteId} />}
</>
)}
</>

View file

@ -15,7 +15,7 @@ import SideNav from 'components/layout/SideNav';
import useNavigation from 'components/hooks/useNavigation';
import useMessages from 'components/hooks/useMessages';
import LinkButton from 'components/common/LinkButton';
import styles from './WebsiteMenuView.module.css';
import styles from './WebsiteExpandedView.module.css';
const views = {
url: PagesTable,
@ -33,7 +33,7 @@ const views = {
query: QueryParametersTable,
};
export default function WebsiteMenuView({
export default function WebsiteExpandedView({
websiteId,
websiteDomain,
}: {
@ -113,11 +113,11 @@ export default function WebsiteMenuView({
const DetailsComponent = views[view] || (() => null);
const handleChange = view => {
const handleChange = (view: any) => {
router.push(makeUrl({ view }));
};
const renderValue = value => items.find(({ key }) => key === value)?.label;
const renderValue = (value: string) => items.find(({ key }) => key === value)?.label;
return (
<div className={styles.layout}>
@ -146,9 +146,10 @@ export default function WebsiteMenuView({
websiteDomain={websiteDomain}
limit={false}
animate={false}
showFilters={true}
virtualize={true}
itemCount={25}
allowFilter={true}
allowSearch={true}
/>
</div>
</div>