Added Dockerfile and renamed project

src/app/beautify/beautify.component.ts

@@ -2,7 +2,7 @@ import {Component, OnInit} from '@angular/core';
 import {EditorComponent} from "ngx-monaco-editor-v2";
 import {FormsModule} from "@angular/forms";
 import {InputOutputComponent} from "../input-output/input-output.component";
-import {JsonTransformService} from "../json-transform.service";
+import {JtrService} from "../jtr.service";
 import {
   DebounceTime,
   GenerateDefaultJsonObjectString,
@@ -23,14 +23,12 @@ import {BehaviorSubject, debounceTime} from "rxjs";
   styleUrl: './beautify.component.scss'
 })
 export class BeautifyComponent implements OnInit {
-  // input: string = ;
   $input: BehaviorSubject<string> = new BehaviorSubject<string>(GenerateDefaultJsonObjectString());
   inputOptions = MonacoJsonConfig;
   output: string = GenerateDefaultJsonObjectString(2);
   outputOptions = ReadOnlyMonacoJsonConfig;
-  // error: string = "";
 
-  constructor(private service: JsonTransformService) {
+  constructor(private service: JtrService) {
   }
 
   ngOnInit(): void {

src/app/json-path/json-path.component.ts

@@ -2,7 +2,7 @@ import {Component, OnInit} from '@angular/core';
 import {InputOutputComponent} from "../input-output/input-output.component";
 import {DebounceTime, GenerateDefaultJsonObjectString, MonacoJsonConfig, ReadOnlyMonacoCSharpConfig} from "../defaults";
 import {BehaviorSubject, debounceTime} from "rxjs";
-import {JsonTransformService} from "../json-transform.service";
+import {JtrService} from "../jtr.service";
 import {MatFormField} from "@angular/material/form-field";
 import {MatInputModule} from "@angular/material/input";
 
@@ -24,7 +24,7 @@ export class JsonPathComponent implements OnInit {
   output: string = "";
   outputOptions = ReadOnlyMonacoCSharpConfig;
 
-  constructor(private service: JsonTransformService) {
+  constructor(private service: JtrService) {
   }
 
   ngOnInit(): void {

src/app/json-transform.service.spec.ts

@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { JsonTransformService } from './json-transform.service';
-
-describe('JsonTransformService', () => {
-  let service: JsonTransformService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(JsonTransformService);
-  });
-
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
-});

src/app/json2csharp/json2-csharp.component.ts

@@ -1,6 +1,6 @@
 import {Component, OnInit} from '@angular/core';
 import {InputOutputComponent} from "../input-output/input-output.component";
-import {JsonTransformService} from "../json-transform.service";
+import {JtrService} from "../jtr.service";
 import {
   DebounceTime,
   GenerateDefaultJsonObjectString,
@@ -24,7 +24,7 @@ export class Json2CsharpComponent implements OnInit {
   output: string = "";
   outputOptions = ReadOnlyMonacoCSharpConfig;
 
-  constructor(private service: JsonTransformService) {
+  constructor(private service: JtrService) {
   }
 
   ngOnInit(): void {

src/app/jtr.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import {  JtrService } from './jtr.service';
+
+describe('JtrService', () => {
+  let service: JtrService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(JtrService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

src/app/jtr.service.ts

@@ -5,8 +5,8 @@ import {Observable} from "rxjs";
 @Injectable({
   providedIn: 'root'
 })
-export class JsonTransformService {
-  private url: string = "https://localhost:5001";
+export class JtrService {
+  private url: string = import.meta.env.JTR_API_URL;
 
   constructor(private http: HttpClient) {
   }

src/app/layout/layout.component.html

@@ -15,7 +15,7 @@
       <button mat-icon-button (click)="drawer.toggle()">
         <mat-icon>menu</mat-icon>
       </button>
-      <span>JSON Transform</span>
+      <span>JSON Transform / JTR</span>
     </mat-toolbar>
 
     <main>

src/app/uglify/uglify.component.ts

@@ -1,5 +1,5 @@
 import {Component, OnInit} from '@angular/core';
-import {JsonTransformService} from "../json-transform.service";
+import {JtrService} from "../jtr.service";
 import {InputOutputComponent} from "../input-output/input-output.component";
 import {
   DebounceTime,
@@ -25,7 +25,7 @@ export class UglifyComponent implements OnInit {
   output: string = GenerateDefaultJsonObjectString();
   outputOptions = ReadOnlyMonacoJsonConfig;
 
-  constructor(private service: JsonTransformService) {
+  constructor(private service: JtrService) {
   }
 
   ngOnInit(): void {

src/env.d.ts

@@ -0,0 +1,28 @@
+// Define the type of the environment variables.
+declare interface Env {
+  readonly NODE_ENV: string;
+  // Replace the following with your own environment variables.
+  // Example: NGX_VERSION: string;
+  readonly JTR_API_URL: string;
+  [key: string]: any;
+}
+
+// Choose how to access the environment variables.
+// Remove the unused options.
+
+// 1. Use import.meta.env.YOUR_ENV_VAR in your code. (conventional)
+declare interface ImportMeta {
+  readonly env: Env;
+}
+
+// 2. Use _NGX_ENV_.YOUR_ENV_VAR in your code. (customizable)
+// You can modify the name of the variable in angular.json.
+// ngxEnv: {
+//  define: '_NGX_ENV_',
+// }
+declare const _NGX_ENV_: Env;
+
+// 3. Use process.env.YOUR_ENV_VAR in your code. (deprecated)
+declare namespace NodeJS {
+  export interface ProcessEnv extends Env {}
+}

src/styles.scss

@@ -10,7 +10,7 @@
 @include mat.core();
 
 // Define the theme object.
-$DevDisciples-Json-Tools-App-theme: mat.define-theme((
+$jtr-app-theme: mat.define-theme((
   color: (
     theme-type: light,
     primary: mat.$azure-palette,
@@ -25,15 +25,15 @@ $DevDisciples-Json-Tools-App-theme: mat.define-theme((
 // Alternatively, you can import and @include the theme mixins for each component
 // that you are using.
 :root {
-  @include mat.all-component-themes($DevDisciples-Json-Tools-App-theme);
+  @include mat.all-component-themes($jtr-app-theme);
 }
 
 // Comment out the line below if you want to use the pre-defined typography utility classes.
 // For more information: https://material.angular.io/guide/typography#using-typography-styles-in-your-application.
-// @include mat.typography-hierarchy($DevDisciples.Json.Tools.App-theme);
+// @include mat.typography-hierarchy($jtr-theme);
 
 // Comment out the line below if you want to use the deprecated `color` inputs.
-// @include mat.color-variants-backwards-compatibility($DevDisciples.Json.Tools.App-theme);
+// @include mat.color-variants-backwards-compatibility($jtr-theme);
 /* You can add global styles to this file, and also import other style files */
 
 html, body { height: 100%; }