Integration with the OpenPLC Runtime

[thiagoralves]

Pull request info

References

This PR resolves automated code review comments on PR #351 and adds comprehensive OpenPLC Runtime REST API integration.

Link to Devin run: https://app.devin.ai/sessions/fa2ad387381e41faaa4da853a02c452a

Requested by: Thiago Alves (@thiagoralves)

Description of the changes proposed

This PR adds comprehensive integration with the OpenPLC Runtime REST API, enabling the OpenPLC Editor to communicate directly with runtime instances for user management and PLC control. Additionally, it addresses all 13 automated code review comments with security and reliability improvements.

Major Feature Addition: Runtime API Integration

• Runtime connection management with JWT authentication and connection status tracking
• User management modals for creating runtime users and logging in
• PLC status monitoring with real-time status parsing (INIT, RUNNING, STOPPED, etc.)
• Device configuration updates to support runtime IP address configuration
• Headless VNC setup with comprehensive documentation for remote GUI access

Security and Reliability Improvements

• Configurable TLS verification via RUNTIME_TLS_REJECT_UNAUTHORIZED environment variable (defaults to secure)
• IP address validation utility supporting IPv4 addresses and hostnames
• Request timeout handling (5-minute timeout for upload operations)
• Safe error stringification replacing unsafe type assertions
• Fixed double-end errors by removing req.end() calls after https.get()
• Improved regex parsing for PLC status handling various whitespace scenarios

Key Files Changed

• New utilities: validate-ip-address.ts, runtime-https-config.ts, plc-status.ts
• New modals: Runtime user creation, runtime login, device switch confirmation
• Store enhancements: Device slice with runtime connection state management
• API integration: Main IPC and compiler modules with runtime endpoints
• Configuration updates: Device schema with runtime IP address field

Security Considerations

⚠️ Important for Review:

• TLS verification is enabled by default (secure) but can be disabled via environment variable for development
• Runtime API calls use JWT authentication with proper token management
• IP validation prevents malformed addresses from being stored
• All HTTPS requests use centralized TLS configuration

Human Review Checklist

• Runtime API security: Verify JWT token handling and TLS configuration are appropriate
• IP validation logic: Test edge cases for IPv4 addresses and hostnames
• Error handling: Confirm timeout behavior and error messages are user-friendly
• Modal user flows: Test runtime login/user creation flows, including error states
• Backward compatibility: Verify existing device configurations still work
• Environment variable documentation: Ensure RUNTIME_TLS_REJECT_UNAUTHORIZED is documented
• Runtime API endpoints: Test integration with actual OpenPLC Runtime instance
• Connection status management: Verify store state updates correctly reflect connection status
• PLC status parsing: Test with various runtime status responses
• Headless setup: Verify VNC documentation and setup script work correctly

Testing Notes

This PR includes extensive changes to runtime integration. Critical testing areas:

1. Runtime API authentication and connection management
2. TLS configuration in different environments (dev vs production)
3. IP address validation with various input formats
4. Modal workflows for user management
5. PLC status monitoring and parsing
6. Error handling for network timeouts and API failures

DOD checklist

• The code is complete and according to developers' standards
• I have performed a self-review of my code
• Meet the acceptance criteria for runtime API integration
• Unit tests are written and green
• Test coverage: __%
• Integration tests are written and green
• Changes were communicated and updated in the ticket description
• Reviewed and accepted by the Product Owner
• End-to-end test are successful

Summary by CodeRabbit

• New Features

  • Connect to OpenPLC Runtime (v3/v4) by IP with login/user-creation, JWT sessions, automatic status polling, auto-disconnect, and runtime start/stop controls.
  • Compile-and-upload workflow to runtime with source packaging, live polling, logs, timeout handling, and PLC status retrieval.

• UI

  • Device configuration adds runtime IP/connect controls and runtime-aware board switching; activity bar adds Play/Stop PLC controls and a Stop icon; new login, user-creation, and device-switch confirmation modals.

• Documentation

  • Headless setup guide and helper script for running the editor via VNC/noVNC.

[coderabbitai]

Walkthrough

Adds a headless setup guide and orchestration script, and integrates OpenPLC Runtime support end-to-end: runtime API handlers, compile→upload→poll flow, renderer bridge/UI, new modals, store/types, PLC-status parsing, Stop icon, and utility helpers.

Changes

Cohort / File(s)	Summary
Documentation (Headless) docs/HEADLESS_SETUP.md	New guide describing headless OpenPLC Editor setup with Xvfb/x11vnc/fluxbox/noVNC, usage, troubleshooting, CI notes.
Headless Orchestration Script setup-headless-vnc.sh	New bash script to check/install deps, start/stop Xvfb/fluxbox/x11vnc/noVNC, build/extract AppImage, launch editor, record PIDs/logs, and print status.
Compiler: Runtime Upload & Polling src/main/modules/compiler/compiler-module.ts	Adds runtime upload flow (v3 .st / v4+ zip), compressSourceFolder, compilation-status polling with timeout/interval, log-level parsing, optional upload/skip flows, and expanded compileProgram signature to accept mainProcessBridge and runtime creds.
IPC (Main) Runtime Handlers src/main/modules/ipc/main.ts	Adds runtime HTTPS config and runtime API handlers (get-users-info, create-user, login, get-status, start/stop-plc, get-compilation-status) plus makeRuntimeApiRequest helper; passes bridge into compiler compile flow.
IPC (Renderer) Bridge src/main/modules/ipc/renderer.ts	Adds runtime bridge methods: runtimeGetUsersInfo, runtimeCreateUser, runtimeLogin, runtimeGetStatus, runtimeStartPlc, runtimeStopPlc, runtimeGetCompilationStatus.
Renderer UI: Device / Activity Bar UI files: src/renderer/components/_features/.../board.tsx, .../communication.tsx, .../workspace-activity-bar/default.tsx, .../play.tsx	Adds runtime IP/connect UI, connect/login/create-user flows, status polling with auto-disconnect, device-switch confirmation modal flow, PLC start/stop controls in activity bar; PlayButton accepts optional children.
Modals: Runtime + Device Switch src/renderer/components/_organisms/modals/runtime-login-modal.tsx, .../runtime-create-user-modal.tsx, .../confirm-device-switch-modal.tsx, src/renderer/components/_organisms/modals/index.ts, src/renderer/screens/workspace-screen.tsx	New runtime-login and runtime-create-user modals, confirm-device-switch modal; exported and mounted in workspace.
Icons src/renderer/assets/icons/interface/Stop.tsx, src/renderer/assets/icons/index.ts	New StopIcon component and re-export in icons index.
Store: Device Runtime State & Types src/renderer/store/slices/device/slice.ts, .../data/constants.ts, .../types.ts, src/types/PLC/devices/configuration.ts	Adds runtimeConnection state (jwtToken, connectionStatus, plcStatus), setters/actions for runtime IP/token/status, default board set to "OpenPLC Runtime v3", runtimeIpAddress added to device config/schema/types.
Store: Modals src/renderer/store/slices/modal/slice.ts, .../types.ts	Adds modal entries and types for runtime-create-user, runtime-login, and confirm-device-switch.
PLC Status Types & Utils src/types/plc-status.ts, src/utils/plc-status.ts	Adds PLC_VALID_STATUSES, PlcStatus type, isValidPlcStatus guard, and parsePlcStatus to normalize runtime status strings.
Utils: Runtime HTTPS & IP Validation src/utils/runtime-https-config.ts, src/utils/validate-ip-address.ts, src/utils/index.ts	Adds getRuntimeHttpsOptions (RUNTIME_TLS_REJECT_UNAUTHORIZED), validateIpAddress helper, and re-exports them from utils index.

Sequence Diagram(s)

sequenceDiagram
  autonumber
  actor User
  participant UI as Renderer UI
  participant Bridge as IPC Bridge
  participant Main as Main Process
  participant Runtime as OpenPLC Runtime

  rect rgba(230,245,255,0.6)
  note over User,Runtime: Connect / Auth flow
  User->>UI: Click "Connect" (IP)
  UI->>Bridge: runtimeGetUsersInfo(ip)
  Bridge->>Main: invoke runtime:get-users-info
  Main->>Runtime: GET /api/get-users-info
  Runtime-->>Main: { has_users }
  Main-->>Bridge: { hasUsers }
  Bridge-->>UI: { hasUsers }
  alt no users
    UI->>User: Open Create User modal
    User->>UI: Submit credentials
    UI->>Bridge: runtimeCreateUser(ip,u,p)
  else users exist
    UI->>User: Open Login modal
    User->>UI: Submit credentials
    UI->>Bridge: runtimeLogin(ip,u,p)
  end
  Bridge->>Main: invoke runtime:login
  Main->>Runtime: POST /api/login
  Runtime-->>Main: { access_token }
  Main-->>Bridge: { accessToken }
  Bridge-->>UI: Store JWT, set connected
  end

Loading

sequenceDiagram
  autonumber
  participant UI as Renderer UI
  participant Main as Main Process
  participant Compiler as CompilerModule
  participant Runtime as OpenPLC Runtime

  rect rgba(245,255,230,0.6)
  note over UI,Runtime: Compile → Upload → Poll → Report
  UI->>Main: runCompileProgram(args + runtimeIp + jwt)
  Main->>Compiler: compileProgram(args, port, bridge)
  Compiler->>Compiler: prepare payload (st or zip)
  Compiler->>Runtime: POST /api/upload (with jwt)
  Runtime-->>Compiler: 200 / ok
  loop poll until timeout/terminal
    Compiler->>Main: makeRuntimeApiRequest(/api/compilation-status, jwt)
    Main->>Runtime: GET /api/compilation-status
    Runtime-->>Main: { status, logs, exit_code }
    Main-->>Compiler: status data
  end
  Compiler->>Main: makeRuntimeApiRequest(/api/status, jwt)
  Main->>Runtime: GET /api/status
  Runtime-->>Main: { status: "STATUS: RUNNING" }
  Main-->>Compiler: plcStatus
  Compiler-->>UI: compile result (+ plcStatus)
  end

Loading

sequenceDiagram
  autonumber
  participant UI as Activity Bar
  participant Bridge as IPC Bridge
  participant Main as Main Process
  participant Runtime as OpenPLC Runtime

  rect rgba(255,240,230,0.6)
  note over UI,Runtime: PLC start / stop control
  UI->>Bridge: runtimeStartPlc(ip, jwt) or runtimeStopPlc(ip, jwt)
  Bridge->>Main: invoke start/stop
  Main->>Runtime: POST /api/start-plc or POST /api/stop-plc
  Runtime-->>Main: 200 / error
  Main-->>Bridge: { success | error }
  Bridge-->>UI: Update UI, then runtimeGetStatus to refresh plcStatus
  end

Loading

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~75 minutes

Possibly related PRs

• Dope 107 fix compiler bug #295 — overlaps on compiler-module.ts changes (compile/upload flow and signature changes).
• DOPE-131 implement compile only option #318 — adds upload steps in compiler flow (Arduino upload) and may conflict with runtime upload additions.
• Dope 104 create core checker/Dope 105 create core installer #297 — modifies compileProgram pipeline and arguments; likely intersects with these signature/flow changes.

Suggested labels

feature, enhancement

Suggested reviewers

• vmleroy
• JoaoGSP

Poem

I hop where headless windows glow,
I zip the code and start the show.
I open VNC and bind the IP,
I press the play and watch it be.
STATUS: RUNNING — carrot in paw, I go! 🥕🐇

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title Check	✅ Passed	The title “Integration with the OpenPLC Runtime” succinctly captures the primary focus of the changeset by highlighting the new runtime API integration, and it is clear and specific enough for teammates to understand the main enhancement at a glance.
Description Check	✅ Passed	The description follows the repository’s template by providing a clear References section, a detailed “Description of the changes proposed” with bullet points, and a DoD checklist at the end; it also adds useful security considerations and testing notes without omitting any required template sections.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch runtimev4-integration

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 15

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

src/main/modules/compiler/compiler-module.ts (1)

1132-1149: Skip Arduino CLI check for OpenPLC runtime path.

arduino-cli isn’t needed when targeting openplc-compiler; this precheck can block remote flows. Gate the check by boardRuntime.

-    _mainProcessPort.postMessage({ logLevel: 'info', message: 'Checking tools availability...' })
-    try {
-      const [arduinoCliCheckResult, iec2cCheckResult] = await Promise.all([
-        this.checkArduinoCliAvailability(),
-        this.checkIec2cAvailability(),
-      ])
+    _mainProcessPort.postMessage({ logLevel: 'info', message: 'Checking tools availability...' })
+    try {
+      const checks: Array<Promise<MethodsResult<string>>> = [this.checkIec2cAvailability()]
+      if ((await this.#getBoardRuntime(boardTarget)) !== 'openplc-compiler') {
+        checks.unshift(this.checkArduinoCliAvailability())
+      }
+      const [maybeArduino, iec2cCheckResult] = await Promise.all(checks)
       _mainProcessPort.postMessage({
-        message: `Arduino CLI available at version ${arduinoCliCheckResult.data}\nIEC2C available at version ${iec2cCheckResult.data}`,
+        message:
+          (maybeArduino ? `Arduino CLI available at version ${maybeArduino.data}\n` : '') +
+          `IEC2C available at version ${iec2cCheckResult.data}`,
       })

🧹 Nitpick comments (19)

setup-headless-vnc.sh (3)

273-281: Address ShellCheck SC2155: declare and assign separately.

Split local var declaration and assignment to avoid masking return values.

-    local appimage_path=$(find "$repo_path/release/build" -name "*.AppImage" 2>/dev/null | head -1)
+    local appimage_path
+    appimage_path=$(find "$repo_path/release/build" -name "*.AppImage" 2>/dev/null | head -1)
...
-    local appimage_path=$(cat /tmp/openplc-appimage-path.txt)
+    local appimage_path
+    appimage_path=$(cat /tmp/openplc-appimage-path.txt)

Also applies to: 294-299

---

84-104: Ensure git is available before cloning noVNC/websockify.

Script uses git but doesn’t verify/install it.

     check_and_install_dependency "fluxbox" "fluxbox" || all_deps_ok=false
     check_and_install_dependency "scrot" "scrot" || all_deps_ok=false
     check_and_install_dependency "python3" "python3" || all_deps_ok=false
+    check_and_install_dependency "git" "git" || all_deps_ok=false

---

56-68: Minor: remove unused parameter from install_apt_package.

Second arg (cmd) is unused; simplify signature and callers.

docs/HEADLESS_SETUP.md (5)

18-45: Add language for fenced block (markdownlint MD040).

Use a neutral lexer like text for the ASCII diagram.

-```
+```text
 ...

---

`134-137`: **Specify language for code fence (markdownlint MD040).**

Use text for plain URLs.


```diff
-```
+```text
 http://localhost:8080/vnc.html

---

`143-146`: **Specify language for code fence (markdownlint MD040).**

Use text for host:port.


```diff
-```
+```text
 localhost:5900

---

`169-176`: **Specify language for code fence (markdownlint MD040).**

Use text for status output.


```diff
-```
+```text
 Service Status:
   • Xvfb:           Display :99 (PID: 1234)
   • fluxbox:        Window manager (PID: 1235)
   • x11vnc:         Port 5900 (PID: 1236)
   • noVNC:          Port 8080 (PID: 1237)
   • OpenPLC Editor: Running (PID: 1238)

---

`317-325`: **Doc note: clarify noVNC binding (localhost by default).**

If the script binds noVNC to localhost, note that remote access requires SSH tunneling or changing the bind host.

</blockquote></details>
<details>
<summary>src/renderer/components/_organisms/modals/runtime-create-user-modal.tsx (1)</summary><blockquote>

`17-56`: **Consider adding timeout handling for async operations.**

The async operations (`runtimeCreateUser` and `runtimeLogin`) don't have timeout handling. If the runtime is unreachable, these operations could hang indefinitely, leaving the user waiting without feedback. Consider adding a timeout mechanism or ensuring the bridge implementation handles timeouts appropriately.



Example implementation with timeout:

```typescript
const handleCreateUser = async () => {
  setError('')

  if (!username || !password) {
    setError('Username and password are required')
    return
  }

  if (password !== confirmPassword) {
    setError('Passwords do not match')
    return
  }

  setIsLoading(true)
  const ipAddress = deviceDefinitions.configuration.runtimeIpAddress || ''

  try {
    // Add timeout wrapper
    const timeout = (promise: Promise<any>, ms: number) => {
      return Promise.race([
        promise,
        new Promise((_, reject) => 
          setTimeout(() => reject(new Error('Request timed out')), ms)
        )
      ])
    }

    const result = await timeout(
      window.bridge.runtimeCreateUser(ipAddress, username, password),
      10000 // 10 second timeout
    )

    if (result.success) {
      const loginResult = await timeout(
        window.bridge.runtimeLogin(ipAddress, username, password),
        10000
      )
      // ... rest of the logic
    }
  } catch (err) {
    if (err.message === 'Request timed out') {
      setError('Connection timed out. Please check the runtime IP address and network connection.')
    } else {
      setError('Error: ' + String(err))
    }
  } finally {
    setIsLoading(false)
  }
}

src/renderer/components/_organisms/modals/index.ts (1)

1-1: Consider using named exports consistently.

Line 1 uses a wildcard export (export * from), while lines 4-5 use named exports. For consistency and clarity, consider using named exports throughout.

Apply this diff to use named exports consistently:

-export * from './confirm-device-switch-modal'
+export { ConfirmDeviceSwitchModal } from './confirm-device-switch-modal'
 export * from './delete-confirmation-modal'
 export * from './quit-application-modal'
 export { RuntimeCreateUserModal } from './runtime-create-user-modal'
 export { RuntimeLoginModal } from './runtime-login-modal'
 export * from './save-changes-modal'

src/renderer/components/_organisms/workspace-activity-bar/default.tsx (2)

46-48: Redundant variable declaration.

Lines 46-48 declare local variables boardCore, runtimeIpAddress, and runtimeJwtToken, but runtimeIpAddress (line 47) shadows the value already retrieved from the store at line 43. This is redundant and could cause confusion.

Apply this diff to remove redundancy:

 const handleRequest = () => {
   const boardCore = availableBoards.get(deviceDefinitions.configuration.deviceBoard)?.core || null
-  const runtimeIpAddress = deviceDefinitions.configuration.runtimeIpAddress || null
   const runtimeJwtToken = useOpenPLCStore.getState().runtimeConnection.jwtToken || null
   window.bridge.runCompileProgram(
     [
       projectMeta.path,
       deviceDefinitions.configuration.deviceBoard,
       boardCore,
       compileOnly,
       projectData,
-      runtimeIpAddress,
+      deviceDefinitions.configuration.runtimeIpAddress || null,
       runtimeJwtToken,
     ],

Or better yet, use the already-defined runtimeIpAddress from line 43:

 const handleRequest = () => {
   const boardCore = availableBoards.get(deviceDefinitions.configuration.deviceBoard)?.core || null
-  const runtimeIpAddress = deviceDefinitions.configuration.runtimeIpAddress || null
   const runtimeJwtToken = useOpenPLCStore.getState().runtimeConnection.jwtToken || null
   window.bridge.runCompileProgram(
     [
       projectMeta.path,
       deviceDefinitions.configuration.deviceBoard,
       boardCore,
       compileOnly,
       projectData,
       runtimeIpAddress || null,
       runtimeJwtToken,
     ],

---

139-145: Add error logging for failed status queries.

The status query after PLC control (lines 139-145) silently ignores failures. If the status query fails, the UI may show stale or incorrect PLC state without any indication to the user.

Apply this diff to log status query failures:

       const statusResult = await window.bridge.runtimeGetStatus(runtimeIpAddress, jwtToken)
       if (statusResult.success && statusResult.status) {
         const status = parsePlcStatus(statusResult.status)
         if (status) {
           useOpenPLCStore.getState().deviceActions.setPlcRuntimeStatus(status)
         }
+      } else {
+        addLog({
+          id: crypto.randomUUID(),
+          level: 'warning',
+          message: `Failed to query PLC status after control action`,
+        })
       }

src/main/modules/ipc/main.ts (1)

198-245: Consider default JSON parsing and Accept header.

For JSON APIs, set Accept: application/json and auto-parse when content-type matches; fall back to raw string otherwise.

src/renderer/store/slices/device/types.ts (1)

21-28: Unify PLC status definition with shared type to avoid drift.

Instead of hardcoding the enum here, reuse the shared PlcStatus type/constants (e.g., from src/types/plc-status.ts).

src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (2)

176-178: Avoid NodeJS.Timeout type in renderer; use portable typing.

setInterval returns number in the browser. Prefer ReturnType.

-    let statusInterval: NodeJS.Timeout | null = null
+    let statusInterval: ReturnType<typeof setInterval> | null = null

---

195-209: Reuse parsePlcStatus utility to keep parsing consistent.

Replace manual string cleanup/enum check with parsePlcStatus().

-            const statusValue = result.status.replace('STATUS:', '').replace('\n', '').trim()
-            const validStatuses = ['INIT', 'RUNNING', 'STOPPED', 'ERROR', 'EMPTY', 'UNKNOWN'] as const
-            if (validStatuses.includes(statusValue as (typeof validStatuses)[number])) {
-              setPlcRuntimeStatus(statusValue as (typeof validStatuses)[number])
-            } else {
-              setPlcRuntimeStatus('UNKNOWN')
-            }
+            const status = window?.utils?.parsePlcStatus
+              ? window.utils.parsePlcStatus(result.status)
+              : null
+            setPlcRuntimeStatus(status ?? 'UNKNOWN')

src/main/modules/compiler/compiler-module.ts (3)

1374-1375: Remove unnecessary cast in Buffer.concat.

Types already satisfy Uint8Array[].

-        const body = Buffer.concat([header, fileBuffer, footer] as unknown as ReadonlyArray<Uint8Array>)
+        const body = Buffer.concat([header, fileBuffer, footer])

---

1415-1486: Allow polling to cancel when the port closes.

Avoid polling after the user closes the panel/window.

-                  const pollCompilationStatus = async () => {
+                  const pollCompilationStatus = async () => {
+                    let portClosed = false
+                    _mainProcessPort.on('close', () => {
+                      portClosed = true
+                    })
...
-                    while (shouldContinuePolling) {
+                    while (shouldContinuePolling && !portClosed) {

---

1379-1381: Avoid duplicating the runtime port literal (8443).

Define a shared constant/config (used also in main.ts) to prevent drift.

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 51645cf and fdd8098.

⛔ Files ignored due to path filters (2)

• resources/sources/MatIEC/lib/create_standard_function_txt.sh is excluded by !resources/**
• resources/sources/boards/hals.json is excluded by !resources/**

📒 Files selected for processing (24)

• docs/HEADLESS_SETUP.md (1 hunks)
• setup-headless-vnc.sh (1 hunks)
• src/main/modules/compiler/compiler-module.ts (7 hunks)
• src/main/modules/ipc/main.ts (4 hunks)
• src/main/modules/ipc/renderer.ts (1 hunks)
• src/renderer/assets/icons/index.ts (1 hunks)
• src/renderer/assets/icons/interface/Stop.tsx (1 hunks)
• src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (6 hunks)
• src/renderer/components/_features/[workspace]/editor/device/configuration/communication.tsx (1 hunks)
• src/renderer/components/_molecules/workspace-activity-bar/default/play.tsx (1 hunks)
• src/renderer/components/_organisms/modals/confirm-device-switch-modal.tsx (1 hunks)
• src/renderer/components/_organisms/modals/index.ts (1 hunks)
• src/renderer/components/_organisms/modals/runtime-create-user-modal.tsx (1 hunks)
• src/renderer/components/_organisms/modals/runtime-login-modal.tsx (1 hunks)
• src/renderer/components/_organisms/workspace-activity-bar/default.tsx (4 hunks)
• src/renderer/screens/workspace-screen.tsx (2 hunks)
• src/renderer/store/slices/device/data/constants.ts (1 hunks)
• src/renderer/store/slices/device/slice.ts (2 hunks)
• src/renderer/store/slices/device/types.ts (5 hunks)
• src/renderer/store/slices/modal/slice.ts (1 hunks)
• src/renderer/store/slices/modal/types.ts (1 hunks)
• src/types/PLC/devices/configuration.ts (1 hunks)
• src/types/plc-status.ts (1 hunks)
• src/utils/plc-status.ts (1 hunks)

🧰 Additional context used

🧠 Learnings (1)

📚 Learning: 2025-07-04T15:13:57.599Z

Learnt from: vmleroy
PR: Autonomy-Logic/openplc-editor#274
File: src/types/PLC/devices/configuration.ts:0-0
Timestamp: 2025-07-04T15:13:57.599Z
Learning: In src/types/PLC/devices/configuration.ts, the team prefers to handle IP address validation at the local store level when passing values from frontend to backend, rather than adding additional validation at the schema level.

Applied to files:

• src/types/PLC/devices/configuration.ts

🧬 Code graph analysis (9)

src/utils/plc-status.ts (1)

src/types/plc-status.ts (2)

• PlcStatus (10-10)
• isValidPlcStatus (15-17)

src/renderer/components/_organisms/modals/runtime-create-user-modal.tsx (3)

src/renderer/components/_organisms/modals/index.ts (1)

• RuntimeCreateUserModal (4-4)

src/renderer/store/index.ts (1)

• useOpenPLCStore (67-67)

src/renderer/components/_molecules/modal/index.tsx (3)

• Modal (85-85)
• ModalContent (85-85)
• ModalTitle (85-85)

src/renderer/screens/workspace-screen.tsx (4)

src/renderer/components/_organisms/modals/confirm-device-switch-modal.tsx (1)

• ConfirmDeviceSwitchModal (67-67)

src/renderer/components/_organisms/modals/index.ts (2)

• RuntimeCreateUserModal (4-4)
• RuntimeLoginModal (5-5)

src/renderer/components/_organisms/modals/runtime-create-user-modal.tsx (1)

• RuntimeCreateUserModal (146-146)

src/renderer/components/_organisms/modals/runtime-login-modal.tsx (1)

• RuntimeLoginModal (119-119)

src/renderer/components/_organisms/modals/confirm-device-switch-modal.tsx (3)

src/renderer/store/index.ts (1)

• useOpenPLCStore (67-67)

src/renderer/components/_molecules/modal/index.tsx (2)

• Modal (85-85)
• ModalContent (85-85)

src/renderer/assets/icons/interface/Warning.tsx (1)

• WarningIcon (22-48)

src/renderer/store/slices/device/slice.ts (1)

src/renderer/store/slices/device/types.ts (1)

• DeviceSlice (167-167)

src/renderer/components/_organisms/workspace-activity-bar/default.tsx (5)

src/renderer/store/index.ts (1)

• useOpenPLCStore (67-67)

src/utils/plc-status.ts (1)

• parsePlcStatus (16-19)

src/renderer/components/_molecules/workspace-activity-bar/tooltip-button.tsx (1)

• TooltipSidebarWrapperButton (5-19)

src/renderer/components/_molecules/workspace-activity-bar/default/play.tsx (1)

• PlayButton (9-15)

src/renderer/assets/icons/interface/Stop.tsx (1)

• StopIcon (6-20)

src/renderer/components/_molecules/workspace-activity-bar/default/play.tsx (1)

src/renderer/assets/icons/interface/Play.tsx (1)

• PlayIcon (6-20)

src/renderer/components/_organisms/modals/runtime-login-modal.tsx (3)

src/renderer/components/_organisms/modals/index.ts (1)

• RuntimeLoginModal (5-5)

src/renderer/store/index.ts (1)

• useOpenPLCStore (67-67)

src/renderer/components/_molecules/modal/index.tsx (3)

• Modal (85-85)
• ModalContent (85-85)
• ModalTitle (85-85)

src/main/modules/compiler/compiler-module.ts (2)

src/main/modules/hardware/hardware-module.ts (3)

• join (68-74)
• join (77-79)
• join (81-83)

src/utils/plc-status.ts (1)

• parsePlcStatus (16-19)

🪛 markdownlint-cli2 (0.18.1)

docs/HEADLESS_SETUP.md

18-18: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

---

134-134: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

---

143-143: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

---

169-169: Fenced code blocks should have a language specified

(MD040, fenced-code-language)

🪛 Shellcheck (0.11.0)

setup-headless-vnc.sh

[warning] 273-273: Declare and assign separately to avoid masking return values.

(SC2155)

---

[warning] 294-294: Declare and assign separately to avoid masking return values.

(SC2155)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (5)

• GitHub Check: build (ubuntu-latest)
• GitHub Check: build (macos-latest)
• GitHub Check: build (windows-latest)
• GitHub Check: test (macos-latest)
• GitHub Check: test (windows-latest)

🔇 Additional comments (17)

src/renderer/store/slices/modal/slice.ts (1)

45-52: LGTM! Modal entries follow existing patterns.

The new modal entries for 'runtime-create-user' and 'runtime-login' are implemented consistently with the existing modal state structure and integrate properly with the modal actions.

src/renderer/assets/icons/interface/Stop.tsx (1)

1-20: LGTM! Icon implementation follows established patterns.

The StopIcon component correctly implements the standard icon interface, uses proper size classes, and follows the same structure as other icons in the codebase (e.g., PlayIcon).

src/renderer/assets/icons/index.ts (1)

60-60: LGTM! Export follows conventions.

The Stop icon export is properly positioned alphabetically and follows the existing re-export pattern.

src/renderer/components/_organisms/modals/runtime-create-user-modal.tsx (1)

58-65: Verify the cancel behavior for connection status.

The cancel handler sets runtimeConnectionStatus to 'disconnected' on line 60. Ensure this is the intended behavior—if the user cancels during an initial setup flow, explicitly setting the status to 'disconnected' makes sense. However, if the modal can be opened in other contexts, this might unintentionally disconnect an existing connection.

Consider whether the connection status change should be conditional:

const handleCancel = () => {
  modalActions.closeModal()
  // Only disconnect if we were in a connecting state
  if (deviceDefinitions.runtimeConnection.connectionStatus === 'connecting') {
    deviceActions.setRuntimeConnectionStatus('disconnected')
  }
  setUsername('')
  setPassword('')
  setConfirmPassword('')
  setError('')
}

src/renderer/components/_molecules/workspace-activity-bar/default/play.tsx (1)

3-12: LGTM! Good enhancement for flexibility.

Adding optional children to PlayButton makes the component more flexible while maintaining backward compatibility with existing usage. The conditional rendering pattern is clean and idiomatic.

src/renderer/store/slices/device/data/constants.ts (1)

5-5: LGTM! Version clarification aligns with PR objectives.

Renaming to 'OpenPLC Runtime v3' properly distinguishes between runtime versions as described in the PR objectives.

src/renderer/store/slices/modal/types.ts (1)

11-14: LGTM! Modal type additions are properly integrated.

The new modal types are correctly added to the enum and match the modal keys used in the modal slice, maintaining type safety across the modal system.

src/renderer/screens/workspace-screen.tsx (2)

19-19: LGTM! Modal imports are properly structured.

The new runtime and device switch modals are correctly imported from the modals module.

---

105-107: LGTM! Modal rendering follows established patterns.

The three new modals are properly rendered at the component root level, consistent with the existing AboutModal pattern. This ensures they're available throughout the workspace lifecycle.

src/renderer/components/_features/[workspace]/editor/device/configuration/communication.tsx (1)

12-12: LGTM!

The expansion of onlyCompileBoards to include runtime variants is consistent with the PR's goal of integrating OpenPLC Runtime support. The array is used correctly throughout the component to disable Modbus RTU/TCP configuration for boards that only compile.

src/types/plc-status.ts (1)

1-17: LGTM!

The PLC status typings are well-structured:

• Const assertion ensures type safety
• Type guard correctly validates status strings
• Documentation is clear and helpful

src/renderer/components/_organisms/modals/runtime-login-modal.tsx (1)

46-52: LGTM!

The cancel handler correctly resets all local state and sets the connection status to 'disconnected'. This ensures a clean state when the user closes the modal.

src/renderer/store/slices/device/slice.ts (1)

34-38: LGTM: runtime connection state and actions.

Initial shape + setters are coherent. Marking deviceUpdated on IP change is appropriate; token/status changes avoid touching it.

Also applies to: 444-472

src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (1)

143-173: Handle modal dismissal to reset connection status.

If the login/create-user modal is closed without completing auth, ensure status goes back to 'disconnected'.

src/main/modules/ipc/renderer.ts (1)

210-241: LGTM: runtime IPC surface matches main handlers.

Channel names and payloads align; shapes are consistent.

src/main/modules/compiler/compiler-module.ts (1)

110-126: Verify renderer handles “warning” log level.

parseLogLevel introduces 'warning', but downstream UI may expect only 'info'|'error'. Confirm handling or map 'warning' to 'info'.

src/main/modules/ipc/main.ts (1)

264-278: Confirm method and path for PLC start/stop endpoints

makeRuntimeApiRequest issues GET to /api/start-plc and /api/stop-plc, but OpenPLC Runtime v3/v4 exposes /start_plc and /stop_plc (underscores) and may require POST. Verify correct HTTP method and path against the runtime API.

[coderabbitai]

⚠️ Potential issue | 🟡 Minor

Unsafe type assertion in error messages.

Lines 123 and 133 use (result.error as string) to format error messages. If result.error is not a string (e.g., an error object, number, or undefined), this could display [object Object] or cause type issues.

Apply this diff to safely handle different error types:

         const result = await window.bridge.runtimeStopPlc(runtimeIpAddress, jwtToken)
         if (!result.success) {
           addLog({
             id: crypto.randomUUID(),
             level: 'error',
-            message: `Failed to stop PLC: ${(result.error as string) || 'Unknown error'}`,
+            message: `Failed to stop PLC: ${String(result.error) || 'Unknown error'}`,
           })
           return
         }
       } else {
         const result = await window.bridge.runtimeStartPlc(runtimeIpAddress, jwtToken)
         if (!result.success) {
           addLog({
             id: crypto.randomUUID(),
             level: 'error',
-            message: `Failed to start PLC: ${(result.error as string) || 'Unknown error'}`,
+            message: `Failed to start PLC: ${String(result.error) || 'Unknown error'}`,
           })
           return
         }

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	if (plcStatus === 'RUNNING') {
	const result = await window.bridge.runtimeStopPlc(runtimeIpAddress, jwtToken)
	if (!result.success) {
	addLog({
	id: crypto.randomUUID(),
	level: 'error',
	message: `Failed to stop PLC: ${(result.error as string) || 'Unknown error'}`,
	})
	return
	}
	} else {
	const result = await window.bridge.runtimeStartPlc(runtimeIpAddress, jwtToken)
	if (!result.success) {
	addLog({
	id: crypto.randomUUID(),
	level: 'error',
	message: `Failed to start PLC: ${(result.error as string) || 'Unknown error'}`,
	})
	return
	}
	if (plcStatus === 'RUNNING') {
	const result = await window.bridge.runtimeStopPlc(runtimeIpAddress, jwtToken)
	if (!result.success) {
	addLog({
	id: crypto.randomUUID(),
	level: 'error',
	message: `Failed to stop PLC: ${String(result.error) || 'Unknown error'}`,
	})
	return
	}
	} else {
	const result = await window.bridge.runtimeStartPlc(runtimeIpAddress, jwtToken)
	if (!result.success) {
	addLog({
	id: crypto.randomUUID(),
	level: 'error',
	message: `Failed to start PLC: ${String(result.error) || 'Unknown error'}`,
	})
	return
	}

🤖 Prompt for AI Agents

In src/renderer/components/_organisms/workspace-activity-bar/default.tsx around
lines 117 to 136, the code uses unsafe casts like (result.error as string) when
building log messages; replace those casts with a safe normalization: compute a
string errorText by checking if result.error is a string then use it, else if
result.error is an Error use result.error.message, else if it's defined use
JSON.stringify(result.error) (catching stringify errors) and finally default to
'Unknown error'; use errorText in the addLog message so logging never shows
[object Object] or throws on non-string errors.

[thiagoralves]

Devin, take a look at this

[coderabbitai]

@thiagoralves, I see you've mentioned Devin to review this suggestion. I'm CodeRabbit, the AI code reviewer who flagged this issue.

The concern here is that using (result.error as string) is unsafe because if result.error is an object, it will display as [object Object] in the log messages. The suggested fix using String(result.error) will safely convert any error type to a readable string representation.

If you'd like, I can:

1. Wait for Devin's review of this suggestion
2. Provide additional context or alternative approaches to error stringification
3. Help implement the fix if you decide to proceed with it

Let me know how you'd like to proceed!

[coderabbitai]

Actionable comments posted: 1

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 4cb1017 and 74b2106.

📒 Files selected for processing (1)

• src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (6 hunks)

🧰 Additional context used

🧬 Code graph analysis (1)

src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (2)

src/renderer/store/index.ts (1)

• useOpenPLCStore (67-67)

src/utils/validate-ip-address.ts (1)

• validateIpAddress (3-28)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)

• GitHub Check: test (windows-latest)
• GitHub Check: build (windows-latest)
• GitHub Check: build (ubuntu-latest)
• GitHub Check: build (macos-latest)

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (1)

179-233: Polling logic is sound and addresses previous concerns.

The runtime status polling correctly resets the failure counter in all scenarios: on successful poll (line 206), on manual disconnect (line 149), and importantly on auto-disconnect (line 191) — which addresses the past review comment. The status validation against known values is robust, and the cleanup properly clears state when not connected.

Optional: Prevent overlapping polls

Although unlikely, if a poll takes longer than 2.5 seconds, the next interval could start before the previous completes. You could track a polling-in-progress flag to skip scheduling the next poll if the previous one hasn't finished:

  useEffect(() => {
    let statusInterval: NodeJS.Timeout | null = null
+   let isPolling = false

    const pollStatus = async (): Promise<void> => {
+     if (isPolling) return
+     isPolling = true
+
      if (
        connectionStatus === 'connected' &&
        runtimeIpAddress &&
        useOpenPLCStore.getState().runtimeConnection.jwtToken
      ) {
        // ... existing poll logic ...
      }
+     isPolling = false
    }

    if (connectionStatus === 'connected') {
      void pollStatus()
      statusInterval = setInterval(() => void pollStatus(), 2500)
    } else {
      setPlcRuntimeStatus(null)
    }

    return () => {
      if (statusInterval) clearInterval(statusInterval)
+     isPolling = false
    }
  }, [connectionStatus, runtimeIpAddress, setPlcRuntimeStatus])

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 74b2106 and 64c75e8.

📒 Files selected for processing (1)

• src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (6 hunks)

🧰 Additional context used

🧬 Code graph analysis (1)

src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (3)

src/renderer/store/index.ts (1)

• useOpenPLCStore (67-67)

src/renderer/store/slices/device/types.ts (2)

• RuntimeConnection (169-169)
• DeviceActions (164-164)

src/utils/validate-ip-address.ts (1)

• validateIpAddress (3-28)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)

• GitHub Check: test (windows-latest)
• GitHub Check: build (windows-latest)
• GitHub Check: build (ubuntu-latest)
• GitHub Check: build (macos-latest)

🔇 Additional comments (4)

src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (4)

15-61: Runtime state management is well-structured.

The MAX_CONSECUTIVE_FAILURES constant (7.5 seconds of failed polls) is a reasonable timeout, the runtime-related state hooks are properly typed and extracted from the store, and the failure counter ref is correctly used for non-render state tracking. The IP address validation memo efficiently caches the validation result.

---

119-139: Runtime-aware board switching works correctly.

The modification to check connection status before switching boards is a solid UX improvement that prevents users from accidentally disconnecting an active runtime session. The confirmation modal flow and fallthrough logic are both correct.

---

147-177: Connection toggle flow handles state correctly.

The connect/disconnect logic properly manages the failure counter (resetting on line 149), validates the IP address before attempting connection, and routes to the appropriate modal based on whether users exist in the runtime. Error handling gracefully degrades to 'error' state.

---

297-396: Conditional UI rendering is correct.

The runtime-specific UI (IP input and connect button) versus the standard communication port selector is properly gated by board type. The button disable logic correctly prevents connection attempts when the IP is invalid and allows disconnection at any time. The real-time display of connection status and PLC status provides good user feedback.

[coderabbitai]

Actionable comments posted: 0

🧹 Nitpick comments (1)

src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (1)

44-46: Optional: Simplify the selector pattern.

The explicit type annotation here is verbose. Consider simplifying to match the pattern used on lines 39-42.

Apply this diff:

- const setPlcRuntimeStatus = useOpenPLCStore(
-   (state): DeviceActions['setPlcRuntimeStatus'] => state.deviceActions.setPlcRuntimeStatus,
- )
+ const setPlcRuntimeStatus = useOpenPLCStore((state) => state.deviceActions.setPlcRuntimeStatus)

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 64c75e8 and 6cf4986.

📒 Files selected for processing (2)

• src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (6 hunks)
• src/renderer/store/slices/device/slice.ts (2 hunks)

🧰 Additional context used

🧬 Code graph analysis (1)

src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (2)

src/renderer/store/index.ts (1)

• useOpenPLCStore (67-67)

src/renderer/store/slices/device/types.ts (2)

• RuntimeConnection (169-169)
• DeviceActions (164-164)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)

• GitHub Check: test (windows-latest)
• GitHub Check: build (ubuntu-latest)
• GitHub Check: build (macos-latest)
• GitHub Check: build (windows-latest)

🔇 Additional comments (5)

src/renderer/components/_features/[workspace]/editor/device/configuration/board.tsx (3)

8-16: LGTM!

The imports and constants are properly defined. The MAX_CONSECUTIVE_FAILURES calculation aligns correctly with the 2.5-second polling interval.

---

293-390: LGTM!

The conditional rendering cleanly separates the Runtime UI (for OpenPLC Runtime v3/v4) from the communication port UI (for other devices). The UI structure and status displays are well-organized.

---

175-229: Fix reactivity bug: JWT token must be in dependencies.

The effect accesses useOpenPLCStore.getState().runtimeConnection.jwtToken on lines 182 and 199, but jwtToken is not included in the dependency array on line 229. This creates a stale closure: when the JWT is cleared (e.g., during disconnect on line 146), the polling effect won't re-run and will continue using the old closure that still sees the stale token. This can cause unnecessary API calls or polling to continue when it shouldn't.

Apply this diff to extract the JWT token at the top of the component and include it in dependencies:

  const plcStatus = useOpenPLCStore((state): RuntimeConnection['plcStatus'] => state.runtimeConnection.plcStatus)
  const setPlcRuntimeStatus = useOpenPLCStore(
    (state): DeviceActions['setPlcRuntimeStatus'] => state.deviceActions.setPlcRuntimeStatus,
  )
+ const runtimeJwtToken = useOpenPLCStore((state) => state.runtimeConnection.jwtToken)

  // ... rest of component

  useEffect(() => {
    let statusInterval: NodeJS.Timeout | null = null

    const pollStatus = async (): Promise<void> => {
-     if (
-       connectionStatus === 'connected' &&
-       runtimeIpAddress &&
-       useOpenPLCStore.getState().runtimeConnection.jwtToken
-     ) {
+     if (connectionStatus === 'connected' && runtimeIpAddress && runtimeJwtToken) {
        const handlePollFailure = () => {
          consecutiveFailuresRef.current += 1
          if (consecutiveFailuresRef.current >= MAX_CONSECUTIVE_FAILURES) {
            consecutiveFailuresRef.current = 0
            setRuntimeJwtToken(null)
            setRuntimeConnectionStatus('disconnected')
            setPlcRuntimeStatus(null)
          } else {
            setPlcRuntimeStatus('UNKNOWN')
          }
        }

        try {
          const result = await window.bridge.runtimeGetStatus(
            runtimeIpAddress,
-           useOpenPLCStore.getState().runtimeConnection.jwtToken!,
+           runtimeJwtToken!,
          )
          if (result.success && result.status) {
            consecutiveFailuresRef.current = 0
            const statusValue = result.status.replace('STATUS:', '').replace('\n', '').trim()
            const validStatuses = ['INIT', 'RUNNING', 'STOPPED', 'ERROR', 'EMPTY', 'UNKNOWN'] as const
            if (validStatuses.includes(statusValue as (typeof validStatuses)[number])) {
              setPlcRuntimeStatus(statusValue as (typeof validStatuses)[number])
            } else {
              setPlcRuntimeStatus('UNKNOWN')
            }
          } else {
            handlePollFailure()
          }
        } catch (_error) {
          handlePollFailure()
        }
      }
    }

    if (connectionStatus === 'connected') {
      void pollStatus()
      statusInterval = setInterval(() => void pollStatus(), 2500)
    } else {
      setPlcRuntimeStatus(null)
    }

    return () => {
      if (statusInterval) clearInterval(statusInterval)
    }
- }, [connectionStatus, runtimeIpAddress, setPlcRuntimeStatus])
+ }, [connectionStatus, runtimeIpAddress, runtimeJwtToken, setPlcRuntimeStatus, setRuntimeJwtToken, setRuntimeConnectionStatus])

Likely an incorrect or invalid review comment.

src/renderer/store/slices/device/slice.ts (2)

34-38: LGTM!

The runtimeConnection state segment is properly initialized with sensible defaults. Keeping runtime connection state separate from device configuration is a good architectural choice.

---

444-472: LGTM!

The runtime-related actions are well-implemented with proper separation of concerns:

• setRuntimeIpAddress correctly marks the device as updated since it's persisted configuration
• setRuntimeJwtToken, setRuntimeConnectionStatus, and setPlcRuntimeStatus correctly do NOT mark the device as updated since they're transient runtime state

The type constraint on setPlcRuntimeStatus properly limits values to valid PLC states.