* chore: 🤖 Add initial page layout for code editor + sidebar (#3180) * chore: 🤖 Add initial page layout for code editor + sidebar * test: 💍 add missing a11y ignores for exisitng color issue ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18460 * Replace `Rose::CodeEditor` with `Hds::CodeEditor` (#2679) * chore: 🤖 replace Rose::CodeEditor with Hds::CodeEditor - Remove CodeEditor 5 dependency * chore: 🤖 Replace CodeMirror5 dep remove CodeMirror5 and replace existing editors with HDS::CodeEditor * chore: 🤖 deleting old codeeditor styles * feat: 🎸 changing code editor changing code editor ✅ Closes: 0 * removed unused export * pr cleanup * updating tests for new code editor * responding to PR feedback * added whitespace * fixing linting violations * chore: 🤖 self-review PR self-review PR in the course of switching to new HDS code editor * fix: 🐛 fix linting bug * fix: 🐛 unneeded dependency remove jslint dependency as this is handled in the new code editor from HDS * fix: 🐛 Fixing import bug Fix import bug caused by importing scss modules that no longer exist * Fix and refactor code editor acceptance test * Fix and refactor code editor acceptance test * chore: 🤖 remove codemirror dependency * refactor: 💡 fix merge conflict issues * test: 💍 update e2e test selectors * test: 💍 fix target spec click event * refactor: 💡 clean up test selectors for code editor * refactor: 💡 clean up storage bucket test selectors * chore: 🤖 remove code mirror modifiers --------- Co-authored-by: calcaide <ccorvo@hashicorp.com> Co-authored-by: cameronperera <cameron.perera@hashicorp.com> * feat: 🎸 Create string formats component (#3191) * feat: 🎸 Create string formats component * Add missing copyright headers * fix: 🐛 change to readonly ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18458 * feat: 🎸 add grant schema to mirage (#3196) * feat: 🎸 add grant schema to mirage * refactor: 💡 update grant schema mirage data * refactor: 💡 fix route name in mirage * feat: 🎸 add export options flyout (#3198) * feat: 🎸 add export options flyout * fix: 🐛 update id to be ids * test: 💍 add a11y ignores * test: 💍 fix tests for grant string format ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18524 * feat: 🎸 Add autocompletion to code editor (#3207) * feat: 🎸 Add CSP nonce to code editors (#3230) Co-authored-by: Zhihe Li <zhihe.li@hashicorp.com> * feat: 🎸 Add linting to code editor (#3211) * feat: 🎸 Add linting to code editor * refactor: 💡 add missing case for wildcard type & ids field * refactor: 💡 simplify condition + add more tests * refactor: 💡 cleanup ids validation logic and add more lint erro * refactor: 💡 simplify logic and add actions linting cases * feat: 🎸 Add autocompletion to code editor (#3207) * refactor: 💡 apply PR feedback * refactor: 💡 PR feedback * refactor: 💡 add noop action * fix: 🐛 noop should not be suggested with resource type format ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18462 --------- Co-authored-by: Zhihe Li <zhihe.li@hashicorp.com> * Icu 18506 load resource IDs for autocomplete (#3247) * feat: 🎸 Add id auto completion * style: 💄 Fix code editor styling for dark mode * feat: 🎸 Add optimization for caching sqlite data ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18506 * refactor: 💡 Update string formats to use select + add options (#3256) * refactor: 💡 Update string formats to use select + add options * refactor: 💡 PR feedback * test: 💍 fix tests ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18983 * refactor: 💡 role grants tab to use code block (#3261) * refactor: 💡 grants tab to use code block * refactor: 💡 update getter comment * test: 💍 fix tests * refactor: 💡 remove language arg for codeblock ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18757 * Grant actions card (#3246) * chore: 🤖 Add initial page layout for code editor + sidebar (#3180) * chore: 🤖 Add initial page layout for code editor + sidebar * test: 💍 add missing a11y ignores for exisitng color issue ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18460 * Replace `Rose::CodeEditor` with `Hds::CodeEditor` (#2679) * chore: 🤖 replace Rose::CodeEditor with Hds::CodeEditor - Remove CodeEditor 5 dependency * chore: 🤖 Replace CodeMirror5 dep remove CodeMirror5 and replace existing editors with HDS::CodeEditor * chore: 🤖 deleting old codeeditor styles * feat: 🎸 changing code editor changing code editor ✅ Closes: 0 * removed unused export * pr cleanup * updating tests for new code editor * responding to PR feedback * added whitespace * fixing linting violations * chore: 🤖 self-review PR self-review PR in the course of switching to new HDS code editor * fix: 🐛 fix linting bug * fix: 🐛 unneeded dependency remove jslint dependency as this is handled in the new code editor from HDS * fix: 🐛 Fixing import bug Fix import bug caused by importing scss modules that no longer exist * Fix and refactor code editor acceptance test * Fix and refactor code editor acceptance test * chore: 🤖 remove codemirror dependency * refactor: 💡 fix merge conflict issues * test: 💍 update e2e test selectors * test: 💍 fix target spec click event * refactor: 💡 clean up test selectors for code editor * refactor: 💡 clean up storage bucket test selectors * chore: 🤖 remove code mirror modifiers --------- Co-authored-by: calcaide <ccorvo@hashicorp.com> Co-authored-by: cameronperera <cameron.perera@hashicorp.com> * feat: 🎸 Create string formats component (#3191) * feat: 🎸 Create string formats component * Add missing copyright headers * fix: 🐛 change to readonly ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18458 * feat: 🎸 add grant schema to mirage (#3196) * feat: 🎸 add grant schema to mirage * refactor: 💡 update grant schema mirage data * refactor: 💡 fix route name in mirage * feat: 🎸 add export options flyout (#3198) * feat: 🎸 add export options flyout * fix: 🐛 update id to be ids * test: 💍 add a11y ignores * test: 💍 fix tests for grant string format ✅ Closes: https://hashicorp.atlassian.net/browse/ICU-18524 * feat: 🎸 Add autocompletion to code editor (#3207) * feat: 🎸 create grant actions component * feat: 🎸 add description to actions * feat: 🎸 update default logic to not show all actions * feat: 🎸 show invalid id and type message * test: 💍 create const for test selectors * feat: 🎸 trigger action suggestion when cursor moves * refactor: 💡 add createGrantLineHelpers func * refactor: 💡 small refactors * feat: 🎸 Add CSP nonce to code editors (#3230) Co-authored-by: Zhihe Li <zhihe.li@hashicorp.com> * refactor: 💡 small refactor * test: 💍 add more tests * refactor: 💡 fix merge conflicts issues * refactor: 💡 updates from PR feedback * refactor: 💡 updates for completions and linting * test: 💍 fix test issue with translations * test: 💍 fix test issue that was already fixed once * refactor: 💡 address PR feedback --------- Co-authored-by: Lisbet Alvarez <107949262+lisbet-alvarez@users.noreply.github.com> Co-authored-by: Zack Moore <zack.moore@hashicorp.com> Co-authored-by: calcaide <ccorvo@hashicorp.com> Co-authored-by: Zhihe Li <zhihe.li@hashicorp.com> Co-authored-by: Bharath Gajjala <120367134+bgajjala8@users.noreply.github.com> * refactor: 💡 update pinned IDs logic for actions table * refactor: 💡 use if/else in place of complex ternary * refactor: 💡 user intl.formatList --------- Co-authored-by: Lisbet Alvarez <107949262+lisbet-alvarez@users.noreply.github.com> Co-authored-by: Zack Moore <zack.moore@hashicorp.com> Co-authored-by: calcaide <ccorvo@hashicorp.com> Co-authored-by: Zhihe Li <zhihe.li@hashicorp.com> Co-authored-by: Bharath Gajjala <120367134+bgajjala8@users.noreply.github.com>
Boundary UI Monorepo
This monorepo contains multiple projects, including UIs and addons, used by Boundary.
This top-level repository provides limited common tasks, such as installation and commit assistance. However, most tasks must be executed from within a subproject, e.g. running or testing.
- Boundary UI Monorepo
Projects
This monorepo contains multiple projects.
Core (addons/core):
Core features use by Boundary UI's, i.e i18n, helpers or components. Project Readme.
API (addons/api):
The API data access layer for Boundary and all the related mocks. Project Readme.
Auth (addons/auth):
Authentication layer for Boundary. Project Readme.
Rose (addons/rose)
Common styles and components shared by Boundary UIs. Project Readme.
Admin (ui/admin)
The Admin UI for Boundary. Project Readme.
Desktop Client (ui/desktop)
The desktop client UI for Boundary. Project Readme.
Prerequisites
You will need the following things properly installed on your computer.
- Git
- Node.js
- Supported versions:
v20andv22.
- Supported versions:
- Pnpm installed globally
- Google Chrome
- Firefox
Optional Tooling
Our team finds the following applications useful in day-to-day development workflows. These are merely recommendations. We encourage you to use the tools that best suit you and your personal style.
- VS Code: Code editor for building and debugging web applications
- Warp: Terminal application for macOS
- Homebrew: The missing package manager for macOS and Linux
- Ember Inspector: Understand and debug Ember applications
- Postman: Test and inspect APIs
Installation
git clone <repository-url>this repositorycd boundary-uipnpm install
Pnpm Commands
List of available project commands. pnpm run <command-name>
| Command | Description |
|---|---|
| build | Builds Admin UI for production. |
| test | Runs tests in CI mode. |
| lint | Runs ember-template-lint on all of the hbs, js, and sass files. |
| compliance:audit | Checks for issues using pnpm audit with moderate and above criticality. |
| compliance:licenses | Checks that all dependencies have OSS-compatible licenses. |
| doc:toc | Automatically generates a table of contents for the README file. |
Contributing
Branching
We follow GitHub Flow.
Building ToC
To autogenerate a ToC (table of contents) for this README,
run pnpm doc:toc. Please update the ToC whenever editing the structure
of README.
Building Admin UI for Production
See Admin UI README for more information on how to build the Admin UI for production. Be sure to set build-related environment variables as necessary for your target environment, as described in the Environment Variables section of README.
To quickly produce a production build of Admin UI, run from this folder:
pnpm install
pnpm build
Assets are saved to ui/admin/dist/.
Building with a Container
Optionally, you may build the UI within a container. Execute the following command:
docker-compose -f docker-compose-embedding.yml run build
Assets are saved to ui/admin/dist/.
Building Desktop UI for Production
See Desktop UI README for more information on how to build the Desktop UI. Be sure to set build-related environment variables as necessary for your target environment, as described in the Environment Variables section of README.
To quickly produce a production build of Desktop UI, run from this folder:
pnpm install
pnpm build:ui:desktop
In windows, UI is generated using docker to provide a stable UI across platforms.
pnpm install
docker-compose -f docker-compose-embedding.yml run build-desktop-production
pnpm build:ui:desktop:app
To provide a signing identify for macOS build, use BOUNDARY_DESKTOP_SIGNING_IDENTITY
environment variable to set signing certificate name (e.g Developer ID Application: * (*)) when building desktop app using pnpm build:ui:desktop:app.
Assets are saved to ui/desktop/electron-app/out/make/.
DMG packaged desktop UI is available at asset location as boundary.dmg.
EXE archived desktop UI is available at asset location under zip folder.
Connect Boundary UI to Boundary local instance
This describes how to connect local Boundary UI to your local instance of Boundary.
This assumes you already have up and running a Boundary dev instance in your local environment with a listener 127.0.0.1:9200 (default behaviour). Learn how to start a local Boundary dev instance
For Admin
This assumes you are within boundary-ui/ui/admin.
You will need to turn off mirage, tell the UI where to find Boundary and run it: $ ENABLE_MIRAGE=false API_HOST=http://localhost:9200 pnpm start.
Following terminal instructions, open in your browser: http://localhost:4200/.
Once you open the UI you will see the login screen, authenticate using generated admin login name and password.
For Desktop
This assumes you are within boundary-ui/ui/desktop.
You will need to turn off mirage and run it: $ ENABLE_MIRAGE=false pnpm start:desktop.
In login screen, authenticate using generated admin login name and password.
Enter the cluster URL of your Boundary dev instance, by default is: http://localhost:9200.
Committing
We use husky and lint-staged to ensure linting and other checks pass before a
commit is completed. Simply do a pnpm install to make sure the hooks are installed.
Use a normal git commit to go through the checks, if you need to skip these checks,
use git commit --no-verify to bypass them. However, a consistent commit message will
still be enforced even if you use --no-verify.
License Checking
The licenses of dependencies are checking against an allowlist before every
commit. This helps catch undesirable licenses sooner (e.g. GPL). If your
commit fails due to a non-allowlisted license, you may add it to the allowlist
in package.json as long as it is not a GPL variant or UNLICENSED.
The change will be verified upon PR. GPL variants and UNLICENSED dependencies
will not be accepted.
