remove real data from sign in
This commit is contained in:
@@ -1,12 +1,7 @@
|
|||||||
import { getEvents, transformMinimalEvent } from '@openpanel/db';
|
|
||||||
|
|
||||||
import LiveEvents from './live-events';
|
import LiveEvents from './live-events';
|
||||||
|
|
||||||
const LiveEventsServer = async () => {
|
const LiveEventsServer = () => {
|
||||||
const events = await getEvents(
|
return <LiveEvents />;
|
||||||
'SELECT * FROM events ORDER BY created_at DESC LIMIT 30'
|
|
||||||
);
|
|
||||||
return <LiveEvents events={events.map(transformMinimalEvent)} />;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export default LiveEventsServer;
|
export default LiveEventsServer;
|
||||||
|
|||||||
@@ -1,21 +1,121 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { useState } from 'react';
|
import { useEffect, useState } from 'react';
|
||||||
import { EventListItem } from '@/app/(app)/[organizationSlug]/[projectId]/events/event-list/event-list-item';
|
import { EventListItem } from '@/app/(app)/[organizationSlug]/[projectId]/events/event-list/event-list-item';
|
||||||
import useWS from '@/hooks/useWS';
|
|
||||||
import { AnimatePresence, motion } from 'framer-motion';
|
import { AnimatePresence, motion } from 'framer-motion';
|
||||||
|
|
||||||
import type { IServiceEventMinimal } from '@openpanel/db';
|
import type { IServiceEventMinimal } from '@openpanel/db';
|
||||||
|
|
||||||
type Props = {
|
const useWebEventGenerator = () => {
|
||||||
events: IServiceEventMinimal[];
|
const [events, setEvents] = useState<IServiceEventMinimal[]>([]);
|
||||||
|
|
||||||
|
const eventNames = [
|
||||||
|
'screen_view',
|
||||||
|
'session_start',
|
||||||
|
'session_end',
|
||||||
|
'submit_form',
|
||||||
|
'sign_in',
|
||||||
|
'sign_up',
|
||||||
|
'purchase_flow',
|
||||||
|
'purchase_flow_completed',
|
||||||
|
'subscription_started',
|
||||||
|
];
|
||||||
|
const browsers = [
|
||||||
|
'Chrome WebView',
|
||||||
|
'Firefox',
|
||||||
|
'Safari',
|
||||||
|
'Edge',
|
||||||
|
'Chrome',
|
||||||
|
'Opera',
|
||||||
|
'Internet Explorer',
|
||||||
|
];
|
||||||
|
const paths = [
|
||||||
|
'/features/',
|
||||||
|
'/contact/',
|
||||||
|
'/about/',
|
||||||
|
'/pricing/',
|
||||||
|
'/blog/',
|
||||||
|
'/signup/',
|
||||||
|
'/login/',
|
||||||
|
];
|
||||||
|
const countries = [
|
||||||
|
'BY',
|
||||||
|
'US',
|
||||||
|
'FR',
|
||||||
|
'IN',
|
||||||
|
'DE',
|
||||||
|
'JP',
|
||||||
|
'BR',
|
||||||
|
'ZA',
|
||||||
|
'EG',
|
||||||
|
'AU',
|
||||||
|
'RU',
|
||||||
|
'CN',
|
||||||
|
'IT',
|
||||||
|
'GB',
|
||||||
|
'CA',
|
||||||
|
];
|
||||||
|
const os = [
|
||||||
|
'Windows',
|
||||||
|
'MacOS',
|
||||||
|
'iOS',
|
||||||
|
'Android',
|
||||||
|
'Linux',
|
||||||
|
'Chrome OS',
|
||||||
|
'Windows Phone',
|
||||||
|
];
|
||||||
|
|
||||||
|
// Function to generate a random event
|
||||||
|
const generateEvent = (index?: number): IServiceEventMinimal => {
|
||||||
|
const event = {
|
||||||
|
id: Math.random().toString(36).substring(2, 15),
|
||||||
|
name: eventNames[Math.floor(Math.random() * eventNames.length)]!,
|
||||||
|
projectId: 'marketing-site',
|
||||||
|
sessionId: Math.random().toString(36).substring(2, 15),
|
||||||
|
createdAt: new Date(new Date().getTime() - (index || 0) * 1000),
|
||||||
|
country: countries[Math.floor(Math.random() * countries.length)],
|
||||||
|
longitude: 27.5709,
|
||||||
|
latitude: 53.9007,
|
||||||
|
os: os[Math.floor(Math.random() * os.length)],
|
||||||
|
browser: browsers[Math.floor(Math.random() * browsers.length)],
|
||||||
|
device: 'mobile',
|
||||||
|
brand: 'Xiaomi',
|
||||||
|
duration: 0,
|
||||||
|
path: paths[Math.floor(Math.random() * paths.length)]!,
|
||||||
|
origin: 'https://www.voxie.com',
|
||||||
|
referrer: 'https://syndicatedsearch.goog',
|
||||||
|
meta: undefined,
|
||||||
|
minimal: true,
|
||||||
|
};
|
||||||
|
|
||||||
|
return event;
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
let timer: NodeJS.Timeout;
|
||||||
|
// Generate initial 30 events
|
||||||
|
const initialEvents = Array.from({ length: 30 }).map((_, index) => {
|
||||||
|
return generateEvent(index);
|
||||||
|
});
|
||||||
|
setEvents(initialEvents);
|
||||||
|
|
||||||
|
function createNewEvent() {
|
||||||
|
const newEvent = generateEvent();
|
||||||
|
setEvents((prevEvents) => [newEvent, ...prevEvents]);
|
||||||
|
timer = setTimeout(() => createNewEvent(), Math.random() * 1000);
|
||||||
|
}
|
||||||
|
|
||||||
|
createNewEvent();
|
||||||
|
|
||||||
|
return () => clearInterval(timer);
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return events;
|
||||||
};
|
};
|
||||||
|
|
||||||
const LiveEvents = ({ events }: Props) => {
|
const LiveEvents = () => {
|
||||||
const [state, setState] = useState(events ?? []);
|
const state = useWebEventGenerator();
|
||||||
useWS<IServiceEventMinimal>('/live/events', (event) => {
|
|
||||||
setState((p) => [event, ...p].slice(0, 30));
|
|
||||||
});
|
|
||||||
return (
|
return (
|
||||||
<div className="hide-scrollbar h-screen overflow-y-auto">
|
<div className="hide-scrollbar h-screen overflow-y-auto">
|
||||||
<div className="text-background-foreground py-16 text-center text-2xl font-bold">
|
<div className="text-background-foreground py-16 text-center text-2xl font-bold">
|
||||||
|
|||||||
@@ -4,7 +4,9 @@ export function getProfileName(
|
|||||||
profile: IServiceProfile | undefined | null,
|
profile: IServiceProfile | undefined | null,
|
||||||
short = true
|
short = true
|
||||||
) {
|
) {
|
||||||
if (!profile) return 'Unknown';
|
if (!profile) {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
if (!profile.isExternal) {
|
if (!profile.isExternal) {
|
||||||
if (short) {
|
if (short) {
|
||||||
|
|||||||
Reference in New Issue
Block a user