apply prettier formatting to all files

Auto-formatted by Prettier v3 during ESLint migration

Author: leonardoventurini

.serena/memories/architecture_patterns.md

@@ -3,41 +3,48 @@
 ## Browser Extension Architecture
 
 ### Multi-Context Design
+
 The extension operates in multiple browser contexts:
+
 1. **DevTools Panel** (`src/Pages/Panel`) - Main UI for DDP tracking and Minimongo inspection
 2. **Options Page** (`src/Pages/Options`) - Extension settings and configuration
 3. **Browser Action Popup** (`src/Pages/Popup`) - Quick access popup from toolbar
 4. **Background Scripts** - Browser extension background processes (in `src/Browser/`)
 5. **Content Scripts** - Injected into Meteor app pages (in `src/Injectors/`)
 
 ### Communication Bridge
+
 - `src/Bridge.ts` handles inter-context communication
 - Uses browser extension messaging APIs
 - Coordinates between DevTools panel, content scripts, and page context
 
 ## State Management with MobX
 
 ### Store Pattern
+
 - MobX 6 with `mobx-react-lite` for React integration
 - Stores located in `src/Stores/`
 - Likely uses observable state with computed values and actions
 - React components observe stores using hooks
 
 ### State Persistence
+
 - **Dexie (IndexedDB)** for persistent storage (bookmarks)
 - Located in `src/Database/`
 - Allows saving DDP messages across sessions and browser restarts
 
 ## Component Architecture
 
 ### UI Framework Hierarchy
+
 1. **Blueprint** - Primary component library (buttons, dialogs, forms, etc.)
 2. **Custom Components** - Project-specific components in `src/Components/`
 3. **Styled Components** - CSS-in-JS for component-specific styling
 4. **SCSS** - Global styles and theming
 5. **Tailwind CSS + DaisyUI** - Utility classes for rapid styling
 
 ### Component Patterns
+
 - Functional components with React Hooks (React 17)
 - MobX observer components using `observer()` HOC or hooks
 - Likely uses `react-singleton-hook` for global singletons
@@ -46,7 +53,9 @@ The extension operates in multiple browser contexts:
 ## Data Visualization
 
 ### D3.js Integration
+
 Used for visualizing Meteor/DDP data structures:
+
 - **d3-hierarchy** - Tree structures for Minimongo documents
 - **d3-shape** - Shapes for data visualization
 - **d3-selection** - DOM manipulation for charts
@@ -57,17 +66,20 @@ Custom "Object Treerinator" for document visualization (mentioned in README)
 ## Performance Optimizations
 
 ### Virtualization
+
 - `react-window` + `react-window-infinite-loader` for handling thousands of DDP messages
 - Virtual scrolling prevents DOM bloat with large datasets
 
 ### Memoization & Throttling
+
 - `lodash.memoize` - Cache expensive computations
 - `lodash.debounce` - Debounce user input
 - `lodash.throttle` - Throttle high-frequency events (DDP message processing)
 
 ## Build System
 
 ### Webpack Configuration
+
 - **Base config** - Shared settings
 - **Dev builds** - Watch mode, source maps, faster builds
 - **Prod builds** - Minification, optimization
@@ -76,6 +88,7 @@ Custom "Object Treerinator" for document visualization (mentioned in README)
   - Firefox may use Manifest V2 or adapted V3
 
 ### Asset Handling
+
 - `file-loader` - Images and static assets
 - `css-loader` + `style-loader` - CSS module handling
 - `sass-loader` - SCSS compilation
@@ -84,39 +97,46 @@ Custom "Object Treerinator" for document visualization (mentioned in README)
 - `babel-loader` - JavaScript transpilation
 
 ### Code Splitting
+
 Likely splits code by extension context (panel, popup, options, background)
 
 ## Extension-Specific Patterns
 
 ### Webextension Polyfill
+
 - `webextension-polyfill` provides cross-browser compatibility
 - Converts callback-based APIs to Promises
 - Allows same code to work on Chrome and Firefox
 
 ### Injectors Pattern
+
 - Content scripts in `src/Injectors/` inject code into Meteor app pages
 - Intercepts DDP messages by hooking into Meteor's DDP client
 - Sends captured data to DevTools panel via messaging bridge
 
 ### Analytics
+
 - `src/Analytics.ts` likely tracks usage (opt-in)
 - Helps understand feature usage and bugs
 
 ## Development Workflow
 
 ### Hot Module Replacement
+
 - Webpack dev builds watch for changes
 - Browser extension reloads on rebuild
 - Devapp runs concurrently on port 3000
 
 ### Concurrent Development
+
 - `npm-run-all` / `concurrently` - Run multiple processes
 - `wait-on` - Synchronize startup (wait for builds and devapp)
 - `web-ext run` - Launches browser with extension loaded
 
 ## Styling Strategy
 
 ### Layered Approach
+
 1. **Normalize.css** - Base reset
 2. **Tailwind base** - Utility-first foundation
 3. **DaisyUI** - Component classes on top of Tailwind

.serena/memories/code_style_and_conventions.md

@@ -1,16 +1,20 @@
 # Code Style and Conventions
 
 ## ESLint Configuration
+
 The project extends `@tstt/eslint-config` with custom overrides:
+
 - **global-require**: Disabled (allows require() anywhere)
 - **@typescript-eslint/no-var-requires**: Disabled (allows const x = require())
 - **@typescript-eslint/no-inferrable-types**: Error with ignoreParameters and ignoreProperties
 - **Global variables**: `Meteor` and `i18n` are defined as readonly
 
 ## Prettier Configuration
+
 Inherits from `@tstt/eslint-config/.prettierrc.js` (exact settings not visible but standard Prettier defaults)
 
 ## EditorConfig Settings
+
 - **Indentation**: 2 spaces (for .js, .jsx, .ts, .tsx, .groovy)
 - **Line endings**: LF (Unix-style)
 - **Charset**: UTF-8
@@ -19,6 +23,7 @@ Inherits from `@tstt/eslint-config/.prettierrc.js` (exact settings not visible b
 - **Visual guides**: 80 characters
 
 ## TypeScript Configuration
+
 - **Strict mode**: Disabled (`strict: false`)
 - **noImplicitAny**: Disabled
 - **Target**: ES6
@@ -31,27 +36,33 @@ Inherits from `@tstt/eslint-config/.prettierrc.js` (exact settings not visible b
 - **Path mapping**: `@/*` → `src/*`
 
 ## Naming Conventions
+
 Based on code inspection:
+
 - **Components**: PascalCase (e.g., `Panel`, `Options`, `Popup`)
 - **Files**: Match component names for React components
 - **Constants**: Likely UPPER_SNAKE_CASE (based on Constants.ts)
 - **Utilities**: camelCase functions
 
 ## Code Organization Patterns
+
 - **React**: Functional components with hooks (React 17)
 - **State Management**: MobX stores for global state
 - **Styling**: Mix of styled-components, SCSS modules, and Tailwind utilities
 - **Type Definitions**: Global types in `src/index.d.ts`
 - **Imports**: Use path alias `@/` for src directory imports
 
 ## Component Structure
+
 Based on `App.tsx`:
+
 - Import external libraries first (React, Blueprint, etc.)
 - Then internal components/pages
 - Finally styles (CSS/SCSS)
 - Component logic and rendering
 
 ## Best Practices (from CONTRIBUTING.md)
+
 1. Code must be linted and properly formatted
 2. Features should benefit the Meteor community as a whole
 3. Be friendly and supportive in contributions

.serena/memories/codebase_structure.md

@@ -1,6 +1,7 @@
 # Codebase Structure
 
 ## Root Directory
+
 ```
 meteor-devtools-evolved/
 ├── src/                    # Main source code
@@ -14,6 +15,7 @@ meteor-devtools-evolved/
 ```
 
 ## Source Directory (`src/`)
+
 ```
 src/
 ├── Assets/         # Static assets (images, icons, etc.)
@@ -36,19 +38,23 @@ src/
 ```
 
 ## Webpack Configuration (`webpack/`)
+
 - `base.js` - Base configuration shared by all builds
 - `chrome.dev.js` / `chrome.prod.js` - Chrome-specific builds
 - `firefox.dev.js` / `firefox.prod.js` - Firefox-specific builds
 - `utils.js` - Webpack utility functions
 
 ## Development App (`devapp/`)
+
 A minimal Meteor application used for testing the extension during development:
+
 - Runs on port 3000
 - Standard Meteor project structure
 - Uses Meteor's module system
 - Includes basic client and server code
 
 ## Key Entry Points
+
 - `src/App.tsx` - Renders Panel, Options, or Popup based on context
 - Extension manifests generated by webpack for Chrome/Firefox
 - Path alias: `@/*` maps to `src/*` for imports

.serena/memories/project_overview.md

@@ -1,18 +1,22 @@
 # Meteor DevTools Evolved - Project Overview
 
 ## Purpose
+
 Meteor DevTools Evolved is a browser extension for Google Chrome and Mozilla Firefox that helps developers monitor, debug, and optimize their Meteor.js applications. It provides:
 
 - **DDP (Distributed Data Protocol) Tracking**: Filter and search through thousands of DDP messages to understand what's happening under the hood
 - **Bookmarks**: Save DDP messages for later search and retrieval (stored in IndexedDB)
 - **Minimongo Inspection**: Search and visualize documents in Minimongo with a custom Object Tree viewer
 
 ## Project Context
+
 This project is based on the original Meteor DevTools extension by The Bakery (no longer maintained), hence the "evolved" in the name. It was completely rewritten with modern tooling and technologies.
 
 ## Distribution
+
 - Chrome Web Store: https://chrome.google.com/webstore/detail/meteor-devtools-evolved/ibniinmoafhgbifjojidlagmggecmpgf
 - Firefox Add-ons: https://addons.mozilla.org/en-US/firefox/addon/meteor-devtools-evolved/
 
 ## Repository
+
 GitHub: https://github.com/leonardoventurini/meteor-devtools-evolved

.serena/memories/suggested_commands.md

@@ -1,12 +1,14 @@
 # Suggested Commands
 
 ## Initial Setup
+
 ```bash
 # Install dependencies for both root and devapp
 yarn setup
 ```
 
 ## Development
+
 ```bash
 # Start development mode for Chrome (default)
 yarn dev
@@ -22,12 +24,14 @@ yarn devapp
 ```
 
 **Note**: The `yarn dev` commands will:
+
 1. Build and watch the extension
 2. Run the devapp in parallel
 3. Launch a browser instance with the extension installed
 4. Auto-reload on code changes
 
 ## Building
+
 ```bash
 # Build Chrome extension for production
 yarn build:chrome
@@ -40,6 +44,7 @@ yarn clean
 ```
 
 ## Linting & Formatting
+
 ```bash
 # Run ESLint on all source files
 yarn lint
@@ -49,6 +54,7 @@ yarn lint
 ```
 
 ## Security Auditing
+
 ```bash
 # Check for high and critical security vulnerabilities
 yarn run audit
@@ -57,6 +63,7 @@ yarn run audit
 ```
 
 ## Git Operations
+
 ```bash
 # Standard git commands work normally
 git status
@@ -66,6 +73,7 @@ git push
 ```
 
 ## Useful System Commands (macOS/Darwin)
+
 ```bash
 # List files
 ls -la
@@ -87,16 +95,20 @@ pwd
 ```
 
 ## Testing Extension Manually
+
 After running `yarn dev:chrome` or `yarn dev:firefox`, the extension will be loaded in a browser instance. Navigate to `http://localhost:2100` to see the devapp and test the extension's DevTools panel.
 
 ## Node/Yarn Version Management
+
 The project uses Volta to manage Node and Yarn versions:
+
 - Node.js: 14.19.3
 - Yarn: 1.22.18
 
 Volta will automatically use the correct versions if installed.
 
 ## Troubleshooting
+
 ```bash
 # If dependencies are out of sync, reinstall
 rm -rf node_modules yarn.lock