Updated components build.

This commit is contained in:
Mike Cao 2025-09-01 15:59:06 -07:00
parent 5f27ba149b
commit 56af91950a
53 changed files with 942 additions and 333 deletions

View file

@ -1,8 +1,8 @@
'use client';
import { createContext, ReactNode } from 'react';
import { useWebsiteQuery } from '@/components/hooks';
import { Loading } from '@umami/react-zen';
import { Website } from '@/generated/prisma/client';
import { useWebsiteQuery } from '@/components/hooks/queries/useWebsiteQuery';
export const WebsiteContext = createContext<Website>(null);

View file

@ -143,12 +143,12 @@ export function WebsiteNav({ websiteId }: { websiteId: string }) {
},
];
const selectedKey =
items.flatMap(e => e.items).find(({ path }) => path && pathname.endsWith(path.split('?')[0]))
?.id || 'overview';
const selectedKey = items
.flatMap(e => e.items)
.find(({ path }) => path && pathname.endsWith(path.split('?')[0]))?.id;
return (
<SideMenu items={items} selectedKey={selectedKey} allowMinimize={false}>
<SideMenu items={items} selectedKey={selectedKey} allowMinimize={false} muteItems={false}>
<WebsiteSelect websiteId={websiteId} teamId={teamId} />
</SideMenu>
);

View file

@ -1,5 +1,5 @@
import { useMemo, useState } from 'react';
import { Select, ListItem, Grid } from '@umami/react-zen';
import { Select, ListItem, Grid, Column } from '@umami/react-zen';
import {
useEventDataPropertiesQuery,
useEventDataValuesQuery,
@ -33,40 +33,41 @@ export function EventProperties({ websiteId }: { websiteId: string }) {
isFetching={isFetching}
error={error}
minHeight="300px"
gap="6"
>
{data && (
<Grid columns="repeat(auto-fill, minmax(300px, 1fr))" marginBottom="3" gap>
<Select
label={formatMessage(labels.event)}
value={eventName}
onChange={setEventName}
placeholder=""
>
{events?.map(p => (
<ListItem key={p} id={p}>
{p}
</ListItem>
))}
</Select>
<Select
label={formatMessage(labels.property)}
value={propertyName}
onChange={setPropertyName}
isDisabled={!eventName}
placeholder=""
>
{properties?.map(p => (
<ListItem key={p} id={p}>
{p}
</ListItem>
))}
</Select>
</Grid>
)}
{eventName && propertyName && (
<EventValues websiteId={websiteId} eventName={eventName} propertyName={propertyName} />
)}
<Column gap="6">
{data && (
<Grid columns="repeat(auto-fill, minmax(300px, 1fr))" marginBottom="3" gap>
<Select
label={formatMessage(labels.event)}
value={eventName}
onChange={setEventName}
placeholder=""
>
{events?.map(p => (
<ListItem key={p} id={p}>
{p}
</ListItem>
))}
</Select>
<Select
label={formatMessage(labels.property)}
value={propertyName}
onChange={setPropertyName}
isDisabled={!eventName}
placeholder=""
>
{properties?.map(p => (
<ListItem key={p} id={p}>
{p}
</ListItem>
))}
</Select>
</Grid>
)}
{eventName && propertyName && (
<EventValues websiteId={websiteId} eventName={eventName} propertyName={propertyName} />
)}
</Column>
</LoadingPanel>
);
}

View file

@ -10,7 +10,7 @@ import {
Row,
} from '@umami/react-zen';
import { useState } from 'react';
import { getRandomChars } from '@/lib/crypto';
import { getRandomChars } from '@/lib/generate';
import { useMessages, useUpdateQuery } from '@/components/hooks';
const generateId = () => getRandomChars(16);