e34c16a90c
* ui: Logout button This commit adds an easier way to logout of the UI using a logout button Notes: - Added a Logout button to the main navigation when you are logged in, meaning you have easy access to a way to log out of the UI. - Changed all wording to use 'Log in/out' vocabulary instad of 'stop using'. - The logout button opens a panel to show you your current ACL token and a logout button in order to logout. - When using legacy ACLs we don't show the current ACL token as legacy ACLs tokens only have secret values, whereas the new ACLs use a non-secret ID plus a secret ID (that we don't show). - We also added a new `<EmptyState />` component to use for all our empty states. We currently only use this for the ACLs disabled screen to provide more outgoing links to more readind material/documentation to help you to understand and enable ACLs. - The `<DataSink />` component is the sibling to our `<DataSource />` component and whilst is much simpler (as it doesn't require polling support), its tries to use the same code patterns for consistencies sake. - We had a fun problem with ember-data's `store.unloadAll` here, and in the end went with `store.init` to empty the ember-data store instead due to timing issues. - We've tried to use already existing patterns in the Consul UI here such as our preexisting `feedback` service, although these are likely to change in the future. The thinking here is to add this feature with as little change as possible. Overall this is a precursor to a much larger piece of work centered on auth in the UI. We figured this was a feature complete piece of work as it is and thought it was worthwhile to PR as a feature on its own, which also means the larger piece of work will be a smaller scoped PR also. |
||
|---|---|---|
| .. | ||
| app | ||
| blueprints | ||
| config | ||
| lib | ||
| node-tests/config | ||
| public | ||
| tests | ||
| .dev.eslintrc.js | ||
| .editorconfig | ||
| .ember-cli | ||
| .eslintignore | ||
| .eslintrc.js | ||
| .gitignore | ||
| .nvmrc | ||
| .prettierrc | ||
| .template-lintrc.js | ||
| .travis.yml | ||
| .watchmanconfig | ||
| GNUmakefile | ||
| README.md | ||
| _redirects | ||
| ember-cli-build.js | ||
| package.json | ||
| testem.js | ||
| yarn.lock | ||
README.md
consul-ui
Prerequisites
You will need the following things properly installed on your computer.
- Git
- Node.js (with npm)
- yarn
- Ember CLI
- Google Chrome
Installation
git clone https://github.com/hashicorp/consul.gitthis repositorycd ui-v2yarn install
All tooling scripts below primarily use make which in turn call node package scripts.
Running / Development
The source code comes with a small development mode that runs enough of the consul API as a set of mocks/fixtures to be able to run the UI without having to run consul.
make startoryarn startto start the ember app- Visit your app at http://localhost:4200.
To enable ACLs using the mock API, use Web Inspector to set a cookie as follows:
CONSUL_ACLS_ENABLE=1
This will enable the ACLs login page, to which you can login with any ACL token/secret.
You can also use a number of other cookie key/values to set various things whilst developing the UI, such as (but not limited to):
CONSUL_SERVICE_COUNT=1000
CONSUL_NODE_CODE=1000
// etc etc
See ./node_modules/@hashicorp/consul-api-double for more details.
If you wish to run the UI code against a running consul instance, uncomment the proxy
line in .ember-cli to point ember-cli to your consul instance.
You can also run the UI against a normal Consul installation.
make start-consul or yarn run start:consul will use the CONSUL_HTTP_ADDR
environment variable to locate the Consul installation. If that it not set
start-consul will use http://localhost:8500.
Example usage:
CONSUL_HTTP_ADDR=http://10.0.0.1:8500 make start-consul
Code Generators
Make use of the many generators for code, try ember help generate for more details
Running Tests
Please note: You do not need to run make start-api/yarn run start:api to run the tests, but the same mock consul API is used.
make testoryarn run testmake test-vieworyarn run test:viewto view the tests running in Chrome
Linting
make lint currently runs linting on the majority of js files and hbs files (using ember-template-lint).
See .eslintrc.js and .eslintignore for specific configuration.
Building
make buildbuilds the UI for production usage (env=production)make build-cibuilds the UI for CI/test usage (env=test)
Static files are built into ./dist
Running Tests in Parallel
Alternatively, ember-exam can be used to split the tests across multiple browser instances for faster results. Most options are the same as ember test. To see a full list of options, run ember exam --help.
Note: The EMBER_EXAM_PARALLEL environment variable must be set to override the default parallel value of 1 browser instance in testem.js.
To quickly run the tests across 4 parallel browser instances:
make test-parallel
To run manually:
$ EMBER_EXAM_PARALLEL=true ./node_modules/.bin/ember exam --split <num> --parallel
More ways to split tests can be found in the ember-exam README.md.