make tracker script smaller and general improvement for web

This commit is contained in:
Carl-Gerhard Lindesvärd
2024-01-21 22:50:49 +01:00
parent 46d5d203dc
commit df239ba436
18 changed files with 132 additions and 112 deletions

1
.gitignore vendored
View File

@@ -2,6 +2,7 @@
packages/sdk/profileId.txt packages/sdk/profileId.txt
packages/sdk/test.ts packages/sdk/test.ts
dump.sql dump.sql
dump-*.sql
# Logs # Logs

View File

@@ -1,14 +1,15 @@
'use client'; 'use client';
import { api, handleError, handleErrorToastOptions } from '@/app/_trpc/client'; import { api, handleErrorToastOptions } from '@/app/_trpc/client';
import { Card, CardActions, CardActionsItem } from '@/components/Card'; import { Card, CardActions, CardActionsItem } from '@/components/Card';
import { ToastAction } from '@/components/ui/toast'; import { ToastAction } from '@/components/ui/toast';
import { toast } from '@/components/ui/use-toast'; import { toast } from '@/components/ui/use-toast';
import { useAppParams } from '@/hooks/useAppParams';
import { pushModal } from '@/modals'; import { pushModal } from '@/modals';
import type { getDashboardsByProjectId } from '@/server/services/dashboard.service'; import type { getDashboardsByProjectId } from '@/server/services/dashboard.service';
import { Pencil, Plus, Trash } from 'lucide-react'; import { Pencil, Trash } from 'lucide-react';
import Link from 'next/link'; import Link from 'next/link';
import { useParams, useRouter } from 'next/navigation'; import { useRouter } from 'next/navigation';
interface ListDashboardsProps { interface ListDashboardsProps {
dashboards: Awaited<ReturnType<typeof getDashboardsByProjectId>>; dashboards: Awaited<ReturnType<typeof getDashboardsByProjectId>>;
@@ -16,7 +17,7 @@ interface ListDashboardsProps {
export function ListDashboards({ dashboards }: ListDashboardsProps) { export function ListDashboards({ dashboards }: ListDashboardsProps) {
const router = useRouter(); const router = useRouter();
const params = useParams(); const params = useAppParams();
const { organizationId, projectId } = params; const { organizationId, projectId } = params;
const deletion = api.dashboard.delete.useMutation({ const deletion = api.dashboard.delete.useMutation({
onError: (error, variables) => { onError: (error, variables) => {

View File

@@ -1,19 +1,19 @@
'use client'; 'use client';
import { Card } from '@/components/Card'; import { Card } from '@/components/Card';
import { useAppParams } from '@/hooks/useAppParams';
import { pushModal } from '@/modals'; import { pushModal } from '@/modals';
import type { getProjectsByOrganizationId } from '@/server/services/project.service'; import type { getProjectsByOrganizationId } from '@/server/services/project.service';
import { Plus } from 'lucide-react'; import { Plus } from 'lucide-react';
import Link from 'next/link'; import Link from 'next/link';
import { useParams } from 'next/navigation';
interface ListProjectsProps { interface ListProjectsProps {
projects: Awaited<ReturnType<typeof getProjectsByOrganizationId>>; projects: Awaited<ReturnType<typeof getProjectsByOrganizationId>>;
} }
export function ListProjects({ projects }: ListProjectsProps) { export function ListProjects({ projects }: ListProjectsProps) {
const params = useParams(); const params = useAppParams();
const organizationId = params.organizationId as string; const organizationId = params.organizationId;
return ( return (
<> <>

View File

@@ -2,19 +2,18 @@
import { StickyBelowHeader } from '@/app/(app)/layout-sticky-below-header'; import { StickyBelowHeader } from '@/app/(app)/layout-sticky-below-header';
import { columns } from '@/components/clients/table'; import { columns } from '@/components/clients/table';
import { ContentHeader } from '@/components/Content';
import { DataTable } from '@/components/DataTable'; import { DataTable } from '@/components/DataTable';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { useAppParams } from '@/hooks/useAppParams';
import { pushModal } from '@/modals'; import { pushModal } from '@/modals';
import type { getClientsByOrganizationId } from '@/server/services/clients.service'; import type { getClientsByOrganizationId } from '@/server/services/clients.service';
import { KeySquareIcon, PlusIcon } from 'lucide-react'; import { PlusIcon } from 'lucide-react';
import { useParams } from 'next/navigation';
interface ListClientsProps { interface ListClientsProps {
clients: Awaited<ReturnType<typeof getClientsByOrganizationId>>; clients: Awaited<ReturnType<typeof getClientsByOrganizationId>>;
} }
export default function ListClients({ clients }: ListClientsProps) { export default function ListClients({ clients }: ListClientsProps) {
const organizationId = useParams().organizationId as string; const organizationId = useAppParams().organizationId;
return ( return (
<> <>

View File

@@ -4,16 +4,16 @@ import { StickyBelowHeader } from '@/app/(app)/layout-sticky-below-header';
import { DataTable } from '@/components/DataTable'; import { DataTable } from '@/components/DataTable';
import { columns } from '@/components/projects/table'; import { columns } from '@/components/projects/table';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { useAppParams } from '@/hooks/useAppParams';
import { pushModal } from '@/modals'; import { pushModal } from '@/modals';
import type { getProjectsByOrganizationId } from '@/server/services/project.service'; import type { getProjectsByOrganizationId } from '@/server/services/project.service';
import { PlusIcon, WarehouseIcon } from 'lucide-react'; import { PlusIcon } from 'lucide-react';
import { useParams } from 'next/navigation';
interface ListProjectsProps { interface ListProjectsProps {
projects: Awaited<ReturnType<typeof getProjectsByOrganizationId>>; projects: Awaited<ReturnType<typeof getProjectsByOrganizationId>>;
} }
export default function ListProjects({ projects }: ListProjectsProps) { export default function ListProjects({ projects }: ListProjectsProps) {
const organizationId = useParams().organizationId as string; const organizationId = useAppParams().organizationId;
return ( return (
<> <>
<StickyBelowHeader> <StickyBelowHeader>

View File

@@ -1,5 +1,6 @@
'use client'; 'use client';
import { useAppParams } from '@/hooks/useAppParams';
import type { IServiceRecentDashboards } from '@/server/services/dashboard.service'; import type { IServiceRecentDashboards } from '@/server/services/dashboard.service';
import { import {
BuildingIcon, BuildingIcon,
@@ -13,7 +14,7 @@ import {
} from 'lucide-react'; } from 'lucide-react';
import type { LucideProps } from 'lucide-react'; import type { LucideProps } from 'lucide-react';
import Link from 'next/link'; import Link from 'next/link';
import { useParams, usePathname } from 'next/navigation'; import { usePathname } from 'next/navigation';
function LinkWithIcon({ function LinkWithIcon({
href, href,
@@ -44,12 +45,11 @@ export default function LayoutMenu({
fallbackProjectId, fallbackProjectId,
}: LayoutMenuProps) { }: LayoutMenuProps) {
const pathname = usePathname(); const pathname = usePathname();
const params = useParams(); const params = useAppParams();
const projectId = ( const projectId =
!params.projectId || params.projectId === 'undefined' !params.projectId || params.projectId === 'undefined'
? fallbackProjectId ? fallbackProjectId
: params.projectId : params.projectId;
) as string | null;
return ( return (
<> <>
@@ -73,7 +73,7 @@ export default function LayoutMenu({
label="Settings" label="Settings"
href={`/${params.organizationId}/settings/organization`} href={`/${params.organizationId}/settings/organization`}
/> />
{pathname.includes('/settings/') && ( {pathname?.includes('/settings/') && (
<div className="pl-7"> <div className="pl-7">
<LinkWithIcon <LinkWithIcon
icon={BuildingIcon} icon={BuildingIcon}

View File

@@ -1,8 +1,8 @@
'use client'; 'use client';
import { useAppParams } from '@/hooks/useAppParams';
import type { IServiceOrganization } from '@/server/services/organization.service'; import type { IServiceOrganization } from '@/server/services/organization.service';
import { Building } from 'lucide-react'; import { Building } from 'lucide-react';
import { useParams } from 'next/navigation';
interface LayoutOrganizationSelectorProps { interface LayoutOrganizationSelectorProps {
organizations: IServiceOrganization[]; organizations: IServiceOrganization[];
@@ -11,7 +11,7 @@ interface LayoutOrganizationSelectorProps {
export default function LayoutOrganizationSelector({ export default function LayoutOrganizationSelector({
organizations, organizations,
}: LayoutOrganizationSelectorProps) { }: LayoutOrganizationSelectorProps) {
const params = useParams(); const params = useAppParams();
const organization = organizations.find( const organization = organizations.find(
(item) => item.id === params.organizationId (item) => item.id === params.organizationId

View File

@@ -17,11 +17,8 @@ export function PreviousDiffIndicator({
}: PreviousDiffIndicatorProps) { }: PreviousDiffIndicatorProps) {
const { previous } = useChartContext(); const { previous } = useChartContext();
const number = useNumber(); const number = useNumber();
if ( if (diff === null || diff === undefined || previous === false) {
(children === undefined && (diff === null || diff === undefined)) || return children ?? null;
previous === false
) {
return null;
} }
return ( return (

View File

@@ -3,6 +3,7 @@
import { api, handleError } from '@/app/_trpc/client'; import { api, handleError } from '@/app/_trpc/client';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { toast } from '@/components/ui/use-toast'; import { toast } from '@/components/ui/use-toast';
import { useAppParams } from '@/hooks/useAppParams';
import { pushModal } from '@/modals'; import { pushModal } from '@/modals';
import { useDispatch, useSelector } from '@/redux'; import { useDispatch, useSelector } from '@/redux';
import { SaveIcon } from 'lucide-react'; import { SaveIcon } from 'lucide-react';
@@ -14,7 +15,7 @@ interface ReportSaveButtonProps {
className?: string; className?: string;
} }
export function ReportSaveButton({ className }: ReportSaveButtonProps) { export function ReportSaveButton({ className }: ReportSaveButtonProps) {
const { reportId } = useParams(); const { reportId } = useAppParams<{ reportId: string | undefined }>();
const dispatch = useDispatch(); const dispatch = useDispatch();
const update = api.report.update.useMutation({ const update = api.report.update.useMutation({
onSuccess() { onSuccess() {
@@ -36,7 +37,7 @@ export function ReportSaveButton({ className }: ReportSaveButtonProps) {
loading={update.isLoading} loading={update.isLoading}
onClick={() => { onClick={() => {
update.mutate({ update.mutate({
reportId: reportId as string, reportId: reportId,
report, report,
}); });
}} }}

View File

@@ -3,20 +3,20 @@
import { api } from '@/app/_trpc/client'; import { api } from '@/app/_trpc/client';
import { ColorSquare } from '@/components/ColorSquare'; import { ColorSquare } from '@/components/ColorSquare';
import { Combobox } from '@/components/ui/combobox'; import { Combobox } from '@/components/ui/combobox';
import { useAppParams } from '@/hooks/useAppParams';
import { useDispatch, useSelector } from '@/redux'; import { useDispatch, useSelector } from '@/redux';
import type { IChartBreakdown } from '@/types'; import type { IChartBreakdown } from '@/types';
import { useParams } from 'next/navigation';
import { addBreakdown, changeBreakdown, removeBreakdown } from '../reportSlice'; import { addBreakdown, changeBreakdown, removeBreakdown } from '../reportSlice';
import { ReportBreakdownMore } from './ReportBreakdownMore'; import { ReportBreakdownMore } from './ReportBreakdownMore';
import type { ReportEventMoreProps } from './ReportEventMore'; import type { ReportEventMoreProps } from './ReportEventMore';
export function ReportBreakdowns() { export function ReportBreakdowns() {
const params = useParams(); const params = useAppParams();
const selectedBreakdowns = useSelector((state) => state.report.breakdowns); const selectedBreakdowns = useSelector((state) => state.report.breakdowns);
const dispatch = useDispatch(); const dispatch = useDispatch();
const propertiesQuery = api.chart.properties.useQuery({ const propertiesQuery = api.chart.properties.useQuery({
projectId: params.projectId as string, projectId: params.projectId,
}); });
const propertiesCombobox = (propertiesQuery.data ?? []).map((item) => ({ const propertiesCombobox = (propertiesQuery.data ?? []).map((item) => ({
value: item, value: item,

View File

@@ -14,6 +14,7 @@ import {
CommandSeparator, CommandSeparator,
} from '@/components/ui/command'; } from '@/components/ui/command';
import { RenderDots } from '@/components/ui/RenderDots'; import { RenderDots } from '@/components/ui/RenderDots';
import { useAppParams } from '@/hooks/useAppParams';
import { useMappings } from '@/hooks/useMappings'; import { useMappings } from '@/hooks/useMappings';
import { useDispatch } from '@/redux'; import { useDispatch } from '@/redux';
import type { import type {
@@ -38,12 +39,12 @@ export function ReportEventFilters({
isCreating, isCreating,
setIsCreating, setIsCreating,
}: ReportEventFiltersProps) { }: ReportEventFiltersProps) {
const params = useParams(); const params = useAppParams();
const dispatch = useDispatch(); const dispatch = useDispatch();
const propertiesQuery = api.chart.properties.useQuery( const propertiesQuery = api.chart.properties.useQuery(
{ {
event: event.name, event: event.name,
projectId: params.projectId as string, projectId: params.projectId,
}, },
{ {
enabled: !!event.name, enabled: !!event.name,

View File

@@ -6,6 +6,7 @@ import { ColorSquare } from '@/components/ColorSquare';
import { Dropdown } from '@/components/Dropdown'; import { Dropdown } from '@/components/Dropdown';
import { Combobox } from '@/components/ui/combobox'; import { Combobox } from '@/components/ui/combobox';
import { Input } from '@/components/ui/input'; import { Input } from '@/components/ui/input';
import { useAppParams } from '@/hooks/useAppParams';
import { useDebounceFn } from '@/hooks/useDebounceFn'; import { useDebounceFn } from '@/hooks/useDebounceFn';
import { useDispatch, useSelector } from '@/redux'; import { useDispatch, useSelector } from '@/redux';
import type { IChartEvent } from '@/types'; import type { IChartEvent } from '@/types';
@@ -21,9 +22,9 @@ export function ReportEvents() {
const [isCreating, setIsCreating] = useState(false); const [isCreating, setIsCreating] = useState(false);
const selectedEvents = useSelector((state) => state.report.events); const selectedEvents = useSelector((state) => state.report.events);
const dispatch = useDispatch(); const dispatch = useDispatch();
const params = useParams(); const params = useAppParams();
const eventsQuery = api.chart.events.useQuery({ const eventsQuery = api.chart.events.useQuery({
projectId: String(params.projectId), projectId: params.projectId,
}); });
const eventsCombobox = (eventsQuery.data ?? []).map((item) => ({ const eventsCombobox = (eventsQuery.data ?? []).map((item) => ({
value: item.name, value: item.name,
@@ -157,6 +158,7 @@ export function ReportEvents() {
<Combobox <Combobox
value={''} value={''}
searchable
onChange={(value) => { onChange={(value) => {
dispatch( dispatch(
addEvent({ addEvent({

View File

@@ -7,9 +7,10 @@ import { Button } from '@/components/ui/button';
import { Combobox } from '@/components/ui/combobox'; import { Combobox } from '@/components/ui/combobox';
import { Label } from '@/components/ui/label'; import { Label } from '@/components/ui/label';
import { toast } from '@/components/ui/use-toast'; import { toast } from '@/components/ui/use-toast';
import { useAppParams } from '@/hooks/useAppParams';
import type { IChartInput } from '@/types'; import type { IChartInput } from '@/types';
import { zodResolver } from '@hookform/resolvers/zod'; import { zodResolver } from '@hookform/resolvers/zod';
import { useParams, useRouter, useSearchParams } from 'next/navigation'; import { useRouter, useSearchParams } from 'next/navigation';
import { Controller, useForm } from 'react-hook-form'; import { Controller, useForm } from 'react-hook-form';
import { z } from 'zod'; import { z } from 'zod';
@@ -30,11 +31,11 @@ type IForm = z.infer<typeof validator>;
export default function SaveReport({ report }: SaveReportProps) { export default function SaveReport({ report }: SaveReportProps) {
const router = useRouter(); const router = useRouter();
const params = useParams(); const params = useAppParams();
const organizationId = params.organizationId as string; const organizationId = params.organizationId;
const projectId = params.projectId as string; const projectId = params.projectId;
const searchParams = useSearchParams(); const searchParams = useSearchParams();
const dashboardId = searchParams.get('dashboardId') ?? undefined; const dashboardId = searchParams?.get('dashboardId') ?? undefined;
const save = api.report.save.useMutation({ const save = api.report.save.useMutation({
onError: handleError, onError: handleError,
@@ -47,7 +48,7 @@ export default function SaveReport({ report }: SaveReportProps) {
router.push( router.push(
`/${organizationId}/${projectId}/reports/${ `/${organizationId}/${projectId}/reports/${
res.id res.id
}?${searchParams.toString()}` }?${searchParams?.toString()}`
); );
}, },
}); });

View File

@@ -45,6 +45,7 @@ export const chartRouter = createTRPCRouter({
() => () =>
db.event.findMany({ db.event.findMany({
take: 500, take: 500,
distinct: 'name',
where: { where: {
project_id: projectId, project_id: projectId,
...(event ...(event
@@ -124,6 +125,14 @@ export const chartRouter = createTRPCRouter({
let diff = 0; let diff = 0;
switch (input.range) { switch (input.range) {
case '30min': {
diff = 1000 * 60 * 30;
break;
}
case '1h': {
diff = 1000 * 60 * 60;
break;
}
case '24h': case '24h':
case 'today': { case 'today': {
diff = 1000 * 60 * 60 * 24; diff = 1000 * 60 * 60 * 24;
@@ -243,7 +252,10 @@ function getPreviousDataDiff(current: number, previous: number | undefined) {
); );
return { return {
diff: Number.isNaN(diff) || !Number.isFinite(diff) ? null : diff, diff:
Number.isNaN(diff) || !Number.isFinite(diff) || current === previous
? null
: diff,
state: state:
current > previous current > previous
? 'positive' ? 'positive'

View File

@@ -1,3 +1,4 @@
import { getDevice, getOS } from '@/utils/user-agent';
import type { Job } from 'bullmq'; import type { Job } from 'bullmq';
import { mergeDeepRight } from 'ramda'; import { mergeDeepRight } from 'ramda';
@@ -152,6 +153,12 @@ export async function eventsJob(job: Job<EventsQueuePayload>) {
break; break;
} }
case 'event': { case 'event': {
const userAgent = payload.properties.ua as string | undefined;
if (userAgent) {
payload.properties.device = getDevice(userAgent);
payload.properties.os = getOS(userAgent);
delete payload.properties.ua;
}
await db.event.create({ await db.event.create({
data: { data: {
name: payload.name, name: payload.name,

View File

@@ -0,0 +1,64 @@
export function getOS(ua?: string) {
if (!ua) {
return null;
}
if (/iPad/i.test(ua)) {
return 'iPad';
}
if (/iPhone/i.test(ua)) {
return 'iPhone';
}
if (/iPod/i.test(ua)) {
return 'iPod';
}
if (/Macintosh/i.test(ua)) {
return 'macOS';
}
if (/IEMobile|Windows/i.test(ua)) {
return 'Windows';
}
if (/Android/i.test(ua)) {
return 'Android';
}
if (/BlackBerry/i.test(ua)) {
return 'BlackBerry';
}
if (/EF500/i.test(ua)) {
return 'Bluebird';
}
if (/CrOS/i.test(ua)) {
return 'Chrome OS';
}
if (/DL-AXIS/i.test(ua)) {
return 'Datalogic';
}
if (/CT50/i.test(ua)) {
return 'Honeywell';
}
if (/TC70|TC55/i.test(ua)) {
return 'Zebra';
}
if (/Linux/i.test(ua)) {
return 'Generic Linux';
}
return 'Unknown';
}
export function getDevice(ua?: string) {
if (!ua) {
return null;
}
const t1 =
/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(
ua
);
const t2 =
/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw-(n|u)|c55\/|capi|ccwa|cdm-|cell|chtm|cldc|cmd-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc-s|devi|dica|dmob|do(c|p)o|ds(12|-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(-|_)|g1 u|g560|gene|gf-5|g-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd-(m|p|t)|hei-|hi(pt|ta)|hp( i|ip)|hs-c|ht(c(-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i-(20|go|ma)|i230|iac( |-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|-[a-w])|libw|lynx|m1-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|-([1-8]|c))|phil|pire|pl(ay|uc)|pn-2|po(ck|rt|se)|prox|psio|pt-g|qa-a|qc(07|12|21|32|60|-[2-7]|i-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h-|oo|p-)|sdk\/|se(c(-|0|1)|47|mc|nd|ri)|sgh-|shar|sie(-|m)|sk-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h-|v-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl-|tdg-|tel(i|m)|tim-|t-mo|to(pl|sh)|ts(70|m-|m3|m5)|tx-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas-|your|zeto|zte-/i.test(
ua.slice(0, 4)
);
if (t1 || t2) {
return 'mobile';
}
return 'desktop';
}

View File

@@ -3,7 +3,7 @@ import { Mixan } from '@mixan/sdk';
import type { PartialBy } from '@mixan/types'; import type { PartialBy } from '@mixan/types';
import { parseQuery } from './src/parseQuery'; import { parseQuery } from './src/parseQuery';
import { getDevice, getOS, getTimezone } from './src/utils'; import { getTimezone } from './src/utils';
export class MixanWeb extends Mixan { export class MixanWeb extends Mixan {
constructor( constructor(
@@ -29,16 +29,12 @@ export class MixanWeb extends Mixan {
private parseUrl(url?: string) { private parseUrl(url?: string) {
if (!url || url === '') { if (!url || url === '') {
return { return {};
direct: true,
};
} }
const ref = new URL(url); const ref = new URL(url);
return { return {
host: ref.host, host: ref.host,
hostname: ref.hostname,
url: ref.href,
path: ref.pathname, path: ref.pathname,
query: parseQuery(ref.search), query: parseQuery(ref.search),
hash: ref.hash, hash: ref.hash,
@@ -47,16 +43,13 @@ export class MixanWeb extends Mixan {
private properties() { private properties() {
return { return {
os: getOS(),
device: getDevice(),
ua: navigator.userAgent, ua: navigator.userAgent,
referrer: this.parseUrl(document.referrer), referrer: document.referrer || undefined,
language: navigator.language, language: navigator.language,
timezone: getTimezone(), timezone: getTimezone(),
screen: { screen: {
width: window.screen.width, width: window.screen.width,
height: window.screen.height, height: window.screen.height,
pixelRatio: window.devicePixelRatio,
}, },
title: document.title, title: document.title,
...this.parseUrl(window.location.href), ...this.parseUrl(window.location.href),

View File

@@ -1,62 +1,3 @@
export function getOS() {
if (/iPad/i.test(navigator.userAgent)) {
return 'iPad';
}
if (/iPhone/i.test(navigator.userAgent)) {
return 'iPhone';
}
if (/iPod/i.test(navigator.userAgent)) {
return 'iPod';
}
if (/Macintosh/i.test(navigator.userAgent)) {
return 'macOS';
}
if (/IEMobile|Windows/i.test(navigator.userAgent)) {
return 'Windows';
}
if (/Android/i.test(navigator.userAgent)) {
return 'Android';
}
if (/BlackBerry/i.test(navigator.userAgent)) {
return 'BlackBerry';
}
if (/EF500/i.test(navigator.userAgent)) {
return 'Bluebird';
}
if (/CrOS/i.test(navigator.userAgent)) {
return 'Chrome OS';
}
if (/DL-AXIS/i.test(navigator.userAgent)) {
return 'Datalogic';
}
if (/CT50/i.test(navigator.userAgent)) {
return 'Honeywell';
}
if (/TC70|TC55/i.test(navigator.userAgent)) {
return 'Zebra';
}
if (/Linux/i.test(navigator.userAgent)) {
return 'Generic Linux';
}
return 'Unknown';
}
export function getDevice() {
const ua = navigator.userAgent;
const t1 =
/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(
ua
);
const t2 =
/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw-(n|u)|c55\/|capi|ccwa|cdm-|cell|chtm|cldc|cmd-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc-s|devi|dica|dmob|do(c|p)o|ds(12|-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(-|_)|g1 u|g560|gene|gf-5|g-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd-(m|p|t)|hei-|hi(pt|ta)|hp( i|ip)|hs-c|ht(c(-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i-(20|go|ma)|i230|iac( |-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|-[a-w])|libw|lynx|m1-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|-([1-8]|c))|phil|pire|pl(ay|uc)|pn-2|po(ck|rt|se)|prox|psio|pt-g|qa-a|qc(07|12|21|32|60|-[2-7]|i-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h-|oo|p-)|sdk\/|se(c(-|0|1)|47|mc|nd|ri)|sgh-|shar|sie(-|m)|sk-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h-|v-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl-|tdg-|tel(i|m)|tim-|t-mo|to(pl|sh)|ts(70|m-|m3|m5)|tx-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas-|your|zeto|zte-/i.test(
ua.slice(0, 4)
);
if (t1 || t2) {
return 'mobile';
}
return 'desktop';
}
export function getTimezone() { export function getTimezone() {
try { try {
return Intl.DateTimeFormat().resolvedOptions().timeZone; return Intl.DateTimeFormat().resolvedOptions().timeZone;