Fix for Button Click in DetailedLogViewer

force-app/main/default/lwc/detailedLogViewer/detailedLogViewer.js

@@ -145,6 +145,10 @@ export default class DetailedLogViewer extends LightningElement {
     publish(this.messageContext, LOG_ANALYSIS_STATE, payload);
   }
   get LogHeaderDetails() {
+    console.log(
+      "[detailedLogViewer.js] LogHeaderDetails called with logId",
+      this.logId
+    );
     if (this.logId) {
       const size = this.idLimitMax - this.idLimitMin;
       const temp = size + (this.idLimitMin - parseInt(this.logId));

force-app/main/default/lwc/fileUploader/fileUploader.css

@@ -9,7 +9,9 @@
   border: 2px solid;
   position: relative;
 }
-
+.main-container {
+  background-color: white;
+}
 .loader::before {
   content: "";
   position: absolute;

force-app/main/default/lwc/fileUploader/fileUploader.html

@@ -14,49 +14,67 @@
     <b>Latest Updates</b>
     <b onclick={resetApp}>Analyze Log</b>
   </div>
-  <lightning-card variant="base" title="Upload File" if:false={responseState}>
-    <template lwc:if={renderUploader}>
-      <div class="slds-grid slds-wrap">
-        <div class="slds-col slds-size_6-of-12">
-          <div class="slds-var-m-around_medium">
-            <lightning-input
-              type="file"
-              label="Upload the .log / .txt file here"
-              accept={acceptedFormats}
-              onchange={handleFileUpload}
-              disabled={textAreaFilled}
-              style="text-align: center"
-            ></lightning-input>
-            <div lwc:if={fileUploaded} style="text-align: center">
-              <c-pill
-                pill-label={fileNameLabel}
-                icon-name="attachment"
-                remove-btn-txt="Remove File"
-                onremove={removeFileHandler}
-              ></c-pill>
+  <div class="main-container">
+    <template if:false={responseState}>
+      <template lwc:if={renderUploader}>
+        <c-splitscreen>
+          <div slot="left-content">
+            <div class="slds-var-m-around_medium">
+              <lightning-input
+                type="file"
+                label="Upload the .log / .txt file here"
+                accept={acceptedFormats}
+                onchange={handleFileUpload}
+                disabled={textAreaFilled}
+                style="text-align: center"
+              ></lightning-input>
+              <div lwc:if={fileUploaded} style="text-align: center">
+                <c-pill
+                  pill-label={fileNameLabel}
+                  icon-name="attachment"
+                  remove-btn-txt="Remove File"
+                  onremove={removeFileHandler}
+                ></c-pill>
+              </div>
             </div>
+            <!-- <div class="slds-clearfix" lwc:if={displayButton}> -->
+            <template lwc:if={fileUploaded}>
+              <div class="slds-clearfix">
+                <lightning-button
+                  variant="brand"
+                  class="slds-align_absolute-center fl-btn"
+                  label="Analyze Log"
+                  title="Click to analyze the log"
+                  onclick={handleSubmit}
+                  type="submit"
+                ></lightning-button>
+              </div>
+              <template lwc:if={loading}><div class="loader"></div></template>
+            </template>
+
+            <!-- </div> -->
           </div>
-        </div>
-        <div class="slds-col slds-size_6-of-12">
-          <c-input-as-text
-            is-file-uploaded={fileUploaded}
-            ontextareachange={textAreaChangeHandler}
-          ></c-input-as-text>
-        </div>
-      </div>
-      <div class="slds-clearfix" lwc:if={displayButton}>
-        <lightning-button
-          variant="brand"
-          class="slds-align_absolute-center fl-btn"
-          label="Analyze Log"
-          title="Click to analyze the log"
-          onclick={handleSubmit}
-          type="submit"
-        ></lightning-button>
-        <template lwc:if={loading}><div class="loader"></div></template>
-      </div>
+          <div slot="right-content">
+            <c-input-as-text
+              is-file-uploaded={fileUploaded}
+              ontextareachange={textAreaChangeHandler}
+            ></c-input-as-text>
+            <template lwc:if={textAreaFilled}>
+              <div class="slds-clearfix">
+                <lightning-button
+                  variant="brand"
+                  class="slds-align_absolute-center fl-btn"
+                  label="Analyze Log"
+                  title="Click to analyze the log"
+                  onclick={handleSubmit}
+                  type="submit"
+                ></lightning-button>
+              </div>
+              <template lwc:if={loading}><div class="loader"></div></template>
+            </template></div></c-splitscreen
+      ></template>
     </template>
-  </lightning-card>
+  </div>
   <template lwc:if={responseState}>
     <template lwc:if={fileUploaded}>
       <div class="slds-var-m-around_medium">

force-app/main/default/lwc/logLineWrapper/logLineWrapper.css

@@ -37,3 +37,15 @@
   line-clamp: 10;
   -webkit-line-clamp: 10;
 }
+
+.eventButton {
+  border-radius: 0px;
+  font-weight: 600;
+  font-size: small;
+}
+
+.slds-button:focus {
+  --webkit-box-shadow: none;
+  box-shadow: none;
+  outline: 0;
+}

force-app/main/default/lwc/logLineWrapper/logLineWrapper.html

@@ -164,12 +164,16 @@
             </td>
             <!-- Event Name -->
             <td class="slds-text-body_small slds-cell-wrap event-name">
-              <div title={line.type}>{line.type}</div>
+              <div title={line.type}>Unit</div>
             </td>
             <!-- Line Content -->
             <td class="slds-text-body_small slds-cell-wrap line-content">
               <div class="slds-line-clamp" title={line.name}>
-                <button class="slds-button slds-button_neutral">
+                <button
+                  class="slds-button eventButton"
+                  data-logid={line.unitId}
+                  onclick={openSubUnit}
+                >
                   {line.name}
                 </button>
               </div>

force-app/main/default/lwc/logLineWrapper/logLineWrapper.js

@@ -2,7 +2,8 @@ import { api, LightningElement, track, wire } from "lwc";
 import {
   subscribe,
   APPLICATION_SCOPE,
-  MessageContext
+  MessageContext,
+  publish
 } from "lightning/messageService";
 import LOG_ANALYSIS_STATE from "@salesforce/messageChannel/Log_Analysis_Viewer_State__c";
 /*
@@ -31,6 +32,7 @@ export default class LogLineWrapper extends LightningElement {
   @track logsArr = [];
 
   get logsArrData() {
+    // console.log("[logLineWrapper.js] logsArr:", JSON.stringify(this.logsArr));
     return this.logsArr;
   }
   connectedCallback() {
@@ -54,7 +56,22 @@ export default class LogLineWrapper extends LightningElement {
     this.logId = message.logId;
     this.prepareLogData();
   }
+  openSubUnit(event) {
+    // console.log(
+    //   "[logLineWrapper.js] Sub Unit open called logId:",
+    //   event.target.dataset.logid
+    // );
+    const temp = event.target.dataset.logid;
+    if (temp !== null || temp !== undefined) {
+      const payload = { logId: temp };
+      // console.log(
+      //   "[logLineWrapper.js] Publish called: ",
+      //   JSON.stringify(payload)
+      // );
 
+      publish(this.messageContext, LOG_ANALYSIS_STATE, payload);
+    }
+  }
   prepareLogData() {
     if (this.logId && this.logLinesData) {
       const parsedId = parseInt(this.logId, 10);
@@ -125,12 +142,12 @@ export default class LogLineWrapper extends LightningElement {
           //<!-- FLORL -->
           else if (logTemp.logLineData.type === "FLORL") {
             logTemp.eventClassComb = "slds-line-clamp florl";
-            console.log("No.of Rows: ", JSON.stringify(logTemp.logLineData));
+            // console.log("No.of Rows: ", JSON.stringify(logTemp.logLineData));
           }
           //<!-- FLOEL -->
           else if (logTemp.logLineData.type === "FLOEL") {
             logTemp.eventClassComb = "slds-line-clamp floel";
-            console.log("No.of Rows: ", JSON.stringify(logTemp.logLineData));
+            // console.log("No.of Rows: ", JSON.stringify(logTemp.logLineData));
           }
           log = logTemp;
         } else if (log.type === "unit") {