Story 5: Draw Pipe Connection

Available Now

This feature is fully implemented in the current version.

As a ranch technician I want to connect two elements with a pipe So that I can visualize the complete water flow network

User Journey

Wireframes

Step 1: Element detail with Connect button

┌─────────────────────────┐
│  ← North Well           │
├─────────────────────────┤
│  [📷]       Status: OK  │
│  Type: Well             │
├─────────────────────────┤
│  Connections            │
│  [Connect to...]        │
├─────────────────────────┤
│  No connections yet     │
└─────────────────────────┘

Step 2: Connection form

┌─────────────────────────┐
│ [Cancel]Connect[Connect]│
├─────────────────────────┤
│  Source                 │
│  ● North Well           │
├─────────────────────────┤
│  Destination            │
│  ○ Main Tank    [✓]     │
│  ○ South Pump           │
│  ○ East Trough          │
├─────────────────────────┤
│  Options                │
│                         │
│  Pipe Name (optional)   │
│  ┌─────────────────────┐│
│  │                     ││
│  └─────────────────────┘│
│                         │
│  Flow Direction         │
│  [→ Source to Dest   ▼] │
└─────────────────────────┘

Step 3: Connections shown

┌─────────────────────────┐
│  ← North Well           │
├─────────────────────────┤
│  Connections            │
│  [Connect to...]        │
│                         │
│  [Trace Upstream ↗]     │
│                         │
│  → To Main Tank         │
│      via pipe           │
│                         │
│  ← From Pump Station    │
│      Main Line          │
└─────────────────────────┘

Steps

1. Open element detail - Navigate to the source element
2. Tap Connect to... - Opens the connection sheet
3. Select destination - Choose which element to connect to
4. Set options - Optional pipe name, flow direction
5. Tap Connect - Pipe created and shown in connections

Flow Direction Options

Direction	Icon	Meaning
Source → Destination	→	Water flows from source to destination
Destination → Source	←	Water flows from destination to source
Bidirectional	↔	Water can flow either direction

Implementation Status

✅ Implemented in M3: Pipes & Connections - Elements can be connected with pipes that have configurable flow direction.

Related Features

• Element Management — View element details and connections
• Systems Organization — Organize connected elements into systems
• Map Visualization — View pipe connections on the map