APEX-DEV: Omniscient Development Skill

Mission: Enable any LLM to produce enterprise-grade, zero-drift, first-pass success code for the APEX ecosystem.

Philosophy: "Intelligence Designed" — Every output is deterministic, secure, portable, and production-ready.

INPUT/OUTPUT CONTRACT

Input: Task description referencing APEX ecosystem (OmniHub, TradeLine, aSpiral, OmniDash, etc.) Output: Production-ready code, architecture decisions, or fixes with verification steps Success: Code passes lint, type-check, and relevant ARMAGEDDON test battery

SYNTHETIC MEMORY ANCHOR

Before ANY action, internalize these invariants:

┌─────────────────────────────────────────────────────────────────────┐ │ APEX ECOSYSTEM TRUTH TABLE (Load into working memory) │ ├─────────────────────────────────────────────────────────────────────┤ │ Platform: APEX OmniHub ("Intelligence Designed") │ │ Domain: apexomnihub.icu │ │ Core Value: Universal Orchestration (Web2 ↔ Web3 Semantic Bridge)│ │ Stack: React 18 + Vite + TypeScript + Tailwind + shadcn UI │ │ Backend: Supabase (Auth, Storage, Edge Functions, Postgres) │ │ Orchestrator: Temporal.io (Event Sourcing + Saga Pattern) │ │ Security: Guardian/Triforce + MAN Mode + Zero-Trust + RLS │ │ Test Suite: ARMAGEDDON (265 tests, 100% pass, Level 6 Adaptive) │ │ Non-Negotiable: No vendor lock-in, no drift, no loops, no secrets │ └─────────────────────────────────────────────────────────────────────┘

DRIFT PREVENTION: Re-read this anchor every 3 tool calls or context switches.

DECISION TREE (Entry Point)

What are you doing?

Building new feature? → Section A: FEATURE DEVELOPMENT Fixing a bug? → Section B: BUG RESOLUTION PROTOCOL Optimizing performance? → Section C: PERFORMANCE ENGINEERING Security hardening? → Section D: SECURITY POSTURE Writing tests? → Section E: ARMAGEDDON TEST PROTOCOL Deploying/DevOps? → Section F: DEPLOYMENT & OPS Architecture decision? → Section G: ARCHITECTURE PATTERNS Working on specific app? → Section H: APP-SPECIFIC PATTERNS

SECTION A: FEATURE DEVELOPMENT

A1. Pre-Flight Checklist

Before writing ANY code:

□ Identify target module (OmniDash | OmniConnect | OmniLink | Guardian | Edge) □ Check existing patterns in that module (don't reinvent) □ Verify abstraction layer exists (no direct provider calls) □ Confirm test strategy (unit + integration + chaos) □ Load relevant type definitions

A2. File Placement Decision Tree

UI Component? ├─ Shared across apps → src/components/ ├─ Page-specific → src/pages/{PageName}/components/ └─ shadcn primitive → src/components/ui/

Business Logic? ├─ API calls → src/lib/api/ ├─ State management → src/contexts/ or src/stores/ ├─ Utilities → src/lib/utils/ └─ Security → src/security/

Backend? ├─ Edge Function → supabase/functions/{name}/ ├─ Workflow → orchestrator/workflows/ ├─ Activity → orchestrator/activities/ └─ Migration → supabase/migrations/

Test? ├─ Unit → tests/{module}/ ├─ E2E → tests/e2e/ ├─ Chaos → tests/chaos/ └─ Security → tests/prompt-defense/

A3. Component Template (React + TypeScript)

// src/components/{ComponentName}.tsx import { FC, memo } from 'react'; import { cn } from '@/lib/utils';

interface {ComponentName}Props { /** Required: Describe purpose / requiredProp: string; /* Optional: Describe default behavior */ optionalProp?: boolean; className?: string; }

/**

• {ComponentName} - One-line description
• @example <{ComponentName} requiredProp="value" /> / export const {ComponentName}: FC<{ComponentName}Props> = memo(({ requiredProp, optionalProp = false, className, }) => { return ( <div className={cn('base-styles', className)}> {/ Implementation */} </div> ); });

{ComponentName}.displayName = '{ComponentName}';

A4. Hook Template

// src/hooks/use{HookName}.ts import { useState, useCallback, useEffect } from 'react';

interface Use{HookName}Options { initialValue?: string; }

interface Use{HookName}Return { value: string; setValue: (v: string) => void; isLoading: boolean; error: Error | null; }

export function use{HookName}(options: Use{HookName}Options = {}): Use{HookName}Return { const [value, setValue] = useState(options.initialValue ?? ''); const [isLoading, setIsLoading] = useState(false); const [error, setError] = useState<Error | null>(null);

// Cleanup on unmount (prevent memory leaks) useEffect(() => { return () => { // Cleanup timers, subscriptions, etc. }; }, []);

return { value, setValue, isLoading, error }; }

SECTION B: BUG RESOLUTION PROTOCOL

B1. Root Cause Analysis (Mandatory Steps)

1. REPRODUCE → Get exact steps, inputs, expected vs actual
2. ISOLATE → Identify smallest code path that triggers bug
3. TRACE → Follow data flow from input to failure point
4. IDENTIFY → Name the root cause (not symptoms)
5. FIX → Patch at root, not at symptom
6. VERIFY → Regression test + add to ARMAGEDDON suite
7. DOCUMENT → Update CHANGELOG, add test case comment

B2. Common APEX Bug Patterns (Pre-empted)

Symptom Root Cause Fix Pattern

"Cannot read property of undefined" Missing null check on Supabase response data?.property ?? fallback

Infinite re-render Missing dependency in useEffect Add dep or use useCallback

Stale data after mutation React Query cache not invalidated queryClient.invalidateQueries(['key'])

Auth token expired Session refresh not triggered Check AuthContext refresh logic

Type error in Edge Function Deno vs Node type mismatch Use Supabase Edge Function types

RLS policy blocking Policy condition wrong Check auth.uid() vs user_id

Guardian heartbeat stale Loop not started Verify npm run guardian:status

B3. Debug Command Sequence

1. Check build health

npm run build 2>&1 | head -50

2. Run type check

npm run typecheck

3. Run relevant test battery

npm test -- --grep "{module}"

4. Check Guardian status

npm run guardian:status

5. Verify security posture

npm run security:audit

6. Check for console errors in dev

npm run dev 2>&1 | grep -i error

SECTION C: PERFORMANCE ENGINEERING

C1. Performance Targets (ARMAGEDDON-Verified)

Metric Target Current

API Response (p95) <100ms <10ms ✓

DB Query (p95) <500ms <20ms ✓

State Update <100ms <5ms ✓

Concurrent Users 100+ 100+ ✓

WebSocket Messages/s 1000+ 1000+ ✓

C2. Optimization Decision Tree

Slow API call? ├─ Add React Query caching → staleTime: 5 * 60 * 1000 ├─ Check N+1 queries → Use Supabase .select(', relation()') └─ Add index → supabase/migrations/

Slow render? ├─ Add memo() to component ├─ Use useMemo/useCallback for expensive computations └─ Lazy load with React.lazy + Suspense

Memory leak? ├─ Check useEffect cleanup ├─ Verify event listener removal └─ Check timer/interval cleanup

C3. React Query Pattern (Standard)

// src/lib/api/{resource}.ts import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'; import { supabase } from '@/lib/supabase';

const STALE_TIME = 5 * 60 * 1000; // 5 minutes

export function use{Resource}s() { return useQuery({ queryKey: ['{resource}s'], queryFn: async () => { const { data, error } = await supabase .from('{resource}s') .select('*') .order('created_at', { ascending: false }); if (error) throw error; return data; }, staleTime: STALE_TIME, }); }

export function useCreate{Resource}() { const queryClient = useQueryClient(); return useMutation({ mutationFn: async (payload: Create{Resource}Payload) => { const { data, error } = await supabase .from('{resource}s') .insert(payload) .select() .single(); if (error) throw error; return data; }, onSuccess: () => { queryClient.invalidateQueries({ queryKey: ['{resource}s'] }); }, }); }

SECTION D: SECURITY POSTURE

D1. Security Invariants (NEVER Violate)

❌ NEVER commit secrets (API keys, tokens, passwords) ❌ NEVER trust user input without validation ❌ NEVER bypass RLS policies ❌ NEVER execute raw SQL from user input ❌ NEVER disable CSRF protection ❌ NEVER log PII to console in production

✅ ALWAYS use parameterized queries ✅ ALWAYS validate with Zod schemas ✅ ALWAYS use RLS for row-level access ✅ ALWAYS audit log security events ✅ ALWAYS use Guardian heartbeat for critical loops

D2. MAN Mode (Manual Approval Node) Integration

Risk classification for agent actions:

Lane Behavior Tool Examples

GREEN Auto-execute search_database , read_record , get_config

YELLOW Execute + Audit Log Unknown tools, single high-risk param

RED Isolate + Human Approval delete_record , transfer_funds , send_email

BLOCKED Never Execute execute_sql_raw , shell_execute

// Use MAN Mode for high-risk actions import { riskTriage } from '@/orchestrator/policies/man_policy';

const result = riskTriage({ tool: 'delete_record', params: { id: recordId }, context: { userId, sessionId } });

if (result.lane === 'RED') { // Isolate and await human approval await createManTask(result); return { status: 'isolated', awaiting_approval: true }; }

D3. Prompt Injection Defense

// src/security/promptDefense.ts import { evaluatePrompt } from './promptDefenseConfig';

// Always sanitize LLM inputs function sanitizeUserInput(input: string): string { const result = evaluatePrompt(input); if (result.blocked) { auditLog.record({ actionType: 'PROMPT_INJECTION_BLOCKED', metadata: { pattern: result.matchedPattern } }); throw new SecurityError('Invalid input detected'); } return result.sanitized; }

D4. Zero-Trust Device Registry

// Verify device on every sensitive operation import { deviceRegistry } from '@/zero-trust/deviceRegistry';

async function sensitiveOperation(userId: string, deviceId: string) { const device = await deviceRegistry.verify(userId, deviceId); if (device.status !== 'trusted') { throw new SecurityError('Device not trusted'); } // Proceed with operation }

SECTION E: ARMAGEDDON TEST PROTOCOL

E1. Test Battery Structure

tests/ ├── chaos/ # Chaos engineering tests │ ├── battery.spec.ts # Core chaos battery (21 tests) │ ├── memory-stress.spec.ts # Memory leak detection (7 tests) │ └── integration-stress.spec.ts # Integration stress (9 tests) ├── e2e/ # End-to-end tests │ ├── enterprise-workflows.spec.ts # Business flows (20 tests) │ ├── errorHandling.spec.ts # Error scenarios (8 tests) │ └── security.spec.ts # Security tests (13 tests) ├── prompt-defense/ # Prompt injection tests │ └── real-injection.spec.ts # Real-world attacks └── {module}/ # Unit tests per module

E2. Test Template (Vitest)

// tests/{module}/{feature}.spec.ts import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';

describe('{Feature}', () => { beforeEach(() => { vi.clearAllMocks(); });

afterEach(() => { vi.restoreAllMocks(); });

it('should {expected behavior} when {condition}', async () => { // Arrange const input = { /* test data */ };

// Act
const result = await featureUnderTest(input);

// Assert
expect(result).toMatchObject({ /* expected */ });

});

it('should handle error when {error condition}', async () => { // Arrange vi.spyOn(dependency, 'method').mockRejectedValue(new Error('fail'));

// Act & Assert
await expect(featureUnderTest({})).rejects.toThrow('fail');

}); });

E3. Test Commands

Run all tests

npm test

Run specific battery

npm test -- --grep "chaos"

Run prompt defense tests

npm run test:prompt-defense

Run chaos simulation (CI-safe dry run)

npm run sim:dry

Run E2E (requires server)

npm run test:e2e

Full ARMAGEDDON suite

npm run armageddon

SECTION F: DEPLOYMENT & OPS

F1. Deployment Checklist

□ Build passes: npm run build □ Type check passes: npm run typecheck □ All tests pass: npm test □ Security audit clean: npm run security:audit □ No console.log in production code □ Environment variables documented □ Rollback plan documented

F2. Environment Variables (Required)

.env.example (NEVER commit actual values)

VITE_SUPABASE_URL=https://xxx.supabase.co VITE_SUPABASE_PUBLISHABLE_KEY=eyJ...

Optional

VITE_SENTRY_DSN=https://xxx@sentry.io/xxx

F3. Rollback Protocol

1. Identify failing deployment

vercel ls --prod

2. Rollback to previous

vercel rollback <deployment-url>

3. Verify rollback

curl -I https://apexomnihub.icu/health

4. Post-mortem within 24h

SECTION G: ARCHITECTURE PATTERNS

G1. Core Architecture Layers

┌─────────────────────────────────────────────────────────────────────┐ │ PRESENTATION LAYER (React + shadcn UI) │ │ - OmniDash (Navigation UI) │ │ - Pages (Route-level components) │ │ - Components (Reusable UI) │ └────────────────────────┬────────────────────────────────────────────┘ │ ┌────────────────────────▼────────────────────────────────────────────┐ │ APPLICATION LAYER (Hooks + Context + React Query) │ │ - AuthContext (Session management) │ │ - useQuery/useMutation (Data fetching) │ │ - Business logic hooks │ └────────────────────────┬────────────────────────────────────────────┘ │ ┌────────────────────────▼────────────────────────────────────────────┐ │ INTEGRATION LAYER (Adapters - Single Port Rule) │ │ - Supabase adapter (auth, db, storage) │ │ - OmniLink adapter (cross-app orchestration) │ │ - Web3 adapter (wallet, contracts) │ └────────────────────────┬────────────────────────────────────────────┘ │ ┌────────────────────────▼────────────────────────────────────────────┐ │ ORCHESTRATION LAYER (Temporal.io) │ │ - Event Sourcing (Canonical Data Model) │ │ - Saga Pattern (LIFO Compensation) │ │ - Semantic Caching (70% cost reduction) │ │ - MAN Mode (Human-in-the-loop for RED lane) │ └────────────────────────┬────────────────────────────────────────────┘ │ ┌────────────────────────▼────────────────────────────────────────────┐ │ SECURITY LAYER (Guardian/Triforce) │ │ - Guardian heartbeats │ │ - Zero-trust device registry │ │ - Prompt injection defense │ │ - RLS policies │ │ - Audit logging │ └─────────────────────────────────────────────────────────────────────┘

G2. Portability Principle

// ❌ BAD: Direct provider coupling import { createClient } from '@supabase/supabase-js'; const data = await supabase.from('users').select('*');

// ✅ GOOD: Abstraction layer // src/lib/database/interface.ts interface Database { query<T>(table: string, options: QueryOptions): Promise<T[]>; }

// src/lib/database/supabase.ts export const supabaseDatabase: Database = { async query(table, options) { const { data } = await supabase.from(table).select(options.select); return data; } };

// src/lib/database/index.ts import { supabaseDatabase } from './supabase'; export const database: Database = supabaseDatabase; // Swap here for migration

G3. Single Integration Port Rule

All external system calls go through ONE adapter module:

src/lib/ ├── supabase/ # Single port for Supabase │ ├── index.ts # Re-exports │ ├── auth.ts # Auth methods │ ├── database.ts # Query methods │ └── storage.ts # Storage methods ├── web3/ # Single port for Web3 │ ├── index.ts │ ├── wallet.ts │ └── contracts.ts └── omnilink/ # Single port for OmniLink orchestration ├── index.ts └── events.ts

SECTION H: APP-SPECIFIC PATTERNS

H1. OmniDash (Navigation UI)

// Revolutionary icon-based navigation // Location: src/components/OmniDashNavIconButton.tsx

// Pattern: Zero-overlap flexbox layout <nav className="flex items-center justify-between"> <OmniDashNavIconButton icon={Home} label="Dashboard" to="/" /> <OmniDashNavIconButton icon={Settings} label="Settings" to="/settings" /> </nav>

// Mobile: Bottom tabs // Desktop: Side navigation with tooltips

H2. Guardian/Triforce (Security)

// Guardian heartbeat pattern // Location: src/guardian/heartbeat.ts

import { startHeartbeat, getStatus } from '@/guardian/heartbeat';

// Start on app mount useEffect(() => { const cleanup = startHeartbeat('main-loop', 30000); // 30s interval return cleanup; }, []);

// Check status const status = getStatus('main-loop'); // { loopName: 'main-loop', lastSeen: Date, ageMs: number, status: 'healthy' | 'stale' }

H3. Temporal Workflow Pattern

orchestrator/workflows/agent_saga.py

@workflow.defn class AgentSagaWorkflow: @workflow.run async def run(self, goal: Goal) -> GoalResult: compensation_stack: List[CompensationStep] = []

    try:
        # Execute steps with compensation tracking
        for step in plan.steps:
            result = await workflow.execute_activity(
                execute_tool,
                step,
                start_to_close_timeout=timedelta(seconds=30),
            )
            compensation_stack.append(step.compensation)
        
        return GoalResult(status="completed", events=events)
        
    except Exception as e:
        # LIFO compensation (rollback)
        for comp in reversed(compensation_stack):
            await workflow.execute_activity(compensate, comp)
        raise

ANTI-DRIFT PROTOCOL

Every 3 Tool Calls, Verify:

□ Am I still solving the ORIGINAL task? □ Have I introduced any provider lock-in? □ Does this code have a test? □ Is security considered (RLS, validation, audit)? □ Would this pass ARMAGEDDON Level 6?

Loop Detection (ABORT if triggered):

IF same error appears 3x → STOP, re-read Section B (Bug Protocol) IF same code pattern rewritten 3x → STOP, extract to utility IF task scope expanded 2x → STOP, confirm with user IF file touched 5x without progress → STOP, architectural issue

FAILURE PRE-EMPTION (Common Mistakes)

Mistake Prevention

Importing from wrong path Use @/ alias, verify in tsconfig

Missing key prop in lists Always use unique stable ID, never index

Async/await in useEffect Wrap in IIFE or use separate async function

Direct state mutation Always spread: setState(prev => ({ ...prev, field: value }))

Missing error boundary Wrap route-level components

Console.log in production Use conditional: import.meta.env.DEV && console.log()

Hardcoded URLs Use env variables: import.meta.env.VITE_API_URL

Missing cleanup in useEffect Always return cleanup function for subscriptions/timers

COMMAND REFERENCE (Quick Access)

Development

npm run dev # Start dev server npm run build # Production build npm run preview # Preview production build

Quality

npm run typecheck # TypeScript check npm run lint # ESLint npm run lint:fix # Auto-fix lint issues npm test # Run all tests npm run test:watch # Watch mode

Security

npm run security:audit # Dependency audit npm run test:prompt-defense # Prompt injection tests

Operations

npm run guardian:status # Check guardian loops npm run zero-trust:baseline # Generate baseline metrics npm run dr:test # Disaster recovery test (dry-run)

Simulation

npm run sim:dry # Chaos simulation (safe) npm run armageddon # Full test suite

SUCCESS CRITERIA

Every task is complete when:

✅ Code compiles: npm run build passes ✅ Types valid: npm run typecheck passes ✅ Tests pass: npm test passes ✅ Security clean: npm run security:audit clean ✅ No drift: Original task accomplished ✅ Documented: CHANGELOG updated if applicable ✅ Portable: No new vendor lock-in introduced

Skill Version: 1.0.0 Last Updated: 2026-01-20 Maintained By: APEX Business Systems Engineering License: Proprietary - APEX Business Systems Ltd. Edmonton, AB, Canada