diff --git a/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable/ViewTable.js b/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable/ViewTable.js
index 037b21030c6f7fe9a6a05dd9e0c790ad3db08a52..8e6c385e41a92788b396e0b1904b7e2bad820aa7 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable/ViewTable.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable/ViewTable.js
@@ -2395,14 +2395,16 @@ function Table(props) {
                               index={_.findIndex(allColumns, { id: column.id })}
                               isDragDisabled={!!_.includes(fixedColumns, column.id)}>
                               {(provided, snapshot) => (
-                                <th role = {'tablehead'} className={_.includes(fixedColumns, column.id)?'fixed-column-td':'notfixed-column-td-'+column.id.replaceAll(' ','')} style={{display: 'flex'}}
+                                <th role = {'tablehead'} className={_.includes(fixedColumns, column.id)?'fixed-column-td':'notfixed-column-td-'+column.id.replaceAll(' ','')} 
                                     onClick={() => {
                                       if(!doServersideFilter) {
                                         if(!column.disableSortBy) {
                                           toggleBySorting({ 'id': column.id, desc: (column.isSortedDesc !== undefined ? !column.isSortedDesc : false) });
                                         }
                                       }
-                                    }}>
+                                  
+                                  }}>
+                                    <div style={{display:'flex',flexDirection:'row',height:'100%'}}>
                                   <div style={{display:'flex'}}>
                                     <div style={{display: 'grid',verticalAlign:'bottom'}}>
                                       <div {...column.getHeaderProps(column.getSortByToggleProps())} className={_.includes(fixedColumns, column.id)?'fixed-column':''}>
@@ -2431,7 +2433,8 @@ function Table(props) {
                                           {column.canFilter && column.Header !== 'Action' ? column.render('Filter') : null}
                                         </div>
                                       }
-                                    </div>
+
+                                  </div>
                                   </div>
                                   {_.includes(fixedColumns, column.id)?<></>:
                                     <div {...column.getResizerProps()}
@@ -2450,6 +2453,7 @@ function Table(props) {
                                     >
                                     </div>
                                   }
+                                                                      </div>
                                 </th>
                               )}
                             </Draggable>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/AffectedTasksSelector.test.js.snap b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/AffectedTasksSelector.test.js.snap
index 31070db1b069c417058e2c424691676769b96ef1..2d533510c4bfffeb95b25d262377da49174e66f8 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/AffectedTasksSelector.test.js.snap
+++ b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/AffectedTasksSelector.test.js.snap
@@ -781,509 +781,539 @@ exports[`AffectedTasksSelector   AffectedTasksSelector correctly with data and s
                   <th
                     class="fixed-column-td"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class="fixed-column"
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Select"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
+                            class="fixed-column"
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                           >
-                            <div>
-                              <input
-                                style="width: 15px; height: 15px;"
-                                title="Toggle All Rows Selected"
-                                type="checkbox"
-                              />
+                            <div
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Select"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                            >
+                              <div>
+                                <input
+                                  style="width: 15px; height: 15px;"
+                                  title="Toggle All Rows Selected"
+                                  type="checkbox"
+                                />
+                              </div>
                             </div>
                           </div>
+                          <div />
                         </div>
-                        <div />
                       </div>
                     </div>
                   </th>
                   <th
                     class="notfixed-column-td-ObservationStartTime"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Observation Start Time"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Observation Start Time"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Observation Start Time
-                            <i
-                              aria-hidden="true"
-                              class="pi pi-sort-down"
-                            />
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Observation Start Time"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Observation Start Time"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Observation Start Time
+                              <i
+                                aria-hidden="true"
+                                class="pi pi-sort-down"
+                              />
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ObservationEndTime"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Observation End Time"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Observation End Time"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Observation End Time
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Observation End Time"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Observation End Time"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Observation End Time
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-Project"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Project"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Project"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Project
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Project"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Project"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Project
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-SchedulingUnitId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Scheduling Unit Id"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Scheduling Unit Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Scheduling Unit Id
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Scheduling Unit Id"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Scheduling Unit Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Scheduling Unit Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-SchedulingUnitName"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Scheduling Unit Name"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Scheduling Unit Name
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Scheduling Unit Name"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Scheduling Unit Name
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-TaskId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Task Id"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Task Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Task Id
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Task Id"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Task Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Task Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ShortDescription"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Short Description"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Short Description"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Short Description
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Short Description"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Short Description"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Short Description
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-Name"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Name"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Name"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Name
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Name"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Name"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Name
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ControlId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Control Id"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Control Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Control Id
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Control Id"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Control Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Control Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                 </tr>
               </thead>
@@ -1877,509 +1907,539 @@ exports[`AffectedTasksSelector   AffectedTasksSelector correctly with data and s
                   <th
                     class="fixed-column-td"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class="fixed-column"
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Select"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
+                            class="fixed-column"
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                           >
-                            <div>
-                              <input
-                                style="width: 15px; height: 15px;"
-                                title="Toggle All Rows Selected"
-                                type="checkbox"
-                              />
+                            <div
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Select"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                            >
+                              <div>
+                                <input
+                                  style="width: 15px; height: 15px;"
+                                  title="Toggle All Rows Selected"
+                                  type="checkbox"
+                                />
+                              </div>
                             </div>
                           </div>
+                          <div />
                         </div>
-                        <div />
                       </div>
                     </div>
                   </th>
                   <th
                     class="notfixed-column-td-ObservationStartTime"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Observation Start Time"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Observation Start Time"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Observation Start Time
-                            <i
-                              aria-hidden="true"
-                              class="pi pi-sort-down"
-                            />
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Observation Start Time"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Observation Start Time"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Observation Start Time
+                              <i
+                                aria-hidden="true"
+                                class="pi pi-sort-down"
+                              />
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ObservationEndTime"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Observation End Time"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Observation End Time"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Observation End Time
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Observation End Time"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Observation End Time"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Observation End Time
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-Project"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Project"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Project"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Project
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Project"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Project"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Project
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-SchedulingUnitId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Scheduling Unit Id"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Scheduling Unit Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Scheduling Unit Id
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Scheduling Unit Id"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Scheduling Unit Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Scheduling Unit Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-SchedulingUnitName"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Scheduling Unit Name"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Scheduling Unit Name
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Scheduling Unit Name"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Scheduling Unit Name
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-TaskId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Task Id"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Task Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Task Id
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Task Id"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Task Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Task Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ShortDescription"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Short Description"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Short Description"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Short Description
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Short Description"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Short Description"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Short Description
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-Name"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Name"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Name"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Name
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Name"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Name"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Name
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ControlId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Control Id"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Control Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Control Id
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Control Id"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Control Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Control Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                 </tr>
               </thead>
@@ -2973,509 +3033,539 @@ exports[`AffectedTasksSelector   AffectedTasksSelector correctly with data and s
                   <th
                     class="fixed-column-td"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class="fixed-column"
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Select"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
+                            class="fixed-column"
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                           >
-                            <div>
-                              <input
-                                style="width: 15px; height: 15px;"
-                                title="Toggle All Rows Selected"
-                                type="checkbox"
-                              />
+                            <div
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Select"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                            >
+                              <div>
+                                <input
+                                  style="width: 15px; height: 15px;"
+                                  title="Toggle All Rows Selected"
+                                  type="checkbox"
+                                />
+                              </div>
                             </div>
                           </div>
+                          <div />
                         </div>
-                        <div />
                       </div>
                     </div>
                   </th>
                   <th
                     class="notfixed-column-td-ObservationStartTime"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Observation Start Time"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Observation Start Time"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Observation Start Time
-                            <i
-                              aria-hidden="true"
-                              class="pi pi-sort-down"
-                            />
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Observation Start Time"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Observation Start Time"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Observation Start Time
+                              <i
+                                aria-hidden="true"
+                                class="pi pi-sort-down"
+                              />
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ObservationEndTime"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Observation End Time"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Observation End Time"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Observation End Time
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Observation End Time"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Observation End Time"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Observation End Time
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-Project"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Project"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Project"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Project
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Project"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Project"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Project
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-SchedulingUnitId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Scheduling Unit Id"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Scheduling Unit Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Scheduling Unit Id
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Scheduling Unit Id"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Scheduling Unit Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Scheduling Unit Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-SchedulingUnitName"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Scheduling Unit Name"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Scheduling Unit Name
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Scheduling Unit Name"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Scheduling Unit Name
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-TaskId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Task Id"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Task Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Task Id
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Task Id"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Task Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Task Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ShortDescription"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Short Description"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Short Description"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Short Description
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Short Description"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Short Description"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Short Description
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-Name"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Name"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Name"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Name
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Name"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Name"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Name
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ControlId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-1-hidden-text-12"
-                            data-rbd-drag-handle-context-id="1"
-                            data-rbd-drag-handle-draggable-id="Control Id"
-                            data-rbd-draggable-context-id="1"
-                            data-rbd-draggable-id="Control Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Control Id
+                            <div
+                              aria-describedby="rbd-hidden-text-1-hidden-text-12"
+                              data-rbd-drag-handle-context-id="1"
+                              data-rbd-drag-handle-draggable-id="Control Id"
+                              data-rbd-draggable-context-id="1"
+                              data-rbd-draggable-id="Control Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Control Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                 </tr>
               </thead>
@@ -4114,509 +4204,539 @@ exports[`AffectedTasksSelector   Gets Suid from correct Node: After Search Butto
                   <th
                     class="fixed-column-td"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class="fixed-column"
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Select"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
+                            class="fixed-column"
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                           >
-                            <div>
-                              <input
-                                style="width: 15px; height: 15px;"
-                                title="Toggle All Rows Selected"
-                                type="checkbox"
-                              />
+                            <div
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Select"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                            >
+                              <div>
+                                <input
+                                  style="width: 15px; height: 15px;"
+                                  title="Toggle All Rows Selected"
+                                  type="checkbox"
+                                />
+                              </div>
                             </div>
                           </div>
+                          <div />
                         </div>
-                        <div />
                       </div>
                     </div>
                   </th>
                   <th
                     class="notfixed-column-td-ObservationStartTime"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                            data-rbd-drag-handle-context-id="0"
-                            data-rbd-drag-handle-draggable-id="Observation Start Time"
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Observation Start Time"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Observation Start Time
-                            <i
-                              aria-hidden="true"
-                              class="pi pi-sort-down"
-                            />
+                            <div
+                              aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                              data-rbd-drag-handle-context-id="0"
+                              data-rbd-drag-handle-draggable-id="Observation Start Time"
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Observation Start Time"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Observation Start Time
+                              <i
+                                aria-hidden="true"
+                                class="pi pi-sort-down"
+                              />
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ObservationEndTime"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                            data-rbd-drag-handle-context-id="0"
-                            data-rbd-drag-handle-draggable-id="Observation End Time"
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Observation End Time"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Observation End Time
+                            <div
+                              aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                              data-rbd-drag-handle-context-id="0"
+                              data-rbd-drag-handle-draggable-id="Observation End Time"
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Observation End Time"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Observation End Time
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-Project"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                            data-rbd-drag-handle-context-id="0"
-                            data-rbd-drag-handle-draggable-id="Project"
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Project"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Project
+                            <div
+                              aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                              data-rbd-drag-handle-context-id="0"
+                              data-rbd-drag-handle-draggable-id="Project"
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Project"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Project
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-SchedulingUnitId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                            data-rbd-drag-handle-context-id="0"
-                            data-rbd-drag-handle-draggable-id="Scheduling Unit Id"
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Scheduling Unit Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Scheduling Unit Id
+                            <div
+                              aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                              data-rbd-drag-handle-context-id="0"
+                              data-rbd-drag-handle-draggable-id="Scheduling Unit Id"
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Scheduling Unit Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Scheduling Unit Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-SchedulingUnitName"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                            data-rbd-drag-handle-context-id="0"
-                            data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Scheduling Unit Name"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Scheduling Unit Name
+                            <div
+                              aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                              data-rbd-drag-handle-context-id="0"
+                              data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Scheduling Unit Name"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Scheduling Unit Name
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-TaskId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                            data-rbd-drag-handle-context-id="0"
-                            data-rbd-drag-handle-draggable-id="Task Id"
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Task Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Task Id
+                            <div
+                              aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                              data-rbd-drag-handle-context-id="0"
+                              data-rbd-drag-handle-draggable-id="Task Id"
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Task Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Task Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ShortDescription"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                            data-rbd-drag-handle-context-id="0"
-                            data-rbd-drag-handle-draggable-id="Short Description"
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Short Description"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Short Description
+                            <div
+                              aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                              data-rbd-drag-handle-context-id="0"
+                              data-rbd-drag-handle-draggable-id="Short Description"
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Short Description"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Short Description
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-Name"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                            data-rbd-drag-handle-context-id="0"
-                            data-rbd-drag-handle-draggable-id="Name"
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Name"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Name
+                            <div
+                              aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                              data-rbd-drag-handle-context-id="0"
+                              data-rbd-drag-handle-draggable-id="Name"
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Name"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Name
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                   <th
                     class="notfixed-column-td-ControlId"
                     role="tablehead"
-                    style="display: flex;"
                   >
                     <div
-                      style="display: flex;"
+                      style="display: flex; flex-direction: row; height: 100%;"
                     >
                       <div
-                        style="display: grid; vertical-align: bottom;"
+                        style="display: flex;"
                       >
                         <div
-                          class=""
-                          colspan="1"
-                          role="columnheader"
-                          style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                          title="Toggle SortBy"
+                          style="display: grid; vertical-align: bottom;"
                         >
                           <div
-                            aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                            data-rbd-drag-handle-context-id="0"
-                            data-rbd-drag-handle-draggable-id="Control Id"
-                            data-rbd-draggable-context-id="0"
-                            data-rbd-draggable-id="Control Id"
-                            draggable="false"
-                            role="button"
-                            style="transform: translate(0,0); user-select: none; cursor: default;"
-                            tabindex="0"
+                            class=""
+                            colspan="1"
+                            role="columnheader"
+                            style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                            title="Toggle SortBy"
                           >
-                            Control Id
+                            <div
+                              aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                              data-rbd-drag-handle-context-id="0"
+                              data-rbd-drag-handle-draggable-id="Control Id"
+                              data-rbd-draggable-context-id="0"
+                              data-rbd-draggable-id="Control Id"
+                              draggable="false"
+                              role="button"
+                              style="transform: translate(0,0); user-select: none; cursor: default;"
+                              tabindex="0"
+                            >
+                              Control Id
+                            </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            class="table-filter"
-                            style="margin-right: 5px;"
-                          >
-                            <input
-                              title="Enter few characters and press ‘Enter’ key to search"
-                              value=""
-                            />
+                          <div>
+                            <div
+                              class="table-filter"
+                              style="margin-right: 5px;"
+                            >
+                              <input
+                                title="Enter few characters and press ‘Enter’ key to search"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <div
+                        class="resizer "
+                        draggable="false"
+                        role="separator"
+                        style="cursor: col-resize;"
+                      />
                     </div>
-                    <div
-                      class="resizer "
-                      draggable="false"
-                      role="separator"
-                      style="cursor: col-resize;"
-                    />
                   </th>
                 </tr>
               </thead>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/reservation.list.test.js.snap b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/reservation.list.test.js.snap
index d7ec4168a18025d81473ebf2536ba23223f7ba57..d86bc9d5d40d11f01f416c464fa33be7cb9c82cb 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/reservation.list.test.js.snap
+++ b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/reservation.list.test.js.snap
@@ -400,433 +400,431 @@ exports[`Reservation List  Reservation List  correctly with data 1`] = `
             <th
               class="fixed-column-td"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class="fixed-column"
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Select"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
+                      class="fixed-column"
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      <div>
-                        <input
-                          style="width: 15px; height: 15px;"
-                          title="Toggle All Rows Selected"
-                          type="checkbox"
-                        />
+                      <div
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Select"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                      >
+                        <div>
+                          <input
+                            style="width: 15px; height: 15px;"
+                            title="Toggle All Rows Selected"
+                            type="checkbox"
+                          />
+                        </div>
                       </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
               </div>
             </th>
             <th
               class="fixed-column-td"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class="fixed-column"
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Action"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
+                      class="fixed-column"
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Action
+                      <div
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Action"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                      >
+                        Action
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
               </div>
             </th>
             <th
               class="notfixed-column-td-SystemId"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="System Id"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="System Id"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      System Id
-                      <i
-                        aria-hidden="true"
-                        class="pi pi-sort-up"
-                      />
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="System Id"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="System Id"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        System Id
+                        <i
+                          aria-hidden="true"
+                          class="pi pi-sort-up"
+                        />
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Description"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Description"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Description"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Description
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Description"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Description"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Description
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-StartTime"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Start Time"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Start Time"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Start Time
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Start Time"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Start Time"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Start Time
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                    >
+                    <div>
                       <div
-                        class="flatpickr-range-filter"
-                        data-enable-time="true"
-                        data-input="true"
-                        title="Enter the date & time range to search and press ‘Ok’ button"
+                        class="table-filter"
                       >
-                        <input
-                          class="p-inputtext p-component calendar-input flatpickr-input"
+                        <div
+                          class="flatpickr-range-filter"
+                          data-enable-time="true"
                           data-input="true"
-                          type="text"
-                        />
-                        <button
-                          class="p-button p-component p-button-icon-only calendar-button"
-                          data-toggle="true"
-                          title="Click to select the date range"
+                          title="Enter the date & time range to search and press ‘Ok’ button"
                         >
-                          <i
-                            class="fas fa-calendar"
+                          <input
+                            class="p-inputtext p-component calendar-input flatpickr-input"
+                            data-input="true"
+                            type="text"
                           />
-                        </button>
-                        <button
-                          class="p-button p-component p-button-icon-only calendar-reset"
-                          title="Clear date range"
-                        >
-                          <i
-                            class="pi pi-times"
-                            style="color: white;"
-                          />
-                        </button>
+                          <button
+                            class="p-button p-component p-button-icon-only calendar-button"
+                            data-toggle="true"
+                            title="Click to select the date range"
+                          >
+                            <i
+                              class="fas fa-calendar"
+                            />
+                          </button>
+                          <button
+                            class="p-button p-component p-button-icon-only calendar-reset"
+                            title="Clear date range"
+                          >
+                            <i
+                              class="pi pi-times"
+                              style="color: white;"
+                            />
+                          </button>
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-EndTime"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="End Time"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="End Time"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      End Time
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="End Time"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="End Time"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        End Time
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                    >
+                    <div>
                       <div
-                        class="flatpickr-range-filter"
-                        data-enable-time="true"
-                        data-input="true"
-                        title="Enter the date & time range to search and press ‘Ok’ button"
+                        class="table-filter"
                       >
-                        <input
-                          class="p-inputtext p-component calendar-input flatpickr-input"
+                        <div
+                          class="flatpickr-range-filter"
+                          data-enable-time="true"
                           data-input="true"
-                          type="text"
-                        />
-                        <button
-                          class="p-button p-component p-button-icon-only calendar-button"
-                          data-toggle="true"
-                          title="Click to select the date range"
-                        >
-                          <i
-                            class="fas fa-calendar"
-                          />
-                        </button>
-                        <button
-                          class="p-button p-component p-button-icon-only calendar-reset"
-                          title="Clear date range"
+                          title="Enter the date & time range to search and press ‘Ok’ button"
                         >
-                          <i
-                            class="pi pi-times"
-                            style="color: white;"
+                          <input
+                            class="p-inputtext p-component calendar-input flatpickr-input"
+                            data-input="true"
+                            type="text"
                           />
-                        </button>
+                          <button
+                            class="p-button p-component p-button-icon-only calendar-button"
+                            data-toggle="true"
+                            title="Click to select the date range"
+                          >
+                            <i
+                              class="fas fa-calendar"
+                            />
+                          </button>
+                          <button
+                            class="p-button p-component p-button-icon-only calendar-reset"
+                            title="Clear date range"
+                          >
+                            <i
+                              class="pi pi-times"
+                              style="color: white;"
+                            />
+                          </button>
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Duration(DaysHH:mm:ss)"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Duration (Days HH:mm:ss)"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Duration (Days HH:mm:ss)"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Duration (Days HH:mm:ss)
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Duration (Days HH:mm:ss)"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Duration (Days HH:mm:ss)"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Duration (Days HH:mm:ss)
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      style="align-items: center;"
-                    >
-                      <div>
+                    <div>
+                      <div
+                        style="align-items: center;"
+                      >
                         <div>
-                          <div
-                            class="p-dropdown p-component p-inputwrapper p-dropdown-clearable p-inputwrapper-filled"
-                            data-pc-name="dropdown"
-                            data-pc-section="root"
-                            style="width: 10em;"
-                          >
-                            <div
-                              class="p-hidden-accessible"
-                              data-pc-section="hiddenselectedmessage"
-                            >
-                              <input
-                                aria-haspopup="listbox"
-                                data-pc-section="input"
-                                readonly=""
-                                type="text"
-                              />
-                            </div>
+                          <div>
                             <div
-                              class="p-hidden-accessible p-dropdown-hidden-select"
-                              data-pc-section="hiddenselectedmessage"
+                              class="p-dropdown p-component p-inputwrapper p-dropdown-clearable p-inputwrapper-filled"
+                              data-pc-name="dropdown"
+                              data-pc-section="root"
+                              style="width: 10em;"
                             >
-                              <select
-                                aria-hidden="true"
-                                data-pc-section="select"
-                                tabindex="-1"
+                              <div
+                                class="p-hidden-accessible"
+                                data-pc-section="hiddenselectedmessage"
+                              >
+                                <input
+                                  aria-haspopup="listbox"
+                                  data-pc-section="input"
+                                  readonly=""
+                                  type="text"
+                                />
+                              </div>
+                              <div
+                                class="p-hidden-accessible p-dropdown-hidden-select"
+                                data-pc-section="hiddenselectedmessage"
                               >
-                                <option
-                                  data-pc-section="option"
-                                  selected=""
-                                  value="All"
+                                <select
+                                  aria-hidden="true"
+                                  data-pc-section="select"
+                                  tabindex="-1"
                                 >
-                                  All
-                                </option>
-                              </select>
-                            </div>
-                            <span
-                              class="p-dropdown-label p-inputtext"
-                              data-pc-section="input"
-                            >
-                              All
-                            </span>
-                            <svg
-                              aria-hidden="true"
-                              class="p-icon p-dropdown-clear-icon p-clickable"
-                              data-pc-section="clearicon"
-                              fill="none"
-                              height="14"
-                              viewBox="0 0 14 14"
-                              width="14"
-                              xmlns="http://www.w3.org/2000/svg"
-                            >
-                              <path
-                                d="M8.01186 7.00933L12.27 2.75116C12.341 2.68501 12.398 2.60524 12.4375 2.51661C12.4769 2.42798 12.4982 2.3323 12.4999 2.23529C12.5016 2.13827 12.4838 2.0419 12.4474 1.95194C12.4111 1.86197 12.357 1.78024 12.2884 1.71163C12.2198 1.64302 12.138 1.58893 12.0481 1.55259C11.9581 1.51625 11.8617 1.4984 11.7647 1.50011C11.6677 1.50182 11.572 1.52306 11.4834 1.56255C11.3948 1.60204 11.315 1.65898 11.2488 1.72997L6.99067 5.98814L2.7325 1.72997C2.59553 1.60234 2.41437 1.53286 2.22718 1.53616C2.03999 1.53946 1.8614 1.61529 1.72901 1.74767C1.59663 1.88006 1.5208 2.05865 1.5175 2.24584C1.5142 2.43303 1.58368 2.61419 1.71131 2.75116L5.96948 7.00933L1.71131 11.2675C1.576 11.403 1.5 11.5866 1.5 11.7781C1.5 11.9696 1.576 12.1532 1.71131 12.2887C1.84679 12.424 2.03043 12.5 2.2219 12.5C2.41338 12.5 2.59702 12.424 2.7325 12.2887L6.99067 8.03052L11.2488 12.2887C11.3843 12.424 11.568 12.5 11.7594 12.5C11.9509 12.5 12.1346 12.424 12.27 12.2887C12.4053 12.1532 12.4813 11.9696 12.4813 11.7781C12.4813 11.5866 12.4053 11.403 12.27 11.2675L8.01186 7.00933Z"
-                                fill="currentColor"
-                              />
-                            </svg>
-                            <div
-                              aria-expanded="false"
-                              aria-haspopup="listbox"
-                              class="p-dropdown-trigger"
-                              data-pc-section="trigger"
-                              role="button"
-                            >
+                                  <option
+                                    data-pc-section="option"
+                                    selected=""
+                                    value="All"
+                                  >
+                                    All
+                                  </option>
+                                </select>
+                              </div>
+                              <span
+                                class="p-dropdown-label p-inputtext"
+                                data-pc-section="input"
+                              >
+                                All
+                              </span>
                               <svg
                                 aria-hidden="true"
-                                class="p-icon p-dropdown-trigger-icon p-clickable"
-                                data-pc-section="dropdownicon"
+                                class="p-icon p-dropdown-clear-icon p-clickable"
+                                data-pc-section="clearicon"
                                 fill="none"
                                 height="14"
                                 viewBox="0 0 14 14"
@@ -834,10 +832,33 @@ exports[`Reservation List  Reservation List  correctly with data 1`] = `
                                 xmlns="http://www.w3.org/2000/svg"
                               >
                                 <path
-                                  d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                  d="M8.01186 7.00933L12.27 2.75116C12.341 2.68501 12.398 2.60524 12.4375 2.51661C12.4769 2.42798 12.4982 2.3323 12.4999 2.23529C12.5016 2.13827 12.4838 2.0419 12.4474 1.95194C12.4111 1.86197 12.357 1.78024 12.2884 1.71163C12.2198 1.64302 12.138 1.58893 12.0481 1.55259C11.9581 1.51625 11.8617 1.4984 11.7647 1.50011C11.6677 1.50182 11.572 1.52306 11.4834 1.56255C11.3948 1.60204 11.315 1.65898 11.2488 1.72997L6.99067 5.98814L2.7325 1.72997C2.59553 1.60234 2.41437 1.53286 2.22718 1.53616C2.03999 1.53946 1.8614 1.61529 1.72901 1.74767C1.59663 1.88006 1.5208 2.05865 1.5175 2.24584C1.5142 2.43303 1.58368 2.61419 1.71131 2.75116L5.96948 7.00933L1.71131 11.2675C1.576 11.403 1.5 11.5866 1.5 11.7781C1.5 11.9696 1.576 12.1532 1.71131 12.2887C1.84679 12.424 2.03043 12.5 2.2219 12.5C2.41338 12.5 2.59702 12.424 2.7325 12.2887L6.99067 8.03052L11.2488 12.2887C11.3843 12.424 11.568 12.5 11.7594 12.5C11.9509 12.5 12.1346 12.424 12.27 12.2887C12.4053 12.1532 12.4813 11.9696 12.4813 11.7781C12.4813 11.5866 12.4053 11.403 12.27 11.2675L8.01186 7.00933Z"
                                   fill="currentColor"
                                 />
                               </svg>
+                              <div
+                                aria-expanded="false"
+                                aria-haspopup="listbox"
+                                class="p-dropdown-trigger"
+                                data-pc-section="trigger"
+                                role="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  class="p-icon p-dropdown-trigger-icon p-clickable"
+                                  data-pc-section="dropdownicon"
+                                  fill="none"
+                                  height="14"
+                                  viewBox="0 0 14 14"
+                                  width="14"
+                                  xmlns="http://www.w3.org/2000/svg"
+                                >
+                                  <path
+                                    d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -845,1034 +866,1073 @@ exports[`Reservation List  Reservation List  correctly with data 1`] = `
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-ReservationType"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Reservation Type"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Reservation Type"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Reservation Type
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Reservation Type"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Reservation Type"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Reservation Type
+                      </div>
                     </div>
-                  </div>
-                  <div>
                     <div>
-                      <select
-                        style="height: 24.2014px; border: 1px solid lightgrey;"
-                        title="Select a value from list to search"
-                      >
-                        <option
-                          value=""
-                        >
-                          All
-                        </option>
-                        <option
-                          value="maintenance"
-                        >
-                          Maintenance
-                        </option>
-                        <option
-                          value="test"
-                        >
-                          Test
-                        </option>
-                        <option
-                          value="upgrade"
-                        >
-                          Upgrade
-                        </option>
-                        <option
-                          value="outage"
-                        >
-                          Outage
-                        </option>
-                        <option
-                          value="pr"
-                        >
-                          Pr
-                        </option>
-                        <option
-                          value="stand-alone mode"
-                        >
-                          Stand Alone Mode
-                        </option>
-                        <option
-                          value="test system"
-                        >
-                          Test System
-                        </option>
-                        <option
-                          value="other"
-                        >
-                          Other
-                        </option>
-                        <option
-                          value="mowing"
-                        >
-                          Mowing
-                        </option>
-                        <option
-                          value="stopday"
-                        >
-                          Stopday
-                        </option>
-                        <option
-                          value="software rollout"
-                        >
-                          Software Rollout
-                        </option>
-                        <option
-                          value="windmill standstill"
+                      <div>
+                        <select
+                          style="height: 24.2014px; border: 1px solid lightgrey;"
+                          title="Select a value from list to search"
                         >
-                          Windmill Standstill
-                        </option>
-                      </select>
+                          <option
+                            value=""
+                          >
+                            All
+                          </option>
+                          <option
+                            value="maintenance"
+                          >
+                            Maintenance
+                          </option>
+                          <option
+                            value="test"
+                          >
+                            Test
+                          </option>
+                          <option
+                            value="upgrade"
+                          >
+                            Upgrade
+                          </option>
+                          <option
+                            value="outage"
+                          >
+                            Outage
+                          </option>
+                          <option
+                            value="pr"
+                          >
+                            Pr
+                          </option>
+                          <option
+                            value="stand-alone mode"
+                          >
+                            Stand Alone Mode
+                          </option>
+                          <option
+                            value="test system"
+                          >
+                            Test System
+                          </option>
+                          <option
+                            value="other"
+                          >
+                            Other
+                          </option>
+                          <option
+                            value="mowing"
+                          >
+                            Mowing
+                          </option>
+                          <option
+                            value="stopday"
+                          >
+                            Stopday
+                          </option>
+                          <option
+                            value="software rollout"
+                          >
+                            Software Rollout
+                          </option>
+                          <option
+                            value="windmill standstill"
+                          >
+                            Windmill Standstill
+                          </option>
+                        </select>
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Subject"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Subject"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Subject"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Subject
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Subject"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Subject"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Subject
+                      </div>
                     </div>
-                  </div>
-                  <div>
                     <div>
-                      <select
-                        style="height: 24.2014px; border: 1px solid lightgrey;"
-                        title="Select a value from list to search"
-                      >
-                        <option
-                          value=""
-                        >
-                          All
-                        </option>
-                        <option
-                          value="environment"
-                        >
-                          Environment
-                        </option>
-                        <option
-                          value="hardware"
-                        >
-                          Hardware
-                        </option>
-                        <option
-                          value="firmware"
-                        >
-                          Firmware
-                        </option>
-                        <option
-                          value="software"
-                        >
-                          Software
-                        </option>
-                        <option
-                          value="system"
-                        >
-                          System
-                        </option>
-                        <option
-                          value="network"
-                        >
-                          Network
-                        </option>
-                        <option
-                          value="nothing"
+                      <div>
+                        <select
+                          style="height: 24.2014px; border: 1px solid lightgrey;"
+                          title="Select a value from list to search"
                         >
-                          Nothing
-                        </option>
-                      </select>
+                          <option
+                            value=""
+                          >
+                            All
+                          </option>
+                          <option
+                            value="environment"
+                          >
+                            Environment
+                          </option>
+                          <option
+                            value="hardware"
+                          >
+                            Hardware
+                          </option>
+                          <option
+                            value="firmware"
+                          >
+                            Firmware
+                          </option>
+                          <option
+                            value="software"
+                          >
+                            Software
+                          </option>
+                          <option
+                            value="system"
+                          >
+                            System
+                          </option>
+                          <option
+                            value="network"
+                          >
+                            Network
+                          </option>
+                          <option
+                            value="nothing"
+                          >
+                            Nothing
+                          </option>
+                        </select>
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Planned"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Planned"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Planned"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Planned
-                    </div>
-                  </div>
-                  <div>
-                    <div>
                       <div
-                        class="p-tristatecheckbox p-checkbox p-component"
-                        data-pc-name="tristatecheckbox"
-                        data-pc-section="root"
-                        style="width: 15px; height: 24.2014px;"
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Planned"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Planned"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
                       >
+                        Planned
+                      </div>
+                    </div>
+                    <div>
+                      <div>
                         <div
-                          aria-checked="false"
-                          class="p-checkbox-box"
-                          data-pc-section="checkbox"
-                          role="checkbox"
-                          tabindex="0"
-                        />
+                          class="p-tristatecheckbox p-checkbox p-component"
+                          data-pc-name="tristatecheckbox"
+                          data-pc-section="root"
+                          style="width: 15px; height: 24.2014px;"
+                        >
+                          <div
+                            aria-checked="false"
+                            class="p-checkbox-box"
+                            data-pc-section="checkbox"
+                            role="checkbox"
+                            tabindex="0"
+                          />
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Stations"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Stations"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Stations"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Stations
-                    </div>
-                  </div>
-                  <div>
-                    <div>
                       <div
-                        class="flex "
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Stations"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Stations"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
                       >
+                        Stations
+                      </div>
+                    </div>
+                    <div>
+                      <div>
                         <div
-                          class="p-field-radiobutton"
+                          class="flex "
                         >
                           <div
-                            class="p-radiobutton p-component p-radiobutton-checked"
-                            data-pc-name="radiobutton"
-                            data-pc-section="root"
+                            class="p-field-radiobutton"
                           >
                             <div
-                              class="p-hidden-accessible"
-                              data-pc-section="hiddeninputwrapper"
+                              class="p-radiobutton p-component p-radiobutton-checked"
+                              data-pc-name="radiobutton"
+                              data-pc-section="root"
                             >
-                              <input
-                                checked=""
-                                data-pc-section="hiddeninput"
-                                id="filtertype1"
-                                name="filtertype"
-                                type="radio"
-                              />
+                              <div
+                                class="p-hidden-accessible"
+                                data-pc-section="hiddeninputwrapper"
+                              >
+                                <input
+                                  checked=""
+                                  data-pc-section="hiddeninput"
+                                  id="filtertype1"
+                                  name="filtertype"
+                                  type="radio"
+                                />
+                              </div>
+                              <div
+                                class="p-radiobutton-box p-highlight"
+                                data-pc-section="input"
+                              >
+                                <div
+                                  class="p-radiobutton-icon"
+                                  data-pc-section="icon"
+                                />
+                              </div>
                             </div>
+                            <label
+                              for="filtertype1"
+                            >
+                              Any
+                            </label>
+                          </div>
+                          <div
+                            class="p-field-radiobutton"
+                          >
                             <div
-                              class="p-radiobutton-box p-highlight"
-                              data-pc-section="input"
+                              class="p-radiobutton p-component"
+                              data-pc-name="radiobutton"
+                              data-pc-section="root"
                             >
                               <div
-                                class="p-radiobutton-icon"
-                                data-pc-section="icon"
-                              />
+                                class="p-hidden-accessible"
+                                data-pc-section="hiddeninputwrapper"
+                              >
+                                <input
+                                  data-pc-section="hiddeninput"
+                                  id="filtertype2"
+                                  name="filtertype"
+                                  type="radio"
+                                />
+                              </div>
+                              <div
+                                class="p-radiobutton-box"
+                                data-pc-section="input"
+                              >
+                                <div
+                                  class="p-radiobutton-icon"
+                                  data-pc-section="icon"
+                                />
+                              </div>
                             </div>
+                            <label
+                              for="filtertype2"
+                            >
+                              All
+                            </label>
                           </div>
-                          <label
-                            for="filtertype1"
-                          >
-                            Any
-                          </label>
                         </div>
                         <div
-                          class="p-field-radiobutton"
+                          style="position: relative; display: flex;"
                         >
                           <div
-                            class="p-radiobutton p-component"
-                            data-pc-name="radiobutton"
+                            class="p-multiselect p-component p-inputwrapper multi-select"
+                            data-pc-name="multiselect"
                             data-pc-section="root"
+                            data-testid="multi-select"
+                            id="multi-select"
+                            style="width: 95%;"
                           >
                             <div
                               class="p-hidden-accessible"
                               data-pc-section="hiddeninputwrapper"
                             >
                               <input
-                                data-pc-section="hiddeninput"
-                                id="filtertype2"
-                                name="filtertype"
-                                type="radio"
+                                aria-expanded="false"
+                                data-pc-section="input"
+                                readonly=""
+                                role="listbox"
+                                tabindex="0"
+                                type="text"
                               />
                             </div>
                             <div
-                              class="p-radiobutton-box"
-                              data-pc-section="input"
+                              class="p-multiselect-label-container"
+                              data-pc-section="labelcontainer"
                             >
                               <div
-                                class="p-radiobutton-icon"
-                                data-pc-section="icon"
-                              />
+                                class="p-multiselect-label p-multiselect-label-empty"
+                                data-pc-section="label"
+                              >
+                                empty
+                              </div>
                             </div>
-                          </div>
-                          <label
-                            for="filtertype2"
-                          >
-                            All
-                          </label>
-                        </div>
-                      </div>
-                      <div
-                        style="position: relative; display: flex;"
-                      >
-                        <div
-                          class="p-multiselect p-component p-inputwrapper multi-select"
-                          data-pc-name="multiselect"
-                          data-pc-section="root"
-                          data-testid="multi-select"
-                          id="multi-select"
-                          style="width: 95%;"
-                        >
-                          <div
-                            class="p-hidden-accessible"
-                            data-pc-section="hiddeninputwrapper"
-                          >
-                            <input
-                              aria-expanded="false"
-                              data-pc-section="input"
-                              readonly=""
-                              role="listbox"
-                              tabindex="0"
-                              type="text"
-                            />
-                          </div>
-                          <div
-                            class="p-multiselect-label-container"
-                            data-pc-section="labelcontainer"
-                          >
                             <div
-                              class="p-multiselect-label p-multiselect-label-empty"
-                              data-pc-section="label"
+                              class="p-multiselect-trigger"
+                              data-pc-section="trigger"
                             >
-                              empty
+                              <svg
+                                aria-hidden="true"
+                                class="p-icon p-multiselect-trigger-icon p-c"
+                                data-pc-section="triggericon"
+                                fill="none"
+                                height="14"
+                                viewBox="0 0 14 14"
+                                width="14"
+                                xmlns="http://www.w3.org/2000/svg"
+                              >
+                                <path
+                                  d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                  fill="currentColor"
+                                />
+                              </svg>
                             </div>
                           </div>
-                          <div
-                            class="p-multiselect-trigger"
-                            data-pc-section="trigger"
+                          <button
+                            class="p-link"
                           >
-                            <svg
-                              aria-hidden="true"
-                              class="p-icon p-multiselect-trigger-icon p-c"
-                              data-pc-section="triggericon"
-                              fill="none"
-                              height="14"
-                              viewBox="0 0 14 14"
-                              width="14"
-                              xmlns="http://www.w3.org/2000/svg"
-                            >
-                              <path
-                                d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                fill="currentColor"
-                              />
-                            </svg>
-                          </div>
+                            <i
+                              class="pi pi-search search-btn"
+                            />
+                          </button>
                         </div>
-                        <button
-                          class="p-link"
-                        >
-                          <i
-                            class="pi pi-search search-btn"
-                          />
-                        </button>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-FixedTime"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="FixedTime"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="FixedTime"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      FixedTime
-                    </div>
-                  </div>
-                  <div>
-                    <div>
                       <div
-                        class="p-tristatecheckbox p-checkbox p-component"
-                        data-pc-name="tristatecheckbox"
-                        data-pc-section="root"
-                        style="width: 15px; height: 24.2014px;"
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="FixedTime"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="FixedTime"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
                       >
+                        FixedTime
+                      </div>
+                    </div>
+                    <div>
+                      <div>
                         <div
-                          aria-checked="false"
-                          class="p-checkbox-box"
-                          data-pc-section="checkbox"
-                          role="checkbox"
-                          tabindex="0"
-                        />
+                          class="p-tristatecheckbox p-checkbox p-component"
+                          data-pc-name="tristatecheckbox"
+                          data-pc-section="root"
+                          style="width: 15px; height: 24.2014px;"
+                        >
+                          <div
+                            aria-checked="false"
+                            class="p-checkbox-box"
+                            data-pc-section="checkbox"
+                            role="checkbox"
+                            tabindex="0"
+                          />
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Dynamic"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Dynamic"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Dynamic"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Dynamic
-                    </div>
-                  </div>
-                  <div>
-                    <div>
                       <div
-                        class="p-tristatecheckbox p-checkbox p-component"
-                        data-pc-name="tristatecheckbox"
-                        data-pc-section="root"
-                        style="width: 15px; height: 24.2014px;"
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Dynamic"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Dynamic"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
                       >
+                        Dynamic
+                      </div>
+                    </div>
+                    <div>
+                      <div>
                         <div
-                          aria-checked="false"
-                          class="p-checkbox-box"
-                          data-pc-section="checkbox"
-                          role="checkbox"
-                          tabindex="0"
-                        />
+                          class="p-tristatecheckbox p-checkbox p-component"
+                          data-pc-name="tristatecheckbox"
+                          data-pc-section="root"
+                          style="width: 15px; height: 24.2014px;"
+                        >
+                          <div
+                            aria-checked="false"
+                            class="p-checkbox-box"
+                            data-pc-section="checkbox"
+                            role="checkbox"
+                            tabindex="0"
+                          />
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Fixedproject"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Fixed project"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Fixed project"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Fixed project
-                    </div>
-                  </div>
-                  <div>
-                    <div>
                       <div
-                        class="p-tristatecheckbox p-checkbox p-component"
-                        data-pc-name="tristatecheckbox"
-                        data-pc-section="root"
-                        style="width: 15px; height: 24.2014px;"
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Fixed project"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Fixed project"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
                       >
+                        Fixed project
+                      </div>
+                    </div>
+                    <div>
+                      <div>
                         <div
-                          aria-checked="false"
-                          class="p-checkbox-box"
-                          data-pc-section="checkbox"
-                          role="checkbox"
-                          tabindex="0"
-                        />
+                          class="p-tristatecheckbox p-checkbox p-component"
+                          data-pc-name="tristatecheckbox"
+                          data-pc-section="root"
+                          style="width: 15px; height: 24.2014px;"
+                        >
+                          <div
+                            aria-checked="false"
+                            class="p-checkbox-box"
+                            data-pc-section="checkbox"
+                            role="checkbox"
+                            tabindex="0"
+                          />
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Project"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Project"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Project"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Project
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Project"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Project"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Project
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Expert"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Expert"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Expert"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Expert
-                    </div>
-                  </div>
-                  <div>
-                    <div>
                       <div
-                        class="p-tristatecheckbox p-checkbox p-component"
-                        data-pc-name="tristatecheckbox"
-                        data-pc-section="root"
-                        style="width: 15px; height: 24.2014px;"
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Expert"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Expert"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
                       >
+                        Expert
+                      </div>
+                    </div>
+                    <div>
+                      <div>
                         <div
-                          aria-checked="false"
-                          class="p-checkbox-box"
-                          data-pc-section="checkbox"
-                          role="checkbox"
-                          tabindex="0"
-                        />
+                          class="p-tristatecheckbox p-checkbox p-component"
+                          data-pc-name="tristatecheckbox"
+                          data-pc-section="root"
+                          style="width: 15px; height: 24.2014px;"
+                        >
+                          <div
+                            aria-checked="false"
+                            class="p-checkbox-box"
+                            data-pc-section="checkbox"
+                            role="checkbox"
+                            tabindex="0"
+                          />
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-HBA-RFI"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="HBA-RFI"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="HBA-RFI"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      HBA-RFI
-                    </div>
-                  </div>
-                  <div>
-                    <div>
                       <div
-                        class="p-tristatecheckbox p-checkbox p-component"
-                        data-pc-name="tristatecheckbox"
-                        data-pc-section="root"
-                        style="width: 15px; height: 24.2014px;"
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="HBA-RFI"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="HBA-RFI"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
                       >
+                        HBA-RFI
+                      </div>
+                    </div>
+                    <div>
+                      <div>
                         <div
-                          aria-checked="false"
-                          class="p-checkbox-box"
-                          data-pc-section="checkbox"
-                          role="checkbox"
-                          tabindex="0"
-                        />
+                          class="p-tristatecheckbox p-checkbox p-component"
+                          data-pc-name="tristatecheckbox"
+                          data-pc-section="root"
+                          style="width: 15px; height: 24.2014px;"
+                        >
+                          <div
+                            aria-checked="false"
+                            class="p-checkbox-box"
+                            data-pc-section="checkbox"
+                            role="checkbox"
+                            tabindex="0"
+                          />
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-LBA-RFI"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="LBA-RFI"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="LBA-RFI"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      LBA-RFI
-                    </div>
-                  </div>
-                  <div>
-                    <div>
                       <div
-                        class="p-tristatecheckbox p-checkbox p-component"
-                        data-pc-name="tristatecheckbox"
-                        data-pc-section="root"
-                        style="width: 15px; height: 24.2014px;"
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="LBA-RFI"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="LBA-RFI"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
                       >
+                        LBA-RFI
+                      </div>
+                    </div>
+                    <div>
+                      <div>
                         <div
-                          aria-checked="false"
-                          class="p-checkbox-box"
-                          data-pc-section="checkbox"
-                          role="checkbox"
-                          tabindex="0"
-                        />
+                          class="p-tristatecheckbox p-checkbox p-component"
+                          data-pc-name="tristatecheckbox"
+                          data-pc-section="root"
+                          style="width: 15px; height: 24.2014px;"
+                        >
+                          <div
+                            aria-checked="false"
+                            class="p-checkbox-box"
+                            data-pc-section="checkbox"
+                            role="checkbox"
+                            tabindex="0"
+                          />
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Createdat"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Created at"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Created at"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Created at
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Created at"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Created at"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Created at
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                    >
-                      <span
-                        class="p-calendar p-component p-inputwrapper p-calendar-w-btn p-calendar-w-btn-right"
-                        data-pc-name="calendar"
-                        data-pc-section="root"
+                    <div>
+                      <div
+                        class="table-filter"
                       >
-                        <input
-                          autocomplete="off"
-                          class="p-inputtext p-component"
-                          data-pc-name="inputtext"
+                        <span
+                          class="p-calendar p-component p-inputwrapper p-calendar-w-btn p-calendar-w-btn-right"
+                          data-pc-name="calendar"
                           data-pc-section="root"
-                          inputmode="none"
-                          type="text"
-                        />
-                        <button
-                          class="p-button p-component p-datepicker-trigger p-button-icon-only"
-                          data-pc-name="button"
-                          data-pc-section="root"
-                          tabindex="-1"
-                          type="button"
                         >
-                          <svg
-                            aria-hidden="true"
-                            class="p-icon"
-                            fill="none"
-                            height="14"
-                            viewBox="0 0 14 14"
-                            width="14"
-                            xmlns="http://www.w3.org/2000/svg"
-                          >
-                            <path
-                              d="M10.7838 1.51351H9.83783V0.567568C9.83783 0.417039 9.77804 0.272676 9.6716 0.166237C9.56516 0.0597971 9.42079 0 9.27027 0C9.11974 0 8.97538 0.0597971 8.86894 0.166237C8.7625 0.272676 8.7027 0.417039 8.7027 0.567568V1.51351H5.29729V0.567568C5.29729 0.417039 5.2375 0.272676 5.13106 0.166237C5.02462 0.0597971 4.88025 0 4.72973 0C4.5792 0 4.43484 0.0597971 4.3284 0.166237C4.22196 0.272676 4.16216 0.417039 4.16216 0.567568V1.51351H3.21621C2.66428 1.51351 2.13494 1.73277 1.74467 2.12305C1.35439 2.51333 1.13513 3.04266 1.13513 3.59459V11.9189C1.13513 12.4709 1.35439 13.0002 1.74467 13.3905C2.13494 13.7807 2.66428 14 3.21621 14H10.7838C11.3357 14 11.865 13.7807 12.2553 13.3905C12.6456 13.0002 12.8649 12.4709 12.8649 11.9189V3.59459C12.8649 3.04266 12.6456 2.51333 12.2553 2.12305C11.865 1.73277 11.3357 1.51351 10.7838 1.51351ZM3.21621 2.64865H4.16216V3.59459C4.16216 3.74512 4.22196 3.88949 4.3284 3.99593C4.43484 4.10237 4.5792 4.16216 4.72973 4.16216C4.88025 4.16216 5.02462 4.10237 5.13106 3.99593C5.2375 3.88949 5.29729 3.74512 5.29729 3.59459V2.64865H8.7027V3.59459C8.7027 3.74512 8.7625 3.88949 8.86894 3.99593C8.97538 4.10237 9.11974 4.16216 9.27027 4.16216C9.42079 4.16216 9.56516 4.10237 9.6716 3.99593C9.77804 3.88949 9.83783 3.74512 9.83783 3.59459V2.64865H10.7838C11.0347 2.64865 11.2753 2.74831 11.4527 2.92571C11.6301 3.10311 11.7297 3.34371 11.7297 3.59459V5.67568H2.27027V3.59459C2.27027 3.34371 2.36993 3.10311 2.54733 2.92571C2.72473 2.74831 2.96533 2.64865 3.21621 2.64865ZM10.7838 12.8649H3.21621C2.96533 12.8649 2.72473 12.7652 2.54733 12.5878C2.36993 12.4104 2.27027 12.1698 2.27027 11.9189V6.81081H11.7297V11.9189C11.7297 12.1698 11.6301 12.4104 11.4527 12.5878C11.2753 12.7652 11.0347 12.8649 10.7838 12.8649Z"
-                              fill="currentColor"
-                            />
-                          </svg>
-                          <span
-                            class="p-button-label p-c"
+                          <input
+                            autocomplete="off"
+                            class="p-inputtext p-component"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            inputmode="none"
+                            type="text"
+                          />
+                          <button
+                            class="p-button p-component p-datepicker-trigger p-button-icon-only"
+                            data-pc-name="button"
+                            data-pc-section="root"
+                            tabindex="-1"
+                            type="button"
                           >
-                             
-                          </span>
-                        </button>
-                      </span>
+                            <svg
+                              aria-hidden="true"
+                              class="p-icon"
+                              fill="none"
+                              height="14"
+                              viewBox="0 0 14 14"
+                              width="14"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M10.7838 1.51351H9.83783V0.567568C9.83783 0.417039 9.77804 0.272676 9.6716 0.166237C9.56516 0.0597971 9.42079 0 9.27027 0C9.11974 0 8.97538 0.0597971 8.86894 0.166237C8.7625 0.272676 8.7027 0.417039 8.7027 0.567568V1.51351H5.29729V0.567568C5.29729 0.417039 5.2375 0.272676 5.13106 0.166237C5.02462 0.0597971 4.88025 0 4.72973 0C4.5792 0 4.43484 0.0597971 4.3284 0.166237C4.22196 0.272676 4.16216 0.417039 4.16216 0.567568V1.51351H3.21621C2.66428 1.51351 2.13494 1.73277 1.74467 2.12305C1.35439 2.51333 1.13513 3.04266 1.13513 3.59459V11.9189C1.13513 12.4709 1.35439 13.0002 1.74467 13.3905C2.13494 13.7807 2.66428 14 3.21621 14H10.7838C11.3357 14 11.865 13.7807 12.2553 13.3905C12.6456 13.0002 12.8649 12.4709 12.8649 11.9189V3.59459C12.8649 3.04266 12.6456 2.51333 12.2553 2.12305C11.865 1.73277 11.3357 1.51351 10.7838 1.51351ZM3.21621 2.64865H4.16216V3.59459C4.16216 3.74512 4.22196 3.88949 4.3284 3.99593C4.43484 4.10237 4.5792 4.16216 4.72973 4.16216C4.88025 4.16216 5.02462 4.10237 5.13106 3.99593C5.2375 3.88949 5.29729 3.74512 5.29729 3.59459V2.64865H8.7027V3.59459C8.7027 3.74512 8.7625 3.88949 8.86894 3.99593C8.97538 4.10237 9.11974 4.16216 9.27027 4.16216C9.42079 4.16216 9.56516 4.10237 9.6716 3.99593C9.77804 3.88949 9.83783 3.74512 9.83783 3.59459V2.64865H10.7838C11.0347 2.64865 11.2753 2.74831 11.4527 2.92571C11.6301 3.10311 11.7297 3.34371 11.7297 3.59459V5.67568H2.27027V3.59459C2.27027 3.34371 2.36993 3.10311 2.54733 2.92571C2.72473 2.74831 2.96533 2.64865 3.21621 2.64865ZM10.7838 12.8649H3.21621C2.96533 12.8649 2.72473 12.7652 2.54733 12.5878C2.36993 12.4104 2.27027 12.1698 2.27027 11.9189V6.81081H11.7297V11.9189C11.7297 12.1698 11.6301 12.4104 11.4527 12.5878C11.2753 12.7652 11.0347 12.8649 10.7838 12.8649Z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                            <span
+                              class="p-button-label p-c"
+                            >
+                               
+                            </span>
+                          </button>
+                        </span>
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Updatedat"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Updated at"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Updated at"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Updated at
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Updated at"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Updated at"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Updated at
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                    >
-                      <span
-                        class="p-calendar p-component p-inputwrapper p-calendar-w-btn p-calendar-w-btn-right"
-                        data-pc-name="calendar"
-                        data-pc-section="root"
+                    <div>
+                      <div
+                        class="table-filter"
                       >
-                        <input
-                          autocomplete="off"
-                          class="p-inputtext p-component"
-                          data-pc-name="inputtext"
+                        <span
+                          class="p-calendar p-component p-inputwrapper p-calendar-w-btn p-calendar-w-btn-right"
+                          data-pc-name="calendar"
                           data-pc-section="root"
-                          inputmode="none"
-                          type="text"
-                        />
-                        <button
-                          class="p-button p-component p-datepicker-trigger p-button-icon-only"
-                          data-pc-name="button"
-                          data-pc-section="root"
-                          tabindex="-1"
-                          type="button"
                         >
-                          <svg
-                            aria-hidden="true"
-                            class="p-icon"
-                            fill="none"
-                            height="14"
-                            viewBox="0 0 14 14"
-                            width="14"
-                            xmlns="http://www.w3.org/2000/svg"
-                          >
-                            <path
-                              d="M10.7838 1.51351H9.83783V0.567568C9.83783 0.417039 9.77804 0.272676 9.6716 0.166237C9.56516 0.0597971 9.42079 0 9.27027 0C9.11974 0 8.97538 0.0597971 8.86894 0.166237C8.7625 0.272676 8.7027 0.417039 8.7027 0.567568V1.51351H5.29729V0.567568C5.29729 0.417039 5.2375 0.272676 5.13106 0.166237C5.02462 0.0597971 4.88025 0 4.72973 0C4.5792 0 4.43484 0.0597971 4.3284 0.166237C4.22196 0.272676 4.16216 0.417039 4.16216 0.567568V1.51351H3.21621C2.66428 1.51351 2.13494 1.73277 1.74467 2.12305C1.35439 2.51333 1.13513 3.04266 1.13513 3.59459V11.9189C1.13513 12.4709 1.35439 13.0002 1.74467 13.3905C2.13494 13.7807 2.66428 14 3.21621 14H10.7838C11.3357 14 11.865 13.7807 12.2553 13.3905C12.6456 13.0002 12.8649 12.4709 12.8649 11.9189V3.59459C12.8649 3.04266 12.6456 2.51333 12.2553 2.12305C11.865 1.73277 11.3357 1.51351 10.7838 1.51351ZM3.21621 2.64865H4.16216V3.59459C4.16216 3.74512 4.22196 3.88949 4.3284 3.99593C4.43484 4.10237 4.5792 4.16216 4.72973 4.16216C4.88025 4.16216 5.02462 4.10237 5.13106 3.99593C5.2375 3.88949 5.29729 3.74512 5.29729 3.59459V2.64865H8.7027V3.59459C8.7027 3.74512 8.7625 3.88949 8.86894 3.99593C8.97538 4.10237 9.11974 4.16216 9.27027 4.16216C9.42079 4.16216 9.56516 4.10237 9.6716 3.99593C9.77804 3.88949 9.83783 3.74512 9.83783 3.59459V2.64865H10.7838C11.0347 2.64865 11.2753 2.74831 11.4527 2.92571C11.6301 3.10311 11.7297 3.34371 11.7297 3.59459V5.67568H2.27027V3.59459C2.27027 3.34371 2.36993 3.10311 2.54733 2.92571C2.72473 2.74831 2.96533 2.64865 3.21621 2.64865ZM10.7838 12.8649H3.21621C2.96533 12.8649 2.72473 12.7652 2.54733 12.5878C2.36993 12.4104 2.27027 12.1698 2.27027 11.9189V6.81081H11.7297V11.9189C11.7297 12.1698 11.6301 12.4104 11.4527 12.5878C11.2753 12.7652 11.0347 12.8649 10.7838 12.8649Z"
-                              fill="currentColor"
-                            />
-                          </svg>
-                          <span
-                            class="p-button-label p-c"
+                          <input
+                            autocomplete="off"
+                            class="p-inputtext p-component"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            inputmode="none"
+                            type="text"
+                          />
+                          <button
+                            class="p-button p-component p-datepicker-trigger p-button-icon-only"
+                            data-pc-name="button"
+                            data-pc-section="root"
+                            tabindex="-1"
+                            type="button"
                           >
-                             
-                          </span>
-                        </button>
-                      </span>
+                            <svg
+                              aria-hidden="true"
+                              class="p-icon"
+                              fill="none"
+                              height="14"
+                              viewBox="0 0 14 14"
+                              width="14"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M10.7838 1.51351H9.83783V0.567568C9.83783 0.417039 9.77804 0.272676 9.6716 0.166237C9.56516 0.0597971 9.42079 0 9.27027 0C9.11974 0 8.97538 0.0597971 8.86894 0.166237C8.7625 0.272676 8.7027 0.417039 8.7027 0.567568V1.51351H5.29729V0.567568C5.29729 0.417039 5.2375 0.272676 5.13106 0.166237C5.02462 0.0597971 4.88025 0 4.72973 0C4.5792 0 4.43484 0.0597971 4.3284 0.166237C4.22196 0.272676 4.16216 0.417039 4.16216 0.567568V1.51351H3.21621C2.66428 1.51351 2.13494 1.73277 1.74467 2.12305C1.35439 2.51333 1.13513 3.04266 1.13513 3.59459V11.9189C1.13513 12.4709 1.35439 13.0002 1.74467 13.3905C2.13494 13.7807 2.66428 14 3.21621 14H10.7838C11.3357 14 11.865 13.7807 12.2553 13.3905C12.6456 13.0002 12.8649 12.4709 12.8649 11.9189V3.59459C12.8649 3.04266 12.6456 2.51333 12.2553 2.12305C11.865 1.73277 11.3357 1.51351 10.7838 1.51351ZM3.21621 2.64865H4.16216V3.59459C4.16216 3.74512 4.22196 3.88949 4.3284 3.99593C4.43484 4.10237 4.5792 4.16216 4.72973 4.16216C4.88025 4.16216 5.02462 4.10237 5.13106 3.99593C5.2375 3.88949 5.29729 3.74512 5.29729 3.59459V2.64865H8.7027V3.59459C8.7027 3.74512 8.7625 3.88949 8.86894 3.99593C8.97538 4.10237 9.11974 4.16216 9.27027 4.16216C9.42079 4.16216 9.56516 4.10237 9.6716 3.99593C9.77804 3.88949 9.83783 3.74512 9.83783 3.59459V2.64865H10.7838C11.0347 2.64865 11.2753 2.74831 11.4527 2.92571C11.6301 3.10311 11.7297 3.34371 11.7297 3.59459V5.67568H2.27027V3.59459C2.27027 3.34371 2.36993 3.10311 2.54733 2.92571C2.72473 2.74831 2.96533 2.64865 3.21621 2.64865ZM10.7838 12.8649H3.21621C2.96533 12.8649 2.72473 12.7652 2.54733 12.5878C2.36993 12.4104 2.27027 12.1698 2.27027 11.9189V6.81081H11.7297V11.9189C11.7297 12.1698 11.6301 12.4104 11.4527 12.5878C11.2753 12.7652 11.0347 12.8649 10.7838 12.8649Z"
+                                fill="currentColor"
+                              />
+                            </svg>
+                            <span
+                              class="p-button-label p-c"
+                            >
+                               
+                            </span>
+                          </button>
+                        </span>
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
           </tr>
         </thead>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/schedulingunit.list.test.js.snap b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/schedulingunit.list.test.js.snap
index a0152c05790de6d8ce31aa942483c76d440924a6..a69eb58edd65fbe899788bf32b35bd0116245f8e 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/schedulingunit.list.test.js.snap
+++ b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/schedulingunit.list.test.js.snap
@@ -497,927 +497,987 @@ exports[`Schedulinng Unit List  Schedulinng List  correctly with data 1`] = `
             <th
               class="fixed-column-td"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class="fixed-column"
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Select"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
+                      class="fixed-column"
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      <div>
-                        <input
-                          style="width: 15px; height: 15px;"
-                          title="Toggle All Rows Selected"
-                          type="checkbox"
-                        />
+                      <div
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Select"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                      >
+                        <div>
+                          <input
+                            style="width: 15px; height: 15px;"
+                            title="Toggle All Rows Selected"
+                            type="checkbox"
+                          />
+                        </div>
                       </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
               </div>
             </th>
             <th
               class="fixed-column-td"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class="fixed-column"
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Action"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
+                      class="fixed-column"
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Action
+                      <div
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Action"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                      >
+                        Action
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
               </div>
             </th>
             <th
               class="notfixed-column-td-SchedulingUnitID"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Scheduling Unit ID"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Scheduling Unit ID"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Scheduling Unit ID
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Scheduling Unit ID"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Scheduling Unit ID"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Scheduling Unit ID
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Project"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Project"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Project"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Project
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Project"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Project"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Project
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Name"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Name"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Name"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Name
-                      <i
-                        aria-hidden="true"
-                        class="pi pi-sort-up"
-                      />
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Name"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Name"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Name
+                        <i
+                          aria-hidden="true"
+                          class="pi pi-sort-up"
+                        />
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Description"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Description"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Description"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Description
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Description"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Description"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Description
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-ProjectRank"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Project Rank"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Project Rank"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Project Rank
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Project Rank"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Project Rank"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Project Rank
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-PriorityQueue"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Priority Queue"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Priority Queue"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Priority Queue
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Priority Queue"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Priority Queue"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Priority Queue
+                      </div>
                     </div>
-                  </div>
-                  <div>
                     <div>
-                      <select
-                        style="height: 24.2014px; border: 1px solid lightgrey;"
-                        title="Select a value from list to search"
-                      >
-                        <option
-                          value=""
-                        >
-                          All
-                        </option>
-                        <option
-                          value="A"
-                        >
-                          A
-                        </option>
-                        <option
-                          value="B"
+                      <div>
+                        <select
+                          style="height: 24.2014px; border: 1px solid lightgrey;"
+                          title="Select a value from list to search"
                         >
-                          B
-                        </option>
-                      </select>
+                          <option
+                            value=""
+                          >
+                            All
+                          </option>
+                          <option
+                            value="A"
+                          >
+                            A
+                          </option>
+                          <option
+                            value="B"
+                          >
+                            B
+                          </option>
+                        </select>
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-SchedulingSet"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Scheduling Set"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Scheduling Set"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Scheduling Set
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Scheduling Set"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Scheduling Set"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Scheduling Set
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-TemplateName"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Template Name"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Template Name"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Template Name
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Template Name"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Template Name"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Template Name
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-TemplateDescription"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Template Description"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Template Description"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Template Description
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Template Description"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Template Description"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Template Description
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Duration(HH:mm:ss)"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Duration (HH:mm:ss)"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Duration (HH:mm:ss)"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Duration (HH:mm:ss)
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Duration (HH:mm:ss)"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Duration (HH:mm:ss)"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Duration (HH:mm:ss)
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      style="align-items: center;"
-                    >
-                      <input
-                        class="p-inputtext p-component p-inputmask"
-                        data-pc-name="inputtext"
-                        data-pc-section="root"
-                        placeholder="HH:mm:ss"
-                        style="min-width: 48px; max-width: 85px; width: 100%; height: 25px;"
-                        type="text"
-                      />
-                      <input
-                        class="p-inputtext p-component p-inputmask"
-                        data-pc-name="inputtext"
-                        data-pc-section="root"
-                        placeholder="HH:mm:ss"
-                        style="min-width: 48px; max-width: 85px; width: 100%; height: 25px;"
-                        type="text"
-                      />
+                    <div>
+                      <div
+                        style="align-items: center;"
+                      >
+                        <input
+                          class="p-inputtext p-component p-inputmask"
+                          data-pc-name="inputtext"
+                          data-pc-section="root"
+                          placeholder="HH:mm:ss"
+                          style="min-width: 48px; max-width: 85px; width: 100%; height: 25px;"
+                          type="text"
+                        />
+                        <input
+                          class="p-inputtext p-component p-inputmask"
+                          data-pc-name="inputtext"
+                          data-pc-section="root"
+                          placeholder="HH:mm:ss"
+                          style="min-width: 48px; max-width: 85px; width: 100%; height: 25px;"
+                          type="text"
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Stations(CS/RS/IS)"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Stations (CS/RS/IS)"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Stations (CS/RS/IS)"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Stations (CS/RS/IS)
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Stations (CS/RS/IS)"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Stations (CS/RS/IS)"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Stations (CS/RS/IS)
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Taskscontent(O/P/I)"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Tasks content (O/P/I)"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Tasks content (O/P/I)"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Tasks content (O/P/I)
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Tasks content (O/P/I)"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Tasks content (O/P/I)"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Tasks content (O/P/I)
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-NumberofSAPsinthetargetobservation"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Number of SAPs in the target observation"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Number of SAPs in the target observation"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Number of SAPs in the target observation
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Number of SAPs in the target observation"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Number of SAPs in the target observation"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Number of SAPs in the target observation
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Target-Name"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Target - Name"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Target - Name"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Target - Name
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Target - Name"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Target - Name"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Target - Name
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Target-Angle1"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Target - Angle 1"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Target - Angle 1"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Target - Angle 1
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Target - Angle 1"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Target - Angle 1"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Target - Angle 1
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Target-Angle2"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Target - Angle 2"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Target - Angle 2"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Target - Angle 2
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Target - Angle 2"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Target - Angle 2"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Target - Angle 2
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Target-ReferenceFrame"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Target - Reference Frame"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Target - Reference Frame"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Target - Reference Frame
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Target - Reference Frame"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Target - Reference Frame"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Target - Reference Frame
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Cancelled"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                      data-rbd-drag-handle-context-id="0"
-                      data-rbd-drag-handle-draggable-id="Cancelled"
-                      data-rbd-draggable-context-id="0"
-                      data-rbd-draggable-id="Cancelled"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Cancelled
+                      <div
+                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                        data-rbd-drag-handle-context-id="0"
+                        data-rbd-drag-handle-draggable-id="Cancelled"
+                        data-rbd-draggable-context-id="0"
+                        data-rbd-draggable-id="Cancelled"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Cancelled
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
           </tr>
         </thead>
@@ -5829,927 +5889,987 @@ exports[`Schedulinng Unit List Lite  Schedulinng List Lite  correctly with data
             <th
               class="fixed-column-td"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class="fixed-column"
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Select"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
+                      class="fixed-column"
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      <div>
-                        <input
-                          style="width: 15px; height: 15px;"
-                          title="Toggle All Rows Selected"
-                          type="checkbox"
-                        />
+                      <div
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Select"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                      >
+                        <div>
+                          <input
+                            style="width: 15px; height: 15px;"
+                            title="Toggle All Rows Selected"
+                            type="checkbox"
+                          />
+                        </div>
                       </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
               </div>
             </th>
             <th
               class="fixed-column-td"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class="fixed-column"
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Action"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
+                      class="fixed-column"
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Action
+                      <div
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Action"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                      >
+                        Action
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
               </div>
             </th>
             <th
               class="notfixed-column-td-SchedulingUnitID"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Scheduling Unit ID"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Scheduling Unit ID"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Scheduling Unit ID
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Scheduling Unit ID"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Scheduling Unit ID"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Scheduling Unit ID
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Project"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Project"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Project"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Project
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Project"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Project"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Project
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Name"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Name"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Name"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Name
-                      <i
-                        aria-hidden="true"
-                        class="pi pi-sort-up"
-                      />
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Name"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Name"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Name
+                        <i
+                          aria-hidden="true"
+                          class="pi pi-sort-up"
+                        />
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Description"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Description"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Description"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Description
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Description"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Description"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Description
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-ProjectRank"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Project Rank"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Project Rank"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Project Rank
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Project Rank"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Project Rank"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Project Rank
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-PriorityQueue"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Priority Queue"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Priority Queue"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Priority Queue
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Priority Queue"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Priority Queue"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Priority Queue
+                      </div>
                     </div>
-                  </div>
-                  <div>
                     <div>
-                      <select
-                        style="height: 24.2014px; border: 1px solid lightgrey;"
-                        title="Select a value from list to search"
-                      >
-                        <option
-                          value=""
-                        >
-                          All
-                        </option>
-                        <option
-                          value="A"
-                        >
-                          A
-                        </option>
-                        <option
-                          value="B"
+                      <div>
+                        <select
+                          style="height: 24.2014px; border: 1px solid lightgrey;"
+                          title="Select a value from list to search"
                         >
-                          B
-                        </option>
-                      </select>
+                          <option
+                            value=""
+                          >
+                            All
+                          </option>
+                          <option
+                            value="A"
+                          >
+                            A
+                          </option>
+                          <option
+                            value="B"
+                          >
+                            B
+                          </option>
+                        </select>
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-SchedulingSet"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                    title="Toggle SortBy"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Scheduling Set"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Scheduling Set"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                      title="Toggle SortBy"
                     >
-                      Scheduling Set
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Scheduling Set"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Scheduling Set"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Scheduling Set
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-TemplateName"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Template Name"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Template Name"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Template Name
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Template Name"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Template Name"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Template Name
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-TemplateDescription"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Template Description"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Template Description"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Template Description
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Template Description"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Template Description"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Template Description
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      class="table-filter"
-                      style="margin-right: 5px;"
-                    >
-                      <input
-                        title="Enter few characters and press ‘Enter’ key to search"
-                        value=""
-                      />
+                    <div>
+                      <div
+                        class="table-filter"
+                        style="margin-right: 5px;"
+                      >
+                        <input
+                          title="Enter few characters and press ‘Enter’ key to search"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Duration(HH:mm:ss)"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Duration (HH:mm:ss)"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Duration (HH:mm:ss)"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Duration (HH:mm:ss)
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Duration (HH:mm:ss)"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Duration (HH:mm:ss)"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Duration (HH:mm:ss)
+                      </div>
                     </div>
-                  </div>
-                  <div>
-                    <div
-                      style="align-items: center;"
-                    >
-                      <input
-                        class="p-inputtext p-component p-inputmask"
-                        data-pc-name="inputtext"
-                        data-pc-section="root"
-                        placeholder="HH:mm:ss"
-                        style="min-width: 48px; max-width: 85px; width: 100%; height: 25px;"
-                        type="text"
-                      />
-                      <input
-                        class="p-inputtext p-component p-inputmask"
-                        data-pc-name="inputtext"
-                        data-pc-section="root"
-                        placeholder="HH:mm:ss"
-                        style="min-width: 48px; max-width: 85px; width: 100%; height: 25px;"
-                        type="text"
-                      />
+                    <div>
+                      <div
+                        style="align-items: center;"
+                      >
+                        <input
+                          class="p-inputtext p-component p-inputmask"
+                          data-pc-name="inputtext"
+                          data-pc-section="root"
+                          placeholder="HH:mm:ss"
+                          style="min-width: 48px; max-width: 85px; width: 100%; height: 25px;"
+                          type="text"
+                        />
+                        <input
+                          class="p-inputtext p-component p-inputmask"
+                          data-pc-name="inputtext"
+                          data-pc-section="root"
+                          placeholder="HH:mm:ss"
+                          style="min-width: 48px; max-width: 85px; width: 100%; height: 25px;"
+                          type="text"
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Stations(CS/RS/IS)"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Stations (CS/RS/IS)"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Stations (CS/RS/IS)"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Stations (CS/RS/IS)
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Stations (CS/RS/IS)"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Stations (CS/RS/IS)"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Stations (CS/RS/IS)
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Taskscontent(O/P/I)"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Tasks content (O/P/I)"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Tasks content (O/P/I)"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Tasks content (O/P/I)
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Tasks content (O/P/I)"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Tasks content (O/P/I)"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Tasks content (O/P/I)
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-NumberofSAPsinthetargetobservation"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Number of SAPs in the target observation"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Number of SAPs in the target observation"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Number of SAPs in the target observation
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Number of SAPs in the target observation"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Number of SAPs in the target observation"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Number of SAPs in the target observation
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Target-Name"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Target - Name"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Target - Name"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Target - Name
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Target - Name"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Target - Name"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Target - Name
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Target-Angle1"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Target - Angle 1"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Target - Angle 1"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Target - Angle 1
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Target - Angle 1"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Target - Angle 1"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Target - Angle 1
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Target-Angle2"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Target - Angle 2"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Target - Angle 2"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Target - Angle 2
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Target - Angle 2"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Target - Angle 2"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Target - Angle 2
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Target-ReferenceFrame"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Target - Reference Frame"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Target - Reference Frame"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Target - Reference Frame
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Target - Reference Frame"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Target - Reference Frame"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Target - Reference Frame
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
             <th
               class="notfixed-column-td-Cancelled"
               role="tablehead"
-              style="display: flex;"
             >
               <div
-                style="display: flex;"
+                style="display: flex; flex-direction: row; height: 100%;"
               >
                 <div
-                  style="display: grid; vertical-align: bottom;"
+                  style="display: flex;"
                 >
                   <div
-                    class=""
-                    colspan="1"
-                    role="columnheader"
-                    style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                    style="display: grid; vertical-align: bottom;"
                   >
                     <div
-                      aria-describedby="rbd-hidden-text-1-hidden-text-40"
-                      data-rbd-drag-handle-context-id="1"
-                      data-rbd-drag-handle-draggable-id="Cancelled"
-                      data-rbd-draggable-context-id="1"
-                      data-rbd-draggable-id="Cancelled"
-                      draggable="false"
-                      role="button"
-                      style="transform: translate(0,0); user-select: none; cursor: default;"
-                      tabindex="0"
+                      class=""
+                      colspan="1"
+                      role="columnheader"
+                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                     >
-                      Cancelled
+                      <div
+                        aria-describedby="rbd-hidden-text-1-hidden-text-40"
+                        data-rbd-drag-handle-context-id="1"
+                        data-rbd-drag-handle-draggable-id="Cancelled"
+                        data-rbd-draggable-context-id="1"
+                        data-rbd-draggable-id="Cancelled"
+                        draggable="false"
+                        role="button"
+                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        tabindex="0"
+                      >
+                        Cancelled
+                      </div>
                     </div>
+                    <div />
                   </div>
-                  <div />
                 </div>
+                <div
+                  class="resizer "
+                  draggable="false"
+                  role="separator"
+                  style="cursor: col-resize;"
+                />
               </div>
-              <div
-                class="resizer "
-                draggable="false"
-                role="separator"
-                style="cursor: col-resize;"
-              />
             </th>
           </tr>
         </thead>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/systemevent.list.test.js.snap b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/systemevent.list.test.js.snap
index f9e0d75cdf67ce10085d761eb2c64ed95844bca8..9e2ed021d0815451a0f1479c4348e9a4c90d2318 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/systemevent.list.test.js.snap
+++ b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/systemevent.list.test.js.snap
@@ -73,287 +73,315 @@ exports[`Systen Event List  System Event Renders correctly with data 1`] = `
         <table role=\\"table\\" style=\\"min-width: 1080px;\\" data-testid=\\"viewtable\\" class=\\"viewtable\\">
           <thead>
             <tr role=\\"row\\" style=\\"display: flex; flex: 1 0 auto; min-width: 1080px;\\" data-testid=\\"tablerows\\">
-              <th role=\\"tablehead\\" class=\\"fixed-column-td\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Action\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">Action</div>
+              <th role=\\"tablehead\\" class=\\"fixed-column-td\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Action\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">Action</div>
+                      </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
                 </div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SystemEventId\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"System Event Id\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"System Event Id\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">System Event Id<i class=\\"pi pi-sort-up\\" aria-hidden=\\"true\\"></i></div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SystemEventId\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"System Event Id\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"System Event Id\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">System Event Id<i class=\\"pi pi-sort-up\\" aria-hidden=\\"true\\"></i></div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Created\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Created\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Created\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Created</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\">
-                        <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Created\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Created\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Created\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Created</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\">
+                          <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+                        </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Name\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Name\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Name</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Name\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Name\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Name</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Description\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Description\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Description</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Description\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Description\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Description</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-StartTime\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">XXXX-XX-XX XXXX:XX:XX</div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\">XXXX-XX-XX XXXX:XX:XX</div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-StartTime\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">XXXX-XX-XX XXXX:XX:XX</div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-EndTime\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">XXXX-XX-XX XXXX:XX:XX</div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\">XXXX-XX-XX XXXX:XX:XX</div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-EndTime\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">XXXX-XX-XX XXXX:XX:XX</div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Duration\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Duration\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Duration\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Duration</div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Duration\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Duration\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Duration\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Duration</div>
+                      </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-IssueType\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Issue Type\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Issue Type\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Issue Type</div>
-                    </div>
-                    <div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-IssueType\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Issue Type\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Issue Type\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Issue Type</div>
+                      </div>
                       <div>
-                        <div style=\\"position: relative; display: flex;\\">
-                          <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
-                            <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
-                            <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
-                              <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                        <div>
+                          <div style=\\"position: relative; display: flex;\\">
+                            <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
+                              <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
+                              <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
+                                <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                              </div>
+                              <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
+                                  <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
+                                </svg></div>
                             </div>
-                            <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
-                                <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
-                              </svg></div>
+                            <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                           </div>
-                          <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-IssueSubtype\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Issue Subtype\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Issue Subtype\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Issue Subtype</div>
-                    </div>
-                    <div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-IssueSubtype\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Issue Subtype\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Issue Subtype\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Issue Subtype</div>
+                      </div>
                       <div>
-                        <div style=\\"position: relative; display: flex;\\">
-                          <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
-                            <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
-                            <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
-                              <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                        <div>
+                          <div style=\\"position: relative; display: flex;\\">
+                            <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
+                              <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
+                              <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
+                                <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                              </div>
+                              <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
+                                  <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
+                                </svg></div>
                             </div>
-                            <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
-                                <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
-                              </svg></div>
+                            <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                           </div>
-                          <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Severity\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Severity\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Severity\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Severity</div>
-                    </div>
-                    <div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Severity\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Severity\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Severity\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Severity</div>
+                      </div>
                       <div>
-                        <div style=\\"position: relative; display: flex;\\">
-                          <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
-                            <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
-                            <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
-                              <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                        <div>
+                          <div style=\\"position: relative; display: flex;\\">
+                            <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
+                              <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
+                              <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
+                                <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                              </div>
+                              <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
+                                  <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
+                                </svg></div>
                             </div>
-                            <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
-                                <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
-                              </svg></div>
+                            <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                           </div>
-                          <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-CreatedBy\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Created By\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Created By\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Created By</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-CreatedBy\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Created By\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Created By\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Created By</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Notes\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Notes\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Notes\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Notes</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Notes\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Notes\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Notes\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Notes</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Status\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Status\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Status\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Status</div>
-                    </div>
-                    <div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Status\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Status\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Status\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Status</div>
+                      </div>
                       <div>
-                        <div style=\\"position: relative; display: flex;\\">
-                          <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
-                            <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
-                            <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
-                              <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                        <div>
+                          <div style=\\"position: relative; display: flex;\\">
+                            <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
+                              <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
+                              <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
+                                <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                              </div>
+                              <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
+                                  <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
+                                </svg></div>
                             </div>
-                            <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
-                                <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
-                              </svg></div>
+                            <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                           </div>
-                          <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-AffectedHardwareStations\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Affected Hardware Stations\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Affected Hardware Stations\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Affected Hardware Stations</div>
-                    </div>
-                    <div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-AffectedHardwareStations\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Affected Hardware Stations\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Affected Hardware Stations\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Affected Hardware Stations</div>
+                      </div>
                       <div>
-                        <div class=\\"flex \\">
-                          <div class=\\"p-field-radiobutton\\">
-                            <div class=\\"p-radiobutton p-component p-radiobutton-checked\\" data-pc-name=\\"radiobutton\\" data-pc-section=\\"root\\">
-                              <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input id=\\"filtertype1\\" type=\\"radio\\" name=\\"filtertype\\" data-pc-section=\\"hiddeninput\\" checked=\\"\\"></div>
-                              <div class=\\"p-radiobutton-box p-highlight\\" data-pc-section=\\"input\\">
-                                <div class=\\"p-radiobutton-icon\\" data-pc-section=\\"icon\\"></div>
-                              </div>
-                            </div><label for=\\"filtertype1\\">Any</label>
+                        <div>
+                          <div class=\\"flex \\">
+                            <div class=\\"p-field-radiobutton\\">
+                              <div class=\\"p-radiobutton p-component p-radiobutton-checked\\" data-pc-name=\\"radiobutton\\" data-pc-section=\\"root\\">
+                                <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input id=\\"filtertype1\\" type=\\"radio\\" name=\\"filtertype\\" data-pc-section=\\"hiddeninput\\" checked=\\"\\"></div>
+                                <div class=\\"p-radiobutton-box p-highlight\\" data-pc-section=\\"input\\">
+                                  <div class=\\"p-radiobutton-icon\\" data-pc-section=\\"icon\\"></div>
+                                </div>
+                              </div><label for=\\"filtertype1\\">Any</label>
+                            </div>
+                            <div class=\\"p-field-radiobutton\\">
+                              <div class=\\"p-radiobutton p-component\\" data-pc-name=\\"radiobutton\\" data-pc-section=\\"root\\">
+                                <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input id=\\"filtertype2\\" type=\\"radio\\" name=\\"filtertype\\" data-pc-section=\\"hiddeninput\\"></div>
+                                <div class=\\"p-radiobutton-box\\" data-pc-section=\\"input\\">
+                                  <div class=\\"p-radiobutton-icon\\" data-pc-section=\\"icon\\"></div>
+                                </div>
+                              </div><label for=\\"filtertype2\\">All</label>
+                            </div>
                           </div>
-                          <div class=\\"p-field-radiobutton\\">
-                            <div class=\\"p-radiobutton p-component\\" data-pc-name=\\"radiobutton\\" data-pc-section=\\"root\\">
-                              <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input id=\\"filtertype2\\" type=\\"radio\\" name=\\"filtertype\\" data-pc-section=\\"hiddeninput\\"></div>
-                              <div class=\\"p-radiobutton-box\\" data-pc-section=\\"input\\">
-                                <div class=\\"p-radiobutton-icon\\" data-pc-section=\\"icon\\"></div>
+                          <div style=\\"position: relative; display: flex;\\">
+                            <div id=\\"multi-select\\" style=\\"width: 95%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
+                              <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
+                              <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
+                                <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
                               </div>
-                            </div><label for=\\"filtertype2\\">All</label>
+                              <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
+                                  <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
+                                </svg></div>
+                            </div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button>
                           </div>
                         </div>
-                        <div style=\\"position: relative; display: flex;\\">
-                          <div id=\\"multi-select\\" style=\\"width: 95%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
-                            <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
-                            <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
-                              <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
-                            </div>
-                            <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
-                                <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
-                              </svg></div>
-                          </div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button>
-                        </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-AffectedTasks\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Affected Tasks\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Affected Tasks\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Affected Tasks</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-AffectedTasks\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Affected Tasks\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Affected Tasks\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Affected Tasks</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-JiraURL\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Jira URL\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Jira URL\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Jira URL</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-JiraURL\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Jira URL\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Jira URL\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Jira URL</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
             </tr>
           </thead>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/task.list.test.js.snap b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/task.list.test.js.snap
index 762f130fe247effc73981032bb47be947ab788a8..55b1d936e56c6b37c552e21ee2408933aca3f0f7 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/task.list.test.js.snap
+++ b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/task.list.test.js.snap
@@ -65,168 +65,194 @@ exports[`Task List  Task List  correctly with data 1`] = `
         <table role=\\"table\\" style=\\"min-width: 780px;\\" data-testid=\\"viewtable\\" class=\\"viewtable\\">
           <thead>
             <tr role=\\"row\\" style=\\"display: flex; flex: 1 0 auto; min-width: 780px;\\" data-testid=\\"tablerows\\">
-              <th role=\\"tablehead\\" class=\\"fixed-column-td\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Select\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">
-                        <div><input type=\\"checkbox\\" title=\\"Toggle All Rows Selected\\" style=\\"width: 15px; height: 15px;\\"></div>
+              <th role=\\"tablehead\\" class=\\"fixed-column-td\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Select\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">
+                          <div><input type=\\"checkbox\\" title=\\"Toggle All Rows Selected\\" style=\\"width: 15px; height: 15px;\\"></div>
+                        </div>
                       </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
                 </div>
               </th>
-              <th role=\\"tablehead\\" class=\\"fixed-column-td\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Action\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">Action</div>
+              <th role=\\"tablehead\\" class=\\"fixed-column-td\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Action\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">Action</div>
+                      </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
                 </div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Project\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Project\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Project\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Project</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Project\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Project\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Project\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Project</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SchedulingUnitID\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Scheduling Unit ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Scheduling Unit ID\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Scheduling Unit ID<i class=\\"pi pi-sort-up\\" aria-hidden=\\"true\\"></i></div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SchedulingUnitID\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Scheduling Unit ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Scheduling Unit ID\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Scheduling Unit ID<i class=\\"pi pi-sort-up\\" aria-hidden=\\"true\\"></i></div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SchedulingUnitName\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Scheduling Unit Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Scheduling Unit Name\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Scheduling Unit Name</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SchedulingUnitName\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Scheduling Unit Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Scheduling Unit Name\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Scheduling Unit Name</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ID\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"ID\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">ID</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ID\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"ID\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">ID</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Name\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Name\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Name</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Name\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Name\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Name</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Description\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Description\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Description</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Description\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Description\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Description</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ShortDescription\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Short Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Short Description\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Short Description</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ShortDescription\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Short Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Short Description\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Short Description</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Duration(HH:mm:ss)\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Duration (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Duration (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Duration (HH:mm:ss)</div>
-                    </div>
-                    <div>
-                      <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Duration(HH:mm:ss)\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Duration (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Duration (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Duration (HH:mm:ss)</div>
+                      </div>
+                      <div>
+                        <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-RelativeStartTime(HH:mm:ss)\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Relative Start Time (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Relative Start Time (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Relative Start Time (HH:mm:ss)</div>
-                    </div>
-                    <div>
-                      <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-RelativeStartTime(HH:mm:ss)\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Relative Start Time (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Relative Start Time (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Relative Start Time (HH:mm:ss)</div>
+                      </div>
+                      <div>
+                        <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-RelativeEndTime(HH:mm:ss)\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Relative End Time (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Relative End Time (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Relative End Time (HH:mm:ss)</div>
-                    </div>
-                    <div>
-                      <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-RelativeEndTime(HH:mm:ss)\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Relative End Time (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Relative End Time (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Relative End Time (HH:mm:ss)</div>
+                      </div>
+                      <div>
+                        <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Cancelled\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Cancelled\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Cancelled\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Cancelled</div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Cancelled\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"0\\" data-rbd-draggable-id=\\"Cancelled\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-0-hidden-text-0\\" data-rbd-drag-handle-draggable-id=\\"Cancelled\\" data-rbd-drag-handle-context-id=\\"0\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Cancelled</div>
+                      </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
             </tr>
           </thead>
@@ -727,316 +753,362 @@ exports[`Task List  Task List correctly with blueprint data 1`] = `
         <table role=\\"table\\" style=\\"min-width: 1380px;\\" data-testid=\\"viewtable\\" class=\\"viewtable\\">
           <thead>
             <tr role=\\"row\\" style=\\"display: flex; flex: 1 0 auto; min-width: 1380px;\\" data-testid=\\"tablerows\\">
-              <th role=\\"tablehead\\" class=\\"fixed-column-td\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Select\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">
-                        <div><input type=\\"checkbox\\" title=\\"Toggle All Rows Selected\\" style=\\"width: 15px; height: 15px;\\"></div>
+              <th role=\\"tablehead\\" class=\\"fixed-column-td\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Select\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">
+                          <div><input type=\\"checkbox\\" title=\\"Toggle All Rows Selected\\" style=\\"width: 15px; height: 15px;\\"></div>
+                        </div>
                       </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
                 </div>
               </th>
-              <th role=\\"tablehead\\" class=\\"fixed-column-td\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Action\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">Action</div>
+              <th role=\\"tablehead\\" class=\\"fixed-column-td\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Action\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">Action</div>
+                      </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
                 </div>
               </th>
-              <th role=\\"tablehead\\" class=\\"fixed-column-td\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Status Logs\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">Status Logs</div>
+              <th role=\\"tablehead\\" class=\\"fixed-column-td\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"fixed-column\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Status Logs\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\">Status Logs</div>
+                      </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
                 </div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Status\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Status\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Status\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Status</div>
-                    </div>
-                    <div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Status\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Status\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Status\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Status</div>
+                      </div>
                       <div>
-                        <div style=\\"position: relative; display: flex;\\">
-                          <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
-                            <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
-                            <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
-                              <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                        <div>
+                          <div style=\\"position: relative; display: flex;\\">
+                            <div id=\\"multi-select\\" style=\\"width: 85%;\\" class=\\"p-multiselect p-component p-inputwrapper multi-select\\" data-testid=\\"multi-select\\" data-pc-name=\\"multiselect\\" data-pc-section=\\"root\\">
+                              <div class=\\"p-hidden-accessible\\" data-pc-section=\\"hiddeninputwrapper\\"><input type=\\"text\\" role=\\"listbox\\" aria-expanded=\\"false\\" tabindex=\\"0\\" data-pc-section=\\"input\\" readonly=\\"\\"></div>
+                              <div class=\\"p-multiselect-label-container\\" data-pc-section=\\"labelcontainer\\">
+                                <div class=\\"p-multiselect-label p-multiselect-label-empty\\" data-pc-section=\\"label\\">empty</div>
+                              </div>
+                              <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
+                                  <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
+                                </svg></div>
                             </div>
-                            <div class=\\"p-multiselect-trigger\\" data-pc-section=\\"trigger\\"><svg width=\\"14\\" height=\\"14\\" viewBox=\\"0 0 14 14\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" class=\\"p-icon p-multiselect-trigger-icon p-c\\" aria-hidden=\\"true\\" data-pc-section=\\"triggericon\\">
-                                <path d=\\"M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z\\" fill=\\"currentColor\\"></path>
-                              </svg></div>
+                            <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                           </div>
-                          <div><button class=\\"p-link\\"><i class=\\"pi pi-search search-btn\\"></i></button></div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Project\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Project\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Project\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Project</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Project\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Project\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Project\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Project</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SchedulingUnitID\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Scheduling Unit ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Scheduling Unit ID\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Scheduling Unit ID<i class=\\"pi pi-sort-up\\" aria-hidden=\\"true\\"></i></div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SchedulingUnitID\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Scheduling Unit ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Scheduling Unit ID\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Scheduling Unit ID<i class=\\"pi pi-sort-up\\" aria-hidden=\\"true\\"></i></div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SchedulingUnitName\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Scheduling Unit Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Scheduling Unit Name\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Scheduling Unit Name</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-SchedulingUnitName\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Scheduling Unit Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Scheduling Unit Name\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Scheduling Unit Name</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ID\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"ID\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">ID</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ID\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"ID\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">ID</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ControlID\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Control ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Control ID\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Control ID</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ControlID\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Control ID\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Control ID\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Control ID</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter Id and press ‘Enter’ key to search. For multiple values enter comma separated values. For range, provide input like 1..6\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Name\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Name\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Name</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Name\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Name\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Name\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Name</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Description\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Description\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Description</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Description\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Description\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Description</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ShortDescription\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Short Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Short Description\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Short Description</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ShortDescription\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Short Description\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Short Description\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Short Description</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\" style=\\"margin-right: 5px;\\"><input title=\\"Enter few characters and press ‘Enter’ key to search\\" value=\\"\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ObservationStartTime\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Observation Start Time\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Observation Start Time\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Observation Start Time</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\">
-                        <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ObservationStartTime\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Observation Start Time\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Observation Start Time\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Observation Start Time</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\">
+                          <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+                        </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ObservationEndTime\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Observation End Time\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Observation End Time\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Observation End Time</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\">
-                        <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ObservationEndTime\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Observation End Time\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Observation End Time\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Observation End Time</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\">
+                          <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+                        </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ProcessStartTime\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Process Start Time\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Process Start Time\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Process Start Time</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\">
-                        <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ProcessStartTime\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Process Start Time\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Process Start Time\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Process Start Time</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\">
+                          <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+                        </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ProcessEndTime\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Process End Time\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Process End Time\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Process End Time</div>
-                    </div>
-                    <div>
-                      <div class=\\"table-filter\\">
-                        <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-ProcessEndTime\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" title=\\"Toggle SortBy\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Process End Time\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Process End Time\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Process End Time</div>
+                      </div>
+                      <div>
+                        <div class=\\"table-filter\\">
+                          <div data-enable-time=\\"true\\" data-input=\\"true\\" class=\\"flatpickr-range-filter\\" title=\\"Enter the date &amp; time range to search and press ‘Ok’ button\\"><input type=\\"text\\" data-input=\\"true\\" class=\\"p-inputtext p-component calendar-input flatpickr-input\\"><button class=\\"p-button p-component p-button-icon-only calendar-button\\" data-toggle=\\"true\\" title=\\"Click to select the date range\\"><i class=\\"fas fa-calendar\\"></i></button><button class=\\"p-button p-component p-button-icon-only calendar-reset\\" title=\\"Clear date range\\"><i class=\\"pi pi-times\\" style=\\"color: white;\\"></i></button></div>
+                        </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Duration(HH:mm:ss)\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" class=\\"\\" title=\\"Toggle SortBy\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Duration (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Duration (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Duration (HH:mm:ss)</div>
-                    </div>
-                    <div>
-                      <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Duration(HH:mm:ss)\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;\\" class=\\"\\" title=\\"Toggle SortBy\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Duration (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Duration (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Duration (HH:mm:ss)</div>
+                      </div>
+                      <div>
+                        <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-RelativeStartTime(HH:mm:ss)\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Relative Start Time (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Relative Start Time (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Relative Start Time (HH:mm:ss)</div>
-                    </div>
-                    <div>
-                      <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-RelativeStartTime(HH:mm:ss)\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Relative Start Time (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Relative Start Time (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Relative Start Time (HH:mm:ss)</div>
+                      </div>
+                      <div>
+                        <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-RelativeEndTime(HH:mm:ss)\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Relative End Time (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Relative End Time (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Relative End Time (HH:mm:ss)</div>
-                    </div>
-                    <div>
-                      <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-RelativeEndTime(HH:mm:ss)\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Relative End Time (HH:mm:ss)\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Relative End Time (HH:mm:ss)\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Relative End Time (HH:mm:ss)</div>
+                      </div>
+                      <div>
+                        <div style=\\"align-items: center;\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"><input class=\\"p-inputtext p-component p-inputmask\\" type=\\"text\\" style=\\"min-width: 48px; max-width: 85px; width: 100%; height: 25px;\\" placeholder=\\"HH:mm:ss\\" data-pc-name=\\"inputtext\\" data-pc-section=\\"root\\"></div>
+                      </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-#Dataproducts\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"#Dataproducts\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"#Dataproducts\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">#Dataproducts</div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-#Dataproducts\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"#Dataproducts\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"#Dataproducts\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">#Dataproducts</div>
+                      </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Cancelled\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Cancelled\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Cancelled\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Cancelled</div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Cancelled\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Cancelled\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Cancelled\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Cancelled</div>
+                      </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Obsolete\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Obsolete\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Obsolete\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Obsolete</div>
-                    </div>
-                    <div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-Obsolete\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Obsolete\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Obsolete\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Obsolete</div>
+                      </div>
                       <div>
-                        <div class=\\"p-tristatecheckbox p-checkbox p-component\\" style=\\"width: 15px; height: 24.2014px;\\" data-pc-name=\\"tristatecheckbox\\" data-pc-section=\\"root\\">
-                          <div class=\\"p-checkbox-box\\" tabindex=\\"0\\" role=\\"checkbox\\" aria-checked=\\"false\\" data-pc-section=\\"checkbox\\"></div>
+                        <div>
+                          <div class=\\"p-tristatecheckbox p-checkbox p-component\\" style=\\"width: 15px; height: 24.2014px;\\" data-pc-name=\\"tristatecheckbox\\" data-pc-section=\\"root\\">
+                            <div class=\\"p-checkbox-box\\" tabindex=\\"0\\" role=\\"checkbox\\" aria-checked=\\"false\\" data-pc-section=\\"checkbox\\"></div>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
-              <th role=\\"tablehead\\" class=\\"notfixed-column-td-UnschedulableReason\\" style=\\"display: flex;\\">
-                <div style=\\"display: flex;\\">
-                  <div style=\\"display: grid; vertical-align: bottom;\\">
-                    <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
-                      <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Unschedulable Reason\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Unschedulable Reason\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Unschedulable Reason</div>
+              <th role=\\"tablehead\\" class=\\"notfixed-column-td-UnschedulableReason\\">
+                <div style=\\"display: flex; flex-direction: row; height: 100%;\\">
+                  <div style=\\"display: flex;\\">
+                    <div style=\\"display: grid; vertical-align: bottom;\\">
+                      <div colspan=\\"1\\" role=\\"columnheader\\" style=\\"box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;\\" class=\\"\\">
+                        <div data-rbd-draggable-context-id=\\"2\\" data-rbd-draggable-id=\\"Unschedulable Reason\\" style=\\"transform: translate(0,0); user-select: none; cursor: default;\\" tabindex=\\"0\\" role=\\"button\\" aria-describedby=\\"rbd-hidden-text-2-hidden-text-60\\" data-rbd-drag-handle-draggable-id=\\"Unschedulable Reason\\" data-rbd-drag-handle-context-id=\\"2\\" draggable=\\"false\\" rbd-drag-handle-context-id=\\"X\\">Unschedulable Reason</div>
+                      </div>
+                      <div></div>
                     </div>
-                    <div></div>
                   </div>
+                  <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
                 </div>
-                <div draggable=\\"false\\" role=\\"separator\\" style=\\"cursor: col-resize;\\" class=\\"resizer \\"></div>
               </th>
             </tr>
           </thead>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/workflow.list.test.js.snap b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/workflow.list.test.js.snap
index 5326bb02304c4a5ed1d5cd05eb18e0a377074095..8cd7e563e72d675679a56773cc32e4032e11cb52 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/workflow.list.test.js.snap
+++ b/SAS/TMSS/frontend/tmss_webapp/src/tests/__snapshots__/workflow.list.test.js.snap
@@ -466,479 +466,506 @@ exports[`Workflow List  Workflow List correctly with data and security 1`] = `
               <th
                 class="fixed-column-td"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class="fixed-column"
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        data-rbd-draggable-context-id="0"
-                        data-rbd-draggable-id="Action"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        class="fixed-column"
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Action
+                        <div
+                          data-rbd-draggable-context-id="0"
+                          data-rbd-draggable-id="Action"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                        >
+                          Action
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
                 </div>
               </th>
               <th
                 class="notfixed-column-td-SchedulingUnitName"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                        data-rbd-drag-handle-context-id="0"
-                        data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
-                        data-rbd-draggable-context-id="0"
-                        data-rbd-draggable-id="Scheduling Unit Name"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Scheduling Unit Name
+                        <div
+                          aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                          data-rbd-drag-handle-context-id="0"
+                          data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
+                          data-rbd-draggable-context-id="0"
+                          data-rbd-draggable-id="Scheduling Unit Name"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Scheduling Unit Name
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-SchedulingUnitID"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                        data-rbd-drag-handle-context-id="0"
-                        data-rbd-drag-handle-draggable-id="Scheduling Unit ID"
-                        data-rbd-draggable-context-id="0"
-                        data-rbd-draggable-id="Scheduling Unit ID"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Scheduling Unit ID
+                        <div
+                          aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                          data-rbd-drag-handle-context-id="0"
+                          data-rbd-drag-handle-draggable-id="Scheduling Unit ID"
+                          data-rbd-draggable-context-id="0"
+                          data-rbd-draggable-id="Scheduling Unit ID"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Scheduling Unit ID
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-SchedulingUnitStatus"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                        data-rbd-drag-handle-context-id="0"
-                        data-rbd-drag-handle-draggable-id="Scheduling Unit Status"
-                        data-rbd-draggable-context-id="0"
-                        data-rbd-draggable-id="Scheduling Unit Status"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Scheduling Unit Status
+                        <div
+                          aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                          data-rbd-drag-handle-context-id="0"
+                          data-rbd-drag-handle-draggable-id="Scheduling Unit Status"
+                          data-rbd-draggable-context-id="0"
+                          data-rbd-draggable-id="Scheduling Unit Status"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Scheduling Unit Status
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-Project"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                        data-rbd-drag-handle-context-id="0"
-                        data-rbd-drag-handle-draggable-id="Project"
-                        data-rbd-draggable-context-id="0"
-                        data-rbd-draggable-id="Project"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Project
+                        <div
+                          aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                          data-rbd-drag-handle-context-id="0"
+                          data-rbd-drag-handle-draggable-id="Project"
+                          data-rbd-draggable-context-id="0"
+                          data-rbd-draggable-id="Project"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Project
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-AssignedTo"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                        data-rbd-drag-handle-context-id="0"
-                        data-rbd-drag-handle-draggable-id="Assigned To"
-                        data-rbd-draggable-context-id="0"
-                        data-rbd-draggable-id="Assigned To"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Assigned To
+                        <div
+                          aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                          data-rbd-drag-handle-context-id="0"
+                          data-rbd-drag-handle-draggable-id="Assigned To"
+                          data-rbd-draggable-context-id="0"
+                          data-rbd-draggable-id="Assigned To"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Assigned To
+                        </div>
                       </div>
-                    </div>
-                    <div>
-                      <div
-                        class="table-filter"
-                        style="margin-right: 5px;"
-                      >
-                        <input
-                          title="Enter few characters and press ‘Enter’ key to search"
-                          value=""
-                        />
+                      <div>
+                        <div
+                          class="table-filter"
+                          style="margin-right: 5px;"
+                        >
+                          <input
+                            title="Enter few characters and press ‘Enter’ key to search"
+                            value=""
+                          />
+                        </div>
                       </div>
                     </div>
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-CurrentWorkflowStage"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                      title="Toggle SortBy"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                        data-rbd-drag-handle-context-id="0"
-                        data-rbd-drag-handle-draggable-id="Current Workflow Stage"
-                        data-rbd-draggable-context-id="0"
-                        data-rbd-draggable-id="Current Workflow Stage"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                        title="Toggle SortBy"
                       >
-                        Current Workflow Stage
-                      </div>
-                    </div>
-                    <div>
-                      <div>
                         <div
-                          style="position: relative; display: flex;"
+                          aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                          data-rbd-drag-handle-context-id="0"
+                          data-rbd-drag-handle-draggable-id="Current Workflow Stage"
+                          data-rbd-draggable-context-id="0"
+                          data-rbd-draggable-id="Current Workflow Stage"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
                         >
+                          Current Workflow Stage
+                        </div>
+                      </div>
+                      <div>
+                        <div>
                           <div
-                            class="p-multiselect p-component p-inputwrapper multi-select"
-                            data-pc-name="multiselect"
-                            data-pc-section="root"
-                            data-testid="multi-select"
-                            id="multi-select"
-                            style="width: 85%;"
+                            style="position: relative; display: flex;"
                           >
                             <div
-                              class="p-hidden-accessible"
-                              data-pc-section="hiddeninputwrapper"
-                            >
-                              <input
-                                aria-expanded="false"
-                                data-pc-section="input"
-                                readonly=""
-                                role="listbox"
-                                tabindex="0"
-                                type="text"
-                              />
-                            </div>
-                            <div
-                              class="p-multiselect-label-container"
-                              data-pc-section="labelcontainer"
+                              class="p-multiselect p-component p-inputwrapper multi-select"
+                              data-pc-name="multiselect"
+                              data-pc-section="root"
+                              data-testid="multi-select"
+                              id="multi-select"
+                              style="width: 85%;"
                             >
                               <div
-                                class="p-multiselect-label p-multiselect-label-empty"
-                                data-pc-section="label"
+                                class="p-hidden-accessible"
+                                data-pc-section="hiddeninputwrapper"
+                              >
+                                <input
+                                  aria-expanded="false"
+                                  data-pc-section="input"
+                                  readonly=""
+                                  role="listbox"
+                                  tabindex="0"
+                                  type="text"
+                                />
+                              </div>
+                              <div
+                                class="p-multiselect-label-container"
+                                data-pc-section="labelcontainer"
+                              >
+                                <div
+                                  class="p-multiselect-label p-multiselect-label-empty"
+                                  data-pc-section="label"
+                                >
+                                  empty
+                                </div>
+                              </div>
+                              <div
+                                class="p-multiselect-trigger"
+                                data-pc-section="trigger"
                               >
-                                empty
+                                <svg
+                                  aria-hidden="true"
+                                  class="p-icon p-multiselect-trigger-icon p-c"
+                                  data-pc-section="triggericon"
+                                  fill="none"
+                                  height="14"
+                                  viewBox="0 0 14 14"
+                                  width="14"
+                                  xmlns="http://www.w3.org/2000/svg"
+                                >
+                                  <path
+                                    d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
                               </div>
                             </div>
-                            <div
-                              class="p-multiselect-trigger"
-                              data-pc-section="trigger"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                class="p-icon p-multiselect-trigger-icon p-c"
-                                data-pc-section="triggericon"
-                                fill="none"
-                                height="14"
-                                viewBox="0 0 14 14"
-                                width="14"
-                                xmlns="http://www.w3.org/2000/svg"
+                            <div>
+                              <button
+                                class="p-link"
                               >
-                                <path
-                                  d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                  fill="currentColor"
+                                <i
+                                  class="pi pi-search search-btn"
                                 />
-                              </svg>
+                              </button>
                             </div>
                           </div>
-                          <div>
-                            <button
-                              class="p-link"
-                            >
-                              <i
-                                class="pi pi-search search-btn"
-                              />
-                            </button>
-                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-UpdatedAt"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                      title="Toggle SortBy"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                        data-rbd-drag-handle-context-id="0"
-                        data-rbd-drag-handle-draggable-id="Updated At"
-                        data-rbd-draggable-context-id="0"
-                        data-rbd-draggable-id="Updated At"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                        title="Toggle SortBy"
                       >
-                        Updated At
-                        <i
-                          aria-hidden="true"
-                          class="pi pi-sort-up"
-                        />
+                        <div
+                          aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                          data-rbd-drag-handle-context-id="0"
+                          data-rbd-drag-handle-draggable-id="Updated At"
+                          data-rbd-draggable-context-id="0"
+                          data-rbd-draggable-id="Updated At"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Updated At
+                          <i
+                            aria-hidden="true"
+                            class="pi pi-sort-up"
+                          />
+                        </div>
                       </div>
-                    </div>
-                    <div>
-                      <div
-                        class="table-filter"
-                      >
+                      <div>
                         <div
-                          class="flatpickr-range-filter"
-                          data-enable-time="true"
-                          data-input="true"
-                          title="Enter the date & time range to search and press ‘Ok’ button"
+                          class="table-filter"
                         >
-                          <input
-                            class="p-inputtext p-component calendar-input flatpickr-input"
+                          <div
+                            class="flatpickr-range-filter"
+                            data-enable-time="true"
                             data-input="true"
-                            type="text"
-                          />
-                          <button
-                            class="p-button p-component p-button-icon-only calendar-button"
-                            data-toggle="true"
-                            title="Click to select the date range"
+                            title="Enter the date & time range to search and press ‘Ok’ button"
                           >
-                            <i
-                              class="fas fa-calendar"
+                            <input
+                              class="p-inputtext p-component calendar-input flatpickr-input"
+                              data-input="true"
+                              type="text"
                             />
-                          </button>
-                          <button
-                            class="p-button p-component p-button-icon-only calendar-reset"
-                            title="Clear date range"
-                          >
-                            <i
-                              class="pi pi-times"
-                              style="color: white;"
-                            />
-                          </button>
+                            <button
+                              class="p-button p-component p-button-icon-only calendar-button"
+                              data-toggle="true"
+                              title="Click to select the date range"
+                            >
+                              <i
+                                class="fas fa-calendar"
+                              />
+                            </button>
+                            <button
+                              class="p-button p-component p-button-icon-only calendar-reset"
+                              title="Clear date range"
+                            >
+                              <i
+                                class="pi pi-times"
+                                style="color: white;"
+                              />
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-Accepted"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-0-hidden-text-0"
-                        data-rbd-drag-handle-context-id="0"
-                        data-rbd-drag-handle-draggable-id="Accepted"
-                        data-rbd-draggable-context-id="0"
-                        data-rbd-draggable-id="Accepted"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Accepted
+                        <div
+                          aria-describedby="rbd-hidden-text-0-hidden-text-0"
+                          data-rbd-drag-handle-context-id="0"
+                          data-rbd-drag-handle-draggable-id="Accepted"
+                          data-rbd-draggable-context-id="0"
+                          data-rbd-draggable-id="Accepted"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Accepted
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
             </tr>
           </thead>
@@ -1735,479 +1762,506 @@ exports[`Workflow List handle WebSocket Workflow handles correctly Websocket Eve
               <th
                 class="fixed-column-td"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class="fixed-column"
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        data-rbd-draggable-context-id="1"
-                        data-rbd-draggable-id="Action"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
+                        class="fixed-column"
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Action
+                        <div
+                          data-rbd-draggable-context-id="1"
+                          data-rbd-draggable-id="Action"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                        >
+                          Action
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
                 </div>
               </th>
               <th
                 class="notfixed-column-td-SchedulingUnitName"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-1-hidden-text-11"
-                        data-rbd-drag-handle-context-id="1"
-                        data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
-                        data-rbd-draggable-context-id="1"
-                        data-rbd-draggable-id="Scheduling Unit Name"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Scheduling Unit Name
+                        <div
+                          aria-describedby="rbd-hidden-text-1-hidden-text-11"
+                          data-rbd-drag-handle-context-id="1"
+                          data-rbd-drag-handle-draggable-id="Scheduling Unit Name"
+                          data-rbd-draggable-context-id="1"
+                          data-rbd-draggable-id="Scheduling Unit Name"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Scheduling Unit Name
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-SchedulingUnitID"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-1-hidden-text-11"
-                        data-rbd-drag-handle-context-id="1"
-                        data-rbd-drag-handle-draggable-id="Scheduling Unit ID"
-                        data-rbd-draggable-context-id="1"
-                        data-rbd-draggable-id="Scheduling Unit ID"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Scheduling Unit ID
+                        <div
+                          aria-describedby="rbd-hidden-text-1-hidden-text-11"
+                          data-rbd-drag-handle-context-id="1"
+                          data-rbd-drag-handle-draggable-id="Scheduling Unit ID"
+                          data-rbd-draggable-context-id="1"
+                          data-rbd-draggable-id="Scheduling Unit ID"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Scheduling Unit ID
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-SchedulingUnitStatus"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-1-hidden-text-11"
-                        data-rbd-drag-handle-context-id="1"
-                        data-rbd-drag-handle-draggable-id="Scheduling Unit Status"
-                        data-rbd-draggable-context-id="1"
-                        data-rbd-draggable-id="Scheduling Unit Status"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Scheduling Unit Status
+                        <div
+                          aria-describedby="rbd-hidden-text-1-hidden-text-11"
+                          data-rbd-drag-handle-context-id="1"
+                          data-rbd-drag-handle-draggable-id="Scheduling Unit Status"
+                          data-rbd-draggable-context-id="1"
+                          data-rbd-draggable-id="Scheduling Unit Status"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Scheduling Unit Status
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-Project"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-1-hidden-text-11"
-                        data-rbd-drag-handle-context-id="1"
-                        data-rbd-drag-handle-draggable-id="Project"
-                        data-rbd-draggable-context-id="1"
-                        data-rbd-draggable-id="Project"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Project
+                        <div
+                          aria-describedby="rbd-hidden-text-1-hidden-text-11"
+                          data-rbd-drag-handle-context-id="1"
+                          data-rbd-drag-handle-draggable-id="Project"
+                          data-rbd-draggable-context-id="1"
+                          data-rbd-draggable-id="Project"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Project
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-AssignedTo"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-1-hidden-text-11"
-                        data-rbd-drag-handle-context-id="1"
-                        data-rbd-drag-handle-draggable-id="Assigned To"
-                        data-rbd-draggable-context-id="1"
-                        data-rbd-draggable-id="Assigned To"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Assigned To
+                        <div
+                          aria-describedby="rbd-hidden-text-1-hidden-text-11"
+                          data-rbd-drag-handle-context-id="1"
+                          data-rbd-drag-handle-draggable-id="Assigned To"
+                          data-rbd-draggable-context-id="1"
+                          data-rbd-draggable-id="Assigned To"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Assigned To
+                        </div>
                       </div>
-                    </div>
-                    <div>
-                      <div
-                        class="table-filter"
-                        style="margin-right: 5px;"
-                      >
-                        <input
-                          title="Enter few characters and press ‘Enter’ key to search"
-                          value=""
-                        />
+                      <div>
+                        <div
+                          class="table-filter"
+                          style="margin-right: 5px;"
+                        >
+                          <input
+                            title="Enter few characters and press ‘Enter’ key to search"
+                            value=""
+                          />
+                        </div>
                       </div>
                     </div>
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-CurrentWorkflowStage"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                      title="Toggle SortBy"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-1-hidden-text-11"
-                        data-rbd-drag-handle-context-id="1"
-                        data-rbd-drag-handle-draggable-id="Current Workflow Stage"
-                        data-rbd-draggable-context-id="1"
-                        data-rbd-draggable-id="Current Workflow Stage"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                        title="Toggle SortBy"
                       >
-                        Current Workflow Stage
-                      </div>
-                    </div>
-                    <div>
-                      <div>
                         <div
-                          style="position: relative; display: flex;"
+                          aria-describedby="rbd-hidden-text-1-hidden-text-11"
+                          data-rbd-drag-handle-context-id="1"
+                          data-rbd-drag-handle-draggable-id="Current Workflow Stage"
+                          data-rbd-draggable-context-id="1"
+                          data-rbd-draggable-id="Current Workflow Stage"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
                         >
+                          Current Workflow Stage
+                        </div>
+                      </div>
+                      <div>
+                        <div>
                           <div
-                            class="p-multiselect p-component p-inputwrapper multi-select"
-                            data-pc-name="multiselect"
-                            data-pc-section="root"
-                            data-testid="multi-select"
-                            id="multi-select"
-                            style="width: 85%;"
+                            style="position: relative; display: flex;"
                           >
                             <div
-                              class="p-hidden-accessible"
-                              data-pc-section="hiddeninputwrapper"
-                            >
-                              <input
-                                aria-expanded="false"
-                                data-pc-section="input"
-                                readonly=""
-                                role="listbox"
-                                tabindex="0"
-                                type="text"
-                              />
-                            </div>
-                            <div
-                              class="p-multiselect-label-container"
-                              data-pc-section="labelcontainer"
+                              class="p-multiselect p-component p-inputwrapper multi-select"
+                              data-pc-name="multiselect"
+                              data-pc-section="root"
+                              data-testid="multi-select"
+                              id="multi-select"
+                              style="width: 85%;"
                             >
                               <div
-                                class="p-multiselect-label p-multiselect-label-empty"
-                                data-pc-section="label"
+                                class="p-hidden-accessible"
+                                data-pc-section="hiddeninputwrapper"
+                              >
+                                <input
+                                  aria-expanded="false"
+                                  data-pc-section="input"
+                                  readonly=""
+                                  role="listbox"
+                                  tabindex="0"
+                                  type="text"
+                                />
+                              </div>
+                              <div
+                                class="p-multiselect-label-container"
+                                data-pc-section="labelcontainer"
+                              >
+                                <div
+                                  class="p-multiselect-label p-multiselect-label-empty"
+                                  data-pc-section="label"
+                                >
+                                  empty
+                                </div>
+                              </div>
+                              <div
+                                class="p-multiselect-trigger"
+                                data-pc-section="trigger"
                               >
-                                empty
+                                <svg
+                                  aria-hidden="true"
+                                  class="p-icon p-multiselect-trigger-icon p-c"
+                                  data-pc-section="triggericon"
+                                  fill="none"
+                                  height="14"
+                                  viewBox="0 0 14 14"
+                                  width="14"
+                                  xmlns="http://www.w3.org/2000/svg"
+                                >
+                                  <path
+                                    d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
                               </div>
                             </div>
-                            <div
-                              class="p-multiselect-trigger"
-                              data-pc-section="trigger"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                class="p-icon p-multiselect-trigger-icon p-c"
-                                data-pc-section="triggericon"
-                                fill="none"
-                                height="14"
-                                viewBox="0 0 14 14"
-                                width="14"
-                                xmlns="http://www.w3.org/2000/svg"
+                            <div>
+                              <button
+                                class="p-link"
                               >
-                                <path
-                                  d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                  fill="currentColor"
+                                <i
+                                  class="pi pi-search search-btn"
                                 />
-                              </svg>
+                              </button>
                             </div>
                           </div>
-                          <div>
-                            <button
-                              class="p-link"
-                            >
-                              <i
-                                class="pi pi-search search-btn"
-                              />
-                            </button>
-                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-UpdatedAt"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                      title="Toggle SortBy"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-1-hidden-text-11"
-                        data-rbd-drag-handle-context-id="1"
-                        data-rbd-drag-handle-draggable-id="Updated At"
-                        data-rbd-draggable-context-id="1"
-                        data-rbd-draggable-id="Updated At"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                        title="Toggle SortBy"
                       >
-                        Updated At
-                        <i
-                          aria-hidden="true"
-                          class="pi pi-sort-up"
-                        />
+                        <div
+                          aria-describedby="rbd-hidden-text-1-hidden-text-11"
+                          data-rbd-drag-handle-context-id="1"
+                          data-rbd-drag-handle-draggable-id="Updated At"
+                          data-rbd-draggable-context-id="1"
+                          data-rbd-draggable-id="Updated At"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Updated At
+                          <i
+                            aria-hidden="true"
+                            class="pi pi-sort-up"
+                          />
+                        </div>
                       </div>
-                    </div>
-                    <div>
-                      <div
-                        class="table-filter"
-                      >
+                      <div>
                         <div
-                          class="flatpickr-range-filter"
-                          data-enable-time="true"
-                          data-input="true"
-                          title="Enter the date & time range to search and press ‘Ok’ button"
+                          class="table-filter"
                         >
-                          <input
-                            class="p-inputtext p-component calendar-input flatpickr-input"
+                          <div
+                            class="flatpickr-range-filter"
+                            data-enable-time="true"
                             data-input="true"
-                            type="text"
-                          />
-                          <button
-                            class="p-button p-component p-button-icon-only calendar-button"
-                            data-toggle="true"
-                            title="Click to select the date range"
+                            title="Enter the date & time range to search and press ‘Ok’ button"
                           >
-                            <i
-                              class="fas fa-calendar"
+                            <input
+                              class="p-inputtext p-component calendar-input flatpickr-input"
+                              data-input="true"
+                              type="text"
                             />
-                          </button>
-                          <button
-                            class="p-button p-component p-button-icon-only calendar-reset"
-                            title="Clear date range"
-                          >
-                            <i
-                              class="pi pi-times"
-                              style="color: white;"
-                            />
-                          </button>
+                            <button
+                              class="p-button p-component p-button-icon-only calendar-button"
+                              data-toggle="true"
+                              title="Click to select the date range"
+                            >
+                              <i
+                                class="fas fa-calendar"
+                              />
+                            </button>
+                            <button
+                              class="p-button p-component p-button-icon-only calendar-reset"
+                              title="Clear date range"
+                            >
+                              <i
+                                class="pi pi-times"
+                                style="color: white;"
+                              />
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
               <th
                 class="notfixed-column-td-Accepted"
                 role="tablehead"
-                style="display: flex;"
               >
                 <div
-                  style="display: flex;"
+                  style="display: flex; flex-direction: row; height: 100%;"
                 >
                   <div
-                    style="display: grid; vertical-align: bottom;"
+                    style="display: flex;"
                   >
                     <div
-                      class=""
-                      colspan="1"
-                      role="columnheader"
-                      style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                      style="display: grid; vertical-align: bottom;"
                     >
                       <div
-                        aria-describedby="rbd-hidden-text-1-hidden-text-11"
-                        data-rbd-drag-handle-context-id="1"
-                        data-rbd-drag-handle-draggable-id="Accepted"
-                        data-rbd-draggable-context-id="1"
-                        data-rbd-draggable-id="Accepted"
-                        draggable="false"
-                        role="button"
-                        style="transform: translate(0,0); user-select: none; cursor: default;"
-                        tabindex="0"
+                        class=""
+                        colspan="1"
+                        role="columnheader"
+                        style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                       >
-                        Accepted
+                        <div
+                          aria-describedby="rbd-hidden-text-1-hidden-text-11"
+                          data-rbd-drag-handle-context-id="1"
+                          data-rbd-drag-handle-draggable-id="Accepted"
+                          data-rbd-draggable-context-id="1"
+                          data-rbd-draggable-id="Accepted"
+                          draggable="false"
+                          role="button"
+                          style="transform: translate(0,0); user-select: none; cursor: default;"
+                          tabindex="0"
+                        >
+                          Accepted
+                        </div>
                       </div>
+                      <div />
                     </div>
-                    <div />
                   </div>
+                  <div
+                    class="resizer "
+                    draggable="false"
+                    role="separator"
+                    style="cursor: col-resize;"
+                  />
                 </div>
-                <div
-                  class="resizer "
-                  draggable="false"
-                  role="separator"
-                  style="cursor: col-resize;"
-                />
               </th>
             </tr>
           </thead>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/tests/workflow/stepfour/__snapshots__/workflow.test_step_four.test.js.snap b/SAS/TMSS/frontend/tmss_webapp/src/tests/workflow/stepfour/__snapshots__/workflow.test_step_four.test.js.snap
index 394dbd3cacec6629a6bcca94969c58f100f346f0..55a1de6ede734fe52032c00d5ba7bb21d946de82 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/tests/workflow/stepfour/__snapshots__/workflow.test_step_four.test.js.snap
+++ b/SAS/TMSS/frontend/tmss_webapp/src/tests/workflow/stepfour/__snapshots__/workflow.test_step_four.test.js.snap
@@ -1938,1265 +1938,1316 @@ exports[`Workflow  Step Four Workflow Step Four  Renders correctly with data and
                       <th
                         class="fixed-column-td"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class="fixed-column"
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Action"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
+                                class="fixed-column"
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                               >
-                                Action
+                                <div
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Action"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                >
+                                  Action
+                                </div>
                               </div>
+                              <div />
                             </div>
-                            <div />
                           </div>
                         </div>
                       </th>
                       <th
                         class="notfixed-column-td-SystemEventId"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="System Event Id"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="System Event Id"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                System Event Id
-                                <i
-                                  aria-hidden="true"
-                                  class="pi pi-sort-up"
-                                />
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="System Event Id"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="System Event Id"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  System Event Id
+                                  <i
+                                    aria-hidden="true"
+                                    class="pi pi-sort-up"
+                                  />
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Created"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Created"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Created"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Created
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Created"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Created"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Created
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                              >
+                              <div>
                                 <div
-                                  class="flatpickr-range-filter"
-                                  data-enable-time="true"
-                                  data-input="true"
-                                  title="Enter the date & time range to search and press ‘Ok’ button"
+                                  class="table-filter"
                                 >
-                                  <input
-                                    class="p-inputtext p-component calendar-input flatpickr-input"
+                                  <div
+                                    class="flatpickr-range-filter"
+                                    data-enable-time="true"
                                     data-input="true"
-                                    type="text"
-                                  />
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-button"
-                                    data-toggle="true"
-                                    title="Click to select the date range"
+                                    title="Enter the date & time range to search and press ‘Ok’ button"
                                   >
-                                    <i
-                                      class="fas fa-calendar"
+                                    <input
+                                      class="p-inputtext p-component calendar-input flatpickr-input"
+                                      data-input="true"
+                                      type="text"
                                     />
-                                  </button>
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-reset"
-                                    title="Clear date range"
-                                  >
-                                    <i
-                                      class="pi pi-times"
-                                      style="color: white;"
-                                    />
-                                  </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-button"
+                                      data-toggle="true"
+                                      title="Click to select the date range"
+                                    >
+                                      <i
+                                        class="fas fa-calendar"
+                                      />
+                                    </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-reset"
+                                      title="Clear date range"
+                                    >
+                                      <i
+                                        class="pi pi-times"
+                                        style="color: white;"
+                                      />
+                                    </button>
+                                  </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Name"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Name"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Name"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Name
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Name"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Name"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Name
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Description"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Description"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Description"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Description
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Description"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Description"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Description
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-StartTime"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Start Time"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Start Time"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Start Time
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Start Time"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Start Time"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Start Time
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                              >
+                              <div>
                                 <div
-                                  class="flatpickr-range-filter"
-                                  data-enable-time="true"
-                                  data-input="true"
-                                  title="Enter the date & time range to search and press ‘Ok’ button"
+                                  class="table-filter"
                                 >
-                                  <input
-                                    class="p-inputtext p-component calendar-input flatpickr-input"
+                                  <div
+                                    class="flatpickr-range-filter"
+                                    data-enable-time="true"
                                     data-input="true"
-                                    type="text"
-                                  />
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-button"
-                                    data-toggle="true"
-                                    title="Click to select the date range"
-                                  >
-                                    <i
-                                      class="fas fa-calendar"
-                                    />
-                                  </button>
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-reset"
-                                    title="Clear date range"
+                                    title="Enter the date & time range to search and press ‘Ok’ button"
                                   >
-                                    <i
-                                      class="pi pi-times"
-                                      style="color: white;"
+                                    <input
+                                      class="p-inputtext p-component calendar-input flatpickr-input"
+                                      data-input="true"
+                                      type="text"
                                     />
-                                  </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-button"
+                                      data-toggle="true"
+                                      title="Click to select the date range"
+                                    >
+                                      <i
+                                        class="fas fa-calendar"
+                                      />
+                                    </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-reset"
+                                      title="Clear date range"
+                                    >
+                                      <i
+                                        class="pi pi-times"
+                                        style="color: white;"
+                                      />
+                                    </button>
+                                  </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-EndTime"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="End Time"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="End Time"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                End Time
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="End Time"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="End Time"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  End Time
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                              >
+                              <div>
                                 <div
-                                  class="flatpickr-range-filter"
-                                  data-enable-time="true"
-                                  data-input="true"
-                                  title="Enter the date & time range to search and press ‘Ok’ button"
+                                  class="table-filter"
                                 >
-                                  <input
-                                    class="p-inputtext p-component calendar-input flatpickr-input"
+                                  <div
+                                    class="flatpickr-range-filter"
+                                    data-enable-time="true"
                                     data-input="true"
-                                    type="text"
-                                  />
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-button"
-                                    data-toggle="true"
-                                    title="Click to select the date range"
+                                    title="Enter the date & time range to search and press ‘Ok’ button"
                                   >
-                                    <i
-                                      class="fas fa-calendar"
+                                    <input
+                                      class="p-inputtext p-component calendar-input flatpickr-input"
+                                      data-input="true"
+                                      type="text"
                                     />
-                                  </button>
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-reset"
-                                    title="Clear date range"
-                                  >
-                                    <i
-                                      class="pi pi-times"
-                                      style="color: white;"
-                                    />
-                                  </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-button"
+                                      data-toggle="true"
+                                      title="Click to select the date range"
+                                    >
+                                      <i
+                                        class="fas fa-calendar"
+                                      />
+                                    </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-reset"
+                                      title="Clear date range"
+                                    >
+                                      <i
+                                        class="pi pi-times"
+                                        style="color: white;"
+                                      />
+                                    </button>
+                                  </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Duration"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Duration"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Duration"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Duration
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Duration"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Duration"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Duration
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-IssueType"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Issue Type"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Issue Type"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Issue Type
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  style="position: relative; display: flex;"
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Issue Type"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Issue Type"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Issue Type
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 85%;"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
+                                      data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 85%;"
                                     >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-hidden-accessible"
+                                        data-pc-section="hiddeninputwrapper"
                                       >
-                                        empty
+                                        <input
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
+                                        />
                                       </div>
-                                    </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
+                                      <div
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
+                                        <div
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
+                                      >
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-IssueSubtype"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Issue Subtype"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Issue Subtype"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Issue Subtype
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  style="position: relative; display: flex;"
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Issue Subtype"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Issue Subtype"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Issue Subtype
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 85%;"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
+                                      data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 85%;"
                                     >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-hidden-accessible"
+                                        data-pc-section="hiddeninputwrapper"
                                       >
-                                        empty
+                                        <input
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
+                                        />
                                       </div>
-                                    </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
+                                      <div
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
+                                        <div
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
+                                      >
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Severity"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Severity"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Severity"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Severity
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  style="position: relative; display: flex;"
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Severity"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Severity"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Severity
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 85%;"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
+                                      data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 85%;"
                                     >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-hidden-accessible"
+                                        data-pc-section="hiddeninputwrapper"
                                       >
-                                        empty
+                                        <input
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
+                                        />
                                       </div>
-                                    </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
+                                      <div
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
+                                        <div
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
+                                      >
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-CreatedBy"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Created By"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Created By"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Created By
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Created By"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Created By"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Created By
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Notes"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Notes"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Notes"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Notes
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Notes"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Notes"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Notes
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Status"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Status"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Status"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Status
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  style="position: relative; display: flex;"
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Status"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Status"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Status
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 85%;"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
+                                      data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 85%;"
                                     >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-hidden-accessible"
+                                        data-pc-section="hiddeninputwrapper"
                                       >
-                                        empty
+                                        <input
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
+                                        />
                                       </div>
-                                    </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
+                                      <div
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
+                                        <div
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
+                                      >
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-AffectedHardwareStations"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Affected Hardware Stations"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Affected Hardware Stations"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                               >
-                                Affected Hardware Stations
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  class="flex "
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Affected Hardware Stations"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Affected Hardware Stations"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Affected Hardware Stations
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-field-radiobutton"
+                                    class="flex "
                                   >
                                     <div
-                                      class="p-radiobutton p-component p-radiobutton-checked"
-                                      data-pc-name="radiobutton"
-                                      data-pc-section="root"
+                                      class="p-field-radiobutton"
                                     >
                                       <div
-                                        class="p-hidden-accessible"
-                                        data-pc-section="hiddeninputwrapper"
+                                        class="p-radiobutton p-component p-radiobutton-checked"
+                                        data-pc-name="radiobutton"
+                                        data-pc-section="root"
                                       >
-                                        <input
-                                          checked=""
-                                          data-pc-section="hiddeninput"
-                                          id="filtertype1"
-                                          name="filtertype"
-                                          type="radio"
-                                        />
+                                        <div
+                                          class="p-hidden-accessible"
+                                          data-pc-section="hiddeninputwrapper"
+                                        >
+                                          <input
+                                            checked=""
+                                            data-pc-section="hiddeninput"
+                                            id="filtertype1"
+                                            name="filtertype"
+                                            type="radio"
+                                          />
+                                        </div>
+                                        <div
+                                          class="p-radiobutton-box p-highlight"
+                                          data-pc-section="input"
+                                        >
+                                          <div
+                                            class="p-radiobutton-icon"
+                                            data-pc-section="icon"
+                                          />
+                                        </div>
                                       </div>
+                                      <label
+                                        for="filtertype1"
+                                      >
+                                        Any
+                                      </label>
+                                    </div>
+                                    <div
+                                      class="p-field-radiobutton"
+                                    >
                                       <div
-                                        class="p-radiobutton-box p-highlight"
-                                        data-pc-section="input"
+                                        class="p-radiobutton p-component"
+                                        data-pc-name="radiobutton"
+                                        data-pc-section="root"
                                       >
                                         <div
-                                          class="p-radiobutton-icon"
-                                          data-pc-section="icon"
-                                        />
+                                          class="p-hidden-accessible"
+                                          data-pc-section="hiddeninputwrapper"
+                                        >
+                                          <input
+                                            data-pc-section="hiddeninput"
+                                            id="filtertype2"
+                                            name="filtertype"
+                                            type="radio"
+                                          />
+                                        </div>
+                                        <div
+                                          class="p-radiobutton-box"
+                                          data-pc-section="input"
+                                        >
+                                          <div
+                                            class="p-radiobutton-icon"
+                                            data-pc-section="icon"
+                                          />
+                                        </div>
                                       </div>
+                                      <label
+                                        for="filtertype2"
+                                      >
+                                        All
+                                      </label>
                                     </div>
-                                    <label
-                                      for="filtertype1"
-                                    >
-                                      Any
-                                    </label>
                                   </div>
                                   <div
-                                    class="p-field-radiobutton"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-radiobutton p-component"
-                                      data-pc-name="radiobutton"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
                                       data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 95%;"
                                     >
                                       <div
                                         class="p-hidden-accessible"
                                         data-pc-section="hiddeninputwrapper"
                                       >
                                         <input
-                                          data-pc-section="hiddeninput"
-                                          id="filtertype2"
-                                          name="filtertype"
-                                          type="radio"
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
                                         />
                                       </div>
                                       <div
-                                        class="p-radiobutton-box"
-                                        data-pc-section="input"
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
                                         <div
-                                          class="p-radiobutton-icon"
-                                          data-pc-section="icon"
-                                        />
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
                                       </div>
-                                    </div>
-                                    <label
-                                      for="filtertype2"
-                                    >
-                                      All
-                                    </label>
-                                  </div>
-                                </div>
-                                <div
-                                  style="position: relative; display: flex;"
-                                >
-                                  <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 95%;"
-                                  >
-                                    <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
-                                    >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
                                       >
-                                        empty
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
                                       </div>
                                     </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
-                                      >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
-                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-AffectedTasks"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Affected Tasks"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Affected Tasks"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                               >
-                                Affected Tasks
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Affected Tasks"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Affected Tasks"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Affected Tasks
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-JiraURL"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Jira URL"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Jira URL"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Jira URL
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Jira URL"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Jira URL"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Jira URL
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                     </tr>
                   </thead>
@@ -6788,1265 +6839,1316 @@ exports[`Workflow  Step Four Workflow Step Four  Renders correctly with data and
                       <th
                         class="fixed-column-td"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class="fixed-column"
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Action"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
+                                class="fixed-column"
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                               >
-                                Action
+                                <div
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Action"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                >
+                                  Action
+                                </div>
                               </div>
+                              <div />
                             </div>
-                            <div />
                           </div>
                         </div>
                       </th>
                       <th
                         class="notfixed-column-td-SystemEventId"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="System Event Id"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="System Event Id"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                System Event Id
-                                <i
-                                  aria-hidden="true"
-                                  class="pi pi-sort-up"
-                                />
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="System Event Id"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="System Event Id"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  System Event Id
+                                  <i
+                                    aria-hidden="true"
+                                    class="pi pi-sort-up"
+                                  />
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Created"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Created"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Created"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Created
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Created"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Created"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Created
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                              >
+                              <div>
                                 <div
-                                  class="flatpickr-range-filter"
-                                  data-enable-time="true"
-                                  data-input="true"
-                                  title="Enter the date & time range to search and press ‘Ok’ button"
+                                  class="table-filter"
                                 >
-                                  <input
-                                    class="p-inputtext p-component calendar-input flatpickr-input"
+                                  <div
+                                    class="flatpickr-range-filter"
+                                    data-enable-time="true"
                                     data-input="true"
-                                    type="text"
-                                  />
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-button"
-                                    data-toggle="true"
-                                    title="Click to select the date range"
-                                  >
-                                    <i
-                                      class="fas fa-calendar"
-                                    />
-                                  </button>
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-reset"
-                                    title="Clear date range"
+                                    title="Enter the date & time range to search and press ‘Ok’ button"
                                   >
-                                    <i
-                                      class="pi pi-times"
-                                      style="color: white;"
+                                    <input
+                                      class="p-inputtext p-component calendar-input flatpickr-input"
+                                      data-input="true"
+                                      type="text"
                                     />
-                                  </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-button"
+                                      data-toggle="true"
+                                      title="Click to select the date range"
+                                    >
+                                      <i
+                                        class="fas fa-calendar"
+                                      />
+                                    </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-reset"
+                                      title="Clear date range"
+                                    >
+                                      <i
+                                        class="pi pi-times"
+                                        style="color: white;"
+                                      />
+                                    </button>
+                                  </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Name"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Name"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Name"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Name
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Name"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Name"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Name
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Description"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Description"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Description"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Description
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Description"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Description"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Description
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-StartTime"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Start Time"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Start Time"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Start Time
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Start Time"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Start Time"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Start Time
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                              >
+                              <div>
                                 <div
-                                  class="flatpickr-range-filter"
-                                  data-enable-time="true"
-                                  data-input="true"
-                                  title="Enter the date & time range to search and press ‘Ok’ button"
+                                  class="table-filter"
                                 >
-                                  <input
-                                    class="p-inputtext p-component calendar-input flatpickr-input"
+                                  <div
+                                    class="flatpickr-range-filter"
+                                    data-enable-time="true"
                                     data-input="true"
-                                    type="text"
-                                  />
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-button"
-                                    data-toggle="true"
-                                    title="Click to select the date range"
+                                    title="Enter the date & time range to search and press ‘Ok’ button"
                                   >
-                                    <i
-                                      class="fas fa-calendar"
+                                    <input
+                                      class="p-inputtext p-component calendar-input flatpickr-input"
+                                      data-input="true"
+                                      type="text"
                                     />
-                                  </button>
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-reset"
-                                    title="Clear date range"
-                                  >
-                                    <i
-                                      class="pi pi-times"
-                                      style="color: white;"
-                                    />
-                                  </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-button"
+                                      data-toggle="true"
+                                      title="Click to select the date range"
+                                    >
+                                      <i
+                                        class="fas fa-calendar"
+                                      />
+                                    </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-reset"
+                                      title="Clear date range"
+                                    >
+                                      <i
+                                        class="pi pi-times"
+                                        style="color: white;"
+                                      />
+                                    </button>
+                                  </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-EndTime"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="End Time"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="End Time"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                End Time
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="End Time"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="End Time"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  End Time
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                              >
+                              <div>
                                 <div
-                                  class="flatpickr-range-filter"
-                                  data-enable-time="true"
-                                  data-input="true"
-                                  title="Enter the date & time range to search and press ‘Ok’ button"
+                                  class="table-filter"
                                 >
-                                  <input
-                                    class="p-inputtext p-component calendar-input flatpickr-input"
+                                  <div
+                                    class="flatpickr-range-filter"
+                                    data-enable-time="true"
                                     data-input="true"
-                                    type="text"
-                                  />
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-button"
-                                    data-toggle="true"
-                                    title="Click to select the date range"
-                                  >
-                                    <i
-                                      class="fas fa-calendar"
-                                    />
-                                  </button>
-                                  <button
-                                    class="p-button p-component p-button-icon-only calendar-reset"
-                                    title="Clear date range"
+                                    title="Enter the date & time range to search and press ‘Ok’ button"
                                   >
-                                    <i
-                                      class="pi pi-times"
-                                      style="color: white;"
+                                    <input
+                                      class="p-inputtext p-component calendar-input flatpickr-input"
+                                      data-input="true"
+                                      type="text"
                                     />
-                                  </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-button"
+                                      data-toggle="true"
+                                      title="Click to select the date range"
+                                    >
+                                      <i
+                                        class="fas fa-calendar"
+                                      />
+                                    </button>
+                                    <button
+                                      class="p-button p-component p-button-icon-only calendar-reset"
+                                      title="Clear date range"
+                                    >
+                                      <i
+                                        class="pi pi-times"
+                                        style="color: white;"
+                                      />
+                                    </button>
+                                  </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Duration"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Duration"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Duration"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Duration
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Duration"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Duration"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Duration
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-IssueType"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Issue Type"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Issue Type"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Issue Type
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  style="position: relative; display: flex;"
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Issue Type"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Issue Type"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Issue Type
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 85%;"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
+                                      data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 85%;"
                                     >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-hidden-accessible"
+                                        data-pc-section="hiddeninputwrapper"
+                                      >
+                                        <input
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
+                                        />
+                                      </div>
+                                      <div
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
-                                        empty
+                                        <div
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
                                       </div>
-                                    </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
+                                      <div
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
                                       >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-IssueSubtype"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Issue Subtype"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Issue Subtype"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Issue Subtype
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  style="position: relative; display: flex;"
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Issue Subtype"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Issue Subtype"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Issue Subtype
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 85%;"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
+                                      data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 85%;"
                                     >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-hidden-accessible"
+                                        data-pc-section="hiddeninputwrapper"
                                       >
-                                        empty
+                                        <input
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
+                                        />
                                       </div>
-                                    </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
+                                      <div
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
+                                        <div
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
+                                      >
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Severity"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Severity"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Severity"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Severity
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  style="position: relative; display: flex;"
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Severity"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Severity"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Severity
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 85%;"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
+                                      data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 85%;"
                                     >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-hidden-accessible"
+                                        data-pc-section="hiddeninputwrapper"
                                       >
-                                        empty
+                                        <input
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
+                                        />
                                       </div>
-                                    </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
+                                      <div
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
+                                        <div
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
+                                      >
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-CreatedBy"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Created By"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Created By"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Created By
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Created By"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Created By"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Created By
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Notes"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Notes"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Notes"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Notes
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Notes"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Notes"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Notes
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-Status"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Status"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Status"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Status
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  style="position: relative; display: flex;"
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Status"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Status"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Status
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 85%;"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
+                                      data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 85%;"
                                     >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-hidden-accessible"
+                                        data-pc-section="hiddeninputwrapper"
                                       >
-                                        empty
+                                        <input
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
+                                        />
                                       </div>
-                                    </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
+                                      <div
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
+                                        <div
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
+                                      >
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-AffectedHardwareStations"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Affected Hardware Stations"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Affected Hardware Stations"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                               >
-                                Affected Hardware Stations
-                              </div>
-                            </div>
-                            <div>
-                              <div>
                                 <div
-                                  class="flex "
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Affected Hardware Stations"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Affected Hardware Stations"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
                                 >
+                                  Affected Hardware Stations
+                                </div>
+                              </div>
+                              <div>
+                                <div>
                                   <div
-                                    class="p-field-radiobutton"
+                                    class="flex "
                                   >
                                     <div
-                                      class="p-radiobutton p-component p-radiobutton-checked"
-                                      data-pc-name="radiobutton"
-                                      data-pc-section="root"
+                                      class="p-field-radiobutton"
                                     >
                                       <div
-                                        class="p-hidden-accessible"
-                                        data-pc-section="hiddeninputwrapper"
+                                        class="p-radiobutton p-component p-radiobutton-checked"
+                                        data-pc-name="radiobutton"
+                                        data-pc-section="root"
                                       >
-                                        <input
-                                          checked=""
-                                          data-pc-section="hiddeninput"
-                                          id="filtertype1"
-                                          name="filtertype"
-                                          type="radio"
-                                        />
+                                        <div
+                                          class="p-hidden-accessible"
+                                          data-pc-section="hiddeninputwrapper"
+                                        >
+                                          <input
+                                            checked=""
+                                            data-pc-section="hiddeninput"
+                                            id="filtertype1"
+                                            name="filtertype"
+                                            type="radio"
+                                          />
+                                        </div>
+                                        <div
+                                          class="p-radiobutton-box p-highlight"
+                                          data-pc-section="input"
+                                        >
+                                          <div
+                                            class="p-radiobutton-icon"
+                                            data-pc-section="icon"
+                                          />
+                                        </div>
                                       </div>
+                                      <label
+                                        for="filtertype1"
+                                      >
+                                        Any
+                                      </label>
+                                    </div>
+                                    <div
+                                      class="p-field-radiobutton"
+                                    >
                                       <div
-                                        class="p-radiobutton-box p-highlight"
-                                        data-pc-section="input"
+                                        class="p-radiobutton p-component"
+                                        data-pc-name="radiobutton"
+                                        data-pc-section="root"
                                       >
                                         <div
-                                          class="p-radiobutton-icon"
-                                          data-pc-section="icon"
-                                        />
+                                          class="p-hidden-accessible"
+                                          data-pc-section="hiddeninputwrapper"
+                                        >
+                                          <input
+                                            data-pc-section="hiddeninput"
+                                            id="filtertype2"
+                                            name="filtertype"
+                                            type="radio"
+                                          />
+                                        </div>
+                                        <div
+                                          class="p-radiobutton-box"
+                                          data-pc-section="input"
+                                        >
+                                          <div
+                                            class="p-radiobutton-icon"
+                                            data-pc-section="icon"
+                                          />
+                                        </div>
                                       </div>
+                                      <label
+                                        for="filtertype2"
+                                      >
+                                        All
+                                      </label>
                                     </div>
-                                    <label
-                                      for="filtertype1"
-                                    >
-                                      Any
-                                    </label>
                                   </div>
                                   <div
-                                    class="p-field-radiobutton"
+                                    style="position: relative; display: flex;"
                                   >
                                     <div
-                                      class="p-radiobutton p-component"
-                                      data-pc-name="radiobutton"
+                                      class="p-multiselect p-component p-inputwrapper multi-select"
+                                      data-pc-name="multiselect"
                                       data-pc-section="root"
+                                      data-testid="multi-select"
+                                      id="multi-select"
+                                      style="width: 95%;"
                                     >
                                       <div
                                         class="p-hidden-accessible"
                                         data-pc-section="hiddeninputwrapper"
                                       >
                                         <input
-                                          data-pc-section="hiddeninput"
-                                          id="filtertype2"
-                                          name="filtertype"
-                                          type="radio"
+                                          aria-expanded="false"
+                                          data-pc-section="input"
+                                          readonly=""
+                                          role="listbox"
+                                          tabindex="0"
+                                          type="text"
                                         />
                                       </div>
                                       <div
-                                        class="p-radiobutton-box"
-                                        data-pc-section="input"
+                                        class="p-multiselect-label-container"
+                                        data-pc-section="labelcontainer"
                                       >
                                         <div
-                                          class="p-radiobutton-icon"
-                                          data-pc-section="icon"
-                                        />
+                                          class="p-multiselect-label p-multiselect-label-empty"
+                                          data-pc-section="label"
+                                        >
+                                          empty
+                                        </div>
                                       </div>
-                                    </div>
-                                    <label
-                                      for="filtertype2"
-                                    >
-                                      All
-                                    </label>
-                                  </div>
-                                </div>
-                                <div
-                                  style="position: relative; display: flex;"
-                                >
-                                  <div
-                                    class="p-multiselect p-component p-inputwrapper multi-select"
-                                    data-pc-name="multiselect"
-                                    data-pc-section="root"
-                                    data-testid="multi-select"
-                                    id="multi-select"
-                                    style="width: 95%;"
-                                  >
-                                    <div
-                                      class="p-hidden-accessible"
-                                      data-pc-section="hiddeninputwrapper"
-                                    >
-                                      <input
-                                        aria-expanded="false"
-                                        data-pc-section="input"
-                                        readonly=""
-                                        role="listbox"
-                                        tabindex="0"
-                                        type="text"
-                                      />
-                                    </div>
-                                    <div
-                                      class="p-multiselect-label-container"
-                                      data-pc-section="labelcontainer"
-                                    >
                                       <div
-                                        class="p-multiselect-label p-multiselect-label-empty"
-                                        data-pc-section="label"
+                                        class="p-multiselect-trigger"
+                                        data-pc-section="trigger"
                                       >
-                                        empty
+                                        <svg
+                                          aria-hidden="true"
+                                          class="p-icon p-multiselect-trigger-icon p-c"
+                                          data-pc-section="triggericon"
+                                          fill="none"
+                                          height="14"
+                                          viewBox="0 0 14 14"
+                                          width="14"
+                                          xmlns="http://www.w3.org/2000/svg"
+                                        >
+                                          <path
+                                            d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
+                                            fill="currentColor"
+                                          />
+                                        </svg>
                                       </div>
                                     </div>
-                                    <div
-                                      class="p-multiselect-trigger"
-                                      data-pc-section="trigger"
-                                    >
-                                      <svg
-                                        aria-hidden="true"
-                                        class="p-icon p-multiselect-trigger-icon p-c"
-                                        data-pc-section="triggericon"
-                                        fill="none"
-                                        height="14"
-                                        viewBox="0 0 14 14"
-                                        width="14"
-                                        xmlns="http://www.w3.org/2000/svg"
-                                      >
-                                        <path
-                                          d="M7.01744 10.398C6.91269 10.3985 6.8089 10.378 6.71215 10.3379C6.61541 10.2977 6.52766 10.2386 6.45405 10.1641L1.13907 4.84913C1.03306 4.69404 0.985221 4.5065 1.00399 4.31958C1.02276 4.13266 1.10693 3.95838 1.24166 3.82747C1.37639 3.69655 1.55301 3.61742 1.74039 3.60402C1.92777 3.59062 2.11386 3.64382 2.26584 3.75424L7.01744 8.47394L11.769 3.75424C11.9189 3.65709 12.097 3.61306 12.2748 3.62921C12.4527 3.64535 12.6199 3.72073 12.7498 3.84328C12.8797 3.96582 12.9647 4.12842 12.9912 4.30502C13.0177 4.48162 12.9841 4.662 12.8958 4.81724L7.58083 10.1322C7.50996 10.2125 7.42344 10.2775 7.32656 10.3232C7.22968 10.3689 7.12449 10.3944 7.01744 10.398Z"
-                                          fill="currentColor"
-                                        />
-                                      </svg>
-                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-AffectedTasks"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Affected Tasks"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Affected Tasks"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative;"
                               >
-                                Affected Tasks
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Affected Tasks"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Affected Tasks"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Affected Tasks
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                       <th
                         class="notfixed-column-td-JiraURL"
                         role="tablehead"
-                        style="display: flex;"
                       >
                         <div
-                          style="display: flex;"
+                          style="display: flex; flex-direction: row; height: 100%;"
                         >
                           <div
-                            style="display: grid; vertical-align: bottom;"
+                            style="display: flex;"
                           >
                             <div
-                              class=""
-                              colspan="1"
-                              role="columnheader"
-                              style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
-                              title="Toggle SortBy"
+                              style="display: grid; vertical-align: bottom;"
                             >
                               <div
-                                aria-describedby="rbd-hidden-text-1-hidden-text-19"
-                                data-rbd-drag-handle-context-id="1"
-                                data-rbd-drag-handle-draggable-id="Jira URL"
-                                data-rbd-draggable-context-id="1"
-                                data-rbd-draggable-id="Jira URL"
-                                draggable="false"
-                                role="button"
-                                style="transform: translate(0,0); user-select: none; cursor: default;"
-                                tabindex="0"
+                                class=""
+                                colspan="1"
+                                role="columnheader"
+                                style="box-sizing: border-box; flex: 150 0 auto; min-width: 60px; width: 150px; position: relative; cursor: pointer;"
+                                title="Toggle SortBy"
                               >
-                                Jira URL
+                                <div
+                                  aria-describedby="rbd-hidden-text-1-hidden-text-19"
+                                  data-rbd-drag-handle-context-id="1"
+                                  data-rbd-drag-handle-draggable-id="Jira URL"
+                                  data-rbd-draggable-context-id="1"
+                                  data-rbd-draggable-id="Jira URL"
+                                  draggable="false"
+                                  role="button"
+                                  style="transform: translate(0,0); user-select: none; cursor: default;"
+                                  tabindex="0"
+                                >
+                                  Jira URL
+                                </div>
                               </div>
-                            </div>
-                            <div>
-                              <div
-                                class="table-filter"
-                                style="margin-right: 5px;"
-                              >
-                                <input
-                                  title="Enter few characters and press ‘Enter’ key to search"
-                                  value=""
-                                />
+                              <div>
+                                <div
+                                  class="table-filter"
+                                  style="margin-right: 5px;"
+                                >
+                                  <input
+                                    title="Enter few characters and press ‘Enter’ key to search"
+                                    value=""
+                                  />
+                                </div>
                               </div>
                             </div>
                           </div>
+                          <div
+                            class="resizer "
+                            draggable="false"
+                            role="separator"
+                            style="cursor: col-resize;"
+                          />
                         </div>
-                        <div
-                          class="resizer "
-                          draggable="false"
-                          role="separator"
-                          style="cursor: col-resize;"
-                        />
                       </th>
                     </tr>
                   </thead>