refactor: improve code formatting and consistency across multiple files

- Standardized import statements and removed unnecessary line breaks for better readability in various components.
- Enhanced error handling and logging in the useElectronPrinter hook.
- Updated sample data formatting in AgGridShowcase for improved clarity.
- Refactored JSX elements for consistent indentation and structure in LandingSample, AuthPage, and EventsPage components.
- Consolidated and simplified conditional rendering logic in several components.

These changes aim to enhance code maintainability and readability throughout the project.

apps/showcase/src/pages/events/components/events-demo/index.tsx

@@ -1,12 +1,5 @@
 import { useState, useRef, useEffect } from 'react';
-import {
-  Card,
-  Title,
-  Text,
-  Stack,
-  Badge,
-  Divider,
-} from '@repo/ui/components';
+import { Card, Title, Text, Stack, Badge, Divider } from '@repo/ui/components';
 
 // ── Showcase Components ──────────────────────────────────────────
 import { CashierUI } from './printer/cashier.ui';
@@ -65,8 +58,8 @@ export default function EventsDemoPage() {
           🖨️ Showcase 1: Cross-Platform Printer Abstraction
         </Title>
         <Text size="sm" c="dimmed" mb="md">
-          The CashierUI publishes a <code>{DEVICE_EVENTS.PRINT_RECEIPT}</code> event.
-          The PrinterListener listens for it and simulates interacting with a physical printer.
+          The CashierUI publishes a <code>{DEVICE_EVENTS.PRINT_RECEIPT}</code> event. The PrinterListener listens for it
+          and simulates interacting with a physical printer.
         </Text>
 
         {/* Headless listener — renders nothing visible */}
@@ -110,9 +103,8 @@ export default function EventsDemoPage() {
           📈 Showcase 2: High-Frequency Real-Time Data (50 updates/sec)
         </Title>
         <Text size="sm" c="dimmed" mb="md">
-          A mock WebSocket fires <code>WS:STOCK_UPDATE</code> every 20ms.
-          Each StockRow subscribes to the global event but only updates when{' '}
-          <code>payload.id === row.id</code>. The parent grid never re-renders.
+          A mock WebSocket fires <code>WS:STOCK_UPDATE</code> every 20ms. Each StockRow subscribes to the global event
+          but only updates when <code>payload.id === row.id</code>. The parent grid never re-renders.
         </Text>
 
         <LiveStockGrid />
@@ -126,8 +118,8 @@ export default function EventsDemoPage() {
           💾 Showcase 3: Auth/Profile Sync with <code>@repo/core-storage</code>
         </Title>
         <Text size="sm" c="dimmed" mb="md">
-          ProfileSettingsUI publishes <code>{AUTH_EVENTS.PROFILE_UPDATED}</code>.
-          StorageSyncListener silently catches it in the background and saves to IndexedDB via <code>secureIndexedDB</code>.
+          ProfileSettingsUI publishes <code>{AUTH_EVENTS.PROFILE_UPDATED}</code>. StorageSyncListener silently catches
+          it in the background and saves to IndexedDB via <code>secureIndexedDB</code>.
         </Text>
 
         {/* Headless listener — renders nothing visible */}

apps/showcase/src/pages/events/components/events-demo/printer/cashier.ui.tsx

@@ -1,15 +1,7 @@
 import { useState } from 'react';
 import { usePublishEvent } from '@repo/core-events';
 import type { ReceiptItem } from '@repo/core-events';
-import {
-  Button,
-  Group,
-  Stack,
-  Text,
-  TextInput,
-  Table,
-  Badge,
-} from '@repo/ui/components';
+import { Button, Group, Stack, Text, TextInput, Table, Badge } from '@repo/ui/components';
 import { DEVICE_EVENTS } from '../../../../../core/constants/events';
 
 // ─── Mock Receipt Data ──────────────────────────────────────────

apps/showcase/src/pages/events/components/events-demo/printer/printer.listener.tsx

@@ -38,8 +38,8 @@ export function PrinterListener({ onLog }: PrinterListenerProps) {
       // Uses the preload-exposed API. The Electron main process
       // handles the actual OS-level print job via `webContents.print()`.
       onLog(`[Electron] Sending receipt ${payload.receiptId} to OS printer via IPC bridge...`);
-      window.electronAPI!
-        .print({ silent: true, printBackground: true })
+      window
+        .electronAPI!.print({ silent: true, printBackground: true })
         .then((result) => {
           if (result.success) {
             onLog(`[Electron] ✅ Receipt ${payload.receiptId} printed successfully.`);
@@ -55,7 +55,9 @@ export function PrinterListener({ onLog }: PrinterListenerProps) {
       // Opens the native browser print dialog. In production, you'd
       // likely render a hidden print-optimized iframe first.
       onLog(`[Browser] 🖨️ Receipt ${payload.receiptId} — opening browser print dialog...`);
-      onLog(`  → Cashier: ${payload.cashierName} | Items: ${payload.items.length} | Total: $${payload.total.toFixed(2)}`);
+      onLog(
+        `  → Cashier: ${payload.cashierName} | Items: ${payload.items.length} | Total: $${payload.total.toFixed(2)}`,
+      );
       window.print();
     }
   });

apps/showcase/src/pages/events/components/events-demo/stock-grid/mock-websocket.service.ts

@@ -8,9 +8,26 @@ import { WS_EVENTS } from '../../../../../core/constants/events';
  * We generate 1000 unique IDs from these base tickers + numeric suffix.
  */
 const BASE_TICKERS = [
-  'AAPL', 'GOOG', 'MSFT', 'AMZN', 'META', 'NVDA', 'TSLA', 'AMD',
-  'NFLX', 'ORCL', 'CRM', 'INTC', 'PYPL', 'ADBE', 'CSCO', 'QCOM',
-  'AVGO', 'TXN', 'MU', 'SHOP',
+  'AAPL',
+  'GOOG',
+  'MSFT',
+  'AMZN',
+  'META',
+  'NVDA',
+  'TSLA',
+  'AMD',
+  'NFLX',
+  'ORCL',
+  'CRM',
+  'INTC',
+  'PYPL',
+  'ADBE',
+  'CSCO',
+  'QCOM',
+  'AVGO',
+  'TXN',
+  'MU',
+  'SHOP',
 ];
 
 /**

apps/showcase/src/pages/events/components/events-demo/stock-grid/stock-row.ui.tsx

@@ -58,18 +58,12 @@ export const StockRow = memo(function StockRow({ stockId }: StockRowProps) {
       : '#fa5252' // red
     : undefined;
 
-  const changeArrow = data
-    ? data.change >= 0
-      ? '▲'
-      : '▼'
-    : '';
+  const changeArrow = data ? (data.change >= 0 ? '▲' : '▼') : '';
 
   return (
     <tr style={{ fontSize: 12, fontFamily: 'monospace' }}>
       <td style={{ padding: '2px 8px', fontWeight: 600 }}>{stockId}</td>
-      <td style={{ padding: '2px 8px', textAlign: 'right' }}>
-        {data ? `$${data.price.toFixed(2)}` : '—'}
-      </td>
+      <td style={{ padding: '2px 8px', textAlign: 'right' }}>{data ? `$${data.price.toFixed(2)}` : '—'}</td>
       <td
         style={{
           padding: '2px 8px',
@@ -80,12 +74,8 @@ export const StockRow = memo(function StockRow({ stockId }: StockRowProps) {
       >
         {data ? `${changeArrow} ${data.change >= 0 ? '+' : ''}${data.change.toFixed(2)}` : '—'}
       </td>
-      <td style={{ padding: '2px 8px', textAlign: 'right' }}>
-        {data ? data.volume.toLocaleString() : '—'}
-      </td>
-      <td style={{ padding: '2px 8px', textAlign: 'right', color: '#868e96' }}>
-        {renderCountRef.current}
-      </td>
+      <td style={{ padding: '2px 8px', textAlign: 'right' }}>{data ? data.volume.toLocaleString() : '—'}</td>
+      <td style={{ padding: '2px 8px', textAlign: 'right', color: '#868e96' }}>{renderCountRef.current}</td>
     </tr>
   );
 });

apps/showcase/src/pages/events/components/example/features/booking/data/advanced-booking.transformer.ts

@@ -151,9 +151,7 @@ export class AdvancedBookingTransformer extends BookingTransformer {
     return super.transformGetManyResponse(dtos).map((entity) => ({
       ...entity,
       // Normalize 'cancelled' vs 'canceled' from different API versions
-      status: entity.status === ('canceled' as BookingEntity['status'])
-        ? 'cancelled'
-        : entity.status,
+      status: entity.status === ('canceled' as BookingEntity['status']) ? 'cancelled' : entity.status,
     }));
   }
 }

apps/showcase/src/pages/events/components/example/features/booking/data/booking.data-services.ts

@@ -55,4 +55,3 @@ export const bookingServices = new CommonRemoteDataServices<BookingEntity, Booki
   moduleKey: 'BOOKING',
   transformer: new BookingTransformer(),
 });
-

apps/showcase/src/pages/events/components/example/features/booking/presentation/BookingSample.tsx

@@ -30,10 +30,10 @@ export default function BookingSample() {
         telemetryContext: {
           customSpanName: 'booking.list.fetch',
           tags: {
-            'feature': 'booking',
+            feature: 'booking',
             'ui.component': 'BookingSample',
             'ui.action': 'list_fetch',
-            'page': 1,
+            page: 1,
           },
           pushEventOnSuccess: 'booking_list_loaded',
         },
@@ -76,14 +76,19 @@ export default function BookingSample() {
         {loading ? 'Fetching…' : 'Test Fetch Bookings'}
       </button>
 
-      {error && (
-        <pre style={{ color: '#ef4444', marginTop: 16, whiteSpace: 'pre-wrap' }}>
-          ❌ {error}
-        </pre>
-      )}
+      {error && <pre style={{ color: '#ef4444', marginTop: 16, whiteSpace: 'pre-wrap' }}>❌ {error}</pre>}
 
       {result && (
-        <pre style={{ marginTop: 16, background: '#1e1e2e', color: '#a6e3a1', padding: 16, borderRadius: 8, overflow: 'auto' }}>
+        <pre
+          style={{
+            marginTop: 16,
+            background: '#1e1e2e',
+            color: '#a6e3a1',
+            padding: 16,
+            borderRadius: 8,
+            overflow: 'auto',
+          }}
+        >
           {JSON.stringify(result, null, 2)}
         </pre>
       )}

apps/showcase/src/pages/events/index.tsx

@@ -7,7 +7,9 @@ export default function EventsPage() {
     <Container size="xl" m={0} p={0}>
       <Stack gap="xl">
         <Card withBorder shadow="sm" radius="md" p="md">
-          <Title order={4} mb="md">Nested Showcase Example</Title>
+          <Title order={4} mb="md">
+            Nested Showcase Example
+          </Title>
           <Text mb="md">This is an example of a nested showcase component.</Text>
           <ExamplePage />
         </Card>