mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-02-07 01:25:38 -05:00
dashboard improvement (#9730)
* dashboard improvement - WIP (#8836) * wip * wip * tabgroup * tab group * agent views * clean up * formats * feedback * fix error * contribute top level server/db dashboard tab (#8868) * tabbedPanel component (#8861) * tabbed panel * tabbed panel * fix errors * revert main.ts changes * use margin * address comments * remove orientation property * content tab group (#8878) * add databases tab * use more extensible approach * remove unnecessary code * add when expression * objects tab for database dashboard (#8892) * fix build errors * fix build error * Dashboard toolbar (#9118) * remove old toolbar with only edit and refresh * remove tasks widgets from server and databases dashboards * adding toolbar to dashboardpage and clicking new query works * restore and new notebook now do something * add backup to toolbar for database dashboards * new notebook connects to db * only show backup and restore for non-azure * new backup and restore svgs * clean up * got toolbar actions to show up from contribution * some cleanup and add database dashboard toolbar contributions * don't show all tasks when there should be no tasks * fix toolbar showing multiple times when switching opening another dashboard from OE * only show toolbar for home page * update to new icons - same icons for light and dark theme * don't show separator if there aren't any actions * read toolbar actions from tasks-widget * remove tasks widget from home dashboard page * show extension's actions in toolbar * clean up * more cleaning up * fix extension actions not always loading the first time * add configure dashboard * remove old edit icon css * change tasks back to original order * make sure tasks widget is the one being removed * collapsible tab panel (#9221) * collapsible vertical tab panel * fix lint error * comments batch 1 * pr comments * update new query icon (#9351) * Update toolbar actions (#9313) * remove edit and configure dashboard and add refresh to toolbar for other dashboard pages too * Add refresh for tabs that have container type with refresh implemented * change refresh to only refresh the current tab * remove map for tab to actions * add back configure dashboard to home toolbar * check if index is -1 before trying to remove tasks widget from widgets * Move objects widget back to database home tab (#9432) * move objects widget back to database home tab and reorder toolbar * change order of actions back to previous order * Allow extensions to add actions to home toolbar (#9269) * add support for extensions to add actions to home toolbar * fix spacing * use menu contribution point * undo previous changes that added dashboardToolbarHomeAction contribution * remove home from name * add context key for tab name * allow actions to also be added to the toolbar of other tabs * add extension contributed actions even if no tasks-widget * fix refresh being added twice after merging * hide the tab list when collapsed (#9529) * update the order of css selectors (#9606) * Update dashboard style to be closer to mockups (#9570) * update style to be closer to mockups * tab panel styling * change back tab styling for tabs in a tab contributed by an extension * change color of borders when theme changes * set dark theme active tab background to same as OE for now * update border colors * move colors to theme file * fix a few issues (#9690) * couple fixes * comments * small dashboard toolbar fixes (#9695) * fix backup icon in toolbar * fix database page toolbar border color * add back center center in common-icons.css (#9703) * change padding so bottom border shows again (#9710) * tab panel fixes (#9724) * tab panel fixes * fix package.nls.json * feedbacks (#9761) * feedbacks * remove comments Co-authored-by: Kim Santiago <31145923+kisantia@users.noreply.github.com>
This commit is contained in:
@@ -5,7 +5,7 @@
|
||||
*--------------------------------------------------------------------------------------------*/
|
||||
-->
|
||||
<div #parent style="position: absolute; height: 100%; width: 100%;">
|
||||
<div [style.margin-right.px]="_clipped ? 30 : 0" [style.width]="_clipped ? 94 + '%' : '100%'" style="overflow: hidden">
|
||||
<div #container [style.margin-right.px]="_clipped ? 30 : 0" [style.width]="_clipped ? 94 + '%' : '100%'" style="overflow: hidden; padding-bottom: 10px">
|
||||
<span #child style="white-space : nowrap; width: fit-content">
|
||||
<ng-template ngFor let-item [ngForOf]="properties">
|
||||
<span style="margin-left: 10px; display: inline-block;">
|
||||
|
||||
@@ -18,6 +18,9 @@ import * as nls from 'vs/nls';
|
||||
import { Registry } from 'vs/platform/registry/common/platform';
|
||||
import { ILogService } from 'vs/platform/log/common/log';
|
||||
import { subscriptionToDisposable } from 'sql/base/browser/lifecycle';
|
||||
import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
|
||||
import { DASHBOARD_BORDER } from 'vs/workbench/common/theme';
|
||||
import { IColorTheme } from 'vs/platform/theme/common/themeService';
|
||||
|
||||
export interface PropertiesConfig {
|
||||
properties: Array<Property>;
|
||||
@@ -69,13 +72,15 @@ export class PropertiesWidgetComponent extends DashboardWidget implements IDashb
|
||||
|
||||
@ViewChild('child', { read: ElementRef }) private _child: ElementRef;
|
||||
@ViewChild('parent', { read: ElementRef }) private _parent: ElementRef;
|
||||
@ViewChild('container', { read: ElementRef }) private _container: ElementRef;
|
||||
|
||||
constructor(
|
||||
@Inject(forwardRef(() => CommonServiceInterface)) private _bootstrap: CommonServiceInterface,
|
||||
@Inject(forwardRef(() => ChangeDetectorRef)) private _changeRef: ChangeDetectorRef,
|
||||
@Inject(forwardRef(() => ElementRef)) private _el: ElementRef,
|
||||
@Inject(WIDGET_CONFIG) protected _config: WidgetConfig,
|
||||
@Inject(ILogService) private logService: ILogService
|
||||
@Inject(ILogService) private logService: ILogService,
|
||||
@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService
|
||||
) {
|
||||
super();
|
||||
this.init();
|
||||
@@ -85,6 +90,14 @@ export class PropertiesWidgetComponent extends DashboardWidget implements IDashb
|
||||
this._hasInit = true;
|
||||
this._register(addDisposableListener(window, EventType.RESIZE, () => this.handleClipping()));
|
||||
this._changeRef.detectChanges();
|
||||
|
||||
this._register(this.themeService.onDidColorThemeChange((event: IColorTheme) => {
|
||||
this.updateTheme(event);
|
||||
}));
|
||||
}
|
||||
|
||||
ngAfterViewInit(): void {
|
||||
this.updateTheme(this.themeService.getColorTheme());
|
||||
}
|
||||
|
||||
public refresh(): void {
|
||||
@@ -265,4 +278,9 @@ export class PropertiesWidgetComponent extends DashboardWidget implements IDashb
|
||||
}
|
||||
return val;
|
||||
}
|
||||
|
||||
private updateTheme(theme: IColorTheme): void {
|
||||
const border = theme.getColor(DASHBOARD_BORDER);
|
||||
this._container.nativeElement.style.borderBottom = '1px solid ' + border.toString();
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user