Add NGROK as special secret and fix things on interactive modal by deep1401 · Pull Request #1472 · transformerlab/transformerlab-app

deep1401 · 2026-03-06T16:44:10Z

No description provided.

sentry · 2026-03-06T16:48:37Z

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

paragon-review · 2026-03-06T16:51:49Z

Paragon Summary

This pull request review identified 3 issues across 2 categories in 10 files. The review analyzed code changes, potential bugs, security vulnerabilities, performance issues, and code quality concerns using automated analysis tools.

This PR adds NGROK as a special secret type and fixes issues with the interactive task modal components. The changes enhance secret management capabilities while improving the user experience for creating and editing interactive tasks.

Key changes:

NGROK added as special secret in schemas and UI
Interactive task modal fixes across multiple components
Secrets management updated in team and user sections
Jobs router modifications for interactive tasks
AGENTS.md documentation updated

Confidence score: 4/5

This PR has low-moderate risk with 1 medium-priority issue identified
Score reflects code quality concerns and maintainability issues
Consider addressing medium-priority findings to improve code quality

10 files reviewed, 3 comments

Severity breakdown: Medium: 1, Low: 2

Tip: @paragon-run <instructions> to chat with our agent or push fixes!

Dashboard

paragon-review · 2026-03-06T16:51:50Z

-          envVars['NGROK_AUTH_TOKEN'] = data.ngrok_auth_token;
-        }
+      // Use env_parameters from the gallery-defined structure (including NGROK)
+      const envVars: Record<string, string> = data.env_parameters || {};


Bug: envVars mutates React state via direct object reference

envVars mutates React state via direct object reference. Failed submissions leave injected tokens in form. Shallow-copy data.env_parameters before modifying.

View Details

Location: src/renderer/components/Experiment/Tasks/Tasks.tsx (lines 736)

Analysis

envVars mutates React state via direct object reference

What fails envVars is assigned directly from data.env_parameters (React state). Mutating envVars with NGROK_AUTH_TOKEN silently mutates the state object without setState.

Result The injected {{secret._NGROK_AUTH_TOKEN}} leaks into the form state, appearing in config fields on re-render after a failed submission.

Expected State should remain unchanged after a failed submission. The NGROK token injection should only affect the payload sent to the API.

Impact Violates React immutability contract. Can cause subtle UI bugs where injected secret placeholders appear in form fields after failed submissions.

How to reproduce

1. Open interactive task modal on a remote provider 2. Submit the form with an error that prevents completion 3. Observe the NGROK_AUTH_TOKEN now appears in the form's config fields unexpectedly

Patch Details

- const envVars: Record<string, string> = data.env_parameters || {}; + const envVars: Record<string, string> = { ...(data.env_parameters || {}) };

AI Fix Prompt

Fix this issue: envVars mutates React state via direct object reference. Failed submissions leave injected tokens in form. Shallow-copy data.env_parameters before modifying. Location: src/renderer/components/Experiment/Tasks/Tasks.tsx (lines 736) Problem: envVars is assigned directly from data.env_parameters (React state). Mutating envVars with NGROK_AUTH_TOKEN silently mutates the state object without setState. Current behavior: The injected {{secret._NGROK_AUTH_TOKEN}} leaks into the form state, appearing in config fields on re-render after a failed submission. Expected: State should remain unchanged after a failed submission. The NGROK token injection should only affect the payload sent to the API. Steps to reproduce: 1. Open interactive task modal on a remote provider 2. Submit the form with an error that prevents completion 3. Observe the NGROK_AUTH_TOKEN now appears in the form's config fields unexpectedly Provide a code fix.

_{Tip: Reply with @paragon-run to automatically fix this issue}

paragon-review · 2026-03-06T16:51:50Z

-                                : field.field_type === 'integer'
-                                  ? 'number'
-                                  : 'text'
+                      {selectedTemplate.env_parameters


Security: Dead isLocal/NGROK guards after

Dead isLocal/NGROK guards after .filter() removes NGROK_AUTH_TOKEN. These branches can never execute. Remove unreachable conditions.

View Details

Location: src/renderer/components/Experiment/Tasks/NewInteractiveTaskModal.tsx (lines 600)

Analysis

Dead isLocal/NGROK guards after .filter() removes NGROK_AUTH_TOKEN

What fails The .filter() on line ~597 removes all NGROK_AUTH_TOKEN fields, but the subsequent .map() still checks field.env_var === 'NGROK_AUTH_TOKEN' for required and disabled props — conditions that can never be true.

Result Dead code branches remain in the component that can never evaluate to true.

Expected The required prop should simply be field.required and the disabled prop should be removed since no NGROK field can reach the .map() callback.

Impact Minor maintainability concern. Dead code confuses future developers into thinking NGROK fields can appear in the rendered list.

How to reproduce

1. Read NewInteractiveTaskModal.tsx lines 597-625 2. Note .filter((field) => field.env_var !== 'NGROK_AUTH_TOKEN') precedes .map() 3. Inside .map(), observe checks for field.env_var === 'NGROK_AUTH_TOKEN' which are unreachable

AI Fix Prompt

Fix this issue: Dead isLocal/NGROK guards after .`filter`() removes NGROK_AUTH_TOKEN. These branches can never execute. Remove unreachable conditions. Location: src/renderer/components/Experiment/Tasks/NewInteractiveTaskModal.tsx (lines 600) Problem: The .filter() on line ~597 removes all NGROK_AUTH_TOKEN fields, but the subsequent .map() still checks field.env_var === 'NGROK_AUTH_TOKEN' for required and disabled props — conditions that can never be true. Current behavior: Dead code branches remain in the component that can never evaluate to true. Expected: The required prop should simply be field.required and the disabled prop should be removed since no NGROK field can reach the .map() callback. Steps to reproduce: 1. Read NewInteractiveTaskModal.tsx lines 597-625 2. Note .filter((field) => field.env_var !== 'NGROK_AUTH_TOKEN') precedes .map() 3. Inside .map(), observe checks for field.env_var === 'NGROK_AUTH_TOKEN' which are unreachable Provide a code fix.

_{Tip: Reply with @paragon-run to automatically fix this issue}

paragon-review · 2026-03-06T16:51:50Z

-                                  ? 'number'
-                                  : 'text'
+                      {selectedTemplate.env_parameters
+                        .filter((field) => field.env_var !== 'NGROK_AUTH_TOKEN')


Bug: New modal hides NGROK field entirely; Edit modal shows it disabled

New modal hides NGROK field entirely; Edit modal shows it disabled. Inconsistent UX confuses users. Align both modals to same pattern.

View Details

Location: src/renderer/components/Experiment/Tasks/NewInteractiveTaskModal.tsx (lines 601)

Analysis

New modal hides NGROK field entirely; Edit modal shows it disabled. Inconsistent UX confuses users

What fails NewInteractiveTaskModal filters out NGROK_AUTH_TOKEN entirely with .filter(), while EditInteractiveTaskModal renders it as a visible but disabled field. The two modals handle the same field inconsistently.

Result Users never see the NGROK field when creating a task but see a disabled field when editing, creating confusion about where the token is configured.

Expected Both modals should handle the NGROK field identically — either both hide it or both show it disabled with an explanation.

Impact UX inconsistency. Users may be confused about NGROK token configuration when they see it appear only in the edit flow.

How to reproduce

1. Open NewInteractiveTaskModal for a template with NGROK_AUTH_TOKEN env param — field is hidden 2. After creating the task, open EditInteractiveTaskModal for the same task — NGROK field is visible but disabled 3. Observe the inconsistency

AI Fix Prompt

Fix this issue: New modal hides NGROK field entirely; Edit modal shows it disabled. Inconsistent UX confuses users. Align both modals to same pattern. Location: src/renderer/components/Experiment/Tasks/NewInteractiveTaskModal.tsx (lines 601) Problem: NewInteractiveTaskModal filters out NGROK_AUTH_TOKEN entirely with .filter(), while EditInteractiveTaskModal renders it as a visible but disabled field. The two modals handle the same field inconsistently. Current behavior: Users never see the NGROK field when creating a task but see a disabled field when editing, creating confusion about where the token is configured. Expected: Both modals should handle the NGROK field identically — either both hide it or both show it disabled with an explanation. Steps to reproduce: 1. Open NewInteractiveTaskModal for a template with NGROK_AUTH_TOKEN env param — field is hidden 2. After creating the task, open EditInteractiveTaskModal for the same task — NGROK field is visible but disabled 3. Observe the inconsistency Provide a code fix.

_{Tip: Reply with @paragon-run to automatically fix this issue}

deep1401 added 4 commits March 6, 2026 09:09

add ngrok special secret

967b3fd

get rid of the run locally checkbox

0b7a405

fix edit modal

f2e1c21

fix tunnel parser slighlty

1cb6671

paragon-review bot reviewed Mar 6, 2026

View reviewed changes

aliasaria approved these changes Mar 6, 2026

View reviewed changes

deep1401 merged commit fafafc5 into main Mar 6, 2026
10 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Add NGROK as special secret and fix things on interactive modal#1472

Add NGROK as special secret and fix things on interactive modal#1472
deep1401 merged 4 commits intomainfrom
add/ngrok-auth-token-secret

deep1401 commented Mar 6, 2026

Uh oh!

sentry bot commented Mar 6, 2026

Uh oh!

paragon-review bot commented Mar 6, 2026

Uh oh!

paragon-review bot Mar 6, 2026

Uh oh!

paragon-review bot Mar 6, 2026

Uh oh!

paragon-review bot Mar 6, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants


What fails	envVars is assigned directly from data.env_parameters (React state). Mutating envVars with NGROK_AUTH_TOKEN silently mutates the state object without setState.
Result	The injected {{secret._NGROK_AUTH_TOKEN}} leaks into the form state, appearing in config fields on re-render after a failed submission.
Expected	State should remain unchanged after a failed submission. The NGROK token injection should only affect the payload sent to the API.
Impact	Violates React immutability contract. Can cause subtle UI bugs where injected secret placeholders appear in form fields after failed submissions.


What fails	The .`filter`() on line ~597 removes all NGROK_AUTH_TOKEN fields, but the subsequent .`map`() still checks field.env_var === 'NGROK_AUTH_TOKEN' for required and disabled props — conditions that can never be true.
Result	Dead code branches remain in the component that can never evaluate to true.
Expected	The required prop should simply be field.required and the disabled prop should be removed since no NGROK field can reach the .`map`() callback.
Impact	Minor maintainability concern. Dead code confuses future developers into thinking NGROK fields can appear in the rendered list.


What fails	NewInteractiveTaskModal filters out NGROK_AUTH_TOKEN entirely with .`filter`(), while EditInteractiveTaskModal renders it as a visible but disabled field. The two modals handle the same field inconsistently.
Result	Users never see the NGROK field when creating a task but see a disabled field when editing, creating confusion about where the token is configured.
Expected	Both modals should handle the NGROK field identically — either both hide it or both show it disabled with an explanation.
Impact	UX inconsistency. Users may be confused about NGROK token configuration when they see it appear only in the edit flow.

Uh oh!

Conversation

deep1401 commented Mar 6, 2026

Uh oh!

sentry bot commented Mar 6, 2026

Codecov Report

Uh oh!

paragon-review bot commented Mar 6, 2026

Paragon Summary

Confidence score: 4/5

Uh oh!

paragon-review bot Mar 6, 2026

Choose a reason for hiding this comment

Bug: envVars mutates React state via direct object reference

Analysis

Uh oh!

paragon-review bot Mar 6, 2026

Choose a reason for hiding this comment

Security: Dead isLocal/NGROK guards after

Analysis

Uh oh!

paragon-review bot Mar 6, 2026

Choose a reason for hiding this comment

Bug: New modal hides NGROK field entirely; Edit modal shows it disabled

Analysis

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants