Add .env file upload and auto-split paste support for environment variables - #1459
Open
YasiruDEX wants to merge 2 commits into
Open
Add .env file upload and auto-split paste support for environment variables#1459YasiruDEX wants to merge 2 commits into
YasiruDEX wants to merge 2 commits into
Conversation
… variables from files
Contributor
📝 WalkthroughWalkthroughAdds reusable ChangesEnvironment variable input
Estimated code review effort: 3 (Moderate) | ~20 minutes Sequence Diagram(s)sequenceDiagram
participant Operator
participant EnvFileUploadButton
participant EnvironmentVariableForm
participant EnvironmentState
Operator->>EnvFileUploadButton: select .env file
EnvFileUploadButton->>EnvFileUploadButton: parse valid entries
EnvFileUploadButton->>EnvironmentVariableForm: onParsed(entries)
EnvironmentVariableForm->>EnvironmentState: merge entries by key
EnvironmentState-->>EnvironmentVariableForm: updated environment variables
Possibly related issues
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 4
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@console/workspaces/libs/views/src/component/EnvFileUpload/EnvFileUpload.tsx`:
- Around line 47-51: Require at least two characters before stripping matching
surrounding quotes in the quote-normalization logic: add a value.length >= 2
guard in EnvFileUpload.tsx lines 47-51, and the equivalent pastedValue.length >=
2 guard in EnvVariableEditor.tsx lines 136-140, preserving single-quote and
double-quote handling otherwise.
In
`@console/workspaces/libs/views/src/component/EnvVariableEditor/EnvVariableEditor.tsx`:
- Around line 127-145: Update handleKeyPaste to return immediately when
isSecretLocked is true, before calling preventDefault() or changing either
field; preserve the existing paste parsing and onValueChange behavior for
unlocked secrets.
In `@console/workspaces/pages/deploy/src/subComponent/PromoteAgentDrawer.tsx`:
- Around line 294-308: Update handleEnvFileParsed to exclude parsed entries
whose keys are platform-managed system keys in the target configuration before
merging them into formState.env. Reuse the existing target configuration
system-key set used by the prefill filtering, and preserve the current update
behavior for user-managed keys.
- Around line 509-523: Gate the environment upload and Add controls in
PromoteAgentDrawer.tsx on targetConfigLoaded && filledForTarget ===
formState.targetEnvironment, in addition to isPending. In
EditDeployConfigDrawer.tsx, gate the corresponding upload and Add controls on
the readiness state that becomes true after the initial configuration seed
completes.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 907ef358-ce1f-4fde-8640-cbe4a3d17951
📒 Files selected for processing (7)
console/workspaces/libs/views/src/component/EnvFileUpload/EnvFileUpload.tsxconsole/workspaces/libs/views/src/component/EnvFileUpload/index.tsconsole/workspaces/libs/views/src/component/EnvVariableEditor/EnvVariableEditor.tsxconsole/workspaces/libs/views/src/component/index.tsconsole/workspaces/pages/add-new-agent/src/components/EnvironmentVariable.tsxconsole/workspaces/pages/deploy/src/subComponent/EditDeployConfigDrawer.tsxconsole/workspaces/pages/deploy/src/subComponent/PromoteAgentDrawer.tsx
…and improve .env parsing logic
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Purpose
Configuring environment variables one field at a time is tedious, especially
when a user already has a
.envfile, or is copyingKEY=VALUEpairs from aterminal, doc, or another tool. This PR streamlines both entry paths across
every place environment variables are edited in the console.
Resolves issue #1453
Goals
KEY=VALUEline (optionally quoted, e.g.API_KEY="12345") directly into the Key field and have itauto-split into the Key and Value fields.
.env(or plain text) file to bulk-populate /merge environment variables into the existing list, instead of adding
them one at a time.
Approach
onPastehandler on the KeyTextInputin the sharedEnvVariableEditorcomponent (libs/views/src/component/EnvVariableEditor).It detects
=in the pasted text, splits on the first occurrence, trimswhitespace and strips matching surrounding quotes from the value, then
populates both the Key and Value fields. Falls back to normal paste
behavior when there's no
=or the field is disabled.EnvFileUpload(
libs/views/src/component/EnvFileUpload), exposing:parseEnvFileContent(text)— parses.envsyntax: skips blank linesand
#comments, splits each line on the first=, strips matchingsurrounding quotes from the value.
EnvFileUploadButton— a button + hidden file input read viaFileReader, following the existing upload pattern already used byFileMountEditor.edited:
pages/deploy/src/subComponent/EditDeployConfigDrawer.tsx)pages/deploy/src/subComponent/PromoteAgentDrawer.tsx)(
pages/add-new-agent/src/components/EnvironmentVariable.tsx)existing row if the key already exists, append otherwise); the
create-agent flow additionally skips overwriting keys that are locked /
pre-defined by the Agent Kind schema.
User stories
KEY=VALUEline and have both fields fill in automatically, so I don'thave to manually split and retype it.
.envfile, I want to upload it directlyinstead of re-entering each variable by hand.
Release note
You can now paste
KEY=VALUElines directly into an environment variable'sKey field to auto-fill both fields, and upload a
.envfile tobulk-populate environment variables when creating, deploying, or promoting
an agent.
Documentation
N/A — this is a self-explanatory UI affordance (standard paste/upload
interaction) on an existing form; there is no dedicated doc page for the
environment variable editor to update.
Training
N/A — no training content covers this UI flow today.
Certification
N/A — no certification exam content covers this UI flow today.
Marketing
N/A — minor UX improvement to an existing feature, not a new marketable
capability.
Automation tests
N/A
N/A
Security checks
http://wso2.com/technical-reports/wso2-secure-engineering-guidelines? yes
usernames, or other secrets? yes
Samples
N/A — no new sample apps or configs; existing
.envfiles can be useddirectly with the new upload button.
Related PRs
N/A
Migrations (if applicable)
N/A — no data model, schema, or config migration involved; this is a
console-only UI change.
Test environment
Verified locally by rebuilding and running the console via the
docker-composedev setup (make dev-rebuild) on macOS; the sharedEnvFileUploadcomponent and theEnvVariableEditorpaste handler compiledcleanly through the console's Vite watch build.
Learning
Followed the existing
FileMountEditorfile-upload pattern already in thecodebase (
libs/views/src/component/FileMountEditor/FileMountEditor.tsx)for consistency — same
FileReader-based read, same 1 MB size guard — ratherthan introducing a new upload mechanism.
Summary by CodeRabbit
.envfile upload support for environment variable editors.KEY=VALUEcontent directly into environment variable fields.