fix: handle profiles which are not identified but the event has profile_id

apps/start/src/routes/_app.$organizationId.$projectId_.profiles.$profileId._tabs.index.tsx

@@ -41,12 +41,6 @@ export const Route = createFileRoute(
           projectId: params.projectId,
         }),
       ),
-      context.queryClient.prefetchQuery(
-        context.trpc.event.events.queryOptions({
-          profileId: params.profileId,
-          projectId: params.projectId,
-        }),
-      ),
     ]);
   },
   pendingComponent: FullPageLoadingState,
@@ -56,7 +50,6 @@ function Component() {
   const { profileId, projectId, organizationId } = Route.useParams();
   const trpc = useTRPC();
 
-  // Get profile data from parent route
   const profile = useSuspenseQuery(
     trpc.profile.byId.queryOptions({
       profileId,

apps/start/src/routes/_app.$organizationId.$projectId_.profiles.$profileId._tabs.tsx

@@ -6,12 +6,9 @@ import { SerieIcon } from '@/components/report-chart/common/serie-icon';
 import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { usePageTabs } from '@/hooks/use-page-tabs';
 import { useTRPC } from '@/integrations/trpc/react';
-import { cn } from '@/utils/cn';
 import { getProfileName } from '@/utils/getters';
 import { useSuspenseQuery } from '@tanstack/react-query';
 import { Outlet, createFileRoute, useRouter } from '@tanstack/react-router';
-import { CheckIcon, CopyIcon } from 'lucide-react';
-import { useState } from 'react';
 
 export const Route = createFileRoute(
   '/_app/$organizationId/$projectId_/profiles/$profileId/_tabs',
@@ -62,7 +59,9 @@ function Component() {
           <div className="row items-center gap-4 min-w-0">
             <ProfileAvatar {...profile.data} />
             <span className="truncate">
-              {getProfileName(profile.data, false)}
+              {profile.data
+                ? getProfileName(profile.data, false)
+                : 'User not identified'}
             </span>
           </div>
         }