feat(crowdstrike): implement CrowdStrike integration guide and update logs display

Signed-off-by: Manuel Abascal <mjabascal10@gmail.com>

Author: mjabascal10

frontend/src/app/app-module/app-module-view/app-module-view.component.html

@@ -28,7 +28,9 @@ <h5 class="card-title label-header mb-0 text-uppercase label-header">
                            (showModuleIntegration)="showModule($event)"
                            class="module-card m-1">
       </app-app-module-card>
-    <app-utm-spinner class="position-absolute top-35 right-50"  [height]="'110px'" [loading]="(moduleResolver.loading$ | async)" [width]="'110px'"
+    <app-utm-spinner class="position-absolute top-35 right-50"
+                     [height]="'110px'"
+                     [loading]="(moduleResolver.loading$ | async)" [width]="'110px'"
                      label="Loading modules">
     </app-utm-spinner>
   </div>

frontend/src/app/app-module/guides/guide-crowdstrike/crowdstrike.steps.ts

@@ -3,8 +3,8 @@ import {COLLECTOR_MESSAGE, Step} from '../shared/step';
 export const CROWDSTRIKE_STEPS: Step[] = [
   {
     id: '1',
-    name: 'Open the main menu. Click the hamburger icon in the top‑left corner labeled "Open menu".' +
-      'Navigate to API management. Select **Support and resources** then **API Clients and Keys**.',
+    name: 'Navigate to the main view. Click the hamburger icon in the top‑left corner labeled "Open menu".' +
+          'Select <b>Support and resources</b> then <b>API Clients and Keys</b>.',
     content: {
       id: 'stepContent1',
       images: [{
@@ -15,8 +15,7 @@ export const CROWDSTRIKE_STEPS: Step[] = [
   },
   {
     id: '2',
-    name: 'Create a new API client. Click **Create API Client**, ' +
-      'provide a descriptive client name (used to identify event sources) and select the API scopes required for Event Streams.',
+    name: 'Create a new API client. Click <b>Create API Client</b>. ',
     content: {
       id: 'stepContent2',
       images: [{
@@ -27,7 +26,8 @@ export const CROWDSTRIKE_STEPS: Step[] = [
   },
   {
     id: '3',
-    name: 'Generate credentials. Click **Create** to generate the client credentials and endpoint information.',
+    name: 'Generate API credentials. Provide a descriptive client name (used to identify event sources) and select the API scopes required for Event Streams.' +
+      'Click <b>Create</b> to generate the client credentials and endpoint information.',
     content: {
       id: 'stepContent3',
       images: [{
@@ -38,7 +38,7 @@ export const CROWDSTRIKE_STEPS: Step[] = [
   },
   {
     id: '4',
-    name: 'Record the credentials securely. Note the **Client ID**, **Client Secret** and the **Base URL** for the selected region.',
+    name: 'Record the credentials securely. Note the <b>Client ID</b>, <b>Client Secret</b> and the <b>Base URL</b> for the selected region.',
     content: {
       id: 'stepContent4',
       images: [{

frontend/src/app/app-module/guides/guide-crowdstrike/guide-crowdstrike.component.html

@@ -6,9 +6,6 @@ <h4 class="card-title mb-0 text-primary">
   </div>
 
   <div class="card-body">
-    <div class="alert alert-warning alert-styled-right mb-3">
-      The UTMStack AS400 Collector communicate over ports 9000, 9001 and 50051. Please make sure these ports are open.
-    </div>
     <ol class="setup_list">
       <app-utm-list [items]="steps">
         <ng-template stepTemplateRef let-step>