├── .editorconfig
├── .env
├── .gitignore
├── Dockerfile
├── LICENSE
├── README.md
├── angular.json
├── package-lock.json
├── package.json
├── screenshot
├── 1.png
└── 3.png
├── src
├── app
│ ├── app-routing.module.ts
│ ├── app.component.css
│ ├── app.component.html
│ ├── app.component.spec.ts
│ ├── app.component.ts
│ ├── app.module.ts
│ ├── channelsz
│ │ ├── channelsz.component.css
│ │ ├── channelsz.component.html
│ │ └── channelsz.component.ts
│ ├── models
│ │ ├── channel.ts
│ │ ├── channelz.ts
│ │ ├── natsUrls.ts
│ │ ├── serverz.ts
│ │ ├── storez.ts
│ │ ├── subscription.ts
│ │ └── websocket.ts
│ ├── serverz
│ │ ├── serverz.component.css
│ │ ├── serverz.component.html
│ │ ├── serverz.component.spec.ts
│ │ └── serverz.component.ts
│ ├── services
│ │ └── natsserver.service.ts
│ ├── storez
│ │ ├── storez.component.css
│ │ ├── storez.component.html
│ │ ├── storez.component.spec.ts
│ │ └── storez.component.ts
│ └── websocket
│ │ ├── websocket.component.css
│ │ ├── websocket.component.html
│ │ ├── websocket.component.spec.ts
│ │ └── websocket.component.ts
├── assets
│ ├── .gitkeep
│ ├── i18n
│ │ ├── en.json
│ │ └── tr.json
│ ├── nats.png
│ └── urls.json
├── favicon.ico
├── index.html
├── main.ts
└── styles.css
├── tsconfig.app.json
├── tsconfig.json
├── tsconfig.spec.json
└── updateurls.sh
/.editorconfig:
--------------------------------------------------------------------------------
1 | # Editor configuration, see https://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | charset = utf-8
6 | indent_style = space
7 | indent_size = 2
8 | insert_final_newline = true
9 | trim_trailing_whitespace = true
10 |
11 | [*.ts]
12 | quote_type = single
13 |
14 | [*.md]
15 | max_line_length = off
16 | trim_trailing_whitespace = false
17 |
--------------------------------------------------------------------------------
/.env:
--------------------------------------------------------------------------------
1 | URL_JSON=[{ "text": "test", "url": "http://localhost:8222/streaming" },{ "text": "prod", "url": "http://localhost:8223/streaming" }]
2 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See http://help.github.com/ignore-files/ for more about ignoring files.
2 |
3 | # Compiled output
4 | /dist
5 | /tmp
6 | /out-tsc
7 | /bazel-out
8 |
9 | # Node
10 | /node_modules
11 | npm-debug.log
12 | yarn-error.log
13 |
14 | # IDEs and editors
15 | .idea/
16 | .project
17 | .classpath
18 | .c9/
19 | *.launch
20 | .settings/
21 | *.sublime-workspace
22 |
23 | # Visual Studio Code
24 | .vscode/*
25 | !.vscode/settings.json
26 | !.vscode/tasks.json
27 | !.vscode/launch.json
28 | !.vscode/extensions.json
29 | .history/*
30 |
31 | # Miscellaneous
32 | /.angular/cache
33 | .sass-cache/
34 | /connect.lock
35 | /coverage
36 | /libpeerconnection.log
37 | testem.log
38 | /typings
39 |
40 | # System files
41 | .DS_Store
42 | Thumbs.db
43 |
--------------------------------------------------------------------------------
/Dockerfile:
--------------------------------------------------------------------------------
1 | FROM node:18.16.0 as builder
2 | WORKDIR /app
3 | COPY package*.json ./
4 | RUN npm install
5 | COPY . .
6 | RUN npm run build --prod
7 | FROM nginx:latest
8 | COPY --from=builder /app/dist/nats-ui /usr/share/nginx/html
9 | COPY updateurls.sh /usr/share/nginx/html/updateurls.sh
10 | RUN chmod +x /usr/share/nginx/html/updateurls.sh
11 | CMD ["bash", "-c", "/usr/share/nginx/html/updateurls.sh \"$URL_JSON\""]
12 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2024 Defacto Technology
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # nats-ui
2 |
3 | A solution for displaying NATS Streaming data streams in a user-friendly interface
4 |
5 | ## :floppy_disk: Installation
6 |
7 | To install the project, follow these steps:
8 |
9 | 1. Clone the repository: `git clone https://github.com/username/repo.git`
10 | 2. Navigate to the project directory: `cd nats-ui`
11 | 3. Install the dependencies: `npm install`
12 | 4. Add your own NATS Streaming address as shown below in the urls.
13 | ```
14 | ..src/assets/urls.json
15 | [
16 |
17 | { "text": "test","url": "http://localhost:8222/streaming"},
18 | { "text": "prod","url": "http://localhost:8223/streaming" },
19 | ...
20 | ]
21 | ```
22 |
23 | ## :pencil: Usage
24 |
25 | To use the project, follow these steps:
26 |
27 | 1. Start the application: `ng serve -o`
28 | 2. Open your web browser and navigate to `http://localhost:4200`
29 |
30 | ## :ship: Docker Usage
31 |
32 | To use Docker for running the project, follow these steps:
33 |
34 | 1. Create a `.env` file and define the required environment variables inside it:
35 |
36 | ```bash
37 | URL_JSON=[{ "text": "test", "url": "http://localhost:8222/streaming" },{ "text": "prod", "url": "http://localhost:8223/streaming" }]
38 | ```
39 |
40 | 3. Run the project with Docker command
41 |
42 | ```bash
43 | docker run --env-file .env -p 4200:80 -d defactotechnology/nats-ui:tagname
44 | ```
45 | ## :city_sunset: Screens
46 |
47 | 
48 | 
49 |
50 | ## :star: Contributing
51 |
52 | Contributions are welcome! If you have any ideas, suggestions, or bug reports, please open an issue or submit a pull request.
53 |
54 | ## :black_nib: License
55 |
56 | This project is licensed under the [MIT License](LICENSE).
57 |
--------------------------------------------------------------------------------
/angular.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3 | "version": 1,
4 | "newProjectRoot": "projects",
5 | "projects": {
6 | "nats-ui": {
7 | "projectType": "application",
8 | "schematics": {},
9 | "root": "",
10 | "sourceRoot": "src",
11 | "prefix": "app",
12 | "architect": {
13 | "build": {
14 | "builder": "@angular-devkit/build-angular:browser",
15 | "options": {
16 | "outputPath": "dist/nats-ui",
17 | "index": "src/index.html",
18 | "main": "src/main.ts",
19 | "polyfills": [
20 | "zone.js"
21 | ],
22 | "tsConfig": "tsconfig.app.json",
23 | "assets": [
24 | "src/favicon.ico",
25 | "src/assets"
26 | ],
27 | "styles": [
28 | "src/styles.css",
29 | "./node_modules/primeicons/primeicons.css",
30 | "./node_modules/primeng/resources/themes/saga-blue/theme.css",
31 | "./node_modules/primeng/resources/primeng.min.css",
32 | "./node_modules/primeflex/primeflex.css"
33 | ]
34 | },
35 | "configurations": {
36 | "production": {
37 | "budgets": [
38 | {
39 | "type": "initial",
40 | "maximumWarning": "2mb",
41 | "maximumError": "2mb"
42 | },
43 | {
44 | "type": "anyComponentStyle",
45 | "maximumWarning": "2kb",
46 | "maximumError": "4kb"
47 | }
48 | ],
49 | "outputHashing": "all"
50 | },
51 | "development": {
52 | "buildOptimizer": false,
53 | "optimization": false,
54 | "vendorChunk": true,
55 | "extractLicenses": false,
56 | "sourceMap": true,
57 | "namedChunks": true
58 | }
59 | },
60 | "defaultConfiguration": "production"
61 | },
62 | "serve": {
63 | "builder": "@angular-devkit/build-angular:dev-server",
64 | "configurations": {
65 | "production": {
66 | "buildTarget": "nats-ui:build:production"
67 | },
68 | "development": {
69 | "buildTarget": "nats-ui:build:development"
70 | }
71 | },
72 | "defaultConfiguration": "development"
73 | },
74 | "extract-i18n": {
75 | "builder": "@angular-devkit/build-angular:extract-i18n",
76 | "options": {
77 | "buildTarget": "nats-ui:build"
78 | }
79 | },
80 | "test": {
81 | "builder": "@angular-devkit/build-angular:karma",
82 | "options": {
83 | "polyfills": [
84 | "zone.js",
85 | "zone.js/testing"
86 | ],
87 | "tsConfig": "tsconfig.spec.json",
88 | "assets": [
89 | "src/favicon.ico",
90 | "src/assets"
91 | ],
92 | "styles": [
93 | "src/styles.css"
94 | ],
95 | "scripts": []
96 | }
97 | }
98 | }
99 | }
100 | },
101 | "cli": {
102 | "analytics": "88b6909a-e4d2-4ce5-88b6-cad53b799850"
103 | }
104 | }
105 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "nats-ui",
3 | "version": "0.0.0",
4 | "scripts": {
5 | "ng": "ng",
6 | "start": "ng serve",
7 | "build": "ng build",
8 | "watch": "ng build --watch --configuration development",
9 | "test": "ng test"
10 | },
11 | "private": true,
12 | "dependencies": {
13 | "@angular/animations": "^17.3.7",
14 | "@angular/common": "^17.3.7",
15 | "@angular/compiler": "^17.3.7",
16 | "@angular/core": "^17.3.7",
17 | "@angular/forms": "^17.3.7",
18 | "@angular/platform-browser": "^17.3.7",
19 | "@angular/platform-browser-dynamic": "^17.3.7",
20 | "@angular/router": "^17.3.7",
21 | "@ngx-translate/core": "^14.0.0",
22 | "@ngx-translate/http-loader": "^7.0.0",
23 | "primeflex": "^3.3.0",
24 | "primeicons": "^6.0.1",
25 | "primeng": "^17.16.0",
26 | "rxjs": "~7.8.0",
27 | "tslib": "^2.3.0",
28 | "zone.js": "~0.14.5"
29 | },
30 | "devDependencies": {
31 | "@angular-devkit/build-angular": "^17.3.6",
32 | "@angular/cli": "~17.3.6",
33 | "@angular/compiler-cli": "^17.3.7",
34 | "@types/jasmine": "~4.3.0",
35 | "jasmine-core": "~4.5.0",
36 | "karma": "~6.4.0",
37 | "karma-chrome-launcher": "~3.1.0",
38 | "karma-coverage": "~2.2.0",
39 | "karma-jasmine": "~5.1.0",
40 | "karma-jasmine-html-reporter": "~2.0.0",
41 | "typescript": "~5.4.5"
42 | }
43 | }
44 |
--------------------------------------------------------------------------------
/screenshot/1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/screenshot/1.png
--------------------------------------------------------------------------------
/screenshot/3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/screenshot/3.png
--------------------------------------------------------------------------------
/src/app/app-routing.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 | import { RouterModule, Routes } from '@angular/router';
3 | import { ChannelComponent } from './channelsz/channelsz.component';
4 |
5 | import { ServerzComponent } from './serverz/serverz.component';
6 | import { StorezComponent } from './storez/storez.component';
7 | import { WebsocketComponent } from './websocket/websocket.component';
8 |
9 | const routes: Routes = [
10 | {path:'channelz',component:ChannelComponent},
11 | {path:'',component:ChannelComponent},
12 | {path:'serverz',component:ServerzComponent},
13 | {path:'storez',component:StorezComponent},
14 | {path:'websocket',component:WebsocketComponent},
15 | ];
16 |
17 | @NgModule({
18 | imports: [RouterModule.forRoot(routes)],
19 | exports: [RouterModule]
20 | })
21 | export class AppRoutingModule { }
22 |
--------------------------------------------------------------------------------
/src/app/app.component.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/src/app/app.component.css
--------------------------------------------------------------------------------
/src/app/app.component.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
--------------------------------------------------------------------------------
/src/app/app.component.spec.ts:
--------------------------------------------------------------------------------
1 | import { TestBed } from '@angular/core/testing';
2 | import { RouterTestingModule } from '@angular/router/testing';
3 | import { AppComponent } from './app.component';
4 |
5 | describe('AppComponent', () => {
6 | beforeEach(async () => {
7 | await TestBed.configureTestingModule({
8 | imports: [
9 | RouterTestingModule
10 | ],
11 | declarations: [
12 | AppComponent
13 | ],
14 | }).compileComponents();
15 | });
16 |
17 | it('should create the app', () => {
18 | const fixture = TestBed.createComponent(AppComponent);
19 | const app = fixture.componentInstance;
20 | expect(app).toBeTruthy();
21 | });
22 |
23 | it(`should have as title 'nats-ui'`, () => {
24 | const fixture = TestBed.createComponent(AppComponent);
25 | const app = fixture.componentInstance;
26 | expect(app.title).toEqual('nats-ui');
27 | });
28 |
29 | it('should render title', () => {
30 | const fixture = TestBed.createComponent(AppComponent);
31 | fixture.detectChanges();
32 | const compiled = fixture.nativeElement as HTMLElement;
33 | expect(compiled.querySelector('.content span')?.textContent).toContain('nats-ui app is running!');
34 | });
35 | });
36 |
--------------------------------------------------------------------------------
/src/app/app.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, OnInit } from '@angular/core';
2 | import { ActivatedRoute} from '@angular/router';
3 | import { MenuItem } from 'primeng/api';
4 | import { NatsserverService } from './services/natsserver.service';
5 | @Component({
6 | selector: 'app-root',
7 | templateUrl: './app.component.html',
8 | styleUrls: ['./app.component.css']
9 | })
10 | export class AppComponent implements OnInit {
11 | env?: string;
12 | topicName?: string;
13 | constructor(private route: ActivatedRoute, private natsService: NatsserverService) {
14 | this.env = this.route.snapshot.params['env'];
15 | this.topicName = this.route.snapshot.params['tn'];
16 | }
17 | title = 'nats-ui';
18 | items: MenuItem[] = [];
19 | ngOnInit(): void {
20 |
21 | let itemData = [
22 | {
23 | label: 'Serverz',
24 | icon: 'fa-solid fa-server',
25 | routerLink: '/serverz'
26 | },
27 | {
28 | label: 'Chanelsz',
29 | icon: 'fa-brands fa-hubspot',
30 | routerLink: '/channelz'
31 | },
32 | {
33 | label: 'Storez',
34 | icon: 'fa-solid fa-database',
35 | routerLink: '/storez'
36 | },
37 | {
38 | label: 'Websocket',
39 | icon: 'fa-solid fa-circle-nodes',
40 | routerLink: '/websocket'
41 | }
42 | ]
43 | this.items=itemData;
44 | }
45 | }
46 |
--------------------------------------------------------------------------------
/src/app/app.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 | import { FormsModule } from '@angular/forms';
3 | import { BrowserModule } from '@angular/platform-browser';
4 | import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
5 |
6 | import { AppRoutingModule } from './app-routing.module';
7 | import { AppComponent } from './app.component';
8 | import { ChannelComponent } from './channelsz/channelsz.component';
9 | import { HttpClient, HttpClientModule,HttpClientJsonpModule } from '@angular/common/http';
10 |
11 | import {InputTextModule} from 'primeng/inputtext';
12 | import {ListboxModule} from 'primeng/listbox';
13 | import {DropdownModule} from 'primeng/dropdown';
14 | import {CardModule} from 'primeng/card';
15 | import {SplitButtonModule} from 'primeng/splitbutton';
16 | import {DialogModule} from 'primeng/dialog';
17 | import {PanelModule} from 'primeng/panel';
18 | import {ProgressBarModule} from 'primeng/progressbar';
19 | import {TableModule} from 'primeng/table';
20 | import {DividerModule} from 'primeng/divider';
21 | import {TooltipModule} from 'primeng/tooltip';
22 | import {MessagesModule} from 'primeng/messages';
23 | import {MessageModule} from 'primeng/message';
24 | import {MenubarModule} from 'primeng/menubar';
25 | import {BadgeModule} from 'primeng/badge';
26 | import {TagModule } from 'primeng/tag';
27 |
28 | import { ServerzComponent } from './serverz/serverz.component';
29 | import { StorezComponent } from './storez/storez.component';
30 |
31 | import { TranslateModule, TranslateLoader } from "@ngx-translate/core";
32 | import { TranslateHttpLoader } from "@ngx-translate/http-loader";
33 | import { WebsocketComponent } from './websocket/websocket.component';
34 |
35 | export function HttpLoaderFactory(httpClient: HttpClient) {
36 | return new TranslateHttpLoader(httpClient);
37 | }
38 |
39 | @NgModule({
40 | declarations: [
41 | AppComponent,
42 | ChannelComponent,
43 | ServerzComponent,
44 | StorezComponent,
45 | WebsocketComponent
46 | ],
47 | imports: [
48 | BrowserModule,
49 | BrowserAnimationsModule,
50 | AppRoutingModule,
51 | FormsModule,
52 | HttpClientModule,
53 | HttpClientJsonpModule,
54 | TranslateModule.forRoot({
55 | loader: {
56 | provide: TranslateLoader,
57 | useFactory: HttpLoaderFactory,
58 | deps: [HttpClient]
59 | },
60 | defaultLanguage: "en"
61 | }),
62 |
63 | InputTextModule,
64 | ListboxModule,
65 | DropdownModule,
66 | CardModule,
67 | SplitButtonModule,
68 | DialogModule,
69 | PanelModule,
70 | ProgressBarModule,
71 | TableModule,
72 | DividerModule,
73 | TooltipModule,
74 | MessagesModule,
75 | MessageModule,
76 | MenubarModule,
77 | BadgeModule,
78 | TagModule
79 |
80 | ],
81 | providers: [],
82 | bootstrap: [AppComponent]
83 | })
84 | export class AppModule { }
85 |
--------------------------------------------------------------------------------
/src/app/channelsz/channelsz.component.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/src/app/channelsz/channelsz.component.css
--------------------------------------------------------------------------------
/src/app/channelsz/channelsz.component.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
8 |
9 |
10 |
11 | Channelz Info
12 |
13 |
14 |
15 |
Cluster Id
16 |
: {{channelz.cluster_id}}
17 |
Server Id
18 |
: {{channelz.server_id}}
19 |
Now
20 |
: {{ channelz.now | date:'dd.MM.yyyy HH:mm:ss z' }}
21 |
Offset
22 |
: {{channelz.offset}}
23 |
Limit
24 |
: {{channelz.limit}}
25 |
Count
26 |
: {{channelz.count}}
27 |
Total
28 |
: {{channelz.total}}
29 |
30 |
31 |
33 |
34 | Channels
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 | Selected Channel Info
44 |
45 |
46 |
53 |
56 |
Name
57 |
: {{selectedChannel.name}}
58 |
Msgs
59 |
: {{selectedChannel.msgs}}
60 |
Bytes
61 |
: {{selectedChannel.bytes}}
62 |
First Seq
63 |
: {{selectedChannel.first_seq}}
64 |
Last Seq
65 |
: {{selectedChannel.last_seq}}
66 |
Subs Count
67 |
: {{selectedChannel.subs_count}}
68 |
69 |
70 |
71 |
72 |
73 |
74 | Channel Limits
75 |
76 |
77 |
Max Msgs
78 |
: {{getStorezChannelByChannelName(selectedChannel.name)?.namedChannel?.max_msgs}}
79 |
Max Bytes
80 |
: {{getStorezChannelByChannelName(selectedChannel.name)?.namedChannel?.max_bytes}}
81 |
Max Age
82 |
: {{getStorezChannelByChannelName(selectedChannel.name)?.namedChannel?.max_age}}
83 |
Max Subs.
84 |
: {{getStorezChannelByChannelName(selectedChannel.name)?.namedChannel?.max_subscriptions}}
85 |
Max İnactivity
86 |
: {{getStorezChannelByChannelName(selectedChannel.name)?.namedChannel?.max_inactivity}}
87 |
88 |
89 |
90 |
Max Msgs
91 |
: {{storez.limits.max_msgs}}
92 |
Max Bytes
93 |
: {{storez.limits.max_bytes}}
94 |
Max Age
95 |
: {{storez.limits.max_age}}
96 |
Max Subs.
97 |
: {{storez.limits.max_subscriptions}}
98 |
Max İnactivity
99 |
: {{storez.limits.max_inactivity}}
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 | Subscriptions
111 |
112 |
113 |
114 |
115 | Queue Name |
116 | Max Inflight |
117 | Pending Count |
118 | Ack Wait |
119 | Last Sent |
120 | Is Durable |
121 | Is Offline |
122 |
123 |
124 |
125 |
126 | {{sub.queue_name}} |
127 |
128 | {{sub.max_inflight}} |
129 | 3 ? 'red' : 'green'}"> {{sub.pending_count}} |
130 | {{sub.ack_wait}} |
131 | {{sub.last_sent}} |
132 | {{sub.last_sent}} |
133 |
134 |
135 | |
136 |
137 |
138 | |
139 |
140 |
141 |
142 |
143 |
144 |
145 |
146 |
147 |
148 |
149 |
150 | Repeat Interval (seconds)
151 |
152 |
153 |
154 |
155 | Alert Max Pending Count
156 |
157 |
158 |
159 |
160 |
161 |
--------------------------------------------------------------------------------
/src/app/channelsz/channelsz.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, OnInit } from '@angular/core';
2 | import { MenuItem } from 'primeng/api';
3 | import { Channel } from '../models/channel';
4 | import { Channelz } from '../models/channelz';
5 | import { NatsUrl } from '../models/natsUrls';
6 | import { NatsserverService } from '../services/natsserver.service';
7 | import { concatMap } from 'rxjs/operators';
8 | import { NamedStorezChannel, Storez } from '../models/storez';
9 |
10 | @Component({
11 | selector: 'app-channel',
12 | templateUrl: './channelsz.component.html',
13 | styleUrls: ['./channelsz.component.css']
14 | })
15 | export class ChannelComponent implements OnInit {
16 |
17 | Object = Object;
18 | natsUrls: NatsUrl[] = [];
19 | natsUrl: NatsUrl = new NatsUrl();
20 | channelz: Channelz = new Channelz();
21 | storez: Storez = new Storez();
22 | namedStorezChannels?: NamedStorezChannel[] = [];
23 | selectedChannel: Channel = new Channel();
24 | alertMsg: string = '';
25 | items!: MenuItem[];
26 | display: boolean = false;
27 | interval: any;
28 | secondPeriod: number = 3;
29 | maxPendingCount: number = 3;
30 | timerStopVisible: boolean = false;
31 | values = [];
32 |
33 | constructor(private natsService: NatsserverService) { }
34 |
35 | ngOnInit(): void {
36 | this.natsService.getNodes().subscribe(rv => {
37 | this.natsUrls = rv;
38 | });
39 |
40 | this.items = [
41 | {
42 | label: 'Setting',
43 | icon: 'pi pi-cog',
44 | command: () => {
45 | this.showDialog();
46 | },
47 | },
48 | ];
49 |
50 | if (localStorage.getItem('secondPeriod') == undefined || localStorage.getItem('secondPeriod') == undefined) {
51 | localStorage.setItem('secondPeriod', '3'); //3sec
52 | localStorage.setItem('maxPendingCount', '3'); //3sec
53 | this.secondPeriod = 3;
54 | this.maxPendingCount = 3;
55 | } else {
56 | this.secondPeriod = Number(localStorage.getItem('secondPeriod'));
57 | this.maxPendingCount = Number(localStorage.getItem('maxPendingCount'));
58 | }
59 | }
60 |
61 | urlChange(selectedItem: any) {
62 |
63 | localStorage.setItem("selectNode", selectedItem.value.text)
64 | this.natsService.getChannelsz(selectedItem.value).subscribe(
65 | (rv) => {
66 | this.channelz = rv;
67 | for (const element of this.channelz.channels) {
68 | const chnl = element;
69 | chnl.desc = chnl.name;
70 | }
71 | },
72 | (err) => {
73 | alert(err.message);
74 | }
75 | );
76 |
77 | this.natsService.getStorez(selectedItem.value).subscribe(
78 | (rv) => {
79 | this.storez = rv;
80 | if (this.storez.limits.channels == null) {
81 | this.namedStorezChannels = undefined;
82 | }
83 | else {
84 | this.namedStorezChannels = Object.keys(rv.limits.channels).map((key) => ({
85 | name: key,
86 | namedChannel: rv.limits.channels[key],
87 | }));
88 | }
89 | },
90 | (err) => {
91 | alert(err.message);
92 | });
93 | }
94 |
95 | onChangeChannel(data: any) {
96 | localStorage.setItem('selectedChannel', data.value.name);
97 | }
98 |
99 | getNatsData(env: any, channelName: string) {
100 | this.natsService.getChannelz(env, channelName).subscribe(
101 | (rv) => {
102 | this.selectedChannel = rv;
103 | this.selectedChannel.desc = this.selectedChannel.name
104 | let pendingCount = this.selectedChannel?.subscriptions[0].pending_count as number;
105 |
106 | if (pendingCount >= this.maxPendingCount) {
107 | this.alertMsg = 'Warning! max pending count';
108 | } else {
109 | this.alertMsg = '';
110 | }
111 | },
112 | (err) => {
113 | alert(err.message);
114 | }
115 | );
116 | }
117 |
118 | getStorezData() {
119 |
120 | }
121 |
122 | startTimer() {
123 | let secondPeriod = Number(localStorage.getItem('secondPeriod')?.toString()) * 1000;
124 | let setTime = 1000;
125 | this.timerStopVisible = true;
126 | this.interval = setInterval(() => {
127 | if (setTime > 0) {
128 | setTime--;
129 | this.getNatsData(this.natsUrl, this.selectedChannel.name);
130 | // this.selectedChannel = (this.channelz.channels.find((x) => x.name == localStorage.getItem('selectedChannel')));
131 | } else {
132 | clearInterval(this.interval);
133 | this.timerStopVisible = false;
134 | }
135 | }, secondPeriod);
136 | }
137 |
138 | stopTimer() {
139 | clearInterval(this.interval);
140 | this.timerStopVisible = false;
141 | this.alertMsg = '';
142 | }
143 |
144 | setTimer(count: number, maxPendingCount: number) {
145 | if (count >= 3) {
146 | localStorage.setItem('secondPeriod', count.toString());
147 | localStorage.setItem('maxPendingCount', maxPendingCount.toString());
148 | this.display = false;
149 | } else {
150 | alert('Warning! min>2');
151 | }
152 | }
153 |
154 | showDialog() {
155 | this.display = true;
156 | }
157 |
158 | changeSelections(data: any) {
159 | this.natsUrl = { text: data.text, url: data.url };
160 |
161 | }
162 |
163 | IsChannelConfigured(channelName: string) {
164 | if (this.namedStorezChannels == undefined) {
165 | return false;
166 | }
167 | else {
168 | return this.namedStorezChannels.find(x => x.name == channelName) != undefined;
169 | }
170 | }
171 |
172 | getStorezChannelByChannelName(channelName: string) {
173 | return this.namedStorezChannels?.find(x => x.name == channelName);
174 | }
175 | }
176 |
--------------------------------------------------------------------------------
/src/app/models/channel.ts:
--------------------------------------------------------------------------------
1 | import { Subscription } from "./subscription";
2 |
3 | export class Channel {
4 | name!:string;
5 | msgs!:number;
6 | bytes!:number;
7 | first_seq!:number;
8 | last_seq!:number;
9 | subs_count!:number;
10 | subscriptions:Subscription[]=[]
11 | desc:string="";
12 | }
--------------------------------------------------------------------------------
/src/app/models/channelz.ts:
--------------------------------------------------------------------------------
1 | import { Channel } from "./channel";
2 |
3 | export class Channelz {
4 | cluster_id!:string;
5 | server_id!:string;
6 | now!:string;
7 | offset!:number;
8 | limit!:number;
9 | count!:number;
10 | total!:number;
11 | channels:Channel[]=[]
12 | }
--------------------------------------------------------------------------------
/src/app/models/natsUrls.ts:
--------------------------------------------------------------------------------
1 | export class NatsUrl {
2 | text!: string;
3 | url!: string;
4 | }
5 |
--------------------------------------------------------------------------------
/src/app/models/serverz.ts:
--------------------------------------------------------------------------------
1 | export class Serverz{
2 | cluster_id!:string;
3 | server_id!:string;
4 | version!:string;
5 | go!:string;
6 | now!:string;
7 | start_time!:string;
8 | uptime!:string;
9 | clients!:string;
10 | subscriptions!:string;
11 | channels!:string;
12 | total_msgs!:string;
13 | total_bytes!:string;
14 | }
--------------------------------------------------------------------------------
/src/app/models/storez.ts:
--------------------------------------------------------------------------------
1 | export class Storez{
2 | cluster_id!:string;
3 | server_id!:string;
4 | now!:string;
5 | type!:string;
6 | limits:Limits=new Limits();
7 | total_msgs!:number
8 | total_bytes!:number
9 | }
10 |
11 | class Limits{
12 | max_channels!:number
13 | max_msgs!:number
14 | max_bytes!:number
15 | max_age!:number
16 | max_subscriptions!:number
17 | max_inactivity!:number
18 | channels: { [channelName: string]: StorezChannel } = {};
19 | }
20 |
21 | export class StorezChannel{
22 | max_msgs!:number
23 | max_bytes!:number
24 | max_age!:number
25 | max_subscriptions!:number
26 | max_inactivity!:number
27 | }
28 |
29 | export class NamedStorezChannel{
30 | name!:string
31 | namedChannel!:StorezChannel
32 | }
33 |
--------------------------------------------------------------------------------
/src/app/models/subscription.ts:
--------------------------------------------------------------------------------
1 | export class Subscription {
2 | client_id!:string;
3 | inbox!:string;
4 | ack_inbox!:string;
5 | queue_name!:string;
6 | is_durable!:boolean;
7 | is_offline!:boolean;
8 | max_inflight!:number;
9 | ack_wait!:number;
10 | last_sent!:number;
11 | pending_count!:number;
12 | is_stalled!:boolean
13 | }
--------------------------------------------------------------------------------
/src/app/models/websocket.ts:
--------------------------------------------------------------------------------
1 | export class Websocket {
2 | cid!: number;
3 | kind!: string;
4 | type!: string;
5 | ip!: string;
6 | port!: number;
7 | start!: string;
8 | last_activity!: string;
9 | rtt!: string;
10 | uptime!: string;
11 | idle!: string;
12 | pending_bytes!: number;
13 | in_msgs!: number;
14 | out_msgs!: number;
15 | in_bytes!: number;
16 | out_bytes!: number;
17 | subscriptions!: number;
18 | name!: string;
19 | lang!: string;
20 | version!: string;
21 | node!:string;
22 | }
--------------------------------------------------------------------------------
/src/app/serverz/serverz.component.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/src/app/serverz/serverz.component.css
--------------------------------------------------------------------------------
/src/app/serverz/serverz.component.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
6 |
7 |
8 |
9 |
10 | Server Info
11 |
12 |
13 |
14 |
Cluster Id
15 |
: {{serverz.cluster_id}}
16 |
Server Id
17 |
: {{serverz.server_id}}
18 |
Now
19 |
: {{ serverz.now | date:'dd.MM.yyyy HH:mm:ss z' }}
20 |
Version
21 |
: {{serverz.version}}
22 |
Go Version
23 |
: {{serverz.go}}
24 |
Start Time
25 |
: {{serverz.start_time | date:'dd.MM.yyyy HH:mm:ss z'}}
26 |
Up Time
27 |
: {{serverz.uptime}}
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 | {{serverz.channels}}
36 |
37 |
38 |
39 |
40 | {{serverz.subscriptions}}
41 |
42 |
43 |
44 |
45 | {{serverz.total_msgs}}
46 |
47 |
48 |
49 |
50 | {{serverz.total_bytes}}
51 |
52 |
53 |
54 |
55 |
56 |
57 |
--------------------------------------------------------------------------------
/src/app/serverz/serverz.component.spec.ts:
--------------------------------------------------------------------------------
1 | import { ComponentFixture, TestBed } from '@angular/core/testing';
2 |
3 | import { ServerzComponent } from './serverz.component';
4 |
5 | describe('ServerzComponent', () => {
6 | let component: ServerzComponent;
7 | let fixture: ComponentFixture;
8 |
9 | beforeEach(async () => {
10 | await TestBed.configureTestingModule({
11 | declarations: [ ServerzComponent ]
12 | })
13 | .compileComponents();
14 |
15 | fixture = TestBed.createComponent(ServerzComponent);
16 | component = fixture.componentInstance;
17 | fixture.detectChanges();
18 | });
19 |
20 | it('should create', () => {
21 | expect(component).toBeTruthy();
22 | });
23 | });
24 |
--------------------------------------------------------------------------------
/src/app/serverz/serverz.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, OnInit } from '@angular/core';
2 | import { concatMap } from 'rxjs';
3 | import { NatsUrl } from '../models/natsUrls';
4 | import { Serverz } from '../models/serverz';
5 | import { NatsserverService } from '../services/natsserver.service';
6 |
7 | @Component({
8 | selector: 'app-serverz',
9 | templateUrl: './serverz.component.html',
10 | styleUrls: ['./serverz.component.css']
11 | })
12 | export class ServerzComponent implements OnInit {
13 |
14 | natsUrls: NatsUrl[] = [];
15 | natsUrl: NatsUrl = new NatsUrl();
16 | serverz: Serverz = new Serverz();
17 | constructor(private natsService: NatsserverService) {
18 |
19 | }
20 | ngOnInit(): void {
21 | this.natsService.getNodes().subscribe(rv => {
22 | this.natsUrls = rv;
23 | });
24 | }
25 |
26 | onChange(selectedItem: any) {
27 | this.natsService.getServerz(selectedItem.value).subscribe(rv => {
28 | this.serverz = rv;
29 | })
30 | }
31 | }
32 |
--------------------------------------------------------------------------------
/src/app/services/natsserver.service.ts:
--------------------------------------------------------------------------------
1 | import { HttpClient } from '@angular/common/http';
2 | import { Injectable } from '@angular/core';
3 | import { BehaviorSubject, Observable } from 'rxjs';
4 | import { Channel } from '../models/channel';
5 | import { Channelz } from '../models/channelz';
6 | import { NatsUrl } from '../models/natsUrls';
7 | import { Serverz } from '../models/serverz';
8 | import { Storez } from '../models/storez';
9 | import { Websocket } from '../models/websocket';
10 |
11 | @Injectable({
12 | providedIn: 'root'
13 | })
14 | export class NatsserverService {
15 |
16 | constructor(public http:HttpClient) {
17 |
18 | }
19 |
20 | getChannelsz(env:any):Observable{
21 | return this.http.jsonp(env.url+"/channelsz?subs=1","callback")
22 | }
23 |
24 | getChannelz(env:any,tn:string):Observable{
25 | return this.http.jsonp(`${env.url}/channelsz?channel=${tn}&subs=1`,"callback")
26 | }
27 |
28 | getNodes():Observable{
29 | return this.http.get("./assets/urls.json")
30 | }
31 |
32 | getServerz(env:any):Observable{
33 | return this.http.jsonp(env.url+"/serverz","callback")
34 | }
35 |
36 | getStorez(env:any):Observable{
37 | return this.http.jsonp(env.url+"/storez","callback")
38 | }
39 |
40 | getWebsocket(env:any):Observable{
41 | return this.http.jsonp("http://localhost:8222/connz","callback")
42 | }
43 |
44 | }
45 |
--------------------------------------------------------------------------------
/src/app/storez/storez.component.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/src/app/storez/storez.component.css
--------------------------------------------------------------------------------
/src/app/storez/storez.component.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
6 |
7 |
8 |
9 |
10 | Server Info
11 |
12 |
13 |
14 |
Cluster Id
15 |
: {{storez.cluster_id}}
16 |
Server Id
17 |
: {{storez.server_id}}
18 |
Now
19 |
: {{ storez.now | date:'dd.MM.yyyy HH:mm:ss z' }}
20 |
Type
21 |
: {{storez.type}}
22 |
Total Msgs
23 |
: {{storez.total_msgs}}
24 |
Total Byts
25 |
: {{storez.total_bytes}}
26 |
27 |
28 |
29 |
30 |
31 |
32 |
Max Channels
33 |
: {{storez.limits.max_channels}}
34 |
Max Msgs
35 |
: {{storez.limits.max_msgs}}
36 |
Max Bytes
37 |
: {{storez.limits.max_bytes}}
38 |
Max Age
39 |
: {{storez.limits.max_age}}
40 |
Max Subs.
41 |
: {{storez.limits.max_subscriptions}}
42 |
Max İnactivity
43 |
: {{storez.limits.max_inactivity}}
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
55 |
56 |
57 |
58 | Channel Name |
59 | Max Msgs |
60 | Max Bytes |
61 | Max Age |
62 | Max Subs |
63 | Max İnactivity |
64 |
65 |
66 |
67 |
68 | {{item.name}} |
69 | {{item.namedChannel.max_msgs}} |
70 | {{item.namedChannel.max_bytes}} |
71 | {{item.namedChannel.max_age}} |
72 | {{item.namedChannel.max_subscriptions}} |
73 | {{item.namedChannel.max_inactivity}} |
74 |
75 |
76 |
77 |
78 |
79 |
--------------------------------------------------------------------------------
/src/app/storez/storez.component.spec.ts:
--------------------------------------------------------------------------------
1 | import { ComponentFixture, TestBed } from '@angular/core/testing';
2 |
3 | import { StorezComponent } from './storez.component';
4 |
5 | describe('StorezComponent', () => {
6 | let component: StorezComponent;
7 | let fixture: ComponentFixture;
8 |
9 | beforeEach(async () => {
10 | await TestBed.configureTestingModule({
11 | declarations: [ StorezComponent ]
12 | })
13 | .compileComponents();
14 |
15 | fixture = TestBed.createComponent(StorezComponent);
16 | component = fixture.componentInstance;
17 | fixture.detectChanges();
18 | });
19 |
20 | it('should create', () => {
21 | expect(component).toBeTruthy();
22 | });
23 | });
24 |
--------------------------------------------------------------------------------
/src/app/storez/storez.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, OnInit } from '@angular/core';
2 | import { concatMap } from 'rxjs';
3 | import { NatsUrl } from '../models/natsUrls';
4 | import { NamedStorezChannel, Storez } from '../models/storez';
5 | import { NatsserverService } from '../services/natsserver.service';
6 |
7 | @Component({
8 | selector: 'app-storez',
9 | templateUrl: './storez.component.html',
10 | styleUrls: ['./storez.component.css']
11 | })
12 | export class StorezComponent implements OnInit {
13 |
14 | natsUrls: NatsUrl[] = [];
15 | natsUrl: NatsUrl = new NatsUrl();
16 | storez: Storez = new Storez();
17 | namedStorezChannels?: NamedStorezChannel[] = [];
18 | constructor(private natsService: NatsserverService) {
19 |
20 | }
21 |
22 | ngOnInit(): void {
23 | this.natsService.getNodes().subscribe(rv => {
24 | this.natsUrls = rv;
25 | });
26 | }
27 |
28 | onChange(selectedItem: any) {
29 | this.natsService.getStorez(selectedItem.value).subscribe(rv => {
30 | this.storez = rv;
31 | if (this.storez.limits.channels == null){
32 | this.namedStorezChannels = undefined;
33 | }
34 | else{
35 | this.namedStorezChannels = Object.keys(rv.limits.channels).map((key) => ({
36 | name: key,
37 | namedChannel: rv.limits.channels[key],
38 | }));
39 | }
40 | localStorage.setItem("selectNode", this.natsUrl.text)
41 | });
42 | }
43 |
44 | }
45 |
--------------------------------------------------------------------------------
/src/app/websocket/websocket.component.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/src/app/websocket/websocket.component.css
--------------------------------------------------------------------------------
/src/app/websocket/websocket.component.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
5 |
6 |
7 |
8 |
9 |
10 |
12 |
13 |
14 |
15 |
16 |
17 | Node |
18 | Name |
19 | CID |
20 | Type |
21 | IP |
22 | Port |
23 | Start |
24 | Last Activity |
25 | Uptime |
26 | Idle |
27 | In Msgs |
28 | Out Msgs |
29 | In Bytes |
30 |
31 |
32 |
33 |
34 | {{ws.node}} |
35 | {{ws.name}} |
36 | {{ws.cid}} |
37 | {{ws.type}} |
38 | {{ws.ip}} |
39 | {{ws.port}} |
40 | {{ws.start | date:'dd.MM.yyyy HH:mm:ss z'}} |
41 | {{ws.last_activity | date:'dd.MM.yyyy HH:mm:ss z'}} |
42 | {{ws.uptime}} |
43 | {{ws.idle}} |
44 | {{ws.in_msgs}} |
45 | {{ws.out_msgs}} |
46 | {{ws.in_bytes}} |
47 |
48 |
49 | {{websockests.length}} connections
50 |
51 |
52 |
--------------------------------------------------------------------------------
/src/app/websocket/websocket.component.spec.ts:
--------------------------------------------------------------------------------
1 | import { ComponentFixture, TestBed } from '@angular/core/testing';
2 |
3 | import { WebsocketComponent } from './websocket.component';
4 |
5 | describe('WebsocketComponent', () => {
6 | let component: WebsocketComponent;
7 | let fixture: ComponentFixture;
8 |
9 | beforeEach(async () => {
10 | await TestBed.configureTestingModule({
11 | declarations: [ WebsocketComponent ]
12 | })
13 | .compileComponents();
14 |
15 | fixture = TestBed.createComponent(WebsocketComponent);
16 | component = fixture.componentInstance;
17 | fixture.detectChanges();
18 | });
19 |
20 | it('should create', () => {
21 | expect(component).toBeTruthy();
22 | });
23 | });
24 |
--------------------------------------------------------------------------------
/src/app/websocket/websocket.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, OnInit } from '@angular/core';
2 | import { NatsUrl } from '../models/natsUrls';
3 | import { Websocket } from '../models/websocket';
4 | import { NatsserverService } from '../services/natsserver.service';
5 | import { concatMap } from 'rxjs';
6 |
7 | @Component({
8 | selector: 'app-websocket',
9 | templateUrl: './websocket.component.html',
10 | styleUrls: ['./websocket.component.css']
11 | })
12 | export class WebsocketComponent implements OnInit {
13 | natsNodes: NatsUrl[] = [];
14 | natsNode: NatsUrl = new NatsUrl();
15 | websockests: Websocket[] = [];
16 |
17 | constructor(private natsService: NatsserverService) {
18 | }
19 |
20 | ngOnInit(): void {
21 | this.natsService.getWebsocket("").subscribe(rv => {
22 | this.websockests = rv.connections;
23 | } );
24 | }
25 |
26 | }
27 |
--------------------------------------------------------------------------------
/src/assets/.gitkeep:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/src/assets/.gitkeep
--------------------------------------------------------------------------------
/src/assets/i18n/en.json:
--------------------------------------------------------------------------------
1 | {
2 | "queue_name": "Queue Group Name",
3 | "max_inflight": "Maximum number of unacknowledged messages that can be sent to subscriber",
4 | "pending_count": "Number of unprocessed messages sent to subscriber",
5 | "ack_wait": "Acknowledgment message timeout",
6 | "last_sent": "Sequence of the last message sent to subscriber",
7 | "is_drable": "Whether it is durable or not",
8 | "version": "NATS-Streaming Version",
9 | "msgs": "Total number of messages in the queue",
10 | "bytes": "Total message size",
11 | "first_seq": "Sequence of the first message in the queue since the queue was created",
12 | "last_seq": "Sequence of the last message in the queue since the queue was created",
13 | "subs_count": "Number of subscribers",
14 | "max_channels": "Provides global channel limits. Can be changed on a per-channel basis.",
15 | "max_msgs": "Maximum number of messages per channel",
16 | "max_bytes": "Total message size per channel",
17 | "max_age": "Message retention time",
18 | "max_subscriptions": "Provides the number of subscriptions per channel",
19 | "max_inactivity": "Provides the time for channel deletion. When 1h is entered, if no one subscribes within 1 hour and the channel does not contain any messages, it will be deleted.",
20 | "is_offline": "Whether it is offline or not"
21 | }
--------------------------------------------------------------------------------
/src/assets/i18n/tr.json:
--------------------------------------------------------------------------------
1 | {
2 | "queue_name":"queue group ismi",
3 | "max_inflight":"subscriber'a ack mesajı beklemeden (işlenmemiş) gönderilebilecek max mesaj sayısı",
4 | "pending_count":"subscriber'a gönderilmiş, bekleyen işlenmemiş mesaj sayısı",
5 | "ack_wait":"ack mesaj timeout'u",
6 | "last_sent":"subscriber'a son gönderilen mesajın sırası",
7 | "is_drable":"durable olup olmadığı",
8 | "version":"nats-streaming versiyon",
9 | "msgs": "kuyrukta yer alan toplam mesaj sayısı",
10 | "bytes" : "toplam mesaj boyutu",
11 | "first_seq" :"kuyrukta yer alan ilk mesajın kuyruk create edildiği zamandan itibaren sırası",
12 | "last_seq" :"kuyrukta yer alan son mesajın kuyruk create edildiği zamandan itibaren sırası",
13 | "subs_count":"subscriber sayısı",
14 | "max_channels": "global channel limitlerini verir. Channel bazlı değiştirilebilir.",
15 | "max_msgs":"channel başı max msg sayısı",
16 | "max_bytes":"channel başı toplam mesaj boyutu",
17 | "max_age":"mesaj durma süresi",
18 | "max_subscriptions":"channel başı subscription sayısını verir",
19 | "max_inactivity":"channel'ın silinmes süresini verir. 1h girildiğinde, 1h içinde hiç subscribe olan yoksa ve mesaj içermiyorsa silinir.",
20 | "is_offline":"offline olup olmadığı"
21 | }
--------------------------------------------------------------------------------
/src/assets/nats.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/src/assets/nats.png
--------------------------------------------------------------------------------
/src/assets/urls.json:
--------------------------------------------------------------------------------
1 |
2 | [
3 | { "text": "Choose Environmet", "url": "" },
4 | { "text": "test","url": "http://localhost:8222/streaming"},
5 | { "text": "prod","url": "http://localhost:8223/streaming" },
6 | { "text": "uat","url": "http://localhost:8224/streaming" },
7 | { "text": "rc","url": ""}
8 | ]
--------------------------------------------------------------------------------
/src/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/DefactoTechnology/nats-ui/fc02a03d9cdd265b2fe829fb3d139b634ea0ee5d/src/favicon.ico
--------------------------------------------------------------------------------
/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | Nats UI
6 |
7 |
8 |
9 |
11 |
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/src/main.ts:
--------------------------------------------------------------------------------
1 | import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
2 |
3 | import { AppModule } from './app/app.module';
4 |
5 |
6 | platformBrowserDynamic().bootstrapModule(AppModule)
7 | .catch(err => console.error(err));
8 |
--------------------------------------------------------------------------------
/src/styles.css:
--------------------------------------------------------------------------------
1 | /* You can add global styles to this file, and also import other style files */
2 |
--------------------------------------------------------------------------------
/tsconfig.app.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/app",
6 | "types": []
7 | },
8 | "files": [
9 | "src/main.ts"
10 | ],
11 | "include": [
12 | "src/**/*.d.ts"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "compileOnSave": false,
4 | "compilerOptions": {
5 | "baseUrl": "./",
6 | "outDir": "./dist/out-tsc",
7 | "forceConsistentCasingInFileNames": true,
8 | "strict": true,
9 | "noImplicitOverride": true,
10 | "noPropertyAccessFromIndexSignature": true,
11 | "noImplicitReturns": true,
12 | "noFallthroughCasesInSwitch": true,
13 | "sourceMap": true,
14 | "declaration": false,
15 | "downlevelIteration": true,
16 | "experimentalDecorators": true,
17 | "moduleResolution": "node",
18 | "importHelpers": true,
19 | "target": "ES2022",
20 | "module": "ES2022",
21 | "useDefineForClassFields": false,
22 | "lib": [
23 | "ES2022",
24 | "dom"
25 | ]
26 | },
27 | "angularCompilerOptions": {
28 | "enableI18nLegacyMessageIdFormat": false,
29 | "strictInjectionParameters": true,
30 | "strictInputAccessModifiers": true,
31 | "strictTemplates": true
32 | }
33 | }
34 |
--------------------------------------------------------------------------------
/tsconfig.spec.json:
--------------------------------------------------------------------------------
1 | /* To learn more about this file see: https://angular.io/config/tsconfig. */
2 | {
3 | "extends": "./tsconfig.json",
4 | "compilerOptions": {
5 | "outDir": "./out-tsc/spec",
6 | "types": [
7 | "jasmine"
8 | ]
9 | },
10 | "include": [
11 | "src/**/*.spec.ts",
12 | "src/**/*.d.ts"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/updateurls.sh:
--------------------------------------------------------------------------------
1 | #!/bin/bash
2 | echo $1 > /usr/share/nginx/html/assets/urls.json
3 | nginx -g "daemon off;"
4 |
--------------------------------------------------------------------------------