@wopr-network/platform-ui-core 1.27.8 → 1.27.9

package/src/app/(dashboard)/chat/page.tsx

@@ -26,9 +26,7 @@ export default function ChatPage() {
             className={`h-2 w-2 rounded-full inline-block ${isConnected ? "bg-terminal" : "bg-destructive"}`}
             aria-label={isConnected ? "Connected" : "Disconnected"}
           />
-          <h1 className="text-sm font-mono uppercase tracking-wider text-muted-foreground">
-            {brandName()}
-          </h1>
+          <h1 className="text-sm font-mono uppercase tracking-wider text-muted-foreground">{brandName()}</h1>
         </div>
         <Button
           type="button"
@@ -50,9 +48,7 @@ export default function ChatPage() {
           </p>
         )}
         {messages.length === 0 && !isConnected && (
-          <p className="text-center text-xs text-muted-foreground animate-ellipsis">
-            Connecting to {brandName()}
-          </p>
+          <p className="text-center text-xs text-muted-foreground animate-ellipsis">Connecting to {brandName()}</p>
         )}
         {messages.map((msg) => (
           <ChatMessage key={msg.id} message={msg} />

package/src/app/(dashboard)/dashboard/network/page.tsx

@@ -2,13 +2,7 @@
 
 import { useEffect, useState } from "react";
 import { FriendsTab } from "@/components/instances/friends-tab";
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from "@/components/ui/select";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Skeleton } from "@/components/ui/skeleton";
 import type { Instance } from "@/lib/api";
 import { listInstances } from "@/lib/api";
@@ -50,8 +44,7 @@ export default function NetworkPage() {
         <div>
           <h1 className="text-2xl font-bold tracking-widest uppercase">Friends &amp; Network</h1>
           <p className="mt-1 text-sm text-muted-foreground">
-            Manage P2P connections, friend requests, and auto-accept rules for your {productName()}{" "}
-            bot instances.
+            Manage P2P connections, friend requests, and auto-accept rules for your {productName()} bot instances.
           </p>
         </div>
         <div className="w-full sm:w-56 shrink-0">
@@ -62,10 +55,7 @@ export default function NetworkPage() {
           ) : instances.length === 0 ? (
             <p className="text-sm text-muted-foreground">No instances found.</p>
           ) : (
-            <Select
-              value={selectedInstanceId ?? ""}
-              onValueChange={(v) => setSelectedInstanceId(v)}
-            >
+            <Select value={selectedInstanceId ?? ""} onValueChange={(v) => setSelectedInstanceId(v)}>
               <SelectTrigger className="w-full" aria-label="Select instance">
                 <SelectValue placeholder="Select instance..." />
               </SelectTrigger>
@@ -83,15 +73,11 @@ export default function NetworkPage() {
 
       {!loading && !error && !selectedInstanceId && instances.length > 0 && (
         <div className="flex h-64 flex-col items-center justify-center gap-3 rounded-sm border border-dashed border-terminal/20">
-          <p className="font-mono text-sm text-terminal/60">
-            &gt; SELECT AN INSTANCE TO MANAGE FRIENDS
-          </p>
+          <p className="font-mono text-sm text-terminal/60">&gt; SELECT AN INSTANCE TO MANAGE FRIENDS</p>
         </div>
       )}
 
-      {selectedInstanceId && (
-        <FriendsTab key={selectedInstanceId} instanceId={selectedInstanceId} />
-      )}
+      {selectedInstanceId && <FriendsTab key={selectedInstanceId} instanceId={selectedInstanceId} />}
     </div>
   );
 }

package/src/app/(dashboard)/error.tsx

@@ -8,13 +8,7 @@ import { logger } from "@/lib/logger";
 
 const log = logger("error-boundary:dashboard");
 
-export default function DashboardError({
-  error,
-  reset,
-}: {
-  error: Error & { digest?: string };
-  reset: () => void;
-}) {
+export default function DashboardError({ error, reset }: { error: Error & { digest?: string }; reset: () => void }) {
   const [showDetails, setShowDetails] = useState(false);
   const isDev = process.env.NODE_ENV === "development";
 

package/src/app/(dashboard)/layout.tsx

@@ -11,10 +11,9 @@
  */
 "use client";
 
-import { AnimatePresence, motion } from "framer-motion";
 import { MenuIcon } from "lucide-react";
 import { usePathname } from "next/navigation";
-import { Suspense, useEffect, useState } from "react";
+import { Fragment, Suspense, useEffect, useState } from "react";
 import { EmailVerificationBanner } from "@/components/auth/email-verification-banner";
 import { EmailVerificationResultBanner } from "@/components/auth/email-verification-result-banner";
 import { SuspensionBanner } from "@/components/billing/suspension-banner";
@@ -26,15 +25,16 @@ import { usePageContext } from "@/hooks/use-page-context";
 import { useWebMCP } from "@/hooks/use-webmcp";
 import { getBrandConfig, productName } from "@/lib/brand-config";
 import { ChatProvider } from "@/lib/chat/chat-context";
+import { useRequireAuth } from "@/lib/require-auth";
 
 export default function DashboardLayout({
   children,
 }: Readonly<{
   children: React.ReactNode;
 }>) {
+  const { isPending, isAuthed } = useRequireAuth();
   useWebMCP();
   usePageContext();
-
   const pathname = usePathname();
   const [sheetOpen, setSheetOpen] = useState(false);
 
@@ -44,8 +44,13 @@ export default function DashboardLayout({
     setSheetOpen(false);
   }, [pathname]);
 
+  if (isPending || !isAuthed) return null;
+
+  const chatEnabled = getBrandConfig().chatEnabled;
+  const Wrapper = chatEnabled ? ChatProvider : Fragment;
+
   return (
-    <ChatProvider>
+    <Wrapper>
       {/* Desktop layout - hidden on mobile with CSS */}
       <div className="hidden lg:flex h-screen">
         <Sidebar />
@@ -55,23 +60,12 @@ export default function DashboardLayout({
           <Suspense>
             <EmailVerificationResultBanner />
           </Suspense>
-          <AnimatePresence mode="wait">
-            <motion.main
-              key={pathname}
-              initial={{ opacity: 0 }}
-              animate={{ opacity: 1 }}
-              exit={{ opacity: 0 }}
-              transition={{ duration: 0.2, ease: "easeInOut" }}
-              className="flex-1 overflow-auto"
-            >
-              {children}
-            </motion.main>
-          </AnimatePresence>
+          <main className="flex-1">{children}</main>
         </div>
       </div>
 
       {/* Mobile layout - hidden on desktop with CSS */}
-      <div className="crt-scanlines flex lg:hidden h-screen flex-col">
+      <div className="crt-scanlines flex lg:hidden h-screen flex-col overflow-auto">
         <header className="flex h-14 shrink-0 items-center border-b border-sidebar-border bg-sidebar px-4 gap-3">
           <Sheet open={sheetOpen} onOpenChange={setSheetOpen}>
             <SheetTrigger asChild>
@@ -79,11 +73,7 @@ export default function DashboardLayout({
                 <MenuIcon className="size-5" />
               </Button>
             </SheetTrigger>
-            <SheetContent
-              side="left"
-              className="w-64 bg-sidebar text-sidebar-foreground p-0"
-              aria-label="Navigation"
-            >
+            <SheetContent side="left" className="w-64 bg-sidebar text-sidebar-foreground p-0" aria-label="Navigation">
               <SidebarContent onNavigate={() => setSheetOpen(false)} />
             </SheetContent>
           </Sheet>
@@ -94,20 +84,9 @@ export default function DashboardLayout({
         <Suspense>
           <EmailVerificationResultBanner />
         </Suspense>
-        <AnimatePresence mode="wait">
-          <motion.main
-            key={pathname}
-            initial={{ opacity: 0 }}
-            animate={{ opacity: 1 }}
-            exit={{ opacity: 0 }}
-            transition={{ duration: 0.2, ease: "easeInOut" }}
-            className="flex-1 overflow-auto"
-          >
-            {children}
-          </motion.main>
-        </AnimatePresence>
+        <main className="flex-1">{children}</main>
       </div>
-      {getBrandConfig().chatEnabled && !pathname.startsWith("/chat") && <ChatWidget />}
-    </ChatProvider>
+      {chatEnabled && !pathname.startsWith("/chat") && <ChatWidget />}
+    </Wrapper>
   );
 }

package/src/app/(dashboard)/marketplace/[plugin]/page.tsx

@@ -83,6 +83,7 @@ export function TerminalLog({ plugin, onDone }: { plugin: PluginManifest; onDone
       <div ref={containerRef} className="max-h-48 overflow-y-auto space-y-1">
         {lines.map((line, idx) => (
           <motion.div
+            // biome-ignore lint/suspicious/noArrayIndexKey: static list, index key is safe
             key={`line-${idx}-${line.slice(0, 10)}`}
             initial={{ opacity: 0, x: -5 }}
             animate={{ opacity: 1, x: 0 }}
@@ -156,16 +157,9 @@ export default function PluginDetailPage() {
     setInstallError(null);
     try {
       const providerChoices = (config._providerChoices as Record<string, string>) ?? {};
-      const primaryProviderOverrides =
-        (config._primaryProviderOverrides as Record<string, string>) ?? undefined;
+      const primaryProviderOverrides = (config._primaryProviderOverrides as Record<string, string>) ?? undefined;
       const { _providerChoices: _, _primaryProviderOverrides: __, ...pluginConfig } = config;
-      const result = await installPlugin(
-        plugin.id,
-        botId,
-        pluginConfig,
-        providerChoices,
-        primaryProviderOverrides,
-      );
+      const result = await installPlugin(plugin.id, botId, pluginConfig, providerChoices, primaryProviderOverrides);
       if (!result.dispatched) {
         if (result.dispatchError === "bot_not_deployed") {
           toast.warning("Bot isn't running — plugin will activate on next start");
@@ -230,11 +224,7 @@ export default function PluginDetailPage() {
   if (installing) {
     return (
       <div className="mx-auto max-w-xl p-6">
-        <InstallWizard
-          plugin={plugin}
-          onComplete={handleInstallComplete}
-          onCancel={() => setInstalling(false)}
-        />
+        <InstallWizard plugin={plugin} onComplete={handleInstallComplete} onCancel={() => setInstalling(false)} />
       </div>
     );
   }
@@ -319,12 +309,7 @@ export default function PluginDetailPage() {
 
       {/* Outcome bullets */}
       {plugin.superpowerOutcomes && plugin.superpowerOutcomes.length > 0 && (
-        <motion.div
-          initial={{ opacity: 0 }}
-          animate={{ opacity: 1 }}
-          transition={{ delay: 0.2 }}
-          className="space-y-2"
-        >
+        <motion.div initial={{ opacity: 0 }} animate={{ opacity: 1 }} transition={{ delay: 0.2 }} className="space-y-2">
           <h2 className="text-base font-bold">What she can do</h2>
           <ul className="space-y-2">
             {plugin.superpowerOutcomes.map((outcome) => (
@@ -347,19 +332,13 @@ export default function PluginDetailPage() {
         {plugin.capabilities.map((cap) => {
           const color = getCapabilityColor(cap);
           return (
-            <Badge
-              key={cap}
-              variant="outline"
-              className={`${color.bg} ${color.text} ${color.border}`}
-            >
+            <Badge key={cap} variant="outline" className={`${color.bg} ${color.text} ${color.border}`}>
               {cap}
             </Badge>
           );
         })}
         {hostedAvailable && (
-          <Badge className="bg-emerald-500/15 text-emerald-500 border-emerald-500/25">
-            {brandName()} Hosted
-          </Badge>
+          <Badge className="bg-emerald-500/15 text-emerald-500 border-emerald-500/25">{brandName()} Hosted</Badge>
         )}
       </motion.div>
 
@@ -408,17 +387,12 @@ export default function PluginDetailPage() {
             <Card>
               <CardHeader>
                 <CardTitle className="text-base">{brandName()} Hosted Options</CardTitle>
-                <CardDescription>
-                  Capabilities available as managed services -- no keys needed.
-                </CardDescription>
+                <CardDescription>Capabilities available as managed services -- no keys needed.</CardDescription>
               </CardHeader>
               <CardContent>
                 <ul className="space-y-3">
                   {hostedAdapters.map((adapter) => (
-                    <li
-                      key={adapter.capability}
-                      className="flex items-center justify-between rounded-lg border p-3"
-                    >
+                    <li key={adapter.capability} className="flex items-center justify-between rounded-lg border p-3">
                       <div>
                         <p className="text-sm font-medium">{adapter.label}</p>
                         <p className="text-xs text-muted-foreground">{adapter.description}</p>
@@ -470,15 +444,12 @@ export default function PluginDetailPage() {
             <CardHeader>
               <CardTitle className="text-base">Configuration Schema</CardTitle>
               <CardDescription>
-                Fields auto-generated from the plugin manifest. These will be filled during
-                installation.
+                Fields auto-generated from the plugin manifest. These will be filled during installation.
               </CardDescription>
             </CardHeader>
             <CardContent>
               {plugin.configSchema.length === 0 ? (
-                <p className="text-sm text-muted-foreground">
-                  This plugin has no configuration fields.
-                </p>
+                <p className="text-sm text-muted-foreground">This plugin has no configuration fields.</p>
               ) : (
                 <div className="space-y-3">
                   {plugin.configSchema.map((field) => (
@@ -489,25 +460,17 @@ export default function PluginDetailPage() {
                           {field.type}
                         </Badge>
                         {field.required && (
-                          <Badge
-                            variant="outline"
-                            className="text-[10px] border-red-500/25 text-red-500"
-                          >
+                          <Badge variant="outline" className="text-[10px] border-red-500/25 text-red-500">
                             required
                           </Badge>
                         )}
                         {field.secret && (
-                          <Badge
-                            variant="outline"
-                            className="text-[10px] border-yellow-500/25 text-yellow-500"
-                          >
+                          <Badge variant="outline" className="text-[10px] border-yellow-500/25 text-yellow-500">
                             secret
                           </Badge>
                         )}
                       </div>
-                      {field.description && (
-                        <p className="mt-1 text-xs text-muted-foreground">{field.description}</p>
-                      )}
+                      {field.description && <p className="mt-1 text-xs text-muted-foreground">{field.description}</p>}
                     </div>
                   ))}
                 </div>

package/src/app/(dashboard)/marketplace/error.tsx

@@ -8,13 +8,7 @@ import { logger } from "@/lib/logger";
 
 const log = logger("error-boundary:marketplace");
 
-export default function MarketplaceError({
-  error,
-  reset,
-}: {
-  error: Error & { digest?: string };
-  reset: () => void;
-}) {
+export default function MarketplaceError({ error, reset }: { error: Error & { digest?: string }; reset: () => void }) {
   const [showDetails, setShowDetails] = useState(false);
   const isDev = process.env.NODE_ENV === "development";
 

package/src/app/(dashboard)/marketplace/page.tsx

@@ -104,10 +104,7 @@ export default function MarketplacePage() {
   }
 
   // Superpower plugins
-  const superpowers = useMemo(
-    () => plugins.filter((p) => p.marketplaceTab === "superpower"),
-    [plugins],
-  );
+  const superpowers = useMemo(() => plugins.filter((p) => p.marketplaceTab === "superpower"), [plugins]);
 
   // Category counts for current tab
   const categoryCounts = useMemo(() => {
@@ -199,18 +196,14 @@ export default function MarketplacePage() {
     <>
       {/* First-visit cinematic overlay */}
       <AnimatePresence>
-        {showFirstVisit && (
-          <FirstVisitHero superpowers={superpowers} onDismiss={handleDismissFirstVisit} />
-        )}
+        {showFirstVisit && <FirstVisitHero superpowers={superpowers} onDismiss={handleDismissFirstVisit} />}
       </AnimatePresence>
 
       <div className="p-6 space-y-6">
         {/* Page header */}
         <div>
           <h1 className="text-2xl font-bold tracking-tight">Browse Superpowers</h1>
-          <p className="text-sm text-muted-foreground">
-            Give your {productName()} abilities it was born to have.
-          </p>
+          <p className="text-sm text-muted-foreground">Give your {productName()} abilities it was born to have.</p>
         </div>
 
         {/* Featured hero section — hidden during search */}
@@ -231,11 +224,7 @@ export default function MarketplacePage() {
         />
 
         {activeTab !== "superpower" && (
-          <CategoryFilter
-            selected={selectedCategory}
-            onSelect={setSelectedCategory}
-            counts={categoryCounts}
-          />
+          <CategoryFilter selected={selectedCategory} onSelect={setSelectedCategory} counts={categoryCounts} />
         )}
 
         {/* Plugin grid */}
@@ -245,19 +234,9 @@ export default function MarketplacePage() {
           <div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
             {filtered.map((plugin, i) =>
               activeTab === "superpower" ? (
-                <SuperpowerCard
-                  key={plugin.id}
-                  plugin={plugin}
-                  index={i}
-                  installed={installedIds.has(plugin.id)}
-                />
+                <SuperpowerCard key={plugin.id} plugin={plugin} index={i} installed={installedIds.has(plugin.id)} />
               ) : (
-                <PluginCard
-                  key={plugin.id}
-                  plugin={plugin}
-                  index={i}
-                  installed={installedIds.has(plugin.id)}
-                />
+                <PluginCard key={plugin.id} plugin={plugin} index={i} installed={installedIds.has(plugin.id)} />
               ),
             )}
           </div>

package/src/app/(dashboard)/not-found.tsx

@@ -10,9 +10,7 @@ export default function DashboardNotFound() {
         <CardHeader>
           <div className="flex items-center gap-3">
             <TerminalIcon className="size-5 text-terminal" />
-            <span className="text-sm font-medium uppercase tracking-widest text-muted-foreground">
-              system error
-            </span>
+            <span className="text-sm font-medium uppercase tracking-widest text-muted-foreground">system error</span>
           </div>
         </CardHeader>
         <CardContent className="space-y-4">
@@ -22,8 +20,7 @@ export default function DashboardNotFound() {
             <span className="animate-ellipsis" />
           </p>
           <p className="text-sm text-muted-foreground">
-            The requested page does not exist or has been moved. Check the URL or navigate back to
-            the dashboard.
+            The requested page does not exist or has been moved. Check the URL or navigate back to the dashboard.
           </p>
         </CardContent>
         <CardFooter className="gap-3">

package/src/app/(dashboard)/onboarding/page.tsx

@@ -5,14 +5,7 @@ import { Bot, ChevronRight, Rocket, Sparkles } from "lucide-react";
 import { useRouter } from "next/navigation";
 import { useEffect, useState } from "react";
 import { Button } from "@/components/ui/button";
-import {
-  Card,
-  CardContent,
-  CardDescription,
-  CardFooter,
-  CardHeader,
-  CardTitle,
-} from "@/components/ui/card";
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card";
 import { Input } from "@/components/ui/input";
 import { getBrandConfig, storageKey } from "@/lib/brand-config";
 import { presets } from "@/lib/onboarding-data";
@@ -103,9 +96,7 @@ export default function OnboardingPage() {
           {[0, 1, 2].map((s) => (
             <div
               key={s}
-              className={`h-1.5 w-12 rounded-full transition-colors ${
-                s <= step ? "bg-terminal" : "bg-terminal/20"
-              }`}
+              className={`h-1.5 w-12 rounded-full transition-colors ${s <= step ? "bg-terminal" : "bg-terminal/20"}`}
             />
           ))}
         </div>
@@ -170,9 +161,7 @@ export default function OnboardingPage() {
                 <CardTitle className="text-sm font-medium uppercase tracking-widest text-terminal">
                   Pick a preset
                 </CardTitle>
-                <CardDescription>
-                  Choose a starting configuration. You can customize everything later.
-                </CardDescription>
+                <CardDescription>Choose a starting configuration. You can customize everything later.</CardDescription>
               </CardHeader>
               <CardContent className="space-y-2">
                 {presets
@@ -240,9 +229,7 @@ export default function OnboardingPage() {
                 {selectedPresetData && selectedPresetData.channels.length > 0 && (
                   <div className="flex items-center justify-between rounded-sm border border-terminal/10 px-3 py-2">
                     <span className="text-muted-foreground">Channels</span>
-                    <span className="font-medium text-terminal">
-                      {selectedPresetData.channels.join(", ")}
-                    </span>
+                    <span className="font-medium text-terminal">{selectedPresetData.channels.join(", ")}</span>
                   </div>
                 )}
               </CardContent>
@@ -250,11 +237,7 @@ export default function OnboardingPage() {
                 <Button variant="ghost" size="sm" onClick={() => setStep(1)}>
                   Back
                 </Button>
-                <Button
-                  data-onboarding-id="onboarding.launch"
-                  variant="terminal"
-                  onClick={handleLaunch}
-                >
+                <Button data-onboarding-id="onboarding.launch" variant="terminal" onClick={handleLaunch}>
                   Launch <Rocket className="ml-1 size-4" />
                 </Button>
               </CardFooter>

package/src/app/(dashboard)/settings/account/page.tsx

@@ -105,12 +105,7 @@ export default function AccountPage() {
                 {usage.instancesRunning} of {usage.instanceCap} instances used
               </span>
             </div>
-            <Button
-              variant="terminal"
-              size="sm"
-              onClick={handleManageBilling}
-              disabled={portalLoading}
-            >
+            <Button variant="terminal" size="sm" onClick={handleManageBilling} disabled={portalLoading}>
               {portalLoading ? "Redirecting..." : "Manage Billing"}
             </Button>
           </CardContent>

package/src/app/(dashboard)/settings/activity/page.tsx

@@ -3,22 +3,9 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { Button } from "@/components/ui/button";
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from "@/components/ui/select";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Skeleton } from "@/components/ui/skeleton";
-import {
-  Table,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableHeader,
-  TableRow,
-} from "@/components/ui/table";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import type { AuditLogResponse } from "@/lib/api";
 import { fetchAuditLog } from "@/lib/api";
@@ -82,9 +69,7 @@ export default function ActivityPage() {
       const reqId = ++requestIdRef.current;
       try {
         const since =
-          dateRange === "all"
-            ? undefined
-            : new Date(Date.now() - Number(dateRange) * 86400000).toISOString();
+          dateRange === "all" ? undefined : new Date(Date.now() - Number(dateRange) * 86400000).toISOString();
         const result = await fetchAuditLog({
           limit: PAGE_SIZE,
           offset: newOffset,
@@ -134,9 +119,7 @@ export default function ActivityPage() {
           <div className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
             <div>
               <CardTitle>Events</CardTitle>
-              <CardDescription>
-                {data ? `${data.total} total events` : "Loading..."}
-              </CardDescription>
+              <CardDescription>{data ? `${data.total} total events` : "Loading..."}</CardDescription>
             </div>
             <div className="flex flex-wrap items-center gap-2">
               <Select value={dateRange} onValueChange={setDateRange}>
@@ -213,27 +196,18 @@ export default function ActivityPage() {
                   </TableHeader>
                   <TableBody>
                     {events.map((event) => (
-                      <TableRow
-                        key={event.id}
-                        className="hover:bg-accent/50 transition-colors duration-150"
-                      >
+                      <TableRow key={event.id} className="hover:bg-accent/50 transition-colors duration-150">
                         <TableCell className="w-[100px]">
                           <Tooltip>
                             <TooltipTrigger className="text-xs text-muted-foreground">
                               {relativeTime(event.createdAt)}
                             </TooltipTrigger>
-                            <TooltipContent>
-                              {new Date(event.createdAt).toLocaleString()}
-                            </TooltipContent>
+                            <TooltipContent>{new Date(event.createdAt).toLocaleString()}</TooltipContent>
                           </Tooltip>
                         </TableCell>
-                        <TableCell className="font-medium text-foreground">
-                          {humanAction(event.action)}
-                        </TableCell>
+                        <TableCell className="font-medium text-foreground">{humanAction(event.action)}</TableCell>
                         <TableCell className="text-muted-foreground">
-                          <span className="text-xs uppercase tracking-wide">
-                            {event.resourceType}
-                          </span>{" "}
+                          <span className="text-xs uppercase tracking-wide">{event.resourceType}</span>{" "}
                           {event.resourceName ?? event.resourceId}
                         </TableCell>
                         <TableCell className="text-xs text-muted-foreground max-w-[200px] truncate">