mirror of
https://github.com/apache/nifi.git
synced 2025-02-06 01:58:32 +00:00
NIFI-13089: Updating PR Template and README for new UI (#8693)
* NIFI-13089: - Updating PR Template and README for new UI. * Update nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/README.md Reformatting the code structure layout. Co-authored-by: Rob Fellows <rob.fellows@gmail.com> --------- Co-authored-by: Rob Fellows <rob.fellows@gmail.com> This closes #8693
This commit is contained in:
Matt Gilman
GitHub
parent
3e0dcf7342
commit
cde820673c
4
.github/PULL_REQUEST_TEMPLATE.md
vendored
4
.github/PULL_REQUEST_TEMPLATE.md
vendored
@ -42,6 +42,10 @@ Please indicate the verification steps performed prior to pull request creation.
|
||||
- [ ] Build completed using `mvn clean install -P contrib-check`
|
||||
- [ ] JDK 21
|
||||
|
||||
### UI Contributions
|
||||
|
||||
- [ ] NiFi is modernizing its UI. Any contributions that update the [current UI](https://github.com/apache/nifi/tree/main/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui) also need to be implemented in the [new UI](https://github.com/apache/nifi/tree/main/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi).
|
||||
|
||||
### Licensing
|
||||
|
||||
- [ ] New dependencies are compatible with the [Apache License 2.0](https://apache.org/licenses/LICENSE-2.0) according to the [License Policy](https://www.apache.org/legal/resolved.html)
|
||||
|
||||
@ -1,28 +1,58 @@
|
||||
# NiFi
|
||||
|
||||
<a alt="Nx logo" href="https://nx.dev" target="_blank" rel="noreferrer"><img src="https://raw.githubusercontent.com/nrwl/nx/master/images/nx-logo.png" width="45"></a>
|
||||
|
||||
## General Info
|
||||
|
||||
### Nx
|
||||
This module is the primary UI for NiFi. It contains the canvas and all UI's for managing the NiFi instance. There are other modules within the codebase
|
||||
that support other UIs that intergate with this. These include documentation, data viewers, advanced configuration UIs, error handling, and Registry UIs.
|
||||
Overtime, these will all be modernized and possibly brought into this Nx repo to co-locate all the front end code.
|
||||
|
||||
If you are unfamiliar Nx, you can learn more at https://nx.dev/getting-started/intro. They provide many solid resources to get you up to speed.
|
||||
In its current state it is not quite ready to replace the existing UI as there are a few features that are not implemented yet. The new UI will not
|
||||
be available with the default build. However, if the build activates the `include-new-ui` profile the new UI will be built and included. On startup,
|
||||
NiFi has been updated to locate the new UI and if present deploy it to a new context path (`/nf`). If the new UI is not found, nothing is deployed to
|
||||
the new context path and the application functions as it does today.
|
||||
|
||||
_From Nx:_
|
||||
One thing to note, when using the new UI running in NiFi at `/nf`, the user can log in and use the application. When logging out however, there is
|
||||
a hardcoded redirect that happens from the back end which sends the user to the old UI (`/nifi`).
|
||||
|
||||
> We created Nx because developers struggle to configure, maintain and especially integrate various tools and frameworks.
|
||||
> Setting up a system that works well for a handful of developers and at the same time, easily scales up to an entire organization is hard.
|
||||
> This includes setting up low-level build tooling, configuring fast CI, and keeping your codebase healthy, up-to-date, and maintainable.
|
||||
Once the remaining features have been implemented, the look and feel has be polished, and it is ready for release the old UI will be removed, update
|
||||
the context path for the new UI to use `/nifi`, and remove the `include-new-ui` Maven profile. At that point, the logout redirection issue called out above won’t
|
||||
be a problem anymore.
|
||||
|
||||
## Source Structure
|
||||
|
||||
The structure of the application is laid out in the following manner.
|
||||
|
||||
app
|
||||
├── pages
|
||||
│ ├── flow-designer
|
||||
│ │ ├── feature
|
||||
│ │ ├── service
|
||||
│ │ ├── state
|
||||
│ │ └── ui
|
||||
│ ├── settings
|
||||
│ │ ├── feature
|
||||
│ │ ├── service
|
||||
│ │ ├── state
|
||||
│ │ └── ui
|
||||
├── service
|
||||
├── state
|
||||
└── ui
|
||||
|
||||
Each page has its own directory inside `pages`. Within each page, the primary content is in `feature`, any services for that page are in `service`,
|
||||
state management for the feature is in `state`, and any ui components referenced by the feature are in `ui`. The app root also contains `state`,
|
||||
`service`, and `ui` which are available for use by anything in any page. Pages, however, should not access anything from any other pages.
|
||||
|
||||
The application leverages `ngrx` state management throughout. This includes actions and selectors for all data flow. One approach that may be
|
||||
considered unique is that all dialogs and routing happen as side effects to actions dispatched by components. This leaves components less
|
||||
cluttered and can focus on its purpose and not needing to deal with activated routes, dialog references, etc.
|
||||
|
||||
## Development server
|
||||
|
||||
Run `npx nx serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
|
||||
Run `npx nx serve` for a dev server. Navigate to `http://localhost:4200/nf`. The application will automatically reload if you change any of the source files.
|
||||
|
||||
## Code scaffolding
|
||||
|
||||
Run `npx nx generate <generator> <<generator args>>`.
|
||||
|
||||
Or better yet, have a look at the [Nx documentation on integrating with IDEs](https://nx.dev/features/integrate-with-editors)
|
||||
When accessing the UI in this manner, the login form does not work. There is some server side login request handling that does not work through
|
||||
the development server. Fortunately, an authenticated user does not need to log in. So to work around this, simply log in to NiFi using the UI running in
|
||||
the application first. The authentication token will be available in a cookie that is also available in the UI hosted by the development server.
|
||||
|
||||
## Build
|
||||
|
||||
@ -30,12 +60,13 @@ Run `npx nx build` to build the project. The build artifacts will be stored in t
|
||||
|
||||
## Running unit tests
|
||||
|
||||
Run `npx nx test` to execute the unit tests via Jest
|
||||
Run `npx nx test` to execute the unit tests via Jest.
|
||||
|
||||
## Linting the codebase
|
||||
|
||||
Run `npx nx lint` to execute lint
|
||||
Run `npx nx lint` to execute lint. Additionally, run `npx nx lint:fix` to fix lint errors. Please run verify this prior to opening and PRs.
|
||||
|
||||
## Further help
|
||||
## Prettier
|
||||
|
||||
To get more help on the Nx CLI use `npx nx --help`.
|
||||
Run `npx nx prettier` to execute prettier to identify any formatting issues. Additionally, run `npx nx prettier:format` to fix any formatting issues.
|
||||
Please run verify this prior to opening and PRs.
|
||||
|
||||
@ -82,6 +82,12 @@
|
||||
},
|
||||
"outputs": ["{options.outputFile}"]
|
||||
},
|
||||
"lint:fix": {
|
||||
"executor": "nx:run-commands",
|
||||
"options": {
|
||||
"command": "npm run lint:fix"
|
||||
}
|
||||
},
|
||||
"prettier": {
|
||||
"executor": "nx:run-commands",
|
||||
"options": {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user