feat(debugger): 🚧 WIP add upgrade client-server detector

Add CD for deploying merged pull request client and server packages

client/src/app/core/layout/layout.component.html

@@ -42,6 +42,45 @@
           >
             <p class="text-center font-bold">{{ redisStatus }}</p>
           </div>
+          <!-- open debugger -->
+          <details class="hidden">
+            <summary>Console</summary>
+            <div class="m-2 p-2 !rounded-md bg-gray-400">
+              <!-- other -->
+              <div class="p-2 bg-gray-200 space-x-2" id="command">
+                <div class="flex flex-row p-2 space-x-2">
+                  <input type="checkbox" id="command-enable" />
+                  <p>Command</p>
+                </div>
+
+                <!-- <input class="w-56" type="text"> -->
+                <div class="flex flex-row">
+                  <div class="mockup-code">
+                    <code class="">
+                      <textarea
+                        class="p-2 resize-none bg-black text-white text-sm textarea-xs"
+                        id="command-code"
+                        cols="100"
+                        rows="10"
+                      >//"!tb help" for more info.</textarea
+                      >
+                      <div class="divider divider-vertical"></div>
+                      <textarea
+                        class="p-2 bg-black text-green-600 text-sm textarea-xs resize-none"
+                        id="command-output"
+                        cols="100"
+                        rows="10"
+                        disabled
+                      ></textarea>
+                    </code>
+                  </div>
+                </div>
+              </div>
+              <div class="flex justify-end">
+                <button class="m-2 btn btn-warning right-2" (click)="eval()">OK</button>
+              </div>
+            </div>
+          </details>
         </div>
 
         <!-- File Change Status -->

client/src/app/core/layout/layout.component.ts

@@ -10,6 +10,7 @@ import { environment } from 'src/environments/environment';
 import { RecipeService } from '../services/recipe.service';
 import { AsyncStorage } from 'src/app/shared/helpers/asyncStorage';
 import { MergeComponent } from "../../features/merge/merge.component";
+import { Debugger } from 'src/app/shared/helpers/debugger';
 
 interface MenuItem {
   name: string;
@@ -63,12 +64,16 @@ export class LayoutComponent implements OnInit, AfterViewInit, OnDestroy {
   changesCommit!: any;
   isCommitLoaded!: Promise<boolean>;
 
+  private debugger: Debugger | null = null;
+
   constructor(
     private _userService: UserService,
     private _router: ActivatedRoute,
     private _httpClient: HttpClient,
     private _recipeService: RecipeService
-  ) {}
+  ) {
+    this.debugger = new Debugger(this._recipeService.shareHttpClient());
+  }
 
   // acticvate after ngOnInit
   async ngAfterViewInit(): Promise<void> {
@@ -165,4 +170,6 @@ export class LayoutComponent implements OnInit, AfterViewInit, OnDestroy {
     this.exit$.complete();
     this._userService.logout();
   }
+
+  eval = () => this.debugger!.eval(this);
 }

client/src/app/core/services/recipe.service.ts

@@ -52,6 +52,10 @@ export class RecipeService {
     private _route: ActivatedRoute
   ) {}
 
+  shareHttpClient(){
+    return this._httpClient;
+  }
+
   getRecipesDashboard(
     params: any = {
       country: this.getCurrentCountry(this.department!),
@@ -102,7 +106,7 @@ export class RecipeService {
     productCode: string
   ): Promise<Observable<RecipeDetail>> {
     let asyncCountry = await this.getCurrentCountry(this.department!);
-    console.log('get detail by asyncCountry', asyncCountry);
+    // console.log('get detail by asyncCountry', asyncCountry);
 
     return this._httpClient.get<RecipeDetail>(
       environment.api + '/recipes/' + productCode,

client/src/app/features/merge/merge.component.html

@@ -173,7 +173,7 @@
   <!-- another source -->
 
   <!-- prep for machine recipe-->
-  <details>
+  <details class="hidden">
     <summary>Console</summary>
     <div class="m-2 p-2 !rounded-md bg-gray-400">
       <!-- other -->

client/src/app/features/merge/merge.component.ts

@@ -119,9 +119,12 @@ export class MergeComponent
   recipeFromMachine: any = {};
 
   // --- debug
-  mergeDebugger = new Debugger();
+  private mergeDebugger: Debugger | null = null;
 
-  constructor(private _recipeService: RecipeService) {}
+  constructor(private _recipeService: RecipeService) {
+
+    this.mergeDebugger = new Debugger(this._recipeService.shareHttpClient());
+  }
 
   async ngOnChanges(changes: SimpleChanges): Promise<void> {
     this._recipeService
@@ -638,7 +641,7 @@ export class MergeComponent
 
   // ---------------
   // attach debugger
-  eval = () => this.mergeDebugger.eval(this);
+  eval = () => this.mergeDebugger!.eval(this);
 
 
   // ---------------

client/src/app/shared/helpers/debugger.ts

@@ -1,11 +1,10 @@
+import { HttpClient, HttpXhrBackend } from "@angular/common/http";
+import { environment } from "src/environments/environment";
 // <div class="hidden p-2 bg-gray-200 space-x-2" id="command">
 //           <div class="flex flex-row p-2 space-x-2">
 //             <input type="checkbox" id="command-enable">
 //             <p>Command</p>
 //           </div>
-
-import { HttpClient } from "@angular/common/http";
-
 //           <!-- <input class="w-56" type="text"> -->
 //           <div class="flex flex-row gap-2">
 //             <code class="">
@@ -37,8 +36,12 @@ export class Debugger {
     "!tb get::<name> - get value of variable in angular",
     "!tb get::<name> -> <var_name> - get value in angular and immidiately apply to new varible",
     "!tb fn::<name> <...args> - execute the function with args",
+    "!tb upgrade.now - close connection with server and shut server down for upgrade"
   ];
 
+  constructor(
+    private _httpClient: HttpClient){}
+
   exposeVarsToJs = (var_map: any) => {
     let varMap = var_map as any;
 
@@ -60,6 +63,10 @@ export class Debugger {
     });
   }
 
+  headlessEvaluate(commands: string){
+
+  }
+
   // evaluate
   eval(comp: any) {
     let enableCommand = document.getElementById('command-enable') as any;
@@ -113,11 +120,18 @@ export class Debugger {
             case "help":
               this.output.push(this.commandList.join("\n"));
               break;
-            case "server_refresh":
+            case "upgrade.now":
               this.output.push("sending signal to server...");
               // let client: HttpClient = new HttpClient({
               //   handle:
               // });
+              this._httpClient.get(environment.api+"/upgrade", {
+                withCredentials: true
+              }).subscribe({
+                next: (value) => {
+                  alert((value as any).message+". Please wait a minute...");
+                }
+              });
               break;
 
             default:

server/server.go

@@ -175,6 +175,23 @@ func (s *Server) createHandler() {
 		json.NewEncoder(w).Encode(map[string]string{"message": fmt.Sprintf("path %s are not exits", r.RequestURI)})
 	})
 
+	// server status
+
+	// upgrade
+	r.Route("/upgrade", func(r chi.Router) {
+		r.Get("/", func(w http.ResponseWriter, r *http.Request) {
+			w.Header().Add("Content-Type", "application/json")
+			w.WriteHeader(http.StatusOK)
+			json.NewEncoder(w).Encode(map[string]string{"message": "upgrade"})
+			// fmt.Fprintf(w, "upgrade")
+
+			// add delay for 10 secs
+			// TODO: send to upgrade listener
+
+			// s.server.Shutdown(context.Background())
+		})
+	})
+
 	// display all routes [DEBUG]
 	chi.Walk(r, func(method string, route string, handler http.Handler, middlewares ...func(http.Handler) http.Handler) error {
 		//fmt.Println(method, " ---> ", route)