diff --git a/App/Frontend/src/app/search-table/config-map-table/config-map-table.component.ts b/App/Frontend/src/app/search-table/config-map-table/config-map-table.component.ts index 649bac5..3f879ad 100644 --- a/App/Frontend/src/app/search-table/config-map-table/config-map-table.component.ts +++ b/App/Frontend/src/app/search-table/config-map-table/config-map-table.component.ts @@ -6,6 +6,7 @@ import {Component, Input} from '@angular/core'; import {TranslatePipe} from "@ngx-translate/core"; import {ConfigMap} from "../../domain/Kubernetes"; +import {hideTooltip, showTooltip} from "../search-table-util"; @Component({ selector: 'app-config-map-table', @@ -22,25 +23,11 @@ export class ConfigMapTableComponent { protected readonly Object = Object; - showTooltip(event: MouseEvent, data: Record) { - const tooltip = document.getElementById('tooltip'); - if (tooltip) { - tooltip.textContent = data && typeof data === 'object' - ? Object.entries(data) - .map(([key, value]) => `${key}: ${value}`) - .join('\n') - : 'No data available'; - - tooltip.style.display = 'block'; - tooltip.style.left = `${event.pageX + 10}px`; - tooltip.style.top = `${event.pageY + 10}px`; - } + showTooltip(event: MouseEvent, data: Record | undefined) { + showTooltip(event, data); } hideTooltip() { - const tooltip = document.getElementById('tooltip'); - if (tooltip) { - tooltip.style.display = 'none'; - } + hideTooltip(); } } diff --git a/App/Frontend/src/app/search-table/search-table-util.ts b/App/Frontend/src/app/search-table/search-table-util.ts new file mode 100644 index 0000000..a27fc36 --- /dev/null +++ b/App/Frontend/src/app/search-table/search-table-util.ts @@ -0,0 +1,22 @@ + +export function showTooltip(event: MouseEvent, data: Record | undefined, tooltipId = 'tooltip') { + const tooltip = document.getElementById(tooltipId); + if (tooltip) { + tooltip.textContent = data && typeof data === 'object' + ? Object.entries(data) + .map(([key, value]) => `${key}: ${value}`) + .join('\n') + : 'No data available'; + + tooltip.style.display = 'block'; + tooltip.style.left = `${event.pageX + 10}px`; + tooltip.style.top = `${event.pageY + 10}px`; + } +} + +export function hideTooltip(tooltipId = 'tooltip') { + const tooltip = document.getElementById(tooltipId); + if (tooltip) { + tooltip.style.display = 'none'; + } +} \ No newline at end of file diff --git a/App/Frontend/src/app/search-table/secret-table/secret-table.component.ts b/App/Frontend/src/app/search-table/secret-table/secret-table.component.ts index da8b493..5db3ad9 100644 --- a/App/Frontend/src/app/search-table/secret-table/secret-table.component.ts +++ b/App/Frontend/src/app/search-table/secret-table/secret-table.component.ts @@ -6,6 +6,7 @@ import { Component, Input } from '@angular/core'; import { TranslatePipe } from "@ngx-translate/core"; import { Secret } from "../../domain/Kubernetes"; +import {hideTooltip, showTooltip} from "../search-table-util"; @Component({ selector: 'app-secret-table', @@ -22,23 +23,11 @@ export class SecretTableComponent { protected readonly Object = Object; - showTooltip(event: MouseEvent, data: Record) { - const tooltip = document.getElementById('tooltip'); - if (tooltip) { - tooltip.textContent = Object.entries(data) - .map(([key, value]) => `${key}: ${value}`) - .join('\n'); - - tooltip.style.display = 'block'; - tooltip.style.left = `${event.pageX + 10}px`; - tooltip.style.top = `${event.pageY + 10}px`; - } + showTooltip(event: MouseEvent, data: Record | undefined) { + showTooltip(event, data); } hideTooltip() { - const tooltip = document.getElementById('tooltip'); - if (tooltip) { - tooltip.style.display = 'none'; - } + hideTooltip(); } } \ No newline at end of file