[ZEPPELIN-4321] Rework Zeppelin with Latest Angular#3490
[ZEPPELIN-4321] Rework Zeppelin with Latest Angular#3490hsuanxyz wants to merge 19 commits intoapache:web_angularfrom
Conversation
bd48f41 to
8c5816e
Compare
|
@hsuanxyz Could you add apache license header ? |
|
@zjffdu Finally used IDE to add the license header, because the tslint is only works for |
|
Thanks @hsuanxyz . Here's my comments:
Besides that, could you list your plan after this PR ? One important task is adding this into travis build so and add integration test ? The examples you listed in PR description is pretty helpful, especially when we could add them into integration instead of manually tested them each time. |
|
@prabhjyotsingh Could you help review this ? |
|
@hsuanxyz why is the network visualization not implemented? |
|
@conker84 We plan to continue development after this PR review is done. All tasks in the list will be completed. |
I have added the |
2857f74 to
3fb26e5
Compare
- zeppelin-helium - zeppelin-sdk - zeppelin-visualization
- area-chart - bar-chart - line-chart - pie-chart - scatter-chart - table
3538fcb to
cb673df
Compare
### What is this PR for?
The old version of zeppelin was written with AngularJS, there exist many issues related to the zeppelin-web and could not resolve due to the low version of AngularJS.
So we rework the zeppelin-web with the latest Angular (8.0).
### What type of PR is it?
Feature
### Implementation progress
#### Pages
| Name | Route | Module | UI |
| --- | ----- | ---------- | -- |
| Home | `/` | HomeModule | Y |
| Login | `/login` | LoginModule | Y |
| Job Manager | `/jobmanager` | JobManagerModule | Y |
| Interpreter Setting | `/interpreter` | InterpreterModule | Y |
| Notebook | `/notebook/{id}` | NotebookModule | Y |
| Notebook Repos | `/notebookRepos` | | |
| Credential | `/credential` | | |
| Helium | `/helium` | | WIP |
| Configuration | `/configuration` | | |
#### Notebook Features
| Feature | Description | Status |
| ------ | ---- | ---- |
| Files System | Create/ Rename/ Import etc. | Y |
| Toolbar Actions | The top toolbar actions | Y |
#### Paragraph Features
| Feature | Description | Status |
| ------ | ---- | ---- |
| Grid layout and resizable | | Y |
| Code Editor | | Y |
| Actions | The Corresponding actions of the drop-down menu in the setting button | Y |
| Actions(hot-keys) | Support hot-keys for the actions | WIP |
| Publishable | [publish paragraphs](http://zeppelin.apache.org/docs/0.8.0/usage/other_features/publishing_paragraphs.html) | |
| Stream | | |
#### Result Display
| Type | Status |
| ------ | ---- |
| Dynamic Form | Y |
| Text | Y |
| Html | Y |
| Table | Y |
| Network | |
#### Table Visualization
| Type | State |
| ------ | ---- |
| Line Chart | Y |
| Bard Chart | Y |
| Pie Chart | Y |
| Area Chart | Y |
| Scatter Chart | Y |
#### Helium Visualization
| Type | Description | Status |
| ------ | ---- | ---- |
| Prototype | To verify the implementable prototype | Y |
| Publish Dependencies | Just like [zeppelin-vis](https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/visualization) | WIP |
| Example Projects | | Y |
| Development Documents | | WIP |
### What is the Jira issue?
https://issues.apache.org/jira/browse/ZEPPELIN-4321
https://issues.apache.org/jira/browse/ZEPPELIN-4215
### How should this be tested?
#### Prerequisites
- [Node.js](https://nodejs.org) version 10.9.0 or later or use [creationix/nvm](https://github.com/creationix/nvm).
- NPM package manager (which is installed with Node.js by default).
- [Angular CLI](https://angular.io/cli) version 8.3.0 or later.
#### Install
```bash
$ cd zeppelin-frontend
$ npm install
```
Install dependencies in the project directory.
### Start Zeppelin server
[Run Zeppelin server](https://zeppelin.apache.org/contribution/contributions.html#run-zeppelin-server-in-development-mode) on `http://localhost:8080`.
If you are using a custom port instead of the default(http://localhost:8080) or other network address, you can create `.env` file in the project directory and set `SERVER_PROXY`.
*.env*
```
SERVER_PROXY=http://localhost:8080
```
### Development server
```bash
$ npm start
```
Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
### Build
Run `npm build` to build the project. The build artifacts will be stored in the `dist/` directory.
### Screenshots (if appropriate)
**Login**

**Home**


**Interpreter**

**Job Manager**

**Dynamic Form**

**Frontend API(latest Angular)**

** Visualization**

### Questions:
* Does the licenses files need update? No
* Is there breaking changes for older versions? Maybe
* Does this needs documentation? YES
Author: Hsuan Lee <[email protected]>
Author: Wendell <[email protected]>
Author: vthinkxie <[email protected]>
Closes #3490 from hsuanxyz/frontend-next and squashes the following commits:
cb673df [Hsuan Lee] chore: named TODOs
826b6d4 [Hsuan Lee] ci: add exclude item
10ea71e [Hsuan Lee] ci: fix ci config
d48b8f9 [Hsuan Lee] chore: rename the dirname to zeppelin-web-angular
ec4475c [Hsuan Lee] chore: update LICENSE and add pom.xml in zeppelin-frontend
d0dc194 [Hsuan Lee] chore: add `package-lock.json` to version control
06efeda [Hsuan Lee] docs: update frontend README
e7f10d2 [Hsuan Lee] chore: add license header in `*.(js|md)`
5649306 [Hsuan Lee] chore: add license header
8a07902 [Hsuan Lee] chore: update theme variables
10f7c78 [Hsuan Lee] chore: remove commit-lint
03ff8d5 [Hsuan Lee] fix: code editor language highlight
f53ad54 [Hsuan Lee] docs: update frontend README
95bccaf [Wendell] feat: add code editor
4ea8b50 [Hsuan Lee] feat: add visualizations
3d02d0e [vthinkxie] chore: support basic features of zeppelin
eafc519 [Hsuan Lee] feat: add base services
27c5bdf [Hsuan Lee] feat: add common projects
0c39614 [Hsuan Lee] zeppelin-frontend init commit
|
I have merged it, could you close this PR ? @hsuanxyz |
@zjffdu Thank your. |
### What is this PR for?
The old version of zeppelin was written with AngularJS, there exist many issues related to the zeppelin-web and could not resolve due to the low version of AngularJS.
So we rework the zeppelin-web with the latest Angular (8.0).
### What type of PR is it?
Feature
### Implementation progress
#### Pages
| Name | Route | Module | UI |
| --- | ----- | ---------- | -- |
| Home | `/` | HomeModule | Y |
| Login | `/login` | LoginModule | Y |
| Job Manager | `/jobmanager` | JobManagerModule | Y |
| Interpreter Setting | `/interpreter` | InterpreterModule | Y |
| Notebook | `/notebook/{id}` | NotebookModule | Y |
| Notebook Repos | `/notebookRepos` | | |
| Credential | `/credential` | | |
| Helium | `/helium` | | WIP |
| Configuration | `/configuration` | | |
#### Notebook Features
| Feature | Description | Status |
| ------ | ---- | ---- |
| Files System | Create/ Rename/ Import etc. | Y |
| Toolbar Actions | The top toolbar actions | Y |
#### Paragraph Features
| Feature | Description | Status |
| ------ | ---- | ---- |
| Grid layout and resizable | | Y |
| Code Editor | | Y |
| Actions | The Corresponding actions of the drop-down menu in the setting button | Y |
| Actions(hot-keys) | Support hot-keys for the actions | WIP |
| Publishable | [publish paragraphs](http://zeppelin.apache.org/docs/0.8.0/usage/other_features/publishing_paragraphs.html) | |
| Stream | | |
#### Result Display
| Type | Status |
| ------ | ---- |
| Dynamic Form | Y |
| Text | Y |
| Html | Y |
| Table | Y |
| Network | |
#### Table Visualization
| Type | State |
| ------ | ---- |
| Line Chart | Y |
| Bard Chart | Y |
| Pie Chart | Y |
| Area Chart | Y |
| Scatter Chart | Y |
#### Helium Visualization
| Type | Description | Status |
| ------ | ---- | ---- |
| Prototype | To verify the implementable prototype | Y |
| Publish Dependencies | Just like [zeppelin-vis](https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/visualization) | WIP |
| Example Projects | | Y |
| Development Documents | | WIP |
### What is the Jira issue?
https://issues.apache.org/jira/browse/ZEPPELIN-4321
https://issues.apache.org/jira/browse/ZEPPELIN-4215
### How should this be tested?
#### Prerequisites
- [Node.js](https://nodejs.org) version 10.9.0 or later or use [creationix/nvm](https://github.com/creationix/nvm).
- NPM package manager (which is installed with Node.js by default).
- [Angular CLI](https://angular.io/cli) version 8.3.0 or later.
#### Install
```bash
$ cd zeppelin-frontend
$ npm install
```
Install dependencies in the project directory.
### Start Zeppelin server
[Run Zeppelin server](https://zeppelin.apache.org/contribution/contributions.html#run-zeppelin-server-in-development-mode) on `http://localhost:8080`.
If you are using a custom port instead of the default(http://localhost:8080) or other network address, you can create `.env` file in the project directory and set `SERVER_PROXY`.
*.env*
```
SERVER_PROXY=http://localhost:8080
```
### Development server
```bash
$ npm start
```
Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
### Build
Run `npm build` to build the project. The build artifacts will be stored in the `dist/` directory.
### Screenshots (if appropriate)
**Login**

**Home**


**Interpreter**

**Job Manager**

**Dynamic Form**

**Frontend API(latest Angular)**

** Visualization**

### Questions:
* Does the licenses files need update? No
* Is there breaking changes for older versions? Maybe
* Does this needs documentation? YES
Author: Hsuan Lee <[email protected]>
Author: Wendell <[email protected]>
Author: vthinkxie <[email protected]>
Closes #3490 from hsuanxyz/frontend-next and squashes the following commits:
cb673df [Hsuan Lee] chore: named TODOs
826b6d4 [Hsuan Lee] ci: add exclude item
10ea71e [Hsuan Lee] ci: fix ci config
d48b8f9 [Hsuan Lee] chore: rename the dirname to zeppelin-web-angular
ec4475c [Hsuan Lee] chore: update LICENSE and add pom.xml in zeppelin-frontend
d0dc194 [Hsuan Lee] chore: add `package-lock.json` to version control
06efeda [Hsuan Lee] docs: update frontend README
e7f10d2 [Hsuan Lee] chore: add license header in `*.(js|md)`
5649306 [Hsuan Lee] chore: add license header
8a07902 [Hsuan Lee] chore: update theme variables
10f7c78 [Hsuan Lee] chore: remove commit-lint
03ff8d5 [Hsuan Lee] fix: code editor language highlight
f53ad54 [Hsuan Lee] docs: update frontend README
95bccaf [Wendell] feat: add code editor
4ea8b50 [Hsuan Lee] feat: add visualizations
3d02d0e [vthinkxie] chore: support basic features of zeppelin
eafc519 [Hsuan Lee] feat: add base services
27c5bdf [Hsuan Lee] feat: add common projects
0c39614 [Hsuan Lee] zeppelin-frontend init commit
### What is this PR for?
The old version of zeppelin was written with AngularJS, there exist many issues related to the zeppelin-web and could not resolve due to the low version of AngularJS.
So we rework the zeppelin-web with the latest Angular (8.0).
### What type of PR is it?
Feature
### Implementation progress
#### Pages
| Name | Route | Module | UI |
| --- | ----- | ---------- | -- |
| Home | `/` | HomeModule | Y |
| Login | `/login` | LoginModule | Y |
| Job Manager | `/jobmanager` | JobManagerModule | Y |
| Interpreter Setting | `/interpreter` | InterpreterModule | Y |
| Notebook | `/notebook/{id}` | NotebookModule | Y |
| Notebook Repos | `/notebookRepos` | | |
| Credential | `/credential` | | |
| Helium | `/helium` | | WIP |
| Configuration | `/configuration` | | |
#### Notebook Features
| Feature | Description | Status |
| ------ | ---- | ---- |
| Files System | Create/ Rename/ Import etc. | Y |
| Toolbar Actions | The top toolbar actions | Y |
#### Paragraph Features
| Feature | Description | Status |
| ------ | ---- | ---- |
| Grid layout and resizable | | Y |
| Code Editor | | Y |
| Actions | The Corresponding actions of the drop-down menu in the setting button | Y |
| Actions(hot-keys) | Support hot-keys for the actions | WIP |
| Publishable | [publish paragraphs](http://zeppelin.apache.org/docs/0.8.0/usage/other_features/publishing_paragraphs.html) | |
| Stream | | |
#### Result Display
| Type | Status |
| ------ | ---- |
| Dynamic Form | Y |
| Text | Y |
| Html | Y |
| Table | Y |
| Network | |
#### Table Visualization
| Type | State |
| ------ | ---- |
| Line Chart | Y |
| Bard Chart | Y |
| Pie Chart | Y |
| Area Chart | Y |
| Scatter Chart | Y |
#### Helium Visualization
| Type | Description | Status |
| ------ | ---- | ---- |
| Prototype | To verify the implementable prototype | Y |
| Publish Dependencies | Just like [zeppelin-vis](https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/visualization) | WIP |
| Example Projects | | Y |
| Development Documents | | WIP |
### What is the Jira issue?
https://issues.apache.org/jira/browse/ZEPPELIN-4321
https://issues.apache.org/jira/browse/ZEPPELIN-4215
### How should this be tested?
#### Prerequisites
- [Node.js](https://nodejs.org) version 10.9.0 or later or use [creationix/nvm](https://github.com/creationix/nvm).
- NPM package manager (which is installed with Node.js by default).
- [Angular CLI](https://angular.io/cli) version 8.3.0 or later.
#### Install
```bash
$ cd zeppelin-frontend
$ npm install
```
Install dependencies in the project directory.
### Start Zeppelin server
[Run Zeppelin server](https://zeppelin.apache.org/contribution/contributions.html#run-zeppelin-server-in-development-mode) on `http://localhost:8080`.
If you are using a custom port instead of the default(http://localhost:8080) or other network address, you can create `.env` file in the project directory and set `SERVER_PROXY`.
*.env*
```
SERVER_PROXY=http://localhost:8080
```
### Development server
```bash
$ npm start
```
Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
### Build
Run `npm build` to build the project. The build artifacts will be stored in the `dist/` directory.
### Screenshots (if appropriate)
**Login**

**Home**


**Interpreter**

**Job Manager**

**Dynamic Form**

**Frontend API(latest Angular)**

** Visualization**

### Questions:
* Does the licenses files need update? No
* Is there breaking changes for older versions? Maybe
* Does this needs documentation? YES
Author: Hsuan Lee <[email protected]>
Author: Wendell <[email protected]>
Author: vthinkxie <[email protected]>
Closes #3490 from hsuanxyz/frontend-next and squashes the following commits:
cb673df [Hsuan Lee] chore: named TODOs
826b6d4 [Hsuan Lee] ci: add exclude item
10ea71e [Hsuan Lee] ci: fix ci config
d48b8f9 [Hsuan Lee] chore: rename the dirname to zeppelin-web-angular
ec4475c [Hsuan Lee] chore: update LICENSE and add pom.xml in zeppelin-frontend
d0dc194 [Hsuan Lee] chore: add `package-lock.json` to version control
06efeda [Hsuan Lee] docs: update frontend README
e7f10d2 [Hsuan Lee] chore: add license header in `*.(js|md)`
5649306 [Hsuan Lee] chore: add license header
8a07902 [Hsuan Lee] chore: update theme variables
10f7c78 [Hsuan Lee] chore: remove commit-lint
03ff8d5 [Hsuan Lee] fix: code editor language highlight
f53ad54 [Hsuan Lee] docs: update frontend README
95bccaf [Wendell] feat: add code editor
4ea8b50 [Hsuan Lee] feat: add visualizations
3d02d0e [vthinkxie] chore: support basic features of zeppelin
eafc519 [Hsuan Lee] feat: add base services
27c5bdf [Hsuan Lee] feat: add common projects
0c39614 [Hsuan Lee] zeppelin-frontend init commit
What is this PR for?
The old version of zeppelin was written with AngularJS, there exist many issues related to the zeppelin-web and could not resolve due to the low version of AngularJS.
So we rework the zeppelin-web with the latest Angular (8.0).
What type of PR is it?
Feature
Implementation progress
Pages
//login/jobmanager/interpreter/notebook/{id}/notebookRepos/credential/helium/configurationNotebook Features
Paragraph Features
Result Display
Table Visualization
Helium Visualization
What is the Jira issue?
https://issues.apache.org/jira/browse/ZEPPELIN-4321
https://issues.apache.org/jira/browse/ZEPPELIN-4215
How should this be tested?
Prerequisites
Install
$ cd zeppelin-frontend $ npm installInstall dependencies in the project directory.
Start Zeppelin server
Run Zeppelin server on
http://localhost:8080.If you are using a custom port instead of the default(http://localhost:8080) or other network address, you can create
.envfile in the project directory and setSERVER_PROXY..env
Development server
Navigate to
http://localhost:4200/. The app will automatically reload if you change any of the source files.Build
Run
npm buildto build the project. The build artifacts will be stored in thedist/directory.Screenshots (if appropriate)
Login
Home
Interpreter
Job Manager
Dynamic Form
Frontend API(latest Angular)
** Visualization**
Questions: