Created ExpandedViewModal component.

This commit is contained in:
Mike Cao 2025-10-09 14:31:53 -07:00
parent 038f397503
commit e4ce7c9071
4 changed files with 53 additions and 92 deletions

View file

@ -7,30 +7,12 @@ import { WebsiteChart } from '@/app/(main)/websites/[websiteId]/WebsiteChart';
import { LinkMetricsBar } from '@/app/(main)/links/[linkId]/LinkMetricsBar';
import { LinkControls } from '@/app/(main)/links/[linkId]/LinkControls';
import { LinkPanels } from '@/app/(main)/links/[linkId]/LinkPanels';
import { Column, Dialog, Grid, Modal } from '@umami/react-zen';
import { WebsiteExpandedView } from '@/app/(main)/websites/[websiteId]/WebsiteExpandedView';
import { useNavigation } from '@/components/hooks';
import { Column, Grid } from '@umami/react-zen';
import { ExpandedViewModal } from '@/app/(main)/websites/[websiteId]/ExpandedViewModal';
const excludedIds = ['path', 'entry', 'exit', 'title', 'language', 'screen', 'event'];
export function LinkPage({ linkId }: { linkId: string }) {
const {
router,
query: { view },
updateParams,
} = useNavigation();
const handleClose = (close: () => void) => {
router.push(updateParams({ view: undefined }));
close();
};
const handleOpenChange = (isOpen: boolean) => {
if (!isOpen) {
router.push(updateParams({ view: undefined }));
}
};
return (
<LinkProvider linkId={linkId}>
<Grid width="100%" height="100%">
@ -44,19 +26,7 @@ export function LinkPage({ linkId }: { linkId: string }) {
</Panel>
<LinkPanels linkId={linkId} />
</PageBody>
<Modal isOpen={!!view} onOpenChange={handleOpenChange} isDismissable>
<Dialog style={{ maxWidth: 1320, width: '100vw', height: 'calc(100vh - 40px)' }}>
{({ close }) => {
return (
<WebsiteExpandedView
websiteId={linkId}
excludedIds={excludedIds}
onClose={() => handleClose(close)}
/>
);
}}
</Dialog>
</Modal>
<ExpandedViewModal websiteId={linkId} excludedIds={excludedIds} />
</Column>
</Grid>
</LinkProvider>