From cc26d31af2f71234362d405dc4d866c60eee0e28 Mon Sep 17 00:00:00 2001
From: Jacob Yi <jacobyi@jacobs-mbp.lan>
Date: Mon, 11 Dec 2023 15:22:35 -0600
Subject: [PATCH 1/2] added search button on the lefthand navigation

---
 .../df-service-details.component.html         |  8 +++----
 .../df-service-details.component.ts           |  2 +-
 .../df-side-nav/df-side-nav.component.html    | 16 +++++++-------
 .../df-side-nav/df-side-nav.component.scss    | 22 +++++++++++++++++++
 src/assets/i18n/en.json                       |  2 +-
 5 files changed, 36 insertions(+), 14 deletions(-)

diff --git a/src/app/adf-services/df-service-details/df-service-details.component.html b/src/app/adf-services/df-service-details/df-service-details.component.html
index 61d371fb..49437856 100644
--- a/src/app/adf-services/df-service-details/df-service-details.component.html
+++ b/src/app/adf-services/df-service-details/df-service-details.component.html
@@ -58,10 +58,10 @@
   <ng-container *ngIf="viewSchema && !subscriptionRequired">
     <ng-container formGroupName="config">
       <mat-accordion class="full-width">
-        <mat-expansion-panel [expanded]="!serviceForm.getRawValue().type">
-          <mat-expansion-panel-header>{{
-            'services.options' | transloco
-          }}</mat-expansion-panel-header>
+        <mat-expansion-panel [expanded]="serviceForm.getRawValue().type">
+          <mat-expansion-panel-header
+            >{{ 'services.options' | transloco }}
+          </mat-expansion-panel-header>
           <div class="details-section">
             <ng-container *ngFor="let item of viewSchema">
               <ng-container
diff --git a/src/app/adf-services/df-service-details/df-service-details.component.ts b/src/app/adf-services/df-service-details/df-service-details.component.ts
index 7f1d6314..a30a6b6f 100644
--- a/src/app/adf-services/df-service-details/df-service-details.component.ts
+++ b/src/app/adf-services/df-service-details/df-service-details.component.ts
@@ -226,7 +226,7 @@ export class DfServiceDetailsComponent implements OnInit {
           }
         )
         .subscribe(() => {
-          this.router.navigate(['../'], { relativeTo: this.activatedRoute });
+          this.router.navigate(['/api-connections/api-docs']);
         });
     }
   }
diff --git a/src/app/shared/components/df-side-nav/df-side-nav.component.html b/src/app/shared/components/df-side-nav/df-side-nav.component.html
index a629cac6..f3cf8f76 100644
--- a/src/app/shared/components/df-side-nav/df-side-nav.component.html
+++ b/src/app/shared/components/df-side-nav/df-side-nav.component.html
@@ -12,12 +12,6 @@
       </button>
       <img class="logo" src="assets/img/logo.png" alt="Logo" routerLink="/" />
       <span class="spacer"></span>
-      <button
-        mat-icon-button
-        (click)="handleSearchClick()"
-        [attr.aria-label]="'search' | transloco">
-        <fa-icon [icon]="faMagnifyingGlass"></fa-icon>
-      </button>
       <ng-container *ngIf="availableLanguages.length > 1">
         <button
           mat-icon-button
@@ -34,8 +28,8 @@
           </button>
         </mat-menu>
       </ng-container>
-      <button mat-button [matMenuTriggerFor]="profileMenu">
-        {{ (userData$ | async)?.name }}
+      <button mat-button [matMenuTriggerFor]="profileMenu" class="profile-icon">
+        <fa-icon [icon]="faUser"></fa-icon> {{ (userData$ | async)?.name }}
       </button>
       <mat-menu #profileMenu="matMenu">
         <button mat-menu-item routerLink="profile">
@@ -66,6 +60,12 @@
       class="sidenav"
       [mode]="(isSmallScreen | async) ? 'over' : 'side'">
       <mat-nav-list *ngIf="isLoggedIn$ | async">
+        <button class="search-btn" mat-button (click)="handleSearchClick()">
+          {{ 'Search Features' | transloco }}
+          <span>
+            <fa-icon [icon]="faMagnifyingGlass"></fa-icon>
+          </span>
+        </button>
         <ng-container
           *ngTemplateOutlet="
             navList;
diff --git a/src/app/shared/components/df-side-nav/df-side-nav.component.scss b/src/app/shared/components/df-side-nav/df-side-nav.component.scss
index 0a509136..d4ed8127 100644
--- a/src/app/shared/components/df-side-nav/df-side-nav.component.scss
+++ b/src/app/shared/components/df-side-nav/df-side-nav.component.scss
@@ -19,6 +19,28 @@ $red-palette: mat.define-palette(mat.$red-palette);
   min-height: 64px;
 }
 
+.search-btn {
+  font-size: 1.6rem;
+  font-weight: 400;
+  height: 46px;
+  background: none;
+  border: none;
+  padding: 0 16px;
+  font-family: var(--mat-expansion-header-text-font);
+  color: var(--mat-expansion-container-text-color);
+  cursor: pointer;
+  display: flex;
+    align-items: center;
+
+    span {
+      margin-left: 6px;
+    }
+}
+
+.profile-icon {
+  color:  #0f0761;
+}
+
 .sidenav-container {
   flex: 1 1 auto;
   .sidenav {
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index 596446d7..323e36c7 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -126,7 +126,7 @@
       "download": { "nav": "Download", "header": "{{nav.home.download.nav}}" }
     },
     "api-connections": {
-      "nav": "API Connections",
+      "nav": "API Generation & Connections",
       "api-types": {
         "nav": "API Types",
         "database": {

From 1e7c642ebdf55c0a93eb9b5d63960ec75c324a86 Mon Sep 17 00:00:00 2001
From: Jacob Yi <jacobyi@jacobs-mbp.lan>
Date: Mon, 11 Dec 2023 15:47:35 -0600
Subject: [PATCH 2/2] Updated column layout for forms

---
 .../df-service-details.component.html                 | 11 ++++++++---
 .../components/df-side-nav/df-side-nav.component.scss | 10 +++++-----
 src/styles.scss                                       |  6 ++++++
 3 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/src/app/adf-services/df-service-details/df-service-details.component.html b/src/app/adf-services/df-service-details/df-service-details.component.html
index 49437856..43069126 100644
--- a/src/app/adf-services/df-service-details/df-service-details.component.html
+++ b/src/app/adf-services/df-service-details/df-service-details.component.html
@@ -1,5 +1,5 @@
 <form [formGroup]="serviceForm" class="details-section" (ngSubmit)="save()">
-  <mat-form-field subscriptSizing="dynamic" class="dynamic-width">
+  <mat-form-field subscriptSizing="dynamic" class="fourth-width">
     <mat-label>{{
       'services.controls.serviceType.label' | transloco
     }}</mat-label>
@@ -16,7 +16,7 @@
   </mat-form-field>
   <mat-form-field
     subscriptSizing="dynamic"
-    class="dynamic-width"
+    class="fourth-width"
     *ngIf="!subscriptionRequired">
     <mat-label>{{ 'services.controls.namespace.label' | transloco }}</mat-label>
     <input matInput formControlName="name" />
@@ -58,7 +58,12 @@
   <ng-container *ngIf="viewSchema && !subscriptionRequired">
     <ng-container formGroupName="config">
       <mat-accordion class="full-width">
-        <mat-expansion-panel [expanded]="serviceForm.getRawValue().type">
+        <mat-expansion-panel
+          [expanded]="
+            !serviceForm.getRawValue().type ||
+            serviceForm.getRawValue().type === 'soap' ||
+            serviceForm.getRawValue().type === 'rws'
+          ">
           <mat-expansion-panel-header
             >{{ 'services.options' | transloco }}
           </mat-expansion-panel-header>
diff --git a/src/app/shared/components/df-side-nav/df-side-nav.component.scss b/src/app/shared/components/df-side-nav/df-side-nav.component.scss
index d4ed8127..be4f7a64 100644
--- a/src/app/shared/components/df-side-nav/df-side-nav.component.scss
+++ b/src/app/shared/components/df-side-nav/df-side-nav.component.scss
@@ -30,15 +30,15 @@ $red-palette: mat.define-palette(mat.$red-palette);
   color: var(--mat-expansion-container-text-color);
   cursor: pointer;
   display: flex;
-    align-items: center;
+  align-items: center;
 
-    span {
-      margin-left: 6px;
-    }
+  span {
+    margin-left: 6px;
+  }
 }
 
 .profile-icon {
-  color:  #0f0761;
+  color: #0f0761;
 }
 
 .sidenav-container {
diff --git a/src/styles.scss b/src/styles.scss
index 4664bf00..b8088527 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -108,6 +108,12 @@ mat-form-field {
   & .half-width {
     width: calc(50% - 8px);
   }
+  & .fourth-width {
+    width: calc(24.6% - 8px);
+    .small & {
+      width: calc(50% - 8px);
+    }
+  }
   & .dynamic-width {
     width: calc(50% - 8px);
     .small & {