well deserved clean up (#1)

This commit is contained in:
Carl-Gerhard Lindesvärd
2024-03-18 21:53:07 +01:00
parent 3a8404f704
commit b7513f24d5
106 changed files with 453 additions and 1275 deletions

View File

@@ -1,10 +1,9 @@
'use client';
import { api, handleErrorToastOptions } from '@/app/_trpc/client';
import { Card, CardActions, CardActionsItem } from '@/components/Card';
import { FullPageEmptyState } from '@/components/FullPageEmptyState';
import { Card, CardActions, CardActionsItem } from '@/components/card';
import { FullPageEmptyState } from '@/components/full-page-empty-state';
import { Button } from '@/components/ui/button';
import { ToastAction } from '@/components/ui/toast';
import { useAppParams } from '@/hooks/useAppParams';
import { pushModal } from '@/modals';
import { LayoutPanelTopIcon, Pencil, PlusIcon, Trash } from 'lucide-react';

View File

@@ -1,7 +1,7 @@
'use client';
import { Fragment } from 'react';
import { Widget, WidgetHead } from '@/components/Widget';
import { Widget, WidgetHead } from '@/components/widget';
import { isSameDay } from 'date-fns';
import type { IServiceCreateEventPayload } from '@openpanel/db';

View File

@@ -1,4 +1,4 @@
import { Widget } from '@/components/Widget';
import { Widget } from '@/components/widget';
import { db, getEvents } from '@openpanel/db';

View File

@@ -1,8 +1,8 @@
'use client';
import { Fragment, Suspense } from 'react';
import { FullPageEmptyState } from '@/components/FullPageEmptyState';
import { Pagination } from '@/components/Pagination';
import { FullPageEmptyState } from '@/components/full-page-empty-state';
import { Pagination } from '@/components/pagination';
import { ChartSwitch, ChartSwitchShortcut } from '@/components/report/chart';
import { Button } from '@/components/ui/button';
import { useAppParams } from '@/hooks/useAppParams';

View File

@@ -1,7 +1,7 @@
'use client';
import { useEffect, useState } from 'react';
import { Logo } from '@/components/Logo';
import { Logo } from '@/components/logo';
import { buttonVariants } from '@/components/ui/button';
import { cn } from '@/utils/cn';
import { Rotate as Hamburger } from 'hamburger-react';

View File

@@ -1,16 +1,15 @@
import PageLayout from '@/app/(app)/[organizationId]/[projectId]/page-layout';
import { OverviewFiltersButtons } from '@/components/overview/filters/overview-filters-buttons';
import { OverviewFiltersDrawer } from '@/components/overview/filters/overview-filters-drawer';
import { ProfileAvatar } from '@/components/profiles/ProfileAvatar';
import { ProfileAvatar } from '@/components/profiles/profile-avatar';
import { ChartSwitch } from '@/components/report/chart';
import { SerieIcon } from '@/components/report/chart/SerieIcon';
import { Widget, WidgetBody, WidgetHead } from '@/components/Widget';
import { Widget, WidgetBody, WidgetHead } from '@/components/widget';
import {
eventQueryFiltersParser,
eventQueryNamesFilter,
} from '@/hooks/useEventQueryFilters';
import { getExists } from '@/server/pageExists';
import { getProfileName } from '@/utils/getters';
import { notFound } from 'next/navigation';
import { parseAsInteger, parseAsString } from 'nuqs';
@@ -20,6 +19,7 @@ import {
getEventList,
getEventsCount,
getProfileById,
getProfileName,
} from '@openpanel/db';
import type { IChartEvent, IChartInput } from '@openpanel/validation';

View File

@@ -1,74 +0,0 @@
'use client';
import { Suspense } from 'react';
import { FullPageEmptyState } from '@/components/FullPageEmptyState';
import { Pagination } from '@/components/Pagination';
import { Button } from '@/components/ui/button';
import { useCursor } from '@/hooks/useCursor';
import { useEventQueryFilters } from '@/hooks/useEventQueryFilters';
import { UsersIcon } from 'lucide-react';
import type { IServiceProfile } from '@openpanel/db';
import { ProfileListItem } from './profile-list-item';
interface ProfileListProps {
data: IServiceProfile[];
count: number;
}
export function ProfileList({ data, count }: ProfileListProps) {
const { cursor, setCursor } = useCursor();
const [filters] = useEventQueryFilters();
return (
<Suspense>
<div className="p-4">
{data.length === 0 ? (
<FullPageEmptyState title="No profiles here" icon={UsersIcon}>
{cursor !== 0 ? (
<>
<p>Looks like you have reached the end of the list</p>
<Button
className="mt-4"
variant="outline"
size="sm"
onClick={() => setCursor((p) => Math.max(0, p - 1))}
>
Go back
</Button>
</>
) : (
<>
{filters.length ? (
<p>Could not find any profiles with your filter</p>
) : (
<p>No profiles have been created yet</p>
)}
</>
)}
</FullPageEmptyState>
) : (
<>
<Pagination
cursor={cursor}
setCursor={setCursor}
count={count}
take={50}
/>
<div className="flex flex-col gap-4 my-4">
{data.map((item) => (
<ProfileListItem key={item.id} {...item} />
))}
</div>
<Pagination
cursor={cursor}
setCursor={setCursor}
count={count}
take={50}
/>
</>
)}
</div>
</Suspense>
);
}

View File

@@ -3,7 +3,7 @@ import {
TooltipContent,
TooltipTrigger,
} from '@/components/ui/tooltip';
import { Widget, WidgetBody, WidgetHead } from '@/components/Widget';
import { Widget, WidgetBody, WidgetHead } from '@/components/widget';
import { cn } from '@/utils/cn';
import { chQuery } from '@openpanel/db';

View File

@@ -1,59 +0,0 @@
'use client';
import { ExpandableListItem } from '@/components/general/ExpandableListItem';
import { ProfileAvatar } from '@/components/profiles/ProfileAvatar';
import { KeyValue, KeyValueSubtle } from '@/components/ui/key-value';
import { useAppParams } from '@/hooks/useAppParams';
import { useEventQueryFilters } from '@/hooks/useEventQueryFilters';
import { getProfileName } from '@/utils/getters';
import type { IServiceProfile } from '@openpanel/db';
type ProfileListItemProps = IServiceProfile;
export function ProfileListItem(props: ProfileListItemProps) {
const { id, properties, createdAt } = props;
const params = useAppParams();
const [, setFilter] = useEventQueryFilters({ shallow: false });
const renderContent = () => {
return (
<>
<KeyValueSubtle name="Time" value={createdAt.toLocaleString()} />
<KeyValueSubtle
href={`/${params.organizationId}/${params.projectId}/profiles/${id}`}
name="Details"
value={'See profile'}
/>
</>
);
};
return (
<ExpandableListItem
title={getProfileName(props)}
content={renderContent()}
image={<ProfileAvatar {...props} />}
>
<>
{properties && (
<div className="bg-white p-4 flex flex-col gap-4">
<div className="font-medium">Properties</div>
<div className="flex flex-wrap gap-x-4 gap-y-2">
{Object.entries(properties)
.filter(([, value]) => !!value)
.map(([key, value]) => (
<KeyValue
onClick={() => setFilter(`properties.${key}`, value)}
key={key}
name={key}
value={value}
/>
))}
</div>
</div>
)}
</>
</ExpandableListItem>
);
}

View File

@@ -1,18 +1,19 @@
'use client';
import { ListPropertiesIcon } from '@/components/events/ListPropertiesIcon';
import { FullPageEmptyState } from '@/components/FullPageEmptyState';
import { Pagination } from '@/components/Pagination';
import { ProfileAvatar } from '@/components/profiles/ProfileAvatar';
import { ListPropertiesIcon } from '@/components/events/list-properties-icon';
import { FullPageEmptyState } from '@/components/full-page-empty-state';
import { Pagination } from '@/components/pagination';
import { ProfileAvatar } from '@/components/profiles/profile-avatar';
import { Button } from '@/components/ui/button';
import { Tooltiper } from '@/components/ui/tooltip';
import { Widget, WidgetHead } from '@/components/Widget';
import { Widget, WidgetHead } from '@/components/widget';
import { WidgetTable } from '@/components/widget-table';
import { useAppParams } from '@/hooks/useAppParams';
import { useCursor } from '@/hooks/useCursor';
import { UsersIcon } from 'lucide-react';
import Link from 'next/link';
import { getProfileName } from '@openpanel/db';
import type { IServiceProfile } from '@openpanel/db';
interface ProfileListProps {
@@ -49,7 +50,7 @@ export function ProfileList({ data, count }: ProfileListProps) {
className="flex gap-2 items-center font-medium"
>
<ProfileAvatar size="sm" {...profile} />
{profile.firstName} {profile.lastName}
{getProfileName(profile)}
</Link>
);
},

View File

@@ -1,10 +1,10 @@
import { ListPropertiesIcon } from '@/components/events/ListPropertiesIcon';
import { ProfileAvatar } from '@/components/profiles/ProfileAvatar';
import { Widget, WidgetHead } from '@/components/Widget';
import { ListPropertiesIcon } from '@/components/events/list-properties-icon';
import { ProfileAvatar } from '@/components/profiles/profile-avatar';
import { Widget, WidgetHead } from '@/components/widget';
import { WidgetTable } from '@/components/widget-table';
import Link from 'next/link';
import { chQuery, getProfiles } from '@openpanel/db';
import { chQuery, getProfileName, getProfiles } from '@openpanel/db';
interface Props {
projectId: string;
@@ -24,7 +24,7 @@ export default async function ProfileTopServer({
const list = res.map((item) => {
return {
count: item.count,
...(profiles.find((p) => p.id === item.profile_id) ?? {}),
...(profiles.find((p) => p.id === item.profile_id)! ?? {}),
};
});
@@ -35,7 +35,7 @@ export default async function ProfileTopServer({
</WidgetHead>
<WidgetTable
data={list.filter((item) => !!item.id)}
keyExtractor={(item) => item.id!}
keyExtractor={(item) => item.id}
columns={[
{
name: 'Name',
@@ -46,7 +46,7 @@ export default async function ProfileTopServer({
className="flex gap-2 items-center font-medium"
>
<ProfileAvatar size="sm" {...profile} />
{profile.firstName} {profile.lastName}
{getProfileName(profile)}
</Link>
);
},

View File

@@ -2,9 +2,8 @@
import { StickyBelowHeader } from '@/app/(app)/[organizationId]/[projectId]/layout-sticky-below-header';
import { columns } from '@/components/clients/table';
import { DataTable } from '@/components/DataTable';
import { DataTable } from '@/components/data-table';
import { Button } from '@/components/ui/button';
import { useAppParams } from '@/hooks/useAppParams';
import { pushModal } from '@/modals';
import { PlusIcon } from 'lucide-react';
@@ -14,17 +13,12 @@ interface ListClientsProps {
clients: Awaited<ReturnType<typeof getClientsByOrganizationId>>;
}
export default function ListClients({ clients }: ListClientsProps) {
const organizationId = useAppParams().organizationId;
return (
<>
<StickyBelowHeader>
<div className="p-4 flex items-center justify-between">
<div />
<Button
icon={PlusIcon}
onClick={() => pushModal('AddClient', { organizationId })}
>
<Button icon={PlusIcon} onClick={() => pushModal('AddClient')}>
<span className="max-sm:hidden">Create client</span>
<span className="sm:hidden">Client</span>
</Button>

View File

@@ -1,9 +1,9 @@
'use client';
import { api, handleError } from '@/app/_trpc/client';
import { InputWithLabel } from '@/components/forms/InputWithLabel';
import { InputWithLabel } from '@/components/forms/input-with-label';
import { Button } from '@/components/ui/button';
import { Widget, WidgetBody, WidgetHead } from '@/components/Widget';
import { Widget, WidgetBody, WidgetHead } from '@/components/widget';
import { useRouter } from 'next/navigation';
import { useForm } from 'react-hook-form';
import { toast } from 'sonner';

View File

@@ -1,5 +1,5 @@
import { api } from '@/app/_trpc/client';
import { InputWithLabel } from '@/components/forms/InputWithLabel';
import { InputWithLabel } from '@/components/forms/input-with-label';
import { Button } from '@/components/ui/button';
import { useAppParams } from '@/hooks/useAppParams';
import { zodResolver } from '@hookform/resolvers/zod';

View File

@@ -8,7 +8,7 @@ import {
TableHeader,
TableRow,
} from '@/components/ui/table';
import { Widget, WidgetBody, WidgetHead } from '@/components/Widget';
import { Widget, WidgetBody, WidgetHead } from '@/components/widget';
import type { IServiceInvites } from '@openpanel/db';

View File

@@ -1,9 +1,9 @@
'use client';
import { api, handleError } from '@/app/_trpc/client';
import { InputWithLabel } from '@/components/forms/InputWithLabel';
import { InputWithLabel } from '@/components/forms/input-with-label';
import { Button } from '@/components/ui/button';
import { Widget, WidgetBody, WidgetHead } from '@/components/Widget';
import { Widget, WidgetBody, WidgetHead } from '@/components/widget';
import { zodResolver } from '@hookform/resolvers/zod';
import { useRouter } from 'next/navigation';
import { useForm } from 'react-hook-form';

View File

@@ -1,7 +1,7 @@
'use client';
import { buttonVariants } from '@/components/ui/button';
import { Widget, WidgetBody, WidgetHead } from '@/components/Widget';
import { Widget, WidgetBody, WidgetHead } from '@/components/widget';
import { SignOutButton } from '@clerk/nextjs';
export function Logout() {

View File

@@ -1,7 +1,7 @@
'use client';
import { StickyBelowHeader } from '@/app/(app)/[organizationId]/[projectId]/layout-sticky-below-header';
import { DataTable } from '@/components/DataTable';
import { DataTable } from '@/components/data-table';
import { columns } from '@/components/projects/table';
import { Button } from '@/components/ui/button';
import { useAppParams } from '@/hooks/useAppParams';

View File

@@ -1,7 +1,7 @@
'use client';
import { StickyBelowHeader } from '@/app/(app)/[organizationId]/[projectId]/layout-sticky-below-header';
import { DataTable } from '@/components/DataTable';
import { DataTable } from '@/components/data-table';
import { columns } from '@/components/references/table';
import { Button } from '@/components/ui/button';
import { pushModal } from '@/modals';

View File

@@ -1,21 +0,0 @@
import { Funnel } from '@/components/report/funnel';
import PageLayout from '../page-layout';
export const metadata = {
title: 'Funnel - Openpanel.dev',
};
interface PageProps {
params: {
organizationId: string;
};
}
export default function Page({ params: { organizationId } }: PageProps) {
return (
<PageLayout title="Funnel" organizationSlug={organizationId}>
<Funnel />
</PageLayout>
);
}

View File

@@ -1,6 +1,6 @@
'use client';
import { LogoSquare } from '@/components/Logo';
import { LogoSquare } from '@/components/logo';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';

View File

@@ -1,4 +1,4 @@
import { LogoSquare } from '@/components/Logo';
import { LogoSquare } from '@/components/logo';
import { ProjectCard } from '@/components/projects/project-card';
import { notFound, redirect } from 'next/navigation';

View File

@@ -1,8 +1,7 @@
'use client';
import { useState } from 'react';
import { CreateClientSuccess } from '@/components/clients/create-client-success';
import { LogoSquare } from '@/components/Logo';
import { LogoSquare } from '@/components/logo';
import { Button, buttonVariants } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
@@ -10,7 +9,6 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { cn } from '@/utils/cn';
import { zodResolver } from '@hookform/resolvers/zod';
import { SaveIcon, WallpaperIcon } from 'lucide-react';
import Link from 'next/link';
import { useRouter } from 'next/navigation';
import type { SubmitHandler } from 'react-hook-form';
import { useForm } from 'react-hook-form';

View File

@@ -1,6 +1,6 @@
// import { CreateOrganization } from '@clerk/nextjs';
import { LogoSquare } from '@/components/Logo';
import { LogoSquare } from '@/components/logo';
import { redirect } from 'next/navigation';
import { getCurrentOrganizations, isWaitlistUserAccepted } from '@openpanel/db';

View File

@@ -1,6 +1,6 @@
import { StickyBelowHeader } from '@/app/(app)/[organizationId]/[projectId]/layout-sticky-below-header';
import { OverviewReportRange } from '@/app/(app)/[organizationId]/[projectId]/overview-sticky-header';
import { Logo } from '@/components/Logo';
import { Logo } from '@/components/logo';
import { OverviewFiltersButtons } from '@/components/overview/filters/overview-filters-buttons';
import ServerLiveCounter from '@/components/overview/live-counter';
import { OverviewLiveHistogram } from '@/components/overview/overview-live-histogram';

View File

@@ -1,11 +1,11 @@
'use client';
import { useState } from 'react';
import { InputWithLabel } from '@/components/forms/InputWithLabel';
import { Logo } from '@/components/Logo';
import { InputWithLabel } from '@/components/forms/input-with-label';
import { Logo } from '@/components/logo';
import { Alert, AlertDescription, AlertTitle } from '@/components/ui/alert';
import { Button } from '@/components/ui/button';
import { Widget, WidgetBody } from '@/components/Widget';
import { Widget, WidgetBody } from '@/components/widget';
import { zodResolver } from '@hookform/resolvers/zod';
import { KeySquareIcon } from 'lucide-react';
import { signIn } from 'next-auth/react';