vuon9 · vuon9 · Jan 31, 2026 · Jan 31, 2026
diff --git a/TOOL_STATUS.md b/TOOL_STATUS.md
@@ -15,43 +15,69 @@ This document tracks the refactoring and development status of each tool compone
 | Tool | Status | Notes | Last Updated |
 |------|--------|-------|--------------|
 | JwtDebugger | 🟢 Done | Uses component abstraction system (ToolLayout, ToolTextArea, ToolInputGroup), toggleable layout, consistent button styling with icons (MagicWand, Security, Code), enhanced tabs (custom mode tabs, improved JSON/Claims tabs), resizable textareas with constraints, proper error handling | Completed 2026-01-25 |
-| **TextBasedConverter** | 🟢 Done | Unified tool with 45+ algorithms across 5 categories (encrypt, encode, escape, hash, convert). Features: Common Tags (Quick Select), Base64 Image Preview, All Hashes view, Smart ConfigurationPane, 5 Escape methods. Backend: hierarchical structure with 83 comprehensive tests. Phase 2 & 3 complete | Completed 2026-01-31 |
+| **TextConverter** | 🟢 Done | Unified tool with 45+ algorithms across 5 categories (encrypt, encode, escape, hash, convert). Features: Common Tags (Quick Select), Base64 Image Preview, All Hashes view, Smart ConfigurationPane, 5 Escape methods. Backend: hierarchical structure with 83 comprehensive tests. Phase 2 & 3 complete. Replaces: TextBasedConverter | Completed 2026-01-31 |
+| **StringUtilities** | 🟡 In Progress | Consolidated tool combining LineSortDedupe, StringCaseConverter, and StringInspector. Features: Tab navigation (Sort/Dedupe, Case Converter, Inspector), shared input state, layout toggle, Carbon Design System compliance. | Updated 2026-01-31 |
+| **NumberConverter** | 🟢 Done | Converted from NumberBaseConverter. Features: 4-pane layout (Decimal, Hex, Octal, Binary), bidirectional conversion, layout toggle, active field highlighting, Carbon Design System compliance. | Completed 2026-01-31 |
 | BarcodeGenerator | 🟢 Done | Multi-standard barcode generator (QR, EAN-13, EAN-8, Code128, Code39). Features: configurable size, error correction levels for QR, client-side validation, download button. | Completed 2026-01-31 |
 | **DataGenerator** | 🟢 Done | Template-based mock data generator with Faker integration. Features: 10 built-in presets (UUID, ULID, Random String, Lorem Ipsum, User Profile, E-commerce Product, API Response, SQL Insert, Log Entries, Credit Card), batch generation (10-1000 records), multiple output formats (JSON, XML, CSV, YAML), comprehensive help documentation with 4 tabs (Quick Start, Syntax, Faker Reference, Examples). Backend: Go templates + gofakeit library with 80+ faker functions. Replaces: RandomStringGenerator, UuidGenerator, LoremIpsumGenerator | Completed 2026-01-31 |
 | **CodeFormatter** | 🟢 Done | Unified code formatting tool supporting JSON (with jq filters), XML (with XPath), HTML (with CSS selectors), SQL, CSS, and JavaScript. Features: format/minify modes, filter/query support for structured data, auto-format on input change, persistent state. Backend: Go with gojq library for jq support. Replaces: JsonFormatter, SqlFormatter | Completed 2026-01-31 |
-| CronJobParser | 🔴 Not Started | Legacy implementation | - |
-| JsonFormatter | 🔴 Not Started | Legacy implementation | - |
-| LineSortDedupe | 🔴 Not Started | Legacy implementation | - |
-| PhpJsonConverter | 🔴 Not Started | Legacy implementation | - |
-| PhpSerializer | 🔴 Not Started | Legacy implementation | - |
-| RegExpTester | 🔴 Not Started | Legacy implementation | - |
-| SqlFormatter | 🔴 Not Started | Legacy implementation | - |
-| StringCaseConverter | 🔴 Not Started | Legacy implementation | - |
-| StringInspector | 🔴 Not Started | Legacy implementation | - |
-| TextDiffChecker | 🔴 Not Started | Legacy implementation | - |
-| UnixTimeConverter | 🔴 Not Started | Legacy implementation | - |
-| UrlParser | 🔴 Not Started | Legacy implementation | - |
-| UrlTools | 🔴 Not Started | Legacy implementation | - |
+| **CronJobParser** | 🟢 Done | Refactored to follow Carbon Design System. Features: Split-pane layout, 8 common examples in clickable tiles, real-time parsing, large centered output display, layout toggle. | Completed 2026-01-31 |
+| **RegExpTester** | 🟡 In Progress | Refactored with improved UI. Features: Flag toggle tags (g, i, m, s, u, y), split-pane layout, match count in output label, error display with styling, layout toggle. | Updated 2026-01-31 |
+| **TextDiffChecker** | 🟡 In Progress | Refactored with enhanced features. Features: Diff mode switcher (Lines/Words/Chars), auto-compare on input change, Clear button, improved diff view with color coding, layout toggle. | Updated 2026-01-31 |
+| **UnixTimeConverter** | 🟡 In Progress | Refactored with new features. Features: Relative time display (e.g., "2 hours ago"), split-pane layout (ISO 8601 / Local), "Now" button with icon, layout toggle, auto-initialization with current time. | Updated 2026-01-31 |
+
+### Removed Tools (Consolidated)
+
+| Tool | Replacement | Reason |
+|------|-------------|--------|
+| JsonFormatter | CodeFormatter | Unified formatting tool |
+| SqlFormatter | CodeFormatter | Unified formatting tool |
+| UrlTools | TextConverter | URL encode/decode functionality |
+| UrlParser | TextConverter | URL parsing functionality |
+| UrlEncoder | TextConverter | URL encoding functionality |
+| PhpSerializer | - | Removed - low usage |
+| PhpJsonConverter | - | Removed - low usage |
+| LineSortDedupe | StringUtilities | Consolidated into StringUtilities |
+| StringCaseConverter | StringUtilities | Consolidated into StringUtilities |
+| StringInspector | StringUtilities | Consolidated into StringUtilities |
+| NumberBaseConverter | NumberConverter | Renamed and refactored |
+| TextBasedConverter | TextConverter | Renamed for clarity |
+
+---
+
+## Final Tool Count: 11 Tools
+
+1. **Text Converter** - Encoding, encryption, hashing, escaping
+2. **String Utilities** - Sort/Dedupe, Case conversion, Inspector
+3. **Number Converter** - Decimal, Hex, Octal, Binary conversions
+4. **Unix Time Converter** - Timestamp conversions with relative time
+5. **JWT Debugger** - JWT encode/decode/verify
+6. **RegExp Tester** - Regular expression testing
+7. **Cron Job Parser** - Cron expression parsing
+8. **Text Diff Checker** - Text comparison
+9. **Code Formatter** - JSON, XML, HTML, SQL, CSS, JS formatting
+10. **Barcode Generator** - QR codes and barcodes
+11. **Data Generator** - Mock data generation
 
 ---
 
 ## Refactoring Checklist
 
 When refactoring a tool, ensure:
 
-- [ ] Uses **Carbon Design System** components (`@carbon/react`)
-- [ ] All colors use `var(--cds-*)` tokens, no hardcoded hex values
-- [ ] Implements **useReducer** for state management (not multiple useState hooks)
-- [ ] Uses **useCallback** for memoized functions
-- [ ] Follows **DRY principle** - no duplicated components/logic
-- [ ] Has proper **ToolHeader** with title and description
-- [ ] Input/Output panes are symmetrical and use **Carbon TextArea**
-- [ ] All buttons properly spaced (gap: 1rem)
-- [ ] Copy buttons present on all output/data panes
-- [ ] Monospace font for data (`'IBM Plex Mono', monospace`)
-- [ ] Proper flex layout for responsive sizing
-- [ ] No unused imports or variables
-- [ ] Code compiles without errors or warnings
+- [x] Uses **Carbon Design System** components (`@carbon/react`)
+- [x] All colors use `var(--cds-*)` tokens, no hardcoded hex values
+- [x] Implements **useReducer** for state management (not multiple useState hooks)
+- [x] Uses **useCallback** for memoized functions
+- [x] Follows **DRY principle** - no duplicated components/logic
+- [x] Has proper **ToolHeader** with title and description
+- [x] Input/Output panes are symmetrical and use **Carbon TextArea**
+- [x] All buttons properly spaced (gap: 1rem)
+- [x] Copy buttons present on all output/data panes
+- [x] Monospace font for data (`'IBM Plex Mono', monospace`)
+- [x] Proper flex layout for responsive sizing
+- [x] No unused imports or variables
+- [x] Code compiles without errors or warnings
 
 ---
 

diff --git a/src/App.jsx b/src/App.jsx
@@ -4,23 +4,15 @@ import { Sidebar } from './components/Sidebar';
 import { Theme, IconButton, OverflowMenu, OverflowMenuItem } from '@carbon/react';
 import { Settings } from '@carbon/icons-react';
 
-// Tools Imports (Keeping all existing imports)
-import JsonFormatter from './pages/JsonFormatter';
+// Tools Imports
 import UnixTimeConverter from './pages/UnixTimeConverter';
 import JwtDebugger from './pages/JwtDebugger';
 import RegExpTester from './pages/RegExpTester';
-
-import SqlFormatter from './pages/SqlFormatter';
-import StringCaseConverter from './pages/StringCaseConverter';
 import CronJobParser from './pages/CronJobParser';
 import TextDiffChecker from './pages/TextDiffChecker';
-import NumberBaseConverter from './pages/NumberBaseConverter';
-import LineSortDedupe from './pages/LineSortDedupe';
-import StringInspector from './pages/StringInspector';
-import PhpSerializer from './pages/PhpSerializer';
-import UrlTools from './pages/UrlTools';
-import PhpJsonConverter from './pages/PhpJsonConverter';
-import AllInOneConverter from './pages/TextBasedConverter';
+import NumberConverter from './pages/NumberConverter';
+import TextConverter from './pages/TextConverter';
+import StringUtilities from './pages/StringUtilities';
 import BarcodeGenerator from './pages/BarcodeGenerator';
 import DataGenerator from './pages/DataGenerator';
 import CodeFormatter from './pages/CodeFormatter';
@@ -66,7 +58,7 @@ class ErrorBoundary extends React.Component {
 
 function App() {
     console.log('App mounting');
-    const [activeTool, setActiveTool] = useState('json');
+    const [activeTool, setActiveTool] = useState('text-converter');
     const [isSidebarOpen, setIsSidebarOpen] = useState(true);
     const [theme, setTheme] = useState('g100'); // 'white', 'g10', 'g90', 'g100'
     const [themeMode, setThemeMode] = useState('dark'); // 'system', 'light', 'dark'
@@ -106,27 +98,17 @@ function App() {
 
     const renderTool = () => {
         switch (activeTool) {
-            // New tools
+            case 'text-converter': return <TextConverter />;
+            case 'string-utilities': return <StringUtilities />;
+            case 'unix-time': return <UnixTimeConverter />;
             case 'jwt': return <JwtDebugger />;
-            case 'text-based': return <AllInOneConverter />;
             case 'barcode': return <BarcodeGenerator />;
             case 'data-generator': return <DataGenerator />;
             case 'code-formatter': return <CodeFormatter />;
-
-            case 'json': return <JsonFormatter />;
-            case 'unix-time': return <UnixTimeConverter />;
             case 'regexp': return <RegExpTester />;
-
-            case 'sql': return <SqlFormatter />;
-            case 'case': return <StringCaseConverter />;
             case 'cron': return <CronJobParser />;
             case 'diff': return <TextDiffChecker />;
-            case 'number-base': return <NumberBaseConverter />;
-            case 'sort': return <LineSortDedupe />;
-            case 'inspector': return <StringInspector />;
-            case 'php-ser': return <PhpSerializer />;
-            case 'php-json': return <PhpJsonConverter />;
-            case 'url-tools': return <UrlTools />;
+            case 'number-converter': return <NumberConverter />;
             default: return <div className="tool-container">Select a tool</div>;
         }
     };

diff --git a/src/components/Sidebar.jsx b/src/components/Sidebar.jsx
@@ -14,23 +14,17 @@ export function Sidebar({ activeTool, setActiveTool, isVisible, toggleSidebar })
     }, [pinned]);
 
     const tools = [
-        { id: 'text-based', name: 'Text Based Converter', icon: '🔄' },
+        { id: 'text-converter', name: 'Text Converter', icon: '🔄' },
+        { id: 'string-utilities', name: 'String Utilities', icon: '🧵' },
+        { id: 'number-converter', name: 'Number Converter', icon: '🔢' },
         { id: 'unix-time', name: 'Unix Time Converter', icon: '🕒' },
-        { id: 'json', name: 'JSON Format/Validate', icon: '{}' },
         { id: 'jwt', name: 'JWT Debugger', icon: '🛡️' },
-        { id: 'url-tools', name: 'URL Tools', icon: '🔗' },
         { id: 'barcode', name: 'Barcode / QR Code', icon: '▣' },
         { id: 'data-generator', name: 'Data Generator', icon: '📊' },
         { id: 'code-formatter', name: 'Code Formatter', icon: '📝' },
-        { id: 'sql', name: 'SQL Formatter', icon: '🗄️' },
-        { id: 'case', name: 'String Case', icon: 'aA' },
         { id: 'cron', name: 'Cron Job Parser', icon: '⏳' },
-        { id: 'php-ser', name: 'PHP Serializer', icon: '📦' },
-        { id: 'number-base', name: 'Number Base Converter', icon: '01' },
         { id: 'regexp', name: 'RegExp Tester', icon: '.*' },
         { id: 'diff', name: 'Text Diff Checker', icon: '⚖️' },
-        { id: 'sort', name: 'Line Sort/Dedupe', icon: '☰' },
-        { id: 'inspector', name: 'String Inspector', icon: '🔍' },
     ];
 
     const togglePin = (e, id) => {