small surrounding flyout ui changes

Signed-off-by: Paul Sebastian <paulstn@amazon.com>
opensearch-project · Oct 9, 2023 · 8e90df3 · 8e90df3
1 parent 7329721
commit 8e90df3
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 8 deletions.
diff --git a/public/components/event_analytics/explorer/events_views/data_grid.tsx b/public/components/event_analytics/explorer/events_views/data_grid.tsx
@@ -142,7 +142,7 @@ export function DataGrid(props: DataGridProps) {
               explorerFields={explorerFields}
               pplService={pplService}
               rawQuery={rawQuery}
-              onFlyoutOpen={() => {}} // TODO: change this button to a minimize icon
+              onFlyoutOpen={() => {}}
               dataGridColumns={dataGridColumns}
               dataGridColumnVisibility={dataGridColumnVisibility}
               selectedIndex={rowIndex}

diff --git a/public/components/event_analytics/explorer/events_views/docViewRow.tsx b/public/components/event_analytics/explorer/events_views/docViewRow.tsx
@@ -290,7 +290,7 @@ export const FlyoutButton = forwardRef((props: FlyoutButtonProps, ref) => {
     <>
       <EuiButtonIcon
         onClick={() => toggleDetailOpen()}
-        iconType={'inspect'}
+        iconType={detailsOpen || surroundingEventsOpen ? 'minimize' : 'inspect'}
         aria-label="inspect document details"
       />
       {flyout}

diff --git a/public/components/event_analytics/explorer/events_views/surrounding_flyout.tsx b/public/components/event_analytics/explorer/events_views/surrounding_flyout.tsx
@@ -271,7 +271,7 @@ export const SurroundingFlyout = ({
 
   const flyoutBody = (
     <EuiFlyoutBody>
-      <div className="obsExplorer">
+      <div>
         {getInputForm('arrowUp', onChangeNewEvents, numNewEvents, 'new')}
         <EuiSpacer size="s" />
         <div>
@@ -286,13 +286,9 @@ export const SurroundingFlyout = ({
           columnVisibility={dataGridColumnVisibility}
           rowCount={newEventsData.length + oldEventsData.length + 1}
           renderCellValue={renderCells}
-          sorting={{
-            columns: sortingFields.current, // TODO: change this to only have timestamp from new to old
-            onSort: () => {},
-          }}
           toolbarVisibility={false}
           rowHeightsOptions={rowHeightsOptions}
-          height={800}
+          height={'60vh'}
         />
         <div>
           {oldEventsError !== '' && (