# Move useLogger to harmonic-saas Base Layer

This document describes the steps to move the `useLogger` composable from the low-histamine-app to the harmonic-saas base layer, making it available to all apps built on the layer.

## Current Implementation

The logger is currently in:
- `app/composables/useLogger.ts`

## Steps to Migrate

### 1. Add Runtime Config for App Name

In `harmonic-saas/nuxt.config.ts`, add a runtime config option:

```typescript
runtimeConfig: {
  public: {
    appLogTag: 'HarmonicSaaS', // Default tag, apps can override
  }
}
```

### 2. Create the Composable in harmonic-saas

Create `harmonic-saas/app/composables/useLogger.ts`:

```typescript
/**
 * Global logger that prefixes all logs with a configurable app tag
 * This makes it easy to filter logs in browser console and logcat
 */
export const useLogger = (context?: string) => {
  const config = useRuntimeConfig()
  const appTag = `[${config.public.appLogTag || 'App'}]`
  const prefix = context ? `${appTag}[${context}]` : appTag

  return {
    log: (...args: unknown[]) => console.log(prefix, ...args),
    info: (...args: unknown[]) => console.info(prefix, ...args),
    warn: (...args: unknown[]) => console.warn(prefix, ...args),
    error: (...args: unknown[]) => console.error(prefix, ...args),
    debug: (...args: unknown[]) => console.debug(prefix, ...args),
  }
}

// Global logger instance (uses default config)
export const createLogger = (appTag: string) => ({
  log: (...args: unknown[]) => console.log(`[${appTag}]`, ...args),
  info: (...args: unknown[]) => console.info(`[${appTag}]`, ...args),
  warn: (...args: unknown[]) => console.warn(`[${appTag}]`, ...args),
  error: (...args: unknown[]) => console.error(`[${appTag}]`, ...args),
  debug: (...args: unknown[]) => console.debug(`[${appTag}]`, ...args),
})
```

### 3. Update harmonic-saas Internal Logging

Replace all `console.log('[SomeTag]', ...)` calls in harmonic-saas with:

```typescript
const log = useLogger('Auth')  // or whatever context
log.info('Session validated')
```

Files to update in harmonic-saas:
- `app/middleware/auth.global.ts` - Auth middleware logging
- `app/composables/useAuth.ts` - Authentication logging
- Any other files with console.log statements

### 4. Configure in Consuming Apps

In `low-histamine-app/nuxt.config.ts`:

```typescript
runtimeConfig: {
  public: {
    appLogTag: 'LowHistamineApp',
  }
}
```

### 5. Remove Local Implementation

After migrating to harmonic-saas:
1. Delete `low-histamine-app/app/composables/useLogger.ts`
2. Update any imports if needed (should auto-import from layer)

### 6. Update Android Native Code (App-Specific)

Each app should still configure its Android native logging tag in the Java files:

```java
private static final String TAG = "LowHistamineApp";
```

This remains app-specific since native code is not shared via the Nuxt layer.

## Benefits

- Consistent logging across all harmonic-saas based apps
- Easy to filter logs in development and production
- Configurable per-app log tag
- Works with both browser console and Android logcat

## Testing

After migration, verify:
1. Logs appear with correct prefix in browser console
2. Logs appear correctly in Android logcat: `adb logcat Capacitor/Console:D *:S | grep LowHistamineApp`
3. harmonic-saas internal logs also use the app's configured tag
