feat: dashboard v2, esm, upgrades (#211)

* esm * wip * wip * wip * wip * wip * wip * subscription notice * wip * wip * wip * fix envs * fix: update docker build * fix * esm/types * delete dashboard :D * add patches to dockerfiles * update packages + catalogs + ts * wip * remove native libs * ts * improvements * fix redirects and fetching session * try fix favicon * fixes * fix * order and resize reportds within a dashboard * improvements * wip * added userjot to dashboard * fix * add op * wip * different cache key * improve date picker * fix table * event details loading * redo onboarding completely * fix login * fix * fix * extend session, billing and improve bars * fix * reduce price on 10M
2025-10-16 12:27:44 +02:00
parent 436e81ecc9
commit 81a7e5d62e
741 changed files with 32695 additions and 16996 deletions
--- a/apps/start/src/components/report/sidebar/EventPropertiesCombobox.tsx
+++ b/apps/start/src/components/report/sidebar/EventPropertiesCombobox.tsx
@@ -0,0 +1,62 @@
+import { Combobox } from '@/components/ui/combobox';
+import { useAppParams } from '@/hooks/use-app-params';
+import { useEventProperties } from '@/hooks/use-event-properties';
+import { useDispatch, useSelector } from '@/redux';
+import { api } from '@/trpc/client';
+import { cn } from '@/utils/cn';
+import { DatabaseIcon } from 'lucide-react';
+
+import type { IChartEvent } from '@openpanel/validation';
+
+import { changeEvent } from '../reportSlice';
+
+interface EventPropertiesComboboxProps {
+  event: IChartEvent;
+}
+
+export function EventPropertiesCombobox({
+  event,
+}: EventPropertiesComboboxProps) {
+  const dispatch = useDispatch();
+  const { projectId } = useAppParams();
+  const properties = useEventProperties(
+    {
+      event: event.name,
+      projectId,
+    },
+    {
+      enabled: !!event.name,
+    },
+  ).map((item) => ({
+    label: item,
+    value: item,
+  }));
+
+  return (
+    <Combobox
+      searchable
+      placeholder="Select a filter"
+      value=""
+      items={properties}
+      onChange={(value) => {
+        dispatch(
+          changeEvent({
+            ...event,
+            property: value,
+          }),
+        );
+      }}
+    >
+      <button
+        type="button"
+        className={cn(
+          'flex items-center gap-1 rounded-md border border-border p-1 px-2 text-sm font-medium leading-none',
+          !event.property && 'border-destructive text-destructive',
+        )}
+      >
+        <DatabaseIcon size={12} />{' '}
+        {event.property ? `Property: ${event.property}` : 'Select property'}
+      </button>
+    </Combobox>
+  );
+}