fix: set popover height correctly based on position (#557)

Author: arjunlalb

projects/components/src/overlay/sheet/sheet-overlay.component.ts

@@ -2,7 +2,7 @@ import { ChangeDetectionStrategy, Component, Inject, Injector, TemplateRef, Type
 import { IconType } from '@hypertrace/assets-library';
 import { GLOBAL_HEADER_HEIGHT, LayoutChangeService } from '@hypertrace/common';
 import { ButtonStyle } from '../../button/button';
-import { POPOVER_DATA } from '../../popover/popover';
+import { PopoverFixedPositionLocation, POPOVER_DATA } from '../../popover/popover';
 import { PopoverRef } from '../../popover/popover-ref';
 import { SheetConstructionData } from '../overlay.service';
 import { SheetOverlayConfig, SheetSize } from './sheet';
@@ -58,7 +58,7 @@ export class SheetOverlayComponent {
     this.size = sheetConfig.size;
     this.isComponentSheet = !(sheetConfig.content instanceof TemplateRef);
     this.renderer = sheetConfig.content;
-    this.popoverRef.height(`calc(100vh - ${globalHeaderHeight})`);
+    this.popoverRef.height(this.getHeightForPopover(globalHeaderHeight, sheetConfig.position));
 
     if (this.size === SheetSize.ResponsiveExtraLarge) {
       this.popoverRef.width('60%');
@@ -79,4 +79,8 @@ export class SheetOverlayComponent {
     this.visible = false;
     this.popoverRef.close();
   }
+
+  private getHeightForPopover(globalHeaderHeight: string, position?: PopoverFixedPositionLocation): string {
+    return position === PopoverFixedPositionLocation.Right ? '100vh' : `calc(100vh - ${globalHeaderHeight})`;
+  }
 }