uptime.link/catalog_admin
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: uptime.link:v1.0.1
Branches Tags
uptime.link:main
uptime.link:v1.3.0 uptime.link:v1.2.0 uptime.link:v1.1.0 uptime.link:v1.0.3 uptime.link:v1.0.2 uptime.link:v1.0.1
..
compare: uptime.link:v1.3.0
Branches Tags
uptime.link:main
uptime.link:v1.3.0 uptime.link:v1.2.0 uptime.link:v1.1.0 uptime.link:v1.0.3 uptime.link:v1.0.2 uptime.link:v1.0.1

11 Commits
v1.0.1 ... v1.3.0

Author SHA1 Message Date
Juergen Kunz
40b25cf02d v1.3.0 2025-12-27 12:33:14 +00:00
Juergen Kunz
c5632dae77 feat(admin-ui): introduce view layer and refactor admin UI to use view components, consolidate demos, and update interfaces 2025-12-27 12:33:14 +00:00
Juergen Kunz
87ac6e506f v1.2.0 2025-12-26 18:04:55 +00:00
Juergen Kunz
6a7c69bad1 feat(elements): add upladmin-option-card component and migrate option/status UIs to use it; refactor monitor form multitoggle subscriptions and event handling; improve theme color handling and dark-mode styles; add demos, Playwright snapshots, and migration plan 2025-12-26 18:04:55 +00:00
Juergen Kunz
e667370079 v1.1.0 2025-12-24 15:29:15 +00:00
Juergen Kunz
8827a1ba38 feat(monitor): add extended monitor statuses, check configuration, status overrides/paused indicators, and incident update templates 2025-12-24 15:29:15 +00:00
Juergen Kunz
87b739e4b6 v1.0.3 2025-12-24 11:56:43 +00:00
Juergen Kunz
378f3ad2b7 fix(catalog_admin): no changes detected, no release required 2025-12-24 11:56:43 +00:00
Juergen Kunz
e5e05e34ea update 2025-12-24 11:56:14 +00:00
Juergen Kunz
83b94dc2c6 v1.0.2 2025-12-24 11:55:42 +00:00
Juergen Kunz
c1eb38a18c fix(gitignore): ignore distribution/build output directories (dist*) 2025-12-24 11:55:42 +00:00
108 changed files with 2216 additions and 279889 deletions
Expand all files Collapse all files

3
.gitignore vendored
View File

@@ -1 +1,2 @@
node_modules/ node_modules/
dist*

67
.nogit/theme-test.html Normal file
View File

@@ -0,0 +1,67 @@
<!DOCTYPE html>
<html>
<head>
<title>Theme Test</title>
<script type="module" src="../dist_bundle/bundle.js"></script>
<style>
body {
margin: 0;
padding: 24px;
font-family: system-ui, sans-serif;
}
.section {
margin-bottom: 32px;
}
.title {
font-size: 16px;
font-weight: 600;
margin-bottom: 16px;
}
.grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 12px;
}
#theme-toggle {
position: fixed;
top: 16px;
right: 16px;
padding: 8px 16px;
cursor: pointer;
}
</style>
</head>
<body>
<button id="theme-toggle">Toggle Theme</button>
<div class="section">
<div class="title">Severity Variants</div>
<div class="grid">
<upladmin-option-card variant="critical" icon="lucide:AlertCircle" label="Critical" description="Severe impact"></upladmin-option-card>
<upladmin-option-card variant="major" icon="lucide:AlertTriangle" label="Major" description="Significant impact"></upladmin-option-card>
<upladmin-option-card variant="minor" icon="lucide:Info" label="Minor" description="Limited impact"></upladmin-option-card>
<upladmin-option-card variant="maintenance" icon="lucide:Wrench" label="Maintenance" description="Scheduled work" selected></upladmin-option-card>
</div>
</div>
<div class="section">
<div class="title">Status Variants</div>
<div class="grid">
<upladmin-option-card variant="investigating" icon="lucide:Search" label="Investigating" description="Looking into it"></upladmin-option-card>
<upladmin-option-card variant="identified" icon="lucide:Target" label="Identified" description="Root cause found"></upladmin-option-card>
<upladmin-option-card variant="monitoring" icon="lucide:Eye" label="Monitoring" description="Fix applied" selected></upladmin-option-card>
<upladmin-option-card variant="resolved" icon="lucide:CheckCircle" label="Resolved" description="Issue fixed"></upladmin-option-card>
<upladmin-option-card variant="postmortem" icon="lucide:FileText" label="Postmortem" description="Analysis complete"></upladmin-option-card>
</div>
</div>
<script>
document.getElementById('theme-toggle').addEventListener('click', () => {
const isDark = document.documentElement.style.colorScheme === 'dark';
document.documentElement.style.colorScheme = isDark ? 'light' : 'dark';
document.body.style.background = isDark ? '#ffffff' : '#09090b';
document.body.style.color = isDark ? '#09090b' : '#fafafa';
});
</script>
</body>
</html>

BIN
.playwright-mcp/dark-mode-emulated.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

BIN
.playwright-mcp/dark-mode-option-cards.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

BIN
.playwright-mcp/light-mode-option-cards.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

41
changelog.md
View File

@@ -1,5 +1,46 @@
# Changelog # Changelog
## 2025-12-27 - 1.3.0 - feat(admin-ui)
introduce view layer and refactor admin UI to use view components, consolidate demos, and update interfaces
- Added a new views/ layer with view components: upladmin-dashboard-view, upladmin-monitors-view, upladmin-incidents-view, upladmin-config-view and exported them from ts_web/views/index.ts
- Refactored upladmin-app to use the new view components (updated menu routes/content to view tags)
- Removed multiple demo page files under ts_web/pages (consolidated demo surface into the view-based app)
- Updated upladmin-statuspage-config: changed activeSection to a property, removed the side navigation markup/CSS and simplified layout to be view-driven
- Reworked ts_web/interfaces to re-export core types from @uptime.link/interfaces and added UI-specific interfaces and form types
- Bumped dependency @uptime.link/interfaces to ^2.1.0 in package.json
## 2025-12-26 - 1.2.0 - feat(elements)
add upladmin-option-card component and migrate option/status UIs to use it; refactor monitor form multitoggle subscriptions and event handling; improve theme color handling and dark-mode styles; add demos, Playwright snapshots, and migration plan
- Add new upladmin-option-card web component (implementation, index export, and demo).
- Replace inline option/status card markup with <upladmin-option-card> in incident-form and incident-update.
- Refactor upladmin-monitor-form: subscribe/unsubscribe multitoggle change subjects, handle lifecycle (firstUpdated/disconnected), and adjust event handlers (@newValue/@change usage).
- Swap hardcoded color tokens for cssManager.bdTheme for better light/dark theming; add dark-mode media tweak for filter select.
- Add Playwright snapshot images (.playwright-mcp) and a detailed readme.plan.md describing interface migration tasks.
## 2025-12-24 - 1.1.0 - feat(monitor)
add extended monitor statuses, check configuration, status overrides/paused indicators, and incident update templates
- Extend TStatusType with new statuses: initializing, error, paused.
- Add statusMode, manualStatus, paused, checkType, checkConfig and intervalMs to service and monitor interfaces.
- Update monitor list UI to show manual-override and paused indicators, new status badges, and include new statuses in status filter.
- Add quick templates to incident update form that prefill both status and message; update applyTemplate accordingly.
- Enhance monitor form to support checkType/ICheckConfig, statusMode selection, pause flag, interval options and additional validation (domain & PageRank search term).
- Add styles and icons for new statuses and status indicator badges.
## 2025-12-24 - 1.0.3 - fix(catalog_admin)
no changes detected, no release required
- No files changed in this diff
- No code, tests, or documentation modifications detected
- No version bump recommended
## 2025-12-24 - 1.0.2 - fix(gitignore)
ignore distribution/build output directories (dist*)
- Added 'dist*/' to .gitignore to prevent committing build artifacts and local distribution folders
## 2025-12-24 - 1.0.1 - fix(release) ## 2025-12-24 - 1.0.1 - fix(release)
no changes detected no changes detected

27673
dist_bundle/bundle.js
View File

File diff suppressed because one or more lines are too long

7
dist_bundle/bundle.js.map
View File

File diff suppressed because one or more lines are too long

7
dist_ts_web/elements/index.d.ts vendored
View File

@@ -1,7 +0,0 @@
export * from './upladmin-monitor-form/index.js';
export * from './upladmin-monitor-list/index.js';
export * from './upladmin-incident-form/index.js';
export * from './upladmin-incident-list/index.js';
export * from './upladmin-incident-update/index.js';
export * from './upladmin-statuspage-config/index.js';
export * from './upladmin-dashboard/index.js';

12
dist_ts_web/elements/index.js
View File

@@ -1,12 +0,0 @@
// Monitor components
export * from './upladmin-monitor-form/index.js';
export * from './upladmin-monitor-list/index.js';
// Incident components
export * from './upladmin-incident-form/index.js';
export * from './upladmin-incident-list/index.js';
export * from './upladmin-incident-update/index.js';
// Configuration components
export * from './upladmin-statuspage-config/index.js';
// Dashboard components
export * from './upladmin-dashboard/index.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvZWxlbWVudHMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEscUJBQXFCO0FBQ3JCLGNBQWMsa0NBQWtDLENBQUM7QUFDakQsY0FBYyxrQ0FBa0MsQ0FBQztBQUVqRCxzQkFBc0I7QUFDdEIsY0FBYyxtQ0FBbUMsQ0FBQztBQUNsRCxjQUFjLG1DQUFtQyxDQUFDO0FBQ2xELGNBQWMscUNBQXFDLENBQUM7QUFFcEQsMkJBQTJCO0FBQzNCLGNBQWMsdUNBQXVDLENBQUM7QUFFdEQsdUJBQXVCO0FBQ3ZCLGNBQWMsK0JBQStCLENBQUMifQ==

1
dist_ts_web/elements/upladmin-dashboard/index.d.ts vendored
View File

@@ -1 +0,0 @@
export * from './upladmin-dashboard.js';

2
dist_ts_web/elements/upladmin-dashboard/index.js
View File

@@ -1,2 +0,0 @@
export * from './upladmin-dashboard.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4tZGFzaGJvYXJkL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMseUJBQXlCLENBQUMifQ==

28
dist_ts_web/elements/upladmin-dashboard/upladmin-dashboard.d.ts vendored
View File

@@ -1,28 +0,0 @@
import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
import type { IServiceStatus, IIncidentDetails, IOverallStatus } from '../../interfaces/index.js';
declare global {
interface HTMLElementTagNameMap {
'upladmin-dashboard': UpladminDashboard;
}
}
export declare class UpladminDashboard extends DeesElement {
static demo: () => TemplateResult<1>;
accessor monitors: IServiceStatus[];
accessor incidents: IIncidentDetails[];
accessor overallStatus: IOverallStatus | null;
accessor loading: boolean;
static styles: import("@design.estate/dees-element").CSSResult[];
private get statsTiles();
render(): TemplateResult;
private renderStatusBanner;
private renderIncidentItem;
private renderCategoryStatus;
private calculateOverallStatus;
private handleViewAllIncidents;
private handleViewAllMonitors;
private handleIncidentClick;
private handleNewIncident;
private handleNewMonitor;
private handleScheduleMaintenance;
private handleViewConfig;
}

2
dist_ts_web/elements/upladmin-dashboard/upladmin-dashboard.demo.d.ts vendored
View File

@@ -1,2 +0,0 @@
import './upladmin-dashboard.js';
export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

56
dist_ts_web/elements/upladmin-dashboard/upladmin-dashboard.demo.js
View File

@@ -1,56 +0,0 @@
import { html, css, cssManager } from '@design.estate/dees-element';
import './upladmin-dashboard.js';
export const demoFunc = () => html `
<style>
${css `
.demo-container {
padding: 24px;
background: ${cssManager.bdTheme('#f4f4f5', '#09090b')};
min-height: 100vh;
}
`}
</style>
<div class="demo-container">
<upladmin-dashboard
.monitors=${[
{ id: 'api', name: 'api', displayName: 'API Server', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.98, uptime90d: 99.95, responseTime: 45, category: 'Core' },
{ id: 'web', name: 'web', displayName: 'Web App', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.99, uptime90d: 99.97, responseTime: 120, category: 'Core' },
{ id: 'db', name: 'db', displayName: 'Database', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.999, uptime90d: 99.998, responseTime: 5, category: 'Infrastructure' },
{ id: 'cdn', name: 'cdn', displayName: 'CDN', currentStatus: 'degraded', lastChecked: Date.now(), uptime30d: 99.5, uptime90d: 99.8, responseTime: 200, category: 'Infrastructure' },
{ id: 'cache', name: 'cache', displayName: 'Redis Cache', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.99, uptime90d: 99.98, responseTime: 2, category: 'Infrastructure' },
{ id: 'email', name: 'email', displayName: 'Email Service', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.9, uptime90d: 99.85, responseTime: 500, category: 'External' },
{ id: 'payment', name: 'payment', displayName: 'Payment Gateway', currentStatus: 'maintenance', lastChecked: Date.now(), uptime30d: 99.95, uptime90d: 99.9, responseTime: 350, category: 'External' },
{ id: 'search', name: 'search', displayName: 'Search Engine', currentStatus: 'partial_outage', lastChecked: Date.now(), uptime30d: 98.5, uptime90d: 99.2, responseTime: 150, category: 'Core' },
]}
.activeIncidents=${[
{
id: 'inc-1',
title: 'CDN Performance Degradation',
status: 'identified',
severity: 'minor',
affectedServices: ['cdn'],
startTime: Date.now() - 2 * 60 * 60 * 1000,
impact: 'Some users may experience slower page loads',
updates: [
{ id: 'u1', timestamp: Date.now() - 1 * 60 * 60 * 1000, status: 'identified', message: 'Root cause identified as network congestion' },
{ id: 'u2', timestamp: Date.now() - 2 * 60 * 60 * 1000, status: 'investigating', message: 'We are investigating reports of slow content delivery' },
],
},
{
id: 'inc-2',
title: 'Search Cluster Partial Failure',
status: 'investigating',
severity: 'major',
affectedServices: ['search'],
startTime: Date.now() - 30 * 60 * 1000,
impact: 'Search functionality may return incomplete results',
updates: [
{ id: 'u3', timestamp: Date.now() - 30 * 60 * 1000, status: 'investigating', message: 'We are investigating issues with the search cluster' },
],
},
]}
></upladmin-dashboard>
</div>
`;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsYWRtaW4tZGFzaGJvYXJkLmRlbW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4tZGFzaGJvYXJkL3VwbGFkbWluLWRhc2hib2FyZC5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRXBFLE9BQU8seUJBQXlCLENBQUM7QUFFakMsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQTs7TUFFNUIsR0FBRyxDQUFBOzs7c0JBR2EsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7S0FHekQ7Ozs7O2tCQUthO0lBQ1YsRUFBRSxFQUFFLEVBQUUsS0FBSyxFQUFFLElBQUksRUFBRSxLQUFLLEVBQUUsV0FBVyxFQUFFLFlBQVksRUFBRSxhQUFhLEVBQUUsYUFBYSxFQUFFLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFlBQVksRUFBRSxFQUFFLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRTtJQUNwTCxFQUFFLEVBQUUsRUFBRSxLQUFLLEVBQUUsSUFBSSxFQUFFLEtBQUssRUFBRSxXQUFXLEVBQUUsU0FBUyxFQUFFLGFBQWEsRUFBRSxhQUFhLEVBQUUsV0FBVyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsWUFBWSxFQUFFLEdBQUcsRUFBRSxRQUFRLEVBQUUsTUFBTSxFQUFFO0lBQ2xMLEVBQUUsRUFBRSxFQUFFLElBQUksRUFBRSxJQUFJLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRSxVQUFVLEVBQUUsYUFBYSxFQUFFLGFBQWEsRUFBRSxX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

715
dist_ts_web/elements/upladmin-dashboard/upladmin-dashboard.js
View File

File diff suppressed because one or more lines are too long

1
dist_ts_web/elements/upladmin-incident-form/index.d.ts vendored
View File

@@ -1 +0,0 @@
export * from './upladmin-incident-form.js';

2
dist_ts_web/elements/upladmin-incident-form/index.js
View File

@@ -1,2 +0,0 @@
export * from './upladmin-incident-form.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4taW5jaWRlbnQtZm9ybS9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLDZCQUE2QixDQUFDIn0=

33
dist_ts_web/elements/upladmin-incident-form/upladmin-incident-form.d.ts vendored
View File

@@ -1,33 +0,0 @@
import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
import type { IIncidentFormData, IServiceStatus } from '../../interfaces/index.js';
declare global {
interface HTMLElementTagNameMap {
'upladmin-incident-form': UpladminIncidentForm;
}
}
export declare class UpladminIncidentForm extends DeesElement {
static demo: () => TemplateResult<1>;
accessor incident: IIncidentFormData | null;
accessor availableServices: IServiceStatus[];
accessor loading: boolean;
accessor formData: IIncidentFormData;
accessor errors: Record<string, string>;
private severityIcons;
private statusIcons;
static styles: import("@design.estate/dees-element").CSSResult[];
connectedCallback(): Promise<void>;
updated(changedProperties: Map<string, unknown>): void;
render(): TemplateResult;
private handleTitleChange;
private handleImpactChange;
private handleRootCauseChange;
private handleResolutionChange;
private handleSeverityChange;
private handleStatusChange;
private toggleService;
private validate;
private handleSave;
private handleCancel;
reset(): void;
setIncident(incident: IIncidentFormData): void;
}

2
dist_ts_web/elements/upladmin-incident-form/upladmin-incident-form.demo.d.ts vendored
View File

@@ -1,2 +0,0 @@
import './upladmin-incident-form.js';
export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

69
dist_ts_web/elements/upladmin-incident-form/upladmin-incident-form.demo.js
View File

@@ -1,69 +0,0 @@
import { html, css, cssManager } from '@design.estate/dees-element';
import './upladmin-incident-form.js';
export const demoFunc = () => html `
<style>
${css `
.demo-container {
display: flex;
flex-direction: column;
gap: 32px;
padding: 24px;
max-width: 900px;
margin: 0 auto;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
min-height: 100vh;
}
.demo-section {
margin-bottom: 24px;
}
.demo-section h3 {
margin: 0 0 16px 0;
font-size: 14px;
font-weight: 600;
color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
text-transform: uppercase;
letter-spacing: 0.05em;
}
`}
</style>
<div class="demo-container">
<div class="demo-section">
<h3>Create New Incident</h3>
<upladmin-incident-form
.availableServices=${[
{ id: 'api', name: 'api', displayName: 'API Server', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.98, uptime90d: 99.95, responseTime: 45 },
{ id: 'web', name: 'web', displayName: 'Web Application', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.99, uptime90d: 99.97, responseTime: 120 },
{ id: 'db', name: 'db', displayName: 'Database', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.999, uptime90d: 99.998, responseTime: 5 },
{ id: 'cdn', name: 'cdn', displayName: 'CDN', currentStatus: 'degraded', lastChecked: Date.now(), uptime30d: 99.5, uptime90d: 99.8, responseTime: 200 },
{ id: 'cache', name: 'cache', displayName: 'Redis Cache', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.99, uptime90d: 99.98, responseTime: 2 },
]}
></upladmin-incident-form>
</div>
<div class="demo-section">
<h3>Edit Existing Incident</h3>
<upladmin-incident-form
.incident=${{
id: 'inc-123',
title: 'Database Connection Issues',
severity: 'major',
status: 'identified',
affectedServices: ['db', 'api'],
impact: 'Users may experience slow response times and occasional timeouts when accessing the application.',
rootCause: 'Connection pool exhaustion due to a memory leak in the database driver.',
}}
.availableServices=${[
{ id: 'api', name: 'api', displayName: 'API Server', currentStatus: 'degraded', lastChecked: Date.now(), uptime30d: 99.98, uptime90d: 99.95, responseTime: 45 },
{ id: 'web', name: 'web', displayName: 'Web Application', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.99, uptime90d: 99.97, responseTime: 120 },
{ id: 'db', name: 'db', displayName: 'Database', currentStatus: 'partial_outage', lastChecked: Date.now(), uptime30d: 99.999, uptime90d: 99.998, responseTime: 5 },
{ id: 'cdn', name: 'cdn', displayName: 'CDN', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.5, uptime90d: 99.8, responseTime: 200 },
{ id: 'cache', name: 'cache', displayName: 'Redis Cache', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.99, uptime90d: 99.98, responseTime: 2 },
]}
></upladmin-incident-form>
</div>
</div>
`;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsYWRtaW4taW5jaWRlbnQtZm9ybS5kZW1vLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vdHNfd2ViL2VsZW1lbnRzL3VwbGFkbWluLWluY2lkZW50LWZvcm0vdXBsYWRtaW4taW5jaWRlbnQtZm9ybS5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRXBFLE9BQU8sNkJBQTZCLENBQUM7QUFFckMsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQTs7TUFFNUIsR0FBRyxDQUFBOzs7Ozs7OztzQkFRYSxVQUFVLENBQUMsT0FBTyxDQUFDLFNBQVMsRUFBRSxTQUFTLENBQUM7Ozs7Ozs7Ozs7OztpQkFZN0MsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7O0tBSXBEOzs7Ozs7OzZCQU93QjtJQUNuQixFQUFFLEVBQUUsRUFBRSxLQUFLLEVBQUUsSUFBSSxFQUFFLEtBQUssRUFBRSxXQUFXLEVBQUUsWUFBWSxFQUFFLGFBQWEsRUFBRSxhQUFhLEVBQUUsV0FBVyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsWUFBWSxFQUFFLEVBQUUsRUFBRTtJQUNsSyxFQUFFLEVBQUUsRUFBRSxLQUFLLEVBQUUsSUFBSSxFQUFFLEtBQUssRUFBRSxXQUFXLEVBQUUsaUJBQWlCLEVBQUUsYUFBYSxFQUFFLGFBQWEsRUFBRSxXQUFXLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxZQUFZLEVBQUUsR0FBRyxFQUFFO0lBQ3hLLEVBQUUsRUFBRSxFQUFFLElBQUksRUFBRSxJQUFJLEVBQUUsSUFBSSxFQUFF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

617
dist_ts_web/elements/upladmin-incident-form/upladmin-incident-form.js
View File

File diff suppressed because one or more lines are too long

1
dist_ts_web/elements/upladmin-incident-list/index.d.ts vendored
View File

@@ -1 +0,0 @@
export * from './upladmin-incident-list.js';

2
dist_ts_web/elements/upladmin-incident-list/index.js
View File

@@ -1,2 +0,0 @@
export * from './upladmin-incident-list.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4taW5jaWRlbnQtbGlzdC9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLDZCQUE2QixDQUFDIn0=

29
dist_ts_web/elements/upladmin-incident-list/upladmin-incident-list.d.ts vendored
View File

@@ -1,29 +0,0 @@
import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
import type { IIncidentDetails } from '../../interfaces/index.js';
declare global {
interface HTMLElementTagNameMap {
'upladmin-incident-list': UpladminIncidentList;
}
}
type TSeverity = 'critical' | 'major' | 'minor' | 'maintenance';
type TTabFilter = 'current' | 'past' | 'all';
export declare class UpladminIncidentList extends DeesElement {
static demo: () => TemplateResult<1>;
accessor incidents: IIncidentDetails[];
accessor loading: boolean;
accessor tabFilter: TTabFilter;
accessor severityFilter: TSeverity | 'all';
accessor expandedIncidents: Set<string>;
private statusIcons;
private statusLabels;
static styles: import("@design.estate/dees-element").CSSResult[];
render(): TemplateResult;
private renderIncidentCard;
private getFilteredIncidents;
private handleSeverityFilter;
private toggleExpanded;
private handleAddClick;
private handleEdit;
private handleAddUpdate;
}
export {};

2
dist_ts_web/elements/upladmin-incident-list/upladmin-incident-list.demo.d.ts vendored
View File

@@ -1,2 +0,0 @@
import './upladmin-incident-list.js';
export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

93
dist_ts_web/elements/upladmin-incident-list/upladmin-incident-list.demo.js
View File

@@ -1,93 +0,0 @@
import { html, css, cssManager } from '@design.estate/dees-element';
import './upladmin-incident-list.js';
export const demoFunc = () => html `
<style>
${css `
.demo-container {
padding: 24px;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
min-height: 100vh;
}
`}
</style>
<div class="demo-container">
<upladmin-incident-list
.incidents=${[
{
id: 'inc-1',
title: 'CDN Performance Degradation',
status: 'monitoring',
severity: 'minor',
affectedServices: ['cdn'],
startTime: Date.now() - 4 * 60 * 60 * 1000,
impact: 'Some users may experience slower page loads for static assets.',
rootCause: 'Network congestion at edge locations',
updates: [
{ id: 'u1', timestamp: Date.now() - 1 * 60 * 60 * 1000, status: 'monitoring', message: 'Fix deployed, monitoring results.', author: 'Infrastructure Team' },
{ id: 'u2', timestamp: Date.now() - 2 * 60 * 60 * 1000, status: 'identified', message: 'Root cause identified as network congestion at edge nodes.', author: 'Infrastructure Team' },
{ id: 'u3', timestamp: Date.now() - 4 * 60 * 60 * 1000, status: 'investigating', message: 'We are investigating reports of slow content delivery.', author: 'Support Team' },
],
},
{
id: 'inc-2',
title: 'Search Cluster Partial Failure',
status: 'investigating',
severity: 'major',
affectedServices: ['search', 'api'],
startTime: Date.now() - 45 * 60 * 1000,
impact: 'Search functionality may return incomplete results. API responses may be delayed.',
updates: [
{ id: 'u4', timestamp: Date.now() - 45 * 60 * 1000, status: 'investigating', message: 'We are investigating issues with the search cluster. Some nodes are not responding.', author: 'Platform Team' },
],
},
{
id: 'inc-3',
title: 'Scheduled Database Maintenance',
status: 'investigating',
severity: 'maintenance',
affectedServices: ['db', 'api', 'web'],
startTime: Date.now() - 15 * 60 * 1000,
impact: 'Brief interruptions may occur during the maintenance window.',
updates: [
{ id: 'u5', timestamp: Date.now() - 15 * 60 * 1000, status: 'investigating', message: 'Starting scheduled database maintenance. Expected duration: 2 hours.', author: 'DBA Team' },
],
},
{
id: 'inc-4',
title: 'Authentication Service Outage',
status: 'resolved',
severity: 'critical',
affectedServices: ['auth', 'api', 'web'],
startTime: Date.now() - 24 * 60 * 60 * 1000,
endTime: Date.now() - 22 * 60 * 60 * 1000,
impact: 'Users were unable to log in or access authenticated features.',
rootCause: 'Certificate expiration on the identity provider.',
resolution: 'Renewed certificates and implemented automated monitoring for future expirations.',
updates: [
{ id: 'u6', timestamp: Date.now() - 22 * 60 * 60 * 1000, status: 'resolved', message: 'Issue has been fully resolved. All authentication services are operational.', author: 'Security Team' },
{ id: 'u7', timestamp: Date.now() - 23 * 60 * 60 * 1000, status: 'identified', message: 'Root cause identified: expired SSL certificate on identity provider.', author: 'Security Team' },
{ id: 'u8', timestamp: Date.now() - 24 * 60 * 60 * 1000, status: 'investigating', message: 'We are aware of authentication issues and are investigating.', author: 'On-call Engineer' },
],
},
{
id: 'inc-5',
title: 'Payment Processing Delays',
status: 'postmortem',
severity: 'major',
affectedServices: ['payment', 'api'],
startTime: Date.now() - 72 * 60 * 60 * 1000,
endTime: Date.now() - 70 * 60 * 60 * 1000,
impact: 'Payment transactions were delayed by up to 5 minutes.',
rootCause: 'Third-party payment provider experienced capacity issues.',
resolution: 'Provider resolved their capacity issues. Implemented fallback payment routing.',
updates: [
{ id: 'u9', timestamp: Date.now() - 48 * 60 * 60 * 1000, status: 'postmortem', message: 'Postmortem complete. Implementing additional redundancy measures.', author: 'Engineering Lead' },
{ id: 'u10', timestamp: Date.now() - 70 * 60 * 60 * 1000, status: 'resolved', message: 'Payment processing has returned to normal.', author: 'Payments Team' },
],
},
]}
></upladmin-incident-list>
</div>
`;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsYWRtaW4taW5jaWRlbnQtbGlzdC5kZW1vLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vdHNfd2ViL2VsZW1lbnRzL3VwbGFkbWluLWluY2lkZW50LWxpc3QvdXBsYWRtaW4taW5jaWRlbnQtbGlzdC5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRXBFLE9BQU8sNkJBQTZCLENBQUM7QUFFckMsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQTs7TUFFNUIsR0FBRyxDQUFBOzs7c0JBR2EsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7S0FHekQ7Ozs7O21CQUtjO0lBQ1g7UUFDRSxFQUFFLEVBQUUsT0FBTztRQUNYLEtBQUssRUFBRSw2QkFBNkI7UUFDcEMsTUFBTSxFQUFFLFlBQVk7UUFDcEIsUUFBUSxFQUFFLE9BQU87UUFDakIsZ0JBQWdCLEVBQUUsQ0FBQyxLQUFLLENBQUM7UUFDekIsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxJQUFJO1FBQzFDLE1BQU0sRUFBRSxnRUFBZ0U7UUFDeEUsU0FBUyxFQUFFLHNDQUFzQztRQUNqRCxPQUFPLEVBQUU7WUFDUCxFQUFFLEVBQUUsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxJQUFJLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBRSxPQUFPLEVBQUUsbUNBQW1DLEVBQUUsTUFBTSxFQUFFLHFCQUFxQixFQUFFO1lBQzNKLEVBQUUsRUFBRSxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUksRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFFLE9BQU8sRUFBRSw0REFBNEQsRUFBRSxNQUFNLEVBQUUscUJBQXFCLEVBQUU7WUFDcEwsRUFBRSxFQUFFLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSSxFQUFFLE1BQU0sRUFBRSxlQUFlLEVBQUUsT0FBTyxFQUFFLHdEQUF3RCxFQUFFLE1BQU0sRUFBRSxjQUFjLEVBQUU7U0FDN0s7S0FDRjtJQUNEO1FBQ0UsRUFBRSxFQUFFLE9BQU87UUFDWCxLQUFLLEVBQUUsZ0NBQWdDO1FBQ3ZDLE1BQU0sRUFBRSxlQUFlO1FBQ3ZCLFFBQVEsRUFBRSxPQUFPO1FBQ2pCLGdCQUFnQixFQUFFLENBQUMsUUFBUSxFQUFFLEtBQUssQ0FBQztRQUNuQyxTQUFTLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSTtRQUN0QyxNQUFNLEVBQUUsbUZBQW1GO1FBQzNGLE9BQU8sRUFBRTtZQUNQLEVBQUUsRUFBRSxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSSxFQUFFLE1BQU0sRUFBRSxlQUFlLEVBQUUsT0FBTyxFQUFFLHFGQUFxRixFQUFFLE1BQU0sRUFBRSxlQUFlLEVBQUU7U0FDdk07S0FDRjtJQUNEO1FBQ0UsRUFBRSxFQUFFLE9BQU87UUFDWCxLQUFLLEVBQUUsZ0NBQWdDO1FBQ3ZDLE1BQU0sRUFBRSxlQUFlO1FBQ3ZCLFFBQVEsRUFBRSxhQUFhO1FBQ3ZCLGdCQUFnQixFQUFFLENBQUMsSUFBSSxFQUFFLEtBQUssRUFBRSxLQUFLLENBQUM7UUFDdEMsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUk7UUFDdEMsTUFBTSxFQUFFLDhEQUE4RDtRQUN0RSxPQUFPLEVBQUU7WUFDUCxFQUFFLEVBQUUsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUksRUFBRSxNQUFNLEVBQUUsZUFBZSxFQUFFLE9BQU8sRUFBRSxzRUFBc0UsRUFBRSxNQUFNLEVBQUUsVUFBVSxFQUFFO1NBQ25MO0tBQ0Y7SUFDRDtRQUNFLEVBQUUsRUFBRSxPQUFPO1FBQ1gsS0FBSyxFQUFFLCtCQUErQjtRQUN0QyxNQUFNLEVBQUUsVUFBVTtRQUNsQixRQUFRLEVBQUUsVUFBVTtRQUNwQixnQkFBZ0IsRUFBRSxDQUFDLE1BQU0sRUFBRSxLQUFLLEVBQUUsS0FBSyxDQUFDO1FBQ3hDLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSTtRQUMzQyxPQUFPLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUk7UUFDekMsTUFBTSxFQUFFLCtEQUErRDtRQUN2RSxTQUFTLEVBQUUsa0RBQWtEO1FBQzdELFVBQVUsRUFBRSxtRkFBbUY7UUFDL0YsT0FBTyxFQUFFO1lBQ1AsRUFBRSxFQUFFLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSSxFQUFFLE1BQU0sRUFBRSxVQUFVLEVBQUUsT0FBTyxFQUFFLDZFQUE2RSxFQUFFLE1BQU0sRUFBRSxlQUFlLEVBQUU7WUFDOUwsRUFBRSxFQUFFLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSSxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsT0FBTyxFQUFFLHNFQUFzRSxFQUFFLE1BQU0sRUFBRSxlQUFlLEVBQUU7WUFDekwsRUFBRSxFQUFFLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSSxFQUFFLE1BQU0sRUFBRSxlQUFlLEVBQUUsT0FBTyxFQUFFLDhEQUE4RCxFQUFFLE1BQU0sRUFBRSxrQkFBa0IsRUFBRTtTQUN4TDtLQUNGO0lBQ0Q7UUFDRSxFQUFFLEVBQUUsT0FBTztRQUNYLEtBQUssRUFBRSwyQkFBMkI7UUFDbEMsTUFBTSxFQUFFLFlBQVk7UUFDcEIsUUFBUSxFQUFFLE9BQU87UUFDakIsZ0JBQWdCLEVBQUUsQ0FBQyxTQUFTLEVBQUUsS0FBSyxDQUFDO1FBQ3BDLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSTtRQUMzQyxPQUFPLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUk7UUFDekMsTUFBTSxFQUFFLHVEQUF1RDtRQUMvRCxTQUFTLEVBQUUsMkRBQTJEO1FBQ3RFLFVBQVUsRUFBRSxnRkFBZ0Y7UUFDNUYsT0FBTyxFQUFFO1lBQ1AsRUFBRSxFQUFFLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSSxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsT0FBTyxFQUFFLG1FQUFtRSxFQUFFLE1BQU0sRUFBRSxrQkFBa0IsRUFBRTtZQUN6TCxFQUFFLEVBQUUsRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxJQUFJLEVBQUUsTUFBTSxFQUFFLFVBQVUsRUFBRSxPQUFPLEVBQUUsNENBQTRDLEVBQUUsTUFBTSxFQUFFLGVBQWUsRUFBRTtTQUMvSjtLQUNGO0NBQ29COzs7Q0FHNUIsQ0FBQyJ9

761
dist_ts_web/elements/upladmin-incident-list/upladmin-incident-list.js
View File

File diff suppressed because one or more lines are too long

1
dist_ts_web/elements/upladmin-incident-update/index.d.ts vendored
View File

@@ -1 +0,0 @@
export * from './upladmin-incident-update.js';

2
dist_ts_web/elements/upladmin-incident-update/index.js
View File

@@ -1,2 +0,0 @@
export * from './upladmin-incident-update.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4taW5jaWRlbnQtdXBkYXRlL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsK0JBQStCLENBQUMifQ==

27
dist_ts_web/elements/upladmin-incident-update/upladmin-incident-update.d.ts vendored
View File

@@ -1,27 +0,0 @@
import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
import type { IIncidentUpdateFormData, IIncidentDetails } from '../../interfaces/index.js';
declare global {
interface HTMLElementTagNameMap {
'upladmin-incident-update': UpladminIncidentUpdate;
}
}
export declare class UpladminIncidentUpdate extends DeesElement {
static demo: () => TemplateResult<1>;
accessor incident: IIncidentDetails | null;
accessor loading: boolean;
accessor formData: IIncidentUpdateFormData;
accessor errors: Record<string, string>;
private statusIcons;
static styles: import("@design.estate/dees-element").CSSResult[];
connectedCallback(): Promise<void>;
updated(changedProperties: Map<string, unknown>): void;
render(): TemplateResult;
private handleMessageChange;
private handleAuthorChange;
private handleStatusChange;
private applyTemplate;
private validate;
private handlePost;
private handleCancel;
reset(): void;
}

2
dist_ts_web/elements/upladmin-incident-update/upladmin-incident-update.demo.d.ts vendored
View File

@@ -1,2 +0,0 @@
import './upladmin-incident-update.js';
export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

90
dist_ts_web/elements/upladmin-incident-update/upladmin-incident-update.demo.js
View File

@@ -1,90 +0,0 @@
import { html, css, cssManager } from '@design.estate/dees-element';
import './upladmin-incident-update.js';
export const demoFunc = () => html `
<style>
${css `
.demo-container {
display: flex;
flex-direction: column;
gap: 32px;
padding: 24px;
max-width: 800px;
margin: 0 auto;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
min-height: 100vh;
}
.demo-section {
margin-bottom: 24px;
}
.demo-section h3 {
margin: 0 0 16px 0;
font-size: 14px;
font-weight: 600;
color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
text-transform: uppercase;
letter-spacing: 0.05em;
}
`}
</style>
<div class="demo-container">
<div class="demo-section">
<h3>Update Active Incident (Critical)</h3>
<upladmin-incident-update
.incident=${{
id: 'inc-1',
title: 'Database Connection Pool Exhaustion',
status: 'investigating',
severity: 'critical',
affectedServices: ['db', 'api', 'web'],
startTime: Date.now() - 30 * 60 * 1000,
impact: 'All database-dependent services are experiencing failures.',
updates: [
{ id: 'u1', timestamp: Date.now() - 30 * 60 * 1000, status: 'investigating', message: 'We are investigating reports of service failures.' },
],
}}
></upladmin-incident-update>
</div>
<div class="demo-section">
<h3>Update Active Incident (Minor)</h3>
<upladmin-incident-update
.incident=${{
id: 'inc-2',
title: 'Elevated API Response Times',
status: 'identified',
severity: 'minor',
affectedServices: ['api'],
startTime: Date.now() - 2 * 60 * 60 * 1000,
impact: 'API responses may be slower than usual.',
updates: [
{ id: 'u2', timestamp: Date.now() - 1 * 60 * 60 * 1000, status: 'identified', message: 'Issue identified as increased traffic from a specific client.' },
{ id: 'u3', timestamp: Date.now() - 2 * 60 * 60 * 1000, status: 'investigating', message: 'We are investigating elevated response times.' },
],
}}
></upladmin-incident-update>
</div>
<div class="demo-section">
<h3>Update Maintenance Window</h3>
<upladmin-incident-update
.incident=${{
id: 'inc-3',
title: 'Scheduled Infrastructure Upgrade',
status: 'monitoring',
severity: 'maintenance',
affectedServices: ['api', 'web', 'cdn'],
startTime: Date.now() - 45 * 60 * 1000,
impact: 'Brief interruptions may occur during the upgrade.',
updates: [
{ id: 'u4', timestamp: Date.now() - 30 * 60 * 1000, status: 'monitoring', message: 'Upgrade complete. Monitoring for any issues.' },
{ id: 'u5', timestamp: Date.now() - 45 * 60 * 1000, status: 'investigating', message: 'Starting scheduled infrastructure upgrade.' },
],
}}
></upladmin-incident-update>
</div>
</div>
`;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsYWRtaW4taW5jaWRlbnQtdXBkYXRlLmRlbW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4taW5jaWRlbnQtdXBkYXRlL3VwbGFkbWluLWluY2lkZW50LXVwZGF0ZS5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRXBFLE9BQU8sK0JBQStCLENBQUM7QUFFdkMsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQTs7TUFFNUIsR0FBRyxDQUFBOzs7Ozs7OztzQkFRYSxVQUFVLENBQUMsT0FBTyxDQUFDLFNBQVMsRUFBRSxTQUFTLENBQUM7Ozs7Ozs7Ozs7OztpQkFZN0MsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7O0tBSXBEOzs7Ozs7O29CQU9lO0lBQ1YsRUFBRSxFQUFFLE9BQU87SUFDWCxLQUFLLEVBQUUscUNBQXFDO0lBQzVDLE1BQU0sRUFBRSxlQUFlO0lBQ3ZCLFFBQVEsRUFBRSxVQUFVO0lBQ3BCLGdCQUFnQixFQUFFLENBQUMsSUFBSSxFQUFFLEtBQUssRUFBRSxLQUFLLENBQUM7SUFDdEMsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUk7SUFDdEMsTUFBTSxFQUFFLDREQUE0RDtJQUNwRSxPQUFPLEVBQUU7UUFDUCxFQUFFLEVBQUUsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUksRUFBRSxNQUFNLEVBQUUsZUFBZSxFQUFFLE9BQU8sRUFBRSxtREFBbUQsRUFBRTtLQUM1STtDQUNrQjs7Ozs7OztvQkFPVDtJQUNWLEVBQUUsRUFBRSxPQUFPO0lBQ1gsS0FBSyxFQUFFLDZCQUE2QjtJQUNwQyxNQUFNLEVBQUUsWUFBWTtJQUNwQixRQUFRLEVBQUUsT0FBTztJQUNqQixnQkFBZ0IsRUFBRSxDQUFDLEtBQUssQ0FBQztJQUN6QixTQUFTLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUk7SUFDMUMsTUFBTSxFQUFFLHlDQUF5QztJQUNqRCxPQUFPLEVBQUU7UUFDUCxFQUFFLEVBQUUsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxJQUFJLEVBQUUsTUFBTSxFQUFFLFlBQVksRUFBRSxPQUFPLEVBQUUsK0RBQStELEVBQUU7UUFDeEosRUFBRSxFQUFFLEVBQUUsSUFBSSxFQUFFLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSSxFQUFFLE1BQU0sRUFBRSxlQUFlLEVBQUUsT0FBTyxFQUFFLCtDQUErQyxFQUFFO0tBQzVJO0NBQ2tCOzs7Ozs7O29CQU9UO0lBQ1YsRUFBRSxFQUFFLE9BQU87SUFDWCxLQUFLLEVBQUUsa0NBQWtDO0lBQ3pDLE1BQU0sRUFBRSxZQUFZO0lBQ3BCLFFBQVEsRUFBRSxhQUFhO0lBQ3ZCLGdCQUFnQixFQUFFLENBQUMsS0FBSyxFQUFFLEtBQUssRUFBRSxLQUFLLENBQUM7SUFDdkMsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUk7SUFDdEMsTUFBTSxFQUFFLG1EQUFtRDtJQUMzRCxPQUFPLEVBQUU7UUFDUCxFQUFFLEVBQUUsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUksRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFFLE9BQU8sRUFBRSw4Q0FBOEMsRUFBRTtRQUNuSSxFQUFFLEVBQUUsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUksRUFBRSxNQUFNLEVBQUUsZUFBZSxFQUFFLE9BQU8sRUFBRSw0Q0FBNEMsRUFBRTtLQUNySTtDQUNrQjs7OztDQUk1QixDQUFDIn0=

511
dist_ts_web/elements/upladmin-incident-update/upladmin-incident-update.js
View File

File diff suppressed because one or more lines are too long

1
dist_ts_web/elements/upladmin-monitor-form/index.d.ts vendored
View File

@@ -1 +0,0 @@
export * from './upladmin-monitor-form.js';

2
dist_ts_web/elements/upladmin-monitor-form/index.js
View File

@@ -1,2 +0,0 @@
export * from './upladmin-monitor-form.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4tbW9uaXRvci1mb3JtL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsNEJBQTRCLENBQUMifQ==

32
dist_ts_web/elements/upladmin-monitor-form/upladmin-monitor-form.d.ts vendored
View File

@@ -1,32 +0,0 @@
import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
import type { IMonitorFormData, IServiceStatus } from '../../interfaces/index.js';
declare global {
interface HTMLElementTagNameMap {
'upladmin-monitor-form': UpladminMonitorForm;
}
}
export declare class UpladminMonitorForm extends DeesElement {
static demo: () => TemplateResult<1>;
accessor monitor: IMonitorFormData | null;
accessor availableMonitors: IServiceStatus[];
accessor categories: string[];
accessor loading: boolean;
accessor formData: IMonitorFormData;
accessor errors: Record<string, string>;
private statusIcons;
static styles: import("@design.estate/dees-element").CSSResult[];
connectedCallback(): Promise<void>;
updated(changedProperties: Map<string, unknown>): void;
render(): TemplateResult;
private handleNameChange;
private handleDisplayNameChange;
private handleDescriptionChange;
private handleCategoryChange;
private handleDependenciesChange;
private handleStatusChange;
private validate;
private handleSave;
private handleCancel;
reset(): void;
setMonitor(monitor: IMonitorFormData): void;
}

2
dist_ts_web/elements/upladmin-monitor-form/upladmin-monitor-form.demo.d.ts vendored
View File

@@ -1,2 +0,0 @@
import './upladmin-monitor-form.js';
export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

65
dist_ts_web/elements/upladmin-monitor-form/upladmin-monitor-form.demo.js
View File

@@ -1,65 +0,0 @@
import { html, css, cssManager } from '@design.estate/dees-element';
import './upladmin-monitor-form.js';
export const demoFunc = () => html `
<style>
${css `
.demo-container {
display: flex;
flex-direction: column;
gap: 32px;
padding: 24px;
max-width: 900px;
margin: 0 auto;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
min-height: 100vh;
}
.demo-section {
margin-bottom: 24px;
}
.demo-section h3 {
margin: 0 0 16px 0;
font-size: 14px;
font-weight: 600;
color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
text-transform: uppercase;
letter-spacing: 0.05em;
}
`}
</style>
<div class="demo-container">
<div class="demo-section">
<h3>Create New Monitor</h3>
<upladmin-monitor-form
.availableMonitors=${[
{ id: 'api-server', name: 'api-server', displayName: 'API Server', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.98, uptime90d: 99.95, responseTime: 45 },
{ id: 'database', name: 'database', displayName: 'Database', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.99, uptime90d: 99.98, responseTime: 5 },
]}
.categories=${['Core Services', 'Infrastructure', 'External Services', 'Web Services']}
></upladmin-monitor-form>
</div>
<div class="demo-section">
<h3>Edit Existing Monitor</h3>
<upladmin-monitor-form
.monitor=${{
id: 'cdn',
name: 'cdn',
displayName: 'Content Delivery Network',
description: 'Global CDN for static assets and media files',
category: 'Infrastructure',
dependencies: ['api-server'],
currentStatus: 'degraded',
}}
.availableMonitors=${[
{ id: 'api-server', name: 'api-server', displayName: 'API Server', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.98, uptime90d: 99.95, responseTime: 45 },
{ id: 'database', name: 'database', displayName: 'Database', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.99, uptime90d: 99.98, responseTime: 5 },
]}
.categories=${['Core Services', 'Infrastructure', 'External Services', 'Web Services']}
></upladmin-monitor-form>
</div>
</div>
`;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsYWRtaW4tbW9uaXRvci1mb3JtLmRlbW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4tbW9uaXRvci1mb3JtL3VwbGFkbWluLW1vbml0b3ItZm9ybS5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRXBFLE9BQU8sNEJBQTRCLENBQUM7QUFFcEMsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQTs7TUFFNUIsR0FBRyxDQUFBOzs7Ozs7OztzQkFRYSxVQUFVLENBQUMsT0FBTyxDQUFDLFNBQVMsRUFBRSxTQUFTLENBQUM7Ozs7Ozs7Ozs7OztpQkFZN0MsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7O0tBSXBEOzs7Ozs7OzZCQU93QjtJQUNuQixFQUFFLEVBQUUsRUFBRSxZQUFZLEVBQUUsSUFBSSxFQUFFLFlBQVksRUFBRSxXQUFXLEVBQUUsWUFBWSxFQUFFLGFBQWEsRUFBRSxhQUFhLEVBQUUsV0FBVyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsWUFBWSxFQUFFLEVBQUUsRUFBRTtJQUNoTCxFQUFFLEVBQUUsRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxXQUFXLEVBQUUsVUFBVSxFQUFFLGFBQWEsRUFBRSxhQUFhLEVBQUUsV0FBVyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsWUFBWSxFQUFFLENBQUMsRUFBRTtDQUN0SjtzQkFDUCxDQUFDLGVBQWUsRUFBRSxnQkFBZ0IsRUFBRSxtQkFBbUIsRUFBRSxjQUFjLENBQUM7Ozs7Ozs7bUJBTzNFO0lBQ1QsRUFBRSxFQUFFLEtBQUs7SUFDVCxJQUFJLEVBQUUsS0FBSztJQUNYLFdBQVcsRUFBRSwwQkFBMEI7SUFDdkMsV0FBVyxFQUFFLDhDQUE4QztJQUMzRCxRQUFRLEVBQUUsZ0JBQWdCO0lBQzFCLFlBQVksRUFBRSxDQUFDLFlBQVksQ0FBQztJQUM1QixhQUFhLEVBQUUsVUFBVTtDQUMxQjs2QkFDb0I7SUFDbkIsRUFBRSxFQUFFLEVBQUUsWUFBWSxFQUFFLElBQUksRUFBRSxZQUFZLEVBQUUsV0FBVyxFQUFFLFlBQVksRUFBRSxhQUFhLEVBQUUsYUFBYSxFQUFFLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFlBQVksRUFBRSxFQUFFLEVBQUU7SUFDaEwsRUFBRSxFQUFFLEVBQUUsVUFBVSxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsV0FBVyxFQUFFLFVBQVUsRUFBRSxhQUFhLEVBQUUsYUFBYSxFQUFFLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFlBQVksRUFBRSxDQUFDLEVBQUU7Q0FDdEo7c0JBQ1AsQ0FBQyxlQUFlLEVBQUUsZ0JBQWdCLEVBQUUsbUJBQW1CLEVBQUUsY0FBYyxDQUFDOzs7O0NBSTdGLENBQUMifQ==

474
dist_ts_web/elements/upladmin-monitor-form/upladmin-monitor-form.js
View File

File diff suppressed because one or more lines are too long

1
dist_ts_web/elements/upladmin-monitor-list/index.d.ts vendored
View File

@@ -1 +0,0 @@
export * from './upladmin-monitor-list.js';

2
dist_ts_web/elements/upladmin-monitor-list/index.js
View File

@@ -1,2 +0,0 @@
export * from './upladmin-monitor-list.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4tbW9uaXRvci1saXN0L2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsNEJBQTRCLENBQUMifQ==

29
dist_ts_web/elements/upladmin-monitor-list/upladmin-monitor-list.d.ts vendored
View File

@@ -1,29 +0,0 @@
import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
import type { IServiceStatus } from '../../interfaces/index.js';
declare global {
interface HTMLElementTagNameMap {
'upladmin-monitor-list': UpladminMonitorList;
}
}
type TStatusType = 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance';
export declare class UpladminMonitorList extends DeesElement {
static demo: () => TemplateResult<1>;
accessor monitors: IServiceStatus[];
accessor loading: boolean;
accessor statusFilter: TStatusType | 'all';
accessor categoryFilter: string;
private statusIcons;
private statusLabels;
static styles: import("@design.estate/dees-element").CSSResult[];
private get filteredMonitors();
private get categories();
private get tableColumns();
private get tableActions();
render(): TemplateResult;
private handleStatusFilter;
private handleCategoryFilter;
private handleAddClick;
private handleEdit;
private handleDelete;
}
export {};

2
dist_ts_web/elements/upladmin-monitor-list/upladmin-monitor-list.demo.d.ts vendored
View File

@@ -1,2 +0,0 @@
import './upladmin-monitor-list.js';
export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

117
dist_ts_web/elements/upladmin-monitor-list/upladmin-monitor-list.demo.js
View File

@@ -1,117 +0,0 @@
import { html, css, cssManager } from '@design.estate/dees-element';
import './upladmin-monitor-list.js';
export const demoFunc = () => html `
<style>
${css `
.demo-container {
padding: 24px;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
min-height: 100vh;
}
`}
</style>
<div class="demo-container">
<upladmin-monitor-list
.monitors=${[
{
id: 'api-server',
name: 'api-server',
displayName: 'API Server',
description: 'Main REST API endpoint',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.98,
uptime90d: 99.95,
responseTime: 45,
category: 'Core Services',
},
{
id: 'web-app',
name: 'web-app',
displayName: 'Web Application',
description: 'Customer-facing web application',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.99,
uptime90d: 99.97,
responseTime: 120,
category: 'Core Services',
},
{
id: 'database-primary',
name: 'database-primary',
displayName: 'Primary Database',
description: 'PostgreSQL primary node',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.999,
uptime90d: 99.998,
responseTime: 5,
category: 'Infrastructure',
},
{
id: 'cdn',
name: 'cdn',
displayName: 'Content Delivery Network',
description: 'Global CDN for static assets',
currentStatus: 'degraded',
lastChecked: Date.now(),
uptime30d: 99.5,
uptime90d: 99.8,
responseTime: 200,
category: 'Infrastructure',
},
{
id: 'redis-cache',
name: 'redis-cache',
displayName: 'Redis Cache',
description: 'In-memory caching layer',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.99,
uptime90d: 99.98,
responseTime: 2,
category: 'Infrastructure',
},
{
id: 'email-service',
name: 'email-service',
displayName: 'Email Service',
description: 'Transactional email delivery',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.9,
uptime90d: 99.85,
responseTime: 500,
category: 'External Services',
},
{
id: 'payment-gateway',
name: 'payment-gateway',
displayName: 'Payment Gateway',
description: 'Payment processing integration',
currentStatus: 'maintenance',
lastChecked: Date.now(),
uptime30d: 99.95,
uptime90d: 99.9,
responseTime: 350,
category: 'External Services',
},
{
id: 'search-engine',
name: 'search-engine',
displayName: 'Search Engine',
description: 'Elasticsearch cluster',
currentStatus: 'partial_outage',
lastChecked: Date.now(),
uptime30d: 98.5,
uptime90d: 99.2,
responseTime: 150,
category: 'Core Services',
},
]}
></upladmin-monitor-list>
</div>
`;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsYWRtaW4tbW9uaXRvci1saXN0LmRlbW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4tbW9uaXRvci1saXN0L3VwbGFkbWluLW1vbml0b3ItbGlzdC5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRXBFLE9BQU8sNEJBQTRCLENBQUM7QUFFcEMsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQTs7TUFFNUIsR0FBRyxDQUFBOzs7c0JBR2EsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7S0FHekQ7Ozs7O2tCQUthO0lBQ1Y7UUFDRSxFQUFFLEVBQUUsWUFBWTtRQUNoQixJQUFJLEVBQUUsWUFBWTtRQUNsQixXQUFXLEVBQUUsWUFBWTtRQUN6QixXQUFXLEVBQUUsd0JBQXdCO1FBQ3JDLGFBQWEsRUFBRSxhQUFhO1FBQzVCLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFO1FBQ3ZCLFNBQVMsRUFBRSxLQUFLO1FBQ2hCLFNBQVMsRUFBRSxLQUFLO1FBQ2hCLFlBQVksRUFBRSxFQUFFO1FBQ2hCLFFBQVEsRUFBRSxlQUFlO0tBQzFCO0lBQ0Q7UUFDRSxFQUFFLEVBQUUsU0FBUztRQUNiLElBQUksRUFBRSxTQUFTO1FBQ2YsV0FBVyxFQUFFLGlCQUFpQjtRQUM5QixXQUFXLEVBQUUsaUNBQWlDO1FBQzlDLGFBQWEsRUFBRSxhQUFhO1FBQzVCLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFO1FBQ3ZCLFNBQVMsRUFBRSxLQUFLO1FBQ2hCLFNBQVMsRUFBRSxLQUFLO1FBQ2hCLFlBQVksRUFBRSxHQUFHO1FBQ2pCLFFBQVEsRUFBRSxlQUFlO0tBQzFCO0lBQ0Q7UUFDRSxFQUFFLEVBQUUsa0JBQWtCO1FBQ3RCLElBQUksRUFBRSxrQkFBa0I7UUFDeEIsV0FBVyxFQUFFLGtCQUFrQjtRQUMvQixXQUFXLEVBQUUseUJBQXlCO1FBQ3RDLGFBQWEsRUFBRSxhQUFhO1FBQzVCLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFO1FBQ3ZCLFNBQVMsRUFBRSxNQUFNO1FBQ2pCLFNBQVMsRUFBRSxNQUFNO1FBQ2pCLFlBQVksRUFBRSxDQUFDO1FBQ2YsUUFBUSxFQUFFLGdCQUFnQjtLQUMzQjtJQUNEO1FBQ0UsRUFBRSxFQUFFLEtBQUs7UUFDVCxJQUFJLEVBQUUsS0FBSztRQUNYLFdBQVcsRUFBRSwwQkFBMEI7UUFDdkMsV0FBVyxFQUFFLDhCQUE4QjtRQUMzQyxhQUFhLEVBQUUsVUFBVTtRQUN6QixXQUFXLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRTtRQUN2QixTQUFTLEVBQUUsSUFBSTtRQUNmLFNBQVMsRUFBRSxJQUFJO1FBQ2YsWUFBWSxFQUFFLEdBQUc7UUFDakIsUUFBUSxFQUFFLGdCQUFnQjtLQUMzQjtJQUNEO1FBQ0UsRUFBRSxFQUFFLGFBQWE7UUFDakIsSUFBSSxFQUFFLGFBQWE7UUFDbkIsV0FBVyxFQUFFLGFBQWE7UUFDMUIsV0FBVyxFQUFFLHlCQUF5QjtRQUN0QyxhQUFhLEVBQUUsYUFBYTtRQUM1QixXQUFXLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRTtRQUN2QixTQUFTLEVBQUUsS0FBSztRQUNoQixTQUFTLEVBQUUsS0FBSztRQUNoQixZQUFZLEVBQUUsQ0FBQztRQUNmLFFBQVEsRUFBRSxnQkFBZ0I7S0FDM0I7SUFDRDtRQUNFLEVBQUUsRUFBRSxlQUFlO1FBQ25CLElBQUksRUFBRSxlQUFlO1FBQ3JCLFdBQVcsRUFBRSxlQUFlO1FBQzVCLFdBQVcsRUFBRSw4QkFBOEI7UUFDM0MsYUFBYSxFQUFFLGFBQWE7UUFDNUIsV0FBVyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUU7UUFDdkIsU0FBUyxFQUFFLElBQUk7UUFDZixTQUFTLEVBQUUsS0FBSztRQUNoQixZQUFZLEVBQUUsR0FBRztRQUNqQixRQUFRLEVBQUUsbUJBQW1CO0tBQzlCO0lBQ0Q7UUFDRSxFQUFFLEVBQUUsaUJBQWlCO1FBQ3JCLElBQUksRUFBRSxpQkFBaUI7UUFDdkIsV0FBVyxFQUFFLGlCQUFpQjtRQUM5QixXQUFXLEVBQUUsZ0NBQWdDO1FBQzdDLGFBQWEsRUFBRSxhQUFhO1FBQzVCLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFO1FBQ3ZCLFNBQVMsRUFBRSxLQUFLO1FBQ2hCLFNBQVMsRUFBRSxJQUFJO1FBQ2YsWUFBWSxFQUFFLEdBQUc7UUFDakIsUUFBUSxFQUFFLG1CQUFtQjtLQUM5QjtJQUNEO1FBQ0UsRUFBRSxFQUFFLGVBQWU7UUFDbkIsSUFBSSxFQUFFLGVBQWU7UUFDckIsV0FBVyxFQUFFLGVBQWU7UUFDNUIsV0FBVyxFQUFFLHVCQUF1QjtRQUNwQyxhQUFhLEVBQUUsZ0JBQWdCO1FBQy9CLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFO1FBQ3ZCLFNBQVMsRUFBRSxJQUFJO1FBQ2YsU0FBUyxFQUFFLElBQUk7UUFDZixZQUFZLEVBQUUsR0FBRztRQUNqQixRQUFRLEVBQUUsZUFBZTtLQUMxQjtDQUNrQjs7O0NBRzFCLENBQUMifQ==

516
dist_ts_web/elements/upladmin-monitor-list/upladmin-monitor-list.js
View File

File diff suppressed because one or more lines are too long

1
dist_ts_web/elements/upladmin-statuspage-config/index.d.ts vendored
View File

@@ -1 +0,0 @@
export * from './upladmin-statuspage-config.js';

2
dist_ts_web/elements/upladmin-statuspage-config/index.js
View File

@@ -1,2 +0,0 @@
export * from './upladmin-statuspage-config.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvdXBsYWRtaW4tc3RhdHVzcGFnZS1jb25maWcvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxpQ0FBaUMsQ0FBQyJ9

33
dist_ts_web/elements/upladmin-statuspage-config/upladmin-statuspage-config.d.ts vendored
View File

@@ -1,33 +0,0 @@
import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
import type { IStatusPageConfig } from '../../interfaces/index.js';
declare global {
interface HTMLElementTagNameMap {
'upladmin-statuspage-config': UpladminStatuspageConfig;
}
}
export declare class UpladminStatuspageConfig extends DeesElement {
static demo: () => TemplateResult<1>;
accessor config: IStatusPageConfig;
accessor loading: boolean;
accessor formData: IStatusPageConfig;
accessor activeSection: string;
accessor hasChanges: boolean;
static styles: import("@design.estate/dees-element").CSSResult[];
connectedCallback(): Promise<void>;
updated(changedProperties: Map<string, unknown>): void;
render(): TemplateResult;
private renderSection;
private renderBrandingSection;
private renderUrlsSection;
private renderBehaviorSection;
private renderAdvancedSection;
private handleTextChange;
private handleNumberChange;
private handleBooleanChange;
private handleDropdownChange;
private handleThemeChange;
private handleLogoError;
private handleSave;
private handleReset;
setConfig(config: IStatusPageConfig): void;
}

2
dist_ts_web/elements/upladmin-statuspage-config/upladmin-statuspage-config.demo.d.ts vendored
View File

@@ -1,2 +0,0 @@
import './upladmin-statuspage-config.js';
export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

46
dist_ts_web/elements/upladmin-statuspage-config/upladmin-statuspage-config.demo.js
View File

@@ -1,46 +0,0 @@
import { html, css, cssManager } from '@design.estate/dees-element';
import './upladmin-statuspage-config.js';
export const demoFunc = () => html `
<style>
${css `
.demo-container {
padding: 24px;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
min-height: 100vh;
}
.demo-title {
margin: 0 0 24px 0;
font-size: 14px;
font-weight: 600;
color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
text-transform: uppercase;
letter-spacing: 0.05em;
}
`}
</style>
<div class="demo-container">
<h3 class="demo-title">Status Page Configuration</h3>
<upladmin-statuspage-config
.config=${{
companyName: 'Acme Corporation',
companyLogo: 'https://via.placeholder.com/200x60?text=ACME',
supportEmail: 'support@acme.example.com',
statusPageUrl: 'https://status.acme.example.com',
legalUrl: 'https://acme.example.com/terms',
apiEndpoint: 'https://api.acme.example.com/status',
theme: 'auto',
whitelabel: false,
refreshInterval: 60,
showHistoricalDays: 90,
enableWebSocket: true,
enableNotifications: false,
timeZone: 'America/New_York',
language: 'en',
dateFormat: 'relative',
}}
></upladmin-statuspage-config>
</div>
`;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsYWRtaW4tc3RhdHVzcGFnZS1jb25maWcuZGVtby5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3RzX3dlYi9lbGVtZW50cy91cGxhZG1pbi1zdGF0dXNwYWdlLWNvbmZpZy91cGxhZG1pbi1zdGF0dXNwYWdlLWNvbmZpZy5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsR0FBRyxFQUFFLFVBQVUsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRXBFLE9BQU8saUNBQWlDLENBQUM7QUFFekMsTUFBTSxDQUFDLE1BQU0sUUFBUSxHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQTs7TUFFNUIsR0FBRyxDQUFBOzs7c0JBR2EsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7Ozs7OztpQkFRN0MsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7O0tBSXBEOzs7Ozs7Z0JBTVc7SUFDUixXQUFXLEVBQUUsa0JBQWtCO0lBQy9CLFdBQVcsRUFBRSw4Q0FBOEM7SUFDM0QsWUFBWSxFQUFFLDBCQUEwQjtJQUN4QyxhQUFhLEVBQUUsaUNBQWlDO0lBQ2hELFFBQVEsRUFBRSxnQ0FBZ0M7SUFDMUMsV0FBVyxFQUFFLHFDQUFxQztJQUNsRCxLQUFLLEVBQUUsTUFBTTtJQUNiLFVBQVUsRUFBRSxLQUFLO0lBQ2pCLGVBQWUsRUFBRSxFQUFFO0lBQ25CLGtCQUFrQixFQUFFLEVBQUU7SUFDdEIsZUFBZSxFQUFFLElBQUk7SUFDckIsbUJBQW1CLEVBQUUsS0FBSztJQUMxQixRQUFRLEVBQUUsa0JBQWtCO0lBQzVCLFFBQVEsRUFBRSxJQUFJO0lBQ2QsVUFBVSxFQUFFLFVBQVU7Q0FDRjs7O0NBRzNCLENBQUMifQ==

758
dist_ts_web/elements/upladmin-statuspage-config/upladmin-statuspage-config.js
View File

File diff suppressed because one or more lines are too long

4
dist_ts_web/index.d.ts vendored
View File

@@ -1,4 +0,0 @@
export * from './elements/index.js';
export * from './pages/index.js';
export * from './interfaces/index.js';
export * from './services/index.js';

5
dist_ts_web/index.js
View File

@@ -1,5 +0,0 @@
export * from './elements/index.js';
export * from './pages/index.js';
export * from './interfaces/index.js';
export * from './services/index.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi90c193ZWIvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxxQkFBcUIsQ0FBQztBQUNwQyxjQUFjLGtCQUFrQixDQUFDO0FBQ2pDLGNBQWMsdUJBQXVCLENBQUM7QUFDdEMsY0FBYyxxQkFBcUIsQ0FBQyJ9

88
dist_ts_web/interfaces/index.d.ts vendored
View File

@@ -1,88 +0,0 @@
export interface IServiceStatus {
id: string;
name: string;
displayName: string;
description?: string;
currentStatus: 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance';
lastChecked: number;
uptime30d: number;
uptime90d: number;
responseTime: number;
category?: string;
dependencies?: string[];
selected?: boolean;
}
export interface IStatusHistoryPoint {
timestamp: number;
status: 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance';
responseTime?: number;
errorRate?: number;
}
export interface IIncidentUpdate {
id: string;
timestamp: number;
status: 'investigating' | 'identified' | 'monitoring' | 'resolved' | 'postmortem';
message: string;
author?: string;
}
export interface IIncidentDetails {
id: string;
title: string;
status: 'investigating' | 'identified' | 'monitoring' | 'resolved' | 'postmortem';
severity: 'critical' | 'major' | 'minor' | 'maintenance';
affectedServices: string[];
startTime: number;
endTime?: number;
updates: IIncidentUpdate[];
impact: string;
rootCause?: string;
resolution?: string;
}
export interface IOverallStatus {
status: 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance';
message: string;
lastUpdated: number;
affectedServices: number;
totalServices: number;
}
export interface IStatusPageConfig {
apiEndpoint?: string;
refreshInterval?: number;
timeZone?: string;
dateFormat?: string;
enableWebSocket?: boolean;
enableNotifications?: boolean;
theme?: 'light' | 'dark' | 'auto';
language?: string;
showHistoricalDays?: number;
whitelabel?: boolean;
companyName?: string;
companyLogo?: string;
supportEmail?: string;
statusPageUrl?: string;
legalUrl?: string;
}
export interface IMonitorFormData {
id?: string;
name: string;
displayName: string;
description?: string;
category?: string;
dependencies?: string[];
currentStatus: 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance';
}
export interface IIncidentFormData {
id?: string;
title: string;
severity: 'critical' | 'major' | 'minor' | 'maintenance';
status: 'investigating' | 'identified' | 'monitoring' | 'resolved' | 'postmortem';
affectedServices: string[];
impact: string;
rootCause?: string;
resolution?: string;
}
export interface IIncidentUpdateFormData {
status: 'investigating' | 'identified' | 'monitoring' | 'resolved' | 'postmortem';
message: string;
author?: string;
}

2
dist_ts_web/interfaces/index.js
View File

@@ -1,2 +0,0 @@
export {};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvaW50ZXJmYWNlcy9pbmRleC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=

3
dist_ts_web/pages/adminpage-config.d.ts vendored
View File

@@ -1,3 +0,0 @@
import '../elements/index.js';
export declare const adminpageConfig: () => import("@design.estate/dees-element").TemplateResult<1>;
export declare const adminpageConfigWhitelabel: () => import("@design.estate/dees-element").TemplateResult<1>;

77
dist_ts_web/pages/adminpage-config.js
View File

@@ -1,77 +0,0 @@
import { html, cssManager } from "@design.estate/dees-element";
import '../elements/index.js';
export const adminpageConfig = () => html `
<style>
.demo-page-wrapper {
min-height: 100vh;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
padding: 24px;
}
</style>
<div class="demo-page-wrapper">
<dees-demowrapper
.runAfterRender=${async (wrapperElement) => {
const config = wrapperElement.querySelector('upladmin-statuspage-config');
const configData = {
companyName: 'CloudFlow Inc.',
companyLogo: '',
supportEmail: 'support@cloudflow.io',
statusPageUrl: 'https://status.cloudflow.io',
legalUrl: 'https://cloudflow.io/terms',
apiEndpoint: 'https://api.cloudflow.io/status',
refreshInterval: 60,
showHistoricalDays: 90,
theme: 'auto',
language: 'en',
timeZone: 'UTC',
dateFormat: 'relative',
enableWebSocket: true,
enableNotifications: false,
whitelabel: false,
};
config.config = configData;
}}
>
<upladmin-statuspage-config></upladmin-statuspage-config>
</dees-demowrapper>
</div>
`;
export const adminpageConfigWhitelabel = () => html `
<style>
.demo-page-wrapper {
min-height: 100vh;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
padding: 24px;
}
</style>
<div class="demo-page-wrapper">
<dees-demowrapper
.runAfterRender=${async (wrapperElement) => {
const config = wrapperElement.querySelector('upladmin-statuspage-config');
const configData = {
companyName: 'Enterprise Corp',
companyLogo: 'https://via.placeholder.com/200x60/1a1a2e/ffffff?text=ENTERPRISE',
supportEmail: 'support@enterprise.com',
statusPageUrl: 'https://status.enterprise.com',
legalUrl: 'https://enterprise.com/legal',
apiEndpoint: 'https://api.enterprise.com/v2/status',
refreshInterval: 30,
showHistoricalDays: 180,
theme: 'dark',
language: 'en',
timeZone: 'America/New_York',
dateFormat: 'absolute',
enableWebSocket: true,
enableNotifications: true,
whitelabel: true,
};
config.config = configData;
}}
>
<upladmin-statuspage-config></upladmin-statuspage-config>
</dees-demowrapper>
</div>
`;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWRtaW5wYWdlLWNvbmZpZy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3RzX3dlYi9wYWdlcy9hZG1pbnBhZ2UtY29uZmlnLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFFL0QsT0FBTyxzQkFBc0IsQ0FBQztBQUU5QixNQUFNLENBQUMsTUFBTSxlQUFlLEdBQUcsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFBOzs7O29CQUlyQixVQUFVLENBQUMsT0FBTyxDQUFDLFNBQVMsRUFBRSxTQUFTLENBQUM7Ozs7Ozs7c0JBT3RDLEtBQUssRUFBRSxjQUFtQixFQUFFLEVBQUU7SUFDOUMsTUFBTSxNQUFNLEdBQUcsY0FBYyxDQUFDLGFBQWEsQ0FBQyw0QkFBNEIsQ0FBUSxDQUFDO0lBRWpGLE1BQU0sVUFBVSxHQUFzQjtRQUNwQyxXQUFXLEVBQUUsZ0JBQWdCO1FBQzdCLFdBQVcsRUFBRSxFQUFFO1FBQ2YsWUFBWSxFQUFFLHNCQUFzQjtRQUNwQyxhQUFhLEVBQUUsNkJBQTZCO1FBQzVDLFFBQVEsRUFBRSw0QkFBNEI7UUFDdEMsV0FBVyxFQUFFLGlDQUFpQztRQUM5QyxlQUFlLEVBQUUsRUFBRTtRQUNuQixrQkFBa0IsRUFBRSxFQUFFO1FBQ3RCLEtBQUssRUFBRSxNQUFNO1FBQ2IsUUFBUSxFQUFFLElBQUk7UUFDZCxRQUFRLEVBQUUsS0FBSztRQUNmLFVBQVUsRUFBRSxVQUFVO1FBQ3RCLGVBQWUsRUFBRSxJQUFJO1FBQ3JCLG1CQUFtQixFQUFFLEtBQUs7UUFDMUIsVUFBVSxFQUFFLEtBQUs7S0FDbEIsQ0FBQztJQUVGLE1BQU0sQ0FBQyxNQUFNLEdBQUcsVUFBVSxDQUFDO0FBQzdCLENBQUM7Ozs7O0NBS0osQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLHlCQUF5QixHQUFHLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQTs7OztvQkFJL0IsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7Ozs7O3NCQU90QyxLQUFLLEVBQUUsY0FBbUIsRUFBRSxFQUFFO0lBQzlDLE1BQU0sTUFBTSxHQUFHLGNBQWMsQ0FBQyxhQUFhLENBQUMsNEJBQTRCLENBQVEsQ0FBQztJQUVqRixNQUFNLFVBQVUsR0FBc0I7UUFDcEMsV0FBVyxFQUFFLGlCQUFpQjtRQUM5QixXQUFXLEVBQUUsa0VBQWtFO1FBQy9FLFlBQVksRUFBRSx3QkFBd0I7UUFDdEMsYUFBYSxFQUFFLCtCQUErQjtRQUM5QyxRQUFRLEVBQUUsOEJBQThCO1FBQ3hDLFdBQVcsRUFBRSxzQ0FBc0M7UUFDbkQsZUFBZSxFQUFFLEVBQUU7UUFDbkIsa0JBQWtCLEVBQUUsR0FBRztRQUN2QixLQUFLLEVBQUUsTUFBTTtRQUNiLFFBQVEsRUFBRSxJQUFJO1FBQ2QsUUFBUSxFQUFFLGtCQUFrQjtRQUM1QixVQUFVLEVBQUUsVUFBVTtRQUN0QixlQUFlLEVBQUUsSUFBSTtRQUNyQixtQkFBbUIsRUFBRSxJQUFJO1FBQ3pCLFVBQVUsRUFBRSxJQUFJO0tBQ2pCLENBQUM7SUFFRixNQUFNLENBQUMsTUFBTSxHQUFHLFVBQVUsQ0FBQztBQUM3QixDQUFDOzs7OztDQUtKLENBQUMifQ==

2
dist_ts_web/pages/adminpage-dashboard.d.ts vendored
View File

@@ -1,2 +0,0 @@
import '../elements/index.js';
export declare const adminpageDashboard: () => import("@design.estate/dees-element").TemplateResult<1>;

152
dist_ts_web/pages/adminpage-dashboard.js
View File

@@ -1,152 +0,0 @@
import { html, cssManager } from "@design.estate/dees-element";
import '../elements/index.js';
export const adminpageDashboard = () => html `
<style>
.demo-page-wrapper {
min-height: 100vh;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
padding: 24px;
}
</style>
<div class="demo-page-wrapper">
<dees-demowrapper
.runAfterRender=${async (wrapperElement) => {
const dashboard = wrapperElement.querySelector('upladmin-dashboard');
// Demo monitors
const monitors = [
{
id: 'api-server',
name: 'api-server',
displayName: 'API Server',
description: 'Main REST API endpoint',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.98,
uptime90d: 99.95,
responseTime: 45,
category: 'Core Services',
},
{
id: 'web-app',
name: 'web-app',
displayName: 'Web Application',
description: 'Customer-facing web application',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.99,
uptime90d: 99.97,
responseTime: 120,
category: 'Core Services',
},
{
id: 'database-primary',
name: 'database-primary',
displayName: 'Primary Database',
description: 'PostgreSQL primary node',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.999,
uptime90d: 99.998,
responseTime: 5,
category: 'Infrastructure',
},
{
id: 'cdn',
name: 'cdn',
displayName: 'Content Delivery Network',
description: 'Global CDN for static assets',
currentStatus: 'degraded',
lastChecked: Date.now(),
uptime30d: 99.5,
uptime90d: 99.8,
responseTime: 200,
category: 'Infrastructure',
},
{
id: 'email-service',
name: 'email-service',
displayName: 'Email Service',
description: 'Transactional email delivery',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.9,
uptime90d: 99.85,
responseTime: 500,
category: 'External Services',
},
{
id: 'payment-gateway',
name: 'payment-gateway',
displayName: 'Payment Gateway',
description: 'Payment processing integration',
currentStatus: 'maintenance',
lastChecked: Date.now(),
uptime30d: 99.95,
uptime90d: 99.9,
responseTime: 350,
category: 'External Services',
},
];
// Demo incidents
const incidents = [
{
id: 'inc-001',
title: 'CDN Performance Degradation',
status: 'monitoring',
severity: 'minor',
affectedServices: ['cdn'],
startTime: Date.now() - 2 * 60 * 60 * 1000,
impact: 'Some users may experience slower loading times for images and static assets.',
updates: [
{
id: 'upd-001',
timestamp: Date.now() - 2 * 60 * 60 * 1000,
status: 'investigating',
message: 'We are investigating reports of slow asset loading.',
author: 'Platform Team',
},
{
id: 'upd-002',
timestamp: Date.now() - 1 * 60 * 60 * 1000,
status: 'identified',
message: 'We have identified the issue as a problem with one of our CDN edge nodes.',
author: 'Platform Team',
},
{
id: 'upd-003',
timestamp: Date.now() - 30 * 60 * 1000,
status: 'monitoring',
message: 'Traffic has been rerouted to healthy nodes. Monitoring for stability.',
author: 'Platform Team',
},
],
},
{
id: 'inc-002',
title: 'Payment Gateway Scheduled Maintenance',
status: 'investigating',
severity: 'maintenance',
affectedServices: ['payment-gateway'],
startTime: Date.now() - 30 * 60 * 1000,
impact: 'Payment processing is temporarily unavailable during the maintenance window.',
updates: [
{
id: 'upd-004',
timestamp: Date.now() - 30 * 60 * 1000,
status: 'investigating',
message: 'Scheduled maintenance has begun. Expected duration: 2 hours.',
author: 'DevOps Team',
},
],
},
];
dashboard.monitors = monitors;
dashboard.incidents = incidents;
}}
>
<upladmin-dashboard></upladmin-dashboard>
</dees-demowrapper>
</div>
`;
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWRtaW5wYWdlLWRhc2hib2FyZC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3RzX3dlYi9wYWdlcy9hZG1pbnBhZ2UtZGFzaGJvYXJkLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFFL0QsT0FBTyxzQkFBc0IsQ0FBQztBQUU5QixNQUFNLENBQUMsTUFBTSxrQkFBa0IsR0FBRyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUE7Ozs7b0JBSXhCLFVBQVUsQ0FBQyxPQUFPLENBQUMsU0FBUyxFQUFFLFNBQVMsQ0FBQzs7Ozs7OztzQkFPdEMsS0FBSyxFQUFFLGNBQW1CLEVBQUUsRUFBRTtJQUM5QyxNQUFNLFNBQVMsR0FBRyxjQUFjLENBQUMsYUFBYSxDQUFDLG9CQUFvQixDQUFRLENBQUM7SUFFNUUsZ0JBQWdCO0lBQ2hCLE1BQU0sUUFBUSxHQUFxQjtRQUNqQztZQUNFLEVBQUUsRUFBRSxZQUFZO1lBQ2hCLElBQUksRUFBRSxZQUFZO1lBQ2xCLFdBQVcsRUFBRSxZQUFZO1lBQ3pCLFdBQVcsRUFBRSx3QkFBd0I7WUFDckMsYUFBYSxFQUFFLGFBQWE7WUFDNUIsV0FBVyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUU7WUFDdkIsU0FBUyxFQUFFLEtBQUs7WUFDaEIsU0FBUyxFQUFFLEtBQUs7WUFDaEIsWUFBWSxFQUFFLEVBQUU7WUFDaEIsUUFBUSxFQUFFLGVBQWU7U0FDMUI7UUFDRDtZQUNFLEVBQUUsRUFBRSxTQUFTO1lBQ2IsSUFBSSxFQUFFLFNBQVM7WUFDZixXQUFXLEVBQUUsaUJBQWlCO1lBQzlCLFdBQVcsRUFBRSxpQ0FBaUM7WUFDOUMsYUFBYSxFQUFFLGFBQWE7WUFDNUIsV0FBVyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUU7WUFDdkIsU0FBUyxFQUFFLEtBQUs7WUFDaEIsU0FBUyxFQUFFLEtBQUs7WUFDaEIsWUFBWSxFQUFFLEdBQUc7WUFDakIsUUFBUSxFQUFFLGVBQWU7U0FDMUI7UUFDRDtZQUNFLEVBQUUsRUFBRSxrQkFBa0I7WUFDdEIsSUFBSSxFQUFFLGtCQUFrQjtZQUN4QixXQUFXLEVBQUUsa0JBQWtCO1lBQy9CLFdBQVcsRUFBRSx5QkFBeUI7WUFDdEMsYUFBYSxFQUFFLGFBQWE7WUFDNUIsV0FBVyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUU7WUFDdkIsU0FBUyxFQUFFLE1BQU07WUFDakIsU0FBUyxFQUFFLE1BQU07WUFDakIsWUFBWSxFQUFFLENBQUM7WUFDZixRQUFRLEVBQUUsZ0JBQWdCO1NBQzNCO1FBQ0Q7WUFDRSxFQUFFLEVBQUUsS0FBSztZQUNULElBQUksRUFBRSxLQUFLO1lBQ1gsV0FBVyxFQUFFLDBCQUEwQjtZQUN2QyxXQUFXLEVBQUUsOEJBQThCO1lBQzNDLGFBQWEsRUFBRSxVQUFVO1lBQ3pCLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFO1lBQ3ZCLFNBQVMsRUFBRSxJQUFJO1lBQ2YsU0FBUyxFQUFFLElBQUk7WUFDZixZQUFZLEVBQUUsR0FBRztZQUNqQixRQUFRLEVBQUUsZ0JBQWdCO1NBQzNCO1FBQ0Q7WUFDRSxFQUFFLEVBQUUsZUFBZTtZQUNuQixJQUFJLEVBQUUsZUFBZTtZQUNyQixXQUFXLEVBQUUsZUFBZTtZQUM1QixXQUFXLEVBQUUsOEJBQThCO1lBQzNDLGFBQWEsRUFBRSxhQUFhO1lBQzVCLFdBQVcsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFO1lBQ3ZCLFNBQVMsRUFBRSxJQUFJO1lBQ2YsU0FBUyxFQUFFLEtBQUs7WUFDaEIsWUFBWSxFQUFFLEdBQUc7WUFDakIsUUFBUSxFQUFFLG1CQUFtQjtTQUM5QjtRQUNEO1lBQ0UsRUFBRSxFQUFFLGlCQUFpQjtZQUNyQixJQUFJLEVBQUUsaUJBQWlCO1lBQ3ZCLFdBQVcsRUFBRSxpQkFBaUI7WUFDOUIsV0FBVyxFQUFFLGdDQUFnQztZQUM3QyxhQUFhLEVBQUUsYUFBYTtZQUM1QixXQUFXLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRTtZQUN2QixTQUFTLEVBQUUsS0FBSztZQUNoQixTQUFTLEVBQUUsSUFBSTtZQUNmLFlBQVksRUFBRSxHQUFHO1lBQ2pCLFFBQVEsRUFBRSxtQkFBbUI7U0FDOUI7S0FDRixDQUFDO0lBRUYsaUJBQWlCO0lBQ2pCLE1BQU0sU0FBUyxHQUF1QjtRQUNwQztZQUNFLEVBQUUsRUFBRSxTQUFTO1lBQ2IsS0FBSyxFQUFFLDZCQUE2QjtZQUNwQyxNQUFNLEVBQUUsWUFBWTtZQUNwQixRQUFRLEVBQUUsT0FBTztZQUNqQixnQkFBZ0IsRUFBRSxDQUFDLEtBQUssQ0FBQztZQUN6QixTQUFTLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUk7WUFDMUMsTUFBTSxFQUFFLDhFQUE4RTtZQUN0RixPQUFPLEVBQUU7Z0JBQ1A7b0JBQ0UsRUFBRSxFQUFFLFNBQVM7b0JBQ2IsU0FBUyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsR0FBRyxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxJQUFJO29CQUMxQyxNQUFNLEVBQUUsZUFBZTtvQkFDdkIsT0FBTyxFQUFFLHFEQUFxRDtvQkFDOUQsTUFBTSxFQUFFLGVBQWU7aUJBQ3hCO2dCQUNEO29CQUNFLEVBQUUsRUFBRSxTQUFTO29CQUNiLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsQ0FBQyxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSTtvQkFDMUMsTUFBTSxFQUFFLFlBQVk7b0JBQ3BCLE9BQU8sRUFBRSwyRUFBMkU7b0JBQ3BGLE1BQU0sRUFBRSxlQUFlO2lCQUN4QjtnQkFDRDtvQkFDRSxFQUFFLEVBQUUsU0FBUztvQkFDYixTQUFTLEVBQUUsSUFBSSxDQUFDLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLEdBQUcsSUFBSTtvQkFDdEMsTUFBTSxFQUFFLFlBQVk7b0JBQ3BCLE9BQU8sRUFBRSx1RUFBdUU7b0JBQ2hGLE1BQU0sRUFBRSxlQUFlO2lCQUN4QjthQUNGO1NBQ0Y7UUFDRDtZQUNFLEVBQUUsRUFBRSxTQUFTO1lBQ2IsS0FBSyxFQUFFLHVDQUF1QztZQUM5QyxNQUFNLEVBQUUsZUFBZTtZQUN2QixRQUFRLEVBQUUsYUFBYTtZQUN2QixnQkFBZ0IsRUFBRSxDQUFDLGlCQUFpQixDQUFDO1lBQ3JDLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxJQUFJO1lBQ3RDLE1BQU0sRUFBRSw4RUFBOEU7WUFDdEYsT0FBTyxFQUFFO2dCQUNQO29CQUNFLEVBQUUsRUFBRSxTQUFTO29CQUNiLFNBQVMsRUFBRSxJQUFJLENBQUMsR0FBRyxFQUFFLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxJQUFJO29CQUN0QyxNQUFNLEVBQUUsZUFBZTtvQkFDdkIsT0FBTyxFQUFFLDhEQUE4RDtvQkFDdkUsTUFBTSxFQUFFLGFBQWE7aUJBQ3RCO2FBQ0Y7U0FDRjtLQUNGLENBQUM7SUFFRixTQUFTLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQztJQUM5QixTQUFTLENBQUMsU0FBUyxHQUFHLFNBQVMsQ0FBQztBQUNsQyxDQUFDOzs7OztDQUtKLENBQUMifQ==

4
dist_ts_web/pages/adminpage-incidents.d.ts vendored
View File

@@ -1,4 +0,0 @@
import '../elements/index.js';
export declare const adminpageIncidents: () => import("@design.estate/dees-element").TemplateResult<1>;
export declare const adminpageIncidentForm: () => import("@design.estate/dees-element").TemplateResult<1>;
export declare const adminpageIncidentUpdate: () => import("@design.estate/dees-element").TemplateResult<1>;

158
dist_ts_web/pages/adminpage-incidents.js
View File

File diff suppressed because one or more lines are too long

4
dist_ts_web/pages/adminpage-monitors.d.ts vendored
View File

@@ -1,4 +0,0 @@
import '../elements/index.js';
export declare const adminpageMonitors: () => import("@design.estate/dees-element").TemplateResult<1>;
export declare const adminpageMonitorForm: () => import("@design.estate/dees-element").TemplateResult<1>;
export declare const adminpageMonitorFormEdit: () => import("@design.estate/dees-element").TemplateResult<1>;

204
dist_ts_web/pages/adminpage-monitors.js
View File

File diff suppressed because one or more lines are too long

5
dist_ts_web/pages/index.d.ts vendored
View File

@@ -1,5 +0,0 @@
export * from './adminpage-dashboard.js';
export * from './adminpage-monitors.js';
export * from './adminpage-incidents.js';
export * from './adminpage-config.js';
export { demoFunc as adminpageApp } from './upladmin-app/upladmin-app.demo.js';

6
dist_ts_web/pages/index.js
View File

@@ -1,6 +0,0 @@
export * from './adminpage-dashboard.js';
export * from './adminpage-monitors.js';
export * from './adminpage-incidents.js';
export * from './adminpage-config.js';
export { demoFunc as adminpageApp } from './upladmin-app/upladmin-app.demo.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvcGFnZXMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYywwQkFBMEIsQ0FBQztBQUN6QyxjQUFjLHlCQUF5QixDQUFDO0FBQ3hDLGNBQWMsMEJBQTBCLENBQUM7QUFDekMsY0FBYyx1QkFBdUIsQ0FBQztBQUN0QyxPQUFPLEVBQUUsUUFBUSxJQUFJLFlBQVksRUFBRSxNQUFNLHFDQUFxQyxDQUFDIn0=

24
dist_ts_web/pages/upladmin-app/upladmin-app.d.ts vendored
View File

@@ -1,24 +0,0 @@
import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
import type { DeesAppuiBase } from '@design.estate/dees-catalog';
import '../../elements/upladmin-dashboard/upladmin-dashboard.js';
import '../../elements/upladmin-monitor-list/upladmin-monitor-list.js';
import '../../elements/upladmin-monitor-form/upladmin-monitor-form.js';
import '../../elements/upladmin-incident-list/upladmin-incident-list.js';
import '../../elements/upladmin-incident-form/upladmin-incident-form.js';
import '../../elements/upladmin-incident-update/upladmin-incident-update.js';
import '../../elements/upladmin-statuspage-config/upladmin-statuspage-config.js';
declare global {
interface HTMLElementTagNameMap {
'upladmin-app': UpladminApp;
}
}
export declare class UpladminApp extends DeesElement {
static demo: () => TemplateResult<1>;
accessor appuiBase: DeesAppuiBase | null;
static styles: import("@design.estate/dees-element").CSSResult[];
firstUpdated(): Promise<void>;
private configureApp;
private setupStateSubscriptions;
private reloadData;
render(): TemplateResult;
}

2
dist_ts_web/pages/upladmin-app/upladmin-app.demo.d.ts vendored
View File

@@ -1,2 +0,0 @@
import './upladmin-app.js';
export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

166
dist_ts_web/pages/upladmin-app/upladmin-app.demo.js
View File

@@ -1,166 +0,0 @@
import { html } from '@design.estate/dees-element';
import { adminState } from '../../services/admin-state.js';
import './upladmin-app.js';
// Initialize demo data
const initDemoData = () => {
const now = Date.now();
// Demo monitors
const monitors = [
{
id: 'api-server',
name: 'api-server',
displayName: 'API Server',
description: 'Main REST API backend',
category: 'Core Services',
currentStatus: 'operational',
lastChecked: now,
uptime30d: 99.98,
uptime90d: 99.95,
responseTime: 45,
dependencies: [],
},
{
id: 'web-app',
name: 'web-app',
displayName: 'Web Application',
description: 'Frontend web application',
category: 'Core Services',
currentStatus: 'operational',
lastChecked: now,
uptime30d: 99.95,
uptime90d: 99.90,
responseTime: 120,
dependencies: ['api-server'],
},
{
id: 'database',
name: 'database',
displayName: 'Database',
description: 'Primary PostgreSQL database',
category: 'Infrastructure',
currentStatus: 'operational',
lastChecked: now,
uptime30d: 99.99,
uptime90d: 99.98,
responseTime: 5,
dependencies: [],
},
{
id: 'cdn',
name: 'cdn',
displayName: 'CDN',
description: 'Content delivery network',
category: 'Infrastructure',
currentStatus: 'degraded',
lastChecked: now,
uptime30d: 99.85,
uptime90d: 99.80,
responseTime: 25,
dependencies: [],
},
{
id: 'email-service',
name: 'email-service',
displayName: 'Email Service',
description: 'Transactional email delivery',
category: 'External Services',
currentStatus: 'operational',
lastChecked: now,
uptime30d: 99.90,
uptime90d: 99.85,
responseTime: 200,
dependencies: [],
},
];
// Demo incidents
const incidents = [
{
id: 'incident-1',
title: 'CDN Performance Degradation',
impact: 'We are experiencing slower than normal response times from our CDN provider.',
severity: 'minor',
status: 'monitoring',
affectedServices: ['cdn'],
startTime: now - 2 * 60 * 60 * 1000, // 2 hours ago
updates: [
{
id: 'update-1-1',
status: 'investigating',
message: 'We are investigating reports of slow load times.',
timestamp: now - 2 * 60 * 60 * 1000,
},
{
id: 'update-1-2',
status: 'identified',
message: 'The issue has been identified as a CDN edge node problem.',
timestamp: now - 1 * 60 * 60 * 1000,
},
{
id: 'update-1-3',
status: 'monitoring',
message: 'A fix has been deployed. We are monitoring the situation.',
timestamp: now - 30 * 60 * 1000,
},
],
},
{
id: 'incident-2',
title: 'Scheduled Database Maintenance',
impact: 'Routine database maintenance window.',
severity: 'maintenance',
status: 'resolved',
affectedServices: ['database'],
startTime: now - 24 * 60 * 60 * 1000,
endTime: now - 23 * 60 * 60 * 1000,
updates: [
{
id: 'update-2-1',
status: 'investigating',
message: 'Maintenance has begun.',
timestamp: now - 24 * 60 * 60 * 1000,
},
{
id: 'update-2-2',
status: 'resolved',
message: 'Maintenance completed successfully.',
timestamp: now - 23 * 60 * 60 * 1000,
},
],
},
];
// Demo config
const config = {
theme: 'dark',
companyName: 'uptime.link',
companyLogo: '',
supportEmail: 'support@uptime.link',
showHistoricalDays: 90,
timeZone: 'UTC',
};
// Set demo data in state
adminState.monitors = monitors;
adminState.incidents = incidents;
adminState.config = config;
};
export const demoFunc = () => {
// Initialize demo data
initDemoData();
return html `
<dees-demowrapper>
<style>
.demo-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
</style>
<div class="demo-container">
<upladmin-app></upladmin-app>
</div>
</dees-demowrapper>
`;
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXBsYWRtaW4tYXBwLmRlbW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvcGFnZXMvdXBsYWRtaW4tYXBwL3VwbGFkbWluLWFwcC5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUNuRCxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sK0JBQStCLENBQUM7QUFFM0QsT0FBTyxtQkFBbUIsQ0FBQztBQUUzQix1QkFBdUI7QUFDdkIsTUFBTSxZQUFZLEdBQUcsR0FBRyxFQUFFO0lBQ3hCLE1BQU0sR0FBRyxHQUFHLElBQUksQ0FBQyxHQUFHLEVBQUUsQ0FBQztJQUV2QixnQkFBZ0I7SUFDaEIsTUFBTSxRQUFRLEdBQXFCO1FBQ2pDO1lBQ0UsRUFBRSxFQUFFLFlBQVk7WUFDaEIsSUFBSSxFQUFFLFlBQVk7WUFDbEIsV0FBVyxFQUFFLFlBQVk7WUFDekIsV0FBVyxFQUFFLHVCQUF1QjtZQUNwQyxRQUFRLEVBQUUsZUFBZTtZQUN6QixhQUFhLEVBQUUsYUFBYTtZQUM1QixXQUFXLEVBQUUsR0FBRztZQUNoQixTQUFTLEVBQUUsS0FBSztZQUNoQixTQUFTLEVBQUUsS0FBSztZQUNoQixZQUFZLEVBQUUsRUFBRTtZQUNoQixZQUFZLEVBQUUsRUFBRTtTQUNqQjtRQUNEO1lBQ0UsRUFBRSxFQUFFLFNBQVM7WUFDYixJQUFJLEVBQUUsU0FBUztZQUNmLFdBQVcsRUFBRSxpQkFBaUI7WUFDOUIsV0FBVyxFQUFFLDBCQUEwQjtZQUN2QyxRQUFRLEVBQUUsZUFBZTtZQUN6QixhQUFhLEVBQUUsYUFBYTtZQUM1QixXQUFXLEVBQUUsR0FBRztZQUNoQixTQUFTLEVBQUUsS0FBSztZQUNoQixTQUFTLEVBQUUsS0FBSztZQUNoQixZQUFZLEVBQUUsR0FBRztZQUNqQixZQUFZLEVBQUUsQ0FBQyxZQUFZLENBQUM7U0FDN0I7UUFDRDtZQUNFLEVBQUUsRUFB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

309
dist_ts_web/pages/upladmin-app/upladmin-app.js
View File

File diff suppressed because one or more lines are too long

4
dist_ts_web/plugins.d.ts vendored
View File

@@ -1,4 +0,0 @@
import * as domtools from '@design.estate/dees-domtools';
import * as deesCatalog from '@design.estate/dees-catalog';
import * as uplInterfaces from '@uptime.link/interfaces';
export { domtools, deesCatalog, uplInterfaces };

5
dist_ts_web/plugins.js
View File

@@ -1,5 +0,0 @@
import * as domtools from '@design.estate/dees-domtools';
import * as deesCatalog from '@design.estate/dees-catalog';
import * as uplInterfaces from '@uptime.link/interfaces';
export { domtools, deesCatalog, uplInterfaces };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGx1Z2lucy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uL3RzX3dlYi9wbHVnaW5zLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxRQUFRLE1BQU0sOEJBQThCLENBQUM7QUFDekQsT0FBTyxLQUFLLFdBQVcsTUFBTSw2QkFBNkIsQ0FBQztBQUMzRCxPQUFPLEtBQUssYUFBYSxNQUFNLHlCQUF5QixDQUFDO0FBRXpELE9BQU8sRUFDTCxRQUFRLEVBQ1IsV0FBVyxFQUNYLGFBQWEsRUFDZCxDQUFBIn0=

50
dist_ts_web/services/admin-state.d.ts vendored
View File

@@ -1,50 +0,0 @@
import type { IServiceStatus, IIncidentDetails, IStatusPageConfig, IMonitorFormData, IIncidentFormData } from '../interfaces/index.js';
type TStateChangeListener<T> = (data: T) => void;
/**
* Simple observable implementation for state changes
*/
declare class SimpleObservable<T> {
private listeners;
subscribe(listener: TStateChangeListener<T>): () => void;
next(value: T): void;
}
/**
* Centralized state management for the admin dashboard.
* Handles cross-view data passing and state synchronization.
*/
export declare class AdminState {
monitors$: SimpleObservable<IServiceStatus[]>;
incidents$: SimpleObservable<IIncidentDetails[]>;
config$: SimpleObservable<IStatusPageConfig>;
private _monitors;
private _incidents;
private _config;
private _selectedMonitor;
private _selectedIncident;
get monitors(): IServiceStatus[];
set monitors(value: IServiceStatus[]);
get incidents(): IIncidentDetails[];
set incidents(value: IIncidentDetails[]);
get config(): IStatusPageConfig | null;
set config(value: IStatusPageConfig | null);
setSelectedMonitor(monitor: IServiceStatus | null): void;
getSelectedMonitor(): IServiceStatus | null;
clearSelectedMonitor(): void;
setSelectedIncident(incident: IIncidentDetails | null): void;
getSelectedIncident(): IIncidentDetails | null;
clearSelectedIncident(): void;
getCategories(): string[];
getAvailableServices(): IServiceStatus[];
getMonitorById(id: string): IServiceStatus | undefined;
getIncidentById(id: string): IIncidentDetails | undefined;
getActiveIncidents(): IIncidentDetails[];
getPastIncidents(): IIncidentDetails[];
addMonitor(monitor: IServiceStatus): void;
updateMonitor(id: string, data: Partial<IMonitorFormData>): void;
deleteMonitor(id: string): void;
addIncident(incident: IIncidentDetails): void;
updateIncident(id: string, data: Partial<IIncidentFormData>): void;
deleteIncident(id: string): void;
}
export declare const adminState: AdminState;
export {};

125
dist_ts_web/services/admin-state.js
View File

File diff suppressed because one or more lines are too long

1
dist_ts_web/services/index.d.ts vendored
View File

@@ -1 +0,0 @@
export * from './admin-state.js';

2
dist_ts_web/services/index.js
View File

@@ -1,2 +0,0 @@
export * from './admin-state.js';
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvc2VydmljZXMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyxrQkFBa0IsQ0FBQyJ9

91
dist_ts_web/styles/shared.styles.d.ts vendored
View File

@@ -1,91 +0,0 @@
export declare const fonts: {
base: string;
mono: string;
};
export declare const colors: {
background: {
primary: import("@design.estate/dees-element").CSSResult;
secondary: import("@design.estate/dees-element").CSSResult;
muted: import("@design.estate/dees-element").CSSResult;
card: import("@design.estate/dees-element").CSSResult;
elevated: import("@design.estate/dees-element").CSSResult;
};
border: {
default: import("@design.estate/dees-element").CSSResult;
muted: import("@design.estate/dees-element").CSSResult;
subtle: import("@design.estate/dees-element").CSSResult;
light: import("@design.estate/dees-element").CSSResult;
strong: import("@design.estate/dees-element").CSSResult;
};
text: {
primary: import("@design.estate/dees-element").CSSResult;
secondary: import("@design.estate/dees-element").CSSResult;
muted: import("@design.estate/dees-element").CSSResult;
};
status: {
operational: import("@design.estate/dees-element").CSSResult;
degraded: import("@design.estate/dees-element").CSSResult;
partial: import("@design.estate/dees-element").CSSResult;
major: import("@design.estate/dees-element").CSSResult;
maintenance: import("@design.estate/dees-element").CSSResult;
partialOutage: import("@design.estate/dees-element").CSSResult;
majorOutage: import("@design.estate/dees-element").CSSResult;
};
accent: {
primary: import("@design.estate/dees-element").CSSResult;
hover: import("@design.estate/dees-element").CSSResult;
focus: import("@design.estate/dees-element").CSSResult;
danger: import("@design.estate/dees-element").CSSResult;
dangerHover: import("@design.estate/dees-element").CSSResult;
success: import("@design.estate/dees-element").CSSResult;
warning: import("@design.estate/dees-element").CSSResult;
};
};
export declare const shadows: {
xs: string;
sm: string;
base: string;
md: string;
lg: string;
xl: string;
inner: string;
};
export declare const borderRadius: {
xs: string;
sm: string;
base: string;
md: string;
lg: string;
xl: string;
'2xl': string;
full: string;
};
export declare const spacing: {
xs: string;
sm: string;
md: string;
lg: string;
xl: string;
'2xl': string;
'3xl': string;
'4xl': string;
};
export declare const easings: {
default: string;
smooth: string;
bounce: string;
snappy: string;
spring: string;
};
export declare const durations: {
instant: string;
fast: string;
normal: string;
slow: string;
slower: string;
slowest: string;
};
export declare const commonStyles: import("@design.estate/dees-element").CSSResult;
export declare const getStatusColor: (status: string) => import("@design.estate/dees-element").CSSResult;
export declare const getSeverityLabel: (severity: string) => string;
export declare const getStatusLabel: (status: string) => string;

667
dist_ts_web/styles/shared.styles.js
View File

File diff suppressed because one or more lines are too long

243750
dist_watch/bundle.js
View File

File diff suppressed because one or more lines are too long

7
dist_watch/bundle.js.map
View File

File diff suppressed because one or more lines are too long

29
dist_watch/index.html
View File

@@ -1,29 +0,0 @@
<!--gitzone element-->
<!-- made by Task Venture Capital GmbH -->
<!-- checkout https://maintainedby.lossless.com for awesome OpenSource projects -->
<html lang="en">
<head>
<!--Lets set some basic meta tags-->
<meta
name="viewport"
content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height"
/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--Lets load standard fonts-->
<link rel="preconnect" href="https://assetbroker.lossless.one/" crossorigin>
<link rel="preload" href="https://assetbroker.lossless.one/fonts/geist-sans/geistvf.woff2" as="font" type="font/woff2" crossorigin>
<link rel="stylesheet" href="https://assetbroker.lossless.one/fonts/fonts.css">
<style>
body {
margin: 0px;
background: #222222;
}
</style>
<script type="module" src="/bundle.js"></script>
</head>
<body>
</body>
</html>

4
package.json
View File

@@ -1,6 +1,6 @@
{ {
"name": "@uptime.link/statuspage-admin", "name": "@uptime.link/statuspage-admin",
"version": "1.0.1", "version": "1.3.0",
"private": false, "private": false,
"description": "Admin components for managing UptimeLink status pages, monitors, and incidents.", "description": "Admin components for managing UptimeLink status pages, monitors, and incidents.",
"main": "dist_ts_web/index.js", "main": "dist_ts_web/index.js",
@@ -19,7 +19,7 @@
"@design.estate/dees-domtools": "^2.3.6", "@design.estate/dees-domtools": "^2.3.6",
"@design.estate/dees-element": "^2.1.3", "@design.estate/dees-element": "^2.1.3",
"@design.estate/dees-wcctools": "^3.2.0", "@design.estate/dees-wcctools": "^3.2.0",
"@uptime.link/interfaces": "^2.0.21" "@uptime.link/interfaces": "^2.1.0"
}, },
"devDependencies": { "devDependencies": {
"@git.zone/tsbuild": "^4.0.2", "@git.zone/tsbuild": "^4.0.2",

19
pnpm-lock.yaml generated
View File

@@ -21,8 +21,8 @@ importers:
specifier: ^3.2.0 specifier: ^3.2.0
version: 3.2.0 version: 3.2.0
'@uptime.link/interfaces': '@uptime.link/interfaces':
specifier: ^2.0.21 specifier: ^2.1.0
version: 2.0.21 version: 2.1.0
devDependencies: devDependencies:
'@git.zone/tsbuild': '@git.zone/tsbuild':
specifier: ^4.0.2 specifier: ^4.0.2
@@ -65,9 +65,6 @@ packages:
peerDependencies: peerDependencies:
'@push.rocks/smartserve': '>=1.1.0' '@push.rocks/smartserve': '>=1.1.0'
'@apiglobal/typedrequest-interfaces@2.0.1':
resolution: {integrity: sha512-Oi7pNU4vKo5UvcCJmqkH43Us237Ws/Pp/WDYnwnonRnTmIMd+6QjNfN/gXcPnP6tbamk8r8Xzcz9mgnSDM2ysw==}
'@aws-crypto/crc32@5.2.0': '@aws-crypto/crc32@5.2.0':
resolution: {integrity: sha512-nLbCWqQNgUiwwtFsen1AdzAtvuLRsQS8rYgMuxCrdKf9kOssamGLuPwyTY9wyYblNr9+1XM8v6zoDTPPSIeANg==} resolution: {integrity: sha512-nLbCWqQNgUiwwtFsen1AdzAtvuLRsQS8rYgMuxCrdKf9kOssamGLuPwyTY9wyYblNr9+1XM8v6zoDTPPSIeANg==}
engines: {node: '>=16.0.0'} engines: {node: '>=16.0.0'}
@@ -1512,8 +1509,8 @@ packages:
'@ungap/structured-clone@1.3.0': '@ungap/structured-clone@1.3.0':
resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==} resolution: {integrity: sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==}
'@uptime.link/interfaces@2.0.21': '@uptime.link/interfaces@2.1.0':
resolution: {integrity: sha512-sy7WBzHOxU7Kt0BGofK0R3CS8D8QtbTXB00i75QKYXkEesdLd91SbFL80wTupKfjzeldE0ejUVSgvtlZEr8XlQ==} resolution: {integrity: sha512-KlsAUp4Vvb4TeFNBDq4MZ9v4RaeLPr1GRlj4mkNmGLSfEiSasj1FWGLEj8iRdfeUuxMu0WRpAvWe2Ol0MRzoqg==}
'@webcontainer/api@1.2.0': '@webcontainer/api@1.2.0':
resolution: {integrity: sha512-tzoKBd4lLdhHy5GHFpUkl+ndoSba8JqmB7x0ZQFnWfjbcbQOvKQfxA8MEMUYhgqjWHnbrWdAfnBEHz5f5lYG5A==} resolution: {integrity: sha512-tzoKBd4lLdhHy5GHFpUkl+ndoSba8JqmB7x0ZQFnWfjbcbQOvKQfxA8MEMUYhgqjWHnbrWdAfnBEHz5f5lYG5A==}
@@ -2976,8 +2973,6 @@ snapshots:
'@push.rocks/smartstring': 4.1.0 '@push.rocks/smartstring': 4.1.0
'@push.rocks/smarturl': 3.1.0 '@push.rocks/smarturl': 3.1.0
'@apiglobal/typedrequest-interfaces@2.0.1': {}
'@aws-crypto/crc32@5.2.0': '@aws-crypto/crc32@5.2.0':
dependencies: dependencies:
'@aws-crypto/util': 5.2.0 '@aws-crypto/util': 5.2.0
@@ -5254,10 +5249,10 @@ snapshots:
'@ungap/structured-clone@1.3.0': {} '@ungap/structured-clone@1.3.0': {}
'@uptime.link/interfaces@2.0.21': '@uptime.link/interfaces@2.1.0':
dependencies: dependencies:
'@apiglobal/typedrequest-interfaces': 2.0.1 '@api.global/typedrequest-interfaces': 3.0.19
'@tsclass/tsclass': 4.4.4 '@tsclass/tsclass': 9.3.0
'@webcontainer/api@1.2.0': {} '@webcontainer/api@1.2.0': {}

396
readme.plan.md Normal file
View File

@@ -0,0 +1,396 @@
# Plan: Migrate Shared Interfaces to @uptime.link/interfaces
## Overview
Move shared type definitions from `catalog_admin/ts_web/interfaces/` to the canonical `../interfaces` package (`@uptime.link/interfaces`) to ensure consistency across all uptime.link packages.
## Decisions (Resolved)
1. **Check Config**: Use base type + discriminated union variants (elegant, type-safe)
2. **Incident Status**: Create unified type in shared package, migrate both packages
3. **Form Interfaces**: Keep local in catalog_admin (UI-specific)
4. **Versioning**: Manual releases - will notify when ready to publish
---
## Task 1: Add Base Types to Shared Package
**File: `../interfaces/ts/data/types.ts`** (new)
```typescript
// Status types for monitors/services
export type TStatusType =
| 'operational'
| 'degraded'
| 'partial_outage'
| 'major_outage'
| 'maintenance'
| 'initializing'
| 'error'
| 'paused';
// Check types (discriminant values)
export type TCheckType = 'assumption' | 'function' | 'pwa' | 'pagerank';
// Status mode for monitors
export type TStatusMode = 'auto' | 'manual';
// Incident severity
export type TIncidentSeverity = 'critical' | 'major' | 'minor' | 'maintenance';
// Incident status (unified)
export type TIncidentStatus =
| 'investigating'
| 'identified'
| 'monitoring'
| 'resolved'
| 'postmortem';
```
---
## Task 2: Refactor Check Interfaces with Base + Variants
**File: `../interfaces/ts/data/checks/index.ts`** (refactor)
```typescript
import { TStatusType, TCheckType } from '../types.js';
// ============================================
// Base Interface
// ============================================
export interface ICheckBase {
id: string;
name: string;
description?: string;
enabled: boolean;
intervalMs?: number;
lastRun?: number;
lastResult?: 'success' | 'failure' | 'pending';
}
// ============================================
// Discriminated Variants
// ============================================
export interface IAssumptionCheck extends ICheckBase {
checkType: 'assumption';
assumedStatus: TStatusType;
}
export interface IFunctionCheck extends ICheckBase {
checkType: 'function';
functionUrl: string;
expectedStatusCode?: number;
timeoutMs?: number;
headers?: Record<string, string>;
}
export interface IPwaCheck extends ICheckBase {
checkType: 'pwa';
targetUrl: string;
lighthouseThreshold?: number;
categories?: ('performance' | 'accessibility' | 'best-practices' | 'seo')[];
}
export interface IPageRankCheck extends ICheckBase {
checkType: 'pagerank';
targetUrl: string;
minimumRank?: number;
searchEngine?: 'google' | 'bing';
}
// ============================================
// Union Type (for UI and generic handling)
// ============================================
export type TCheck =
| IAssumptionCheck
| IFunctionCheck
| IPwaCheck
| IPageRankCheck;
// ============================================
// Check Collection
// ============================================
export interface ICheckCollection {
id: string;
name: string;
checks: TCheck[];
}
```
---
## Task 3: Create Unified Incident Interface
**File: `../interfaces/ts/data/incident.ts`** (refactor)
```typescript
import { TIncidentSeverity, TIncidentStatus } from './types.js';
export interface IIncidentUpdate {
id: string;
incidentId: string;
status: TIncidentStatus;
message: string;
createdAt: number;
createdBy?: string;
}
export interface IIncident {
id: string;
title: string;
description: string;
severity: TIncidentSeverity;
status: TIncidentStatus;
// Affected services
affectedServiceIds: string[];
// Timeline
createdAt: number;
updatedAt: number;
resolvedAt?: number;
// Updates history
updates: IIncidentUpdate[];
// Metadata
createdBy?: string;
isScheduled?: boolean;
scheduledStartTime?: number;
scheduledEndTime?: number;
}
```
---
## Task 4: Add Service Status Interface
**File: `../interfaces/ts/data/servicestatus.ts`** (new)
```typescript
import { TStatusType, TStatusMode, TCheckType } from './types.js';
export interface IServiceStatus {
id: string;
name: string;
displayName: string;
description?: string;
// Current state
currentStatus: TStatusType;
lastChecked: number;
responseTime: number;
// Uptime metrics
uptime30d: number;
uptime90d: number;
// Organization
category?: string;
dependencies?: string[];
// Status management
statusMode: TStatusMode;
manualStatus?: TStatusType;
paused: boolean;
// Check configuration (references check collection)
checkType?: TCheckType;
checkCollectionId?: string;
intervalMs?: number;
}
export interface IStatusHistoryPoint {
timestamp: number;
status: TStatusType;
responseTime?: number;
}
export interface IOverallStatus {
status: TStatusType;
message?: string;
lastUpdated: number;
}
```
---
## Task 5: Add Status Page Config
**File: `../interfaces/ts/data/statuspageconfig.ts`** (new)
```typescript
import { IOverallStatus } from './servicestatus.js';
export interface IStatusPageConfig {
id: string;
name: string;
slug: string;
// Branding
logoUrl?: string;
faviconUrl?: string;
primaryColor?: string;
// Content
headerTitle: string;
headerDescription?: string;
// Features
showHistoricalUptime: boolean;
showResponseTime: boolean;
showSubscribeButton: boolean;
// Service grouping
serviceGroups: IServiceGroup[];
// Overall status override
overallStatus?: IOverallStatus;
}
export interface IServiceGroup {
id: string;
name: string;
description?: string;
serviceIds: string[];
expanded: boolean;
}
```
---
## Task 6: Update Shared Package Exports
**File: `../interfaces/ts/data/index.ts`** (update)
```typescript
export * from './types.js';
export * from './checks/index.js';
export * from './incident.js';
export * from './servicestatus.js';
export * from './statuspageconfig.js';
// ... existing exports
```
---
## Task 7: Update catalog_admin Interfaces
**File: `catalog_admin/ts_web/interfaces/index.ts`** (refactor)
```typescript
// Re-export shared types from @uptime.link/interfaces
export {
// Types
TStatusType,
TCheckType,
TStatusMode,
TIncidentSeverity,
TIncidentStatus,
// Check interfaces
ICheckBase,
IAssumptionCheck,
IFunctionCheck,
IPwaCheck,
IPageRankCheck,
TCheck,
ICheckCollection,
// Incident interfaces
IIncident,
IIncidentUpdate,
// Service/Status interfaces
IServiceStatus,
IStatusHistoryPoint,
IOverallStatus,
IStatusPageConfig,
IServiceGroup,
} from '@uptime.link/interfaces';
// ============================================
// Form Interfaces (UI-specific, kept local)
// ============================================
import type { TStatusType, TCheckType, TStatusMode, TIncidentSeverity } from '@uptime.link/interfaces';
export interface IMonitorFormData {
name: string;
displayName: string;
description?: string;
category?: string;
checkType: TCheckType;
intervalMs: number;
statusMode: TStatusMode;
paused: boolean;
// Check-specific fields (form flattens the discriminated union)
assumedStatus?: TStatusType;
functionUrl?: string;
expectedStatusCode?: number;
targetUrl?: string;
lighthouseThreshold?: number;
minimumRank?: number;
}
export interface IIncidentFormData {
title: string;
description: string;
severity: TIncidentSeverity;
affectedServiceIds: string[];
isScheduled: boolean;
scheduledStartTime?: number;
scheduledEndTime?: number;
}
export interface IIncidentUpdateFormData {
status: string;
message: string;
}
```
---
## Task 8: Update Component Imports
Scan and update all components that import from local interfaces to ensure they work with the new types. Key files:
- `ts_web/elements/upladmin-monitor-form/upladmin-monitor-form.ts`
- `ts_web/elements/upladmin-monitor-list/upladmin-monitor-list.ts`
- `ts_web/elements/upladmin-incident-form/upladmin-incident-form.ts`
- `ts_web/elements/upladmin-incident-list/upladmin-incident-list.ts`
- `ts_web/elements/upladmin-incident-update/upladmin-incident-update.ts`
---
## Task 9: Build and Test
1. Build `../interfaces`: `cd ../interfaces && pnpm build`
2. **Notify for release** of `@uptime.link/interfaces`
3. Update dependency: `pnpm update @uptime.link/interfaces`
4. Build catalog_admin: `pnpm build`
5. Verify no type errors
6. Test UI components manually
---
## Files Summary
### New files in `../interfaces`:
- `ts/data/types.ts`
- `ts/data/servicestatus.ts`
- `ts/data/statuspageconfig.ts`
### Modified files in `../interfaces`:
- `ts/data/checks/index.ts` (refactor to base + variants)
- `ts/data/incident.ts` (unified interface)
- `ts/data/index.ts` (add exports)
### Modified files in `catalog_admin`:
- `ts_web/interfaces/index.ts` (re-export from shared + local form types)
- Component files (if import paths change)

2
ts_web/00_commitinfo_data.ts
View File

@@ -3,6 +3,6 @@
*/ */
export const commitinfo = { export const commitinfo = {
name: '@uptime.link/statuspage-admin', name: '@uptime.link/statuspage-admin',
version: '1.0.1', version: '1.3.0',
description: 'Admin components for managing UptimeLink status pages, monitors, and incidents.' description: 'Admin components for managing UptimeLink status pages, monitors, and incidents.'
} }

3
ts_web/elements/index.ts
View File

@@ -1,3 +1,6 @@
// Shared components
export * from './upladmin-option-card/index.js';
// Monitor components // Monitor components
export * from './upladmin-monitor-form/index.js'; export * from './upladmin-monitor-form/index.js';
export * from './upladmin-monitor-list/index.js'; export * from './upladmin-monitor-list/index.js';

87
ts_web/elements/upladmin-incident-form/upladmin-incident-form.ts
View File

@@ -168,51 +168,6 @@ export class UpladminIncidentForm extends DeesElement {
gap: ${unsafeCSS(sharedStyles.spacing.sm)}; gap: ${unsafeCSS(sharedStyles.spacing.sm)};
} }
.option-card {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
padding: 18px 14px;
background: ${sharedStyles.colors.background.primary};
border: 2px solid ${sharedStyles.colors.border.default};
border-radius: ${unsafeCSS(sharedStyles.borderRadius.base)};
cursor: pointer;
transition: all ${unsafeCSS(sharedStyles.durations.fast)} ${unsafeCSS(sharedStyles.easings.default)};
text-align: center;
}
.option-card:hover {
border-color: ${sharedStyles.colors.border.strong};
background: ${sharedStyles.colors.background.muted};
}
.option-card.selected {
border-color: ${sharedStyles.colors.accent.primary};
background: ${cssManager.bdTheme('rgba(59, 130, 246, 0.05)', 'rgba(96, 165, 250, 0.1)')};
}
.option-card input {
display: none;
}
.option-label {
font-size: 13px;
font-weight: 600;
color: ${sharedStyles.colors.text.primary};
}
.option-desc {
font-size: 11px;
color: ${sharedStyles.colors.text.muted};
line-height: 1.3;
}
.severity-critical dees-icon { --icon-color: ${sharedStyles.colors.status.majorOutage}; }
.severity-major dees-icon { --icon-color: ${sharedStyles.colors.status.partialOutage}; }
.severity-minor dees-icon { --icon-color: ${sharedStyles.colors.status.degraded}; }
.severity-maintenance dees-icon { --icon-color: ${sharedStyles.colors.status.maintenance}; }
.field-label { .field-label {
display: block; display: block;
font-size: 13px; font-size: 13px;
@@ -363,20 +318,14 @@ export class UpladminIncidentForm extends DeesElement {
<label class="field-label required">Severity</label> <label class="field-label required">Severity</label>
<div class="option-grid"> <div class="option-grid">
${severityOptions.map(opt => html` ${severityOptions.map(opt => html`
<label <upladmin-option-card
class="option-card severity-${opt.value} ${this.formData.severity === opt.value ? 'selected' : ''}" .variant=${opt.value}
@click="${() => this.handleSeverityChange(opt.value)}" .icon=${this.severityIcons[opt.value]}
> .label=${opt.label}
<input .description=${opt.desc}
type="radio" ?selected=${this.formData.severity === opt.value}
name="severity" @click=${() => this.handleSeverityChange(opt.value)}
value="${opt.value}" ></upladmin-option-card>
?checked="${this.formData.severity === opt.value}"
/>
<dees-icon .icon=${this.severityIcons[opt.value]} .iconSize=${24}></dees-icon>
<span class="option-label">${opt.label}</span>
<span class="option-desc">${opt.desc}</span>
</label>
`)} `)}
</div> </div>
</div> </div>
@@ -385,19 +334,13 @@ export class UpladminIncidentForm extends DeesElement {
<label class="field-label required">Status</label> <label class="field-label required">Status</label>
<div class="option-grid"> <div class="option-grid">
${statusOptions.map(opt => html` ${statusOptions.map(opt => html`
<label <upladmin-option-card
class="option-card ${this.formData.status === opt.value ? 'selected' : ''}" .variant=${opt.value}
@click="${() => this.handleStatusChange(opt.value)}" .icon=${this.statusIcons[opt.value]}
> .label=${opt.label}
<input ?selected=${this.formData.status === opt.value}
type="radio" @click=${() => this.handleStatusChange(opt.value)}
name="status" ></upladmin-option-card>
value="${opt.value}"
?checked="${this.formData.status === opt.value}"
/>
<dees-icon .icon=${this.statusIcons[opt.value]} .iconSize=${24}></dees-icon>
<span class="option-label">${opt.label}</span>
</label>
`)} `)}
</div> </div>
</div> </div>

4
ts_web/elements/upladmin-incident-list/upladmin-incident-list.ts
View File

@@ -260,8 +260,8 @@ export class UpladminIncidentList extends DeesElement {
.incident-status.postmortem { .incident-status.postmortem {
background: ${cssManager.bdTheme('rgba(168, 85, 247, 0.1)', 'rgba(168, 85, 247, 0.2)')}; background: ${cssManager.bdTheme('rgba(168, 85, 247, 0.1)', 'rgba(168, 85, 247, 0.2)')};
color: #a855f7; color: ${cssManager.bdTheme('#9333ea', '#a855f7')};
--icon-color: #a855f7; --icon-color: ${cssManager.bdTheme('#9333ea', '#a855f7')};
} }
.incident-meta { .incident-meta {

107
ts_web/elements/upladmin-incident-update/upladmin-incident-update.ts
View File

@@ -157,52 +157,6 @@ export class UpladminIncidentUpdate extends DeesElement {
gap: ${unsafeCSS(sharedStyles.spacing.sm)}; gap: ${unsafeCSS(sharedStyles.spacing.sm)};
} }
.status-option {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
padding: 18px 14px;
background: ${sharedStyles.colors.background.primary};
border: 2px solid ${sharedStyles.colors.border.default};
border-radius: ${unsafeCSS(sharedStyles.borderRadius.base)};
cursor: pointer;
transition: all ${unsafeCSS(sharedStyles.durations.fast)} ${unsafeCSS(sharedStyles.easings.default)};
text-align: center;
}
.status-option:hover {
border-color: ${sharedStyles.colors.border.strong};
background: ${sharedStyles.colors.background.muted};
}
.status-option.selected {
border-color: ${sharedStyles.colors.accent.primary};
background: ${cssManager.bdTheme('rgba(59, 130, 246, 0.05)', 'rgba(96, 165, 250, 0.1)')};
}
.status-option input {
display: none;
}
.status-option.investigating dees-icon { --icon-color: ${sharedStyles.colors.status.partialOutage}; }
.status-option.identified dees-icon { --icon-color: ${sharedStyles.colors.status.degraded}; }
.status-option.monitoring dees-icon { --icon-color: ${sharedStyles.colors.status.maintenance}; }
.status-option.resolved dees-icon { --icon-color: ${sharedStyles.colors.status.operational}; }
.status-option.postmortem dees-icon { --icon-color: #a855f7; }
.status-label {
font-size: 13px;
font-weight: 600;
color: ${sharedStyles.colors.text.primary};
}
.status-desc {
font-size: 11px;
color: ${sharedStyles.colors.text.muted};
line-height: 1.3;
}
.field-label { .field-label {
display: block; display: block;
font-size: 13px; font-size: 13px;
@@ -308,11 +262,12 @@ export class UpladminIncidentUpdate extends DeesElement {
{ value: 'postmortem', label: 'Postmortem', desc: 'Analysis complete' }, { value: 'postmortem', label: 'Postmortem', desc: 'Analysis complete' },
]; ];
const templates: Array<{ icon: string; label: string; message: string }> = [ const templates: Array<{ icon: string; label: string; status: TIncidentStatus; message: string }> = [
{ icon: 'lucide:Search', label: 'Started investigating', message: 'We are currently investigating this issue.' }, { icon: 'lucide:Search', label: 'Started investigating', status: 'investigating', message: 'We are currently investigating this issue.' },
{ icon: 'lucide:Target', label: 'Issue identified', message: 'We have identified the root cause and are working on a fix.' }, { icon: 'lucide:Target', label: 'Issue identified', status: 'identified', message: 'We have identified the root cause and are working on a fix.' },
{ icon: 'lucide:Rocket', label: 'Fix deployed', message: 'A fix has been deployed. We are monitoring the results.' }, { icon: 'lucide:Rocket', label: 'Fix deployed', status: 'monitoring', message: 'A fix has been deployed. We are monitoring the results.' },
{ icon: 'lucide:CheckCircle', label: 'Resolved', message: 'This incident has been resolved. All systems are operating normally.' }, { icon: 'lucide:CheckCircle', label: 'Resolved', status: 'resolved', message: 'This incident has been resolved. All systems are operating normally.' },
{ icon: 'lucide:FileText', label: 'Postmortem', status: 'postmortem', message: 'Postmortem will be released shortly.' },
]; ];
const severityIcons: Record<string, string> = { const severityIcons: Record<string, string> = {
@@ -340,41 +295,37 @@ export class UpladminIncidentUpdate extends DeesElement {
<div class="update-body"> <div class="update-body">
<dees-form> <dees-form>
<div class="template-section">
<label class="field-label">Quick Templates</label>
<div class="template-label">Select a template to prefill status and message:</div>
<div class="template-buttons">
${templates.map(tpl => html`
<button type="button" class="template-btn" @click="${() => this.applyTemplate(tpl)}">
<dees-icon .icon=${tpl.icon} .iconSize=${12}></dees-icon>
${tpl.label}
</button>
`)}
</div>
</div>
<div> <div>
<label class="field-label required">Status</label> <label class="field-label required">Status</label>
<div class="status-grid"> <div class="status-grid">
${statusOptions.map(opt => html` ${statusOptions.map(opt => html`
<label <upladmin-option-card
class="status-option ${opt.value} ${this.formData.status === opt.value ? 'selected' : ''}" .variant=${opt.value}
@click="${() => this.handleStatusChange(opt.value)}" .icon=${this.statusIcons[opt.value]}
> .label=${opt.label}
<input .description=${opt.desc}
type="radio" ?selected=${this.formData.status === opt.value}
name="status" @click=${() => this.handleStatusChange(opt.value)}
value="${opt.value}" ></upladmin-option-card>
?checked="${this.formData.status === opt.value}"
/>
<dees-icon .icon=${this.statusIcons[opt.value]} .iconSize=${24}></dees-icon>
<span class="status-label">${opt.label}</span>
<span class="status-desc">${opt.desc}</span>
</label>
`)} `)}
</div> </div>
</div> </div>
<div> <div>
<label class="field-label required">Update Message</label> <label class="field-label required">Update Message</label>
<div class="template-section">
<div class="template-label">Quick templates:</div>
<div class="template-buttons">
${templates.map(tpl => html`
<button type="button" class="template-btn" @click="${() => this.applyTemplate(tpl.message)}">
<dees-icon .icon=${tpl.icon} .iconSize=${12}></dees-icon>
${tpl.label}
</button>
`)}
</div>
</div>
<dees-input-text <dees-input-text
key="message" key="message"
inputType="textarea" inputType="textarea"
@@ -430,8 +381,8 @@ export class UpladminIncidentUpdate extends DeesElement {
this.formData = { ...this.formData, status }; this.formData = { ...this.formData, status };
} }
private applyTemplate(message: string) { private applyTemplate(template: { status: TIncidentStatus; message: string }) {
this.formData = { ...this.formData, message }; this.formData = { ...this.formData, status: template.status, message: template.message };
} }
private validate(): boolean { private validate(): boolean {

580
ts_web/elements/upladmin-monitor-form/upladmin-monitor-form.ts
View File

@@ -10,8 +10,9 @@ import {
unsafeCSS, unsafeCSS,
state, state,
} from '@design.estate/dees-element'; } from '@design.estate/dees-element';
import type { DeesInputMultitoggle } from '@design.estate/dees-catalog';
import * as sharedStyles from '../../styles/shared.styles.js'; import * as sharedStyles from '../../styles/shared.styles.js';
import type { IMonitorFormData, IServiceStatus } from '../../interfaces/index.js'; import type { IMonitorFormData, IServiceStatus, ICheckConfig, TStatusType, TCheckType, TStatusMode } from '../../interfaces/index.js';
import { demoFunc } from './upladmin-monitor-form.demo.js'; import { demoFunc } from './upladmin-monitor-form.demo.js';
declare global { declare global {
@@ -20,8 +21,6 @@ declare global {
} }
} }
type TStatusType = 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance';
@customElement('upladmin-monitor-form') @customElement('upladmin-monitor-form')
export class UpladminMonitorForm extends DeesElement { export class UpladminMonitorForm extends DeesElement {
public static demo = demoFunc; public static demo = demoFunc;
@@ -45,80 +44,90 @@ export class UpladminMonitorForm extends DeesElement {
description: '', description: '',
category: '', category: '',
dependencies: [], dependencies: [],
currentStatus: 'operational', statusMode: 'auto',
paused: false,
checkType: 'assumption',
checkConfig: { domain: '' },
intervalMs: 300000,
}; };
@state() @state()
accessor errors: Record<string, string> = {}; accessor errors: Record<string, string> = {};
private statusIcons: Record<TStatusType, string> = { private checkTypeLabels: Record<TCheckType, string> = {
operational: 'lucide:CheckCircle', assumption: 'Assumption',
degraded: 'lucide:AlertTriangle', function: 'Function',
partial_outage: 'lucide:AlertOctagon', pwa: 'PWA',
major_outage: 'lucide:XCircle', pagerank: 'PageRank',
maintenance: 'lucide:Wrench',
}; };
private getCheckTypeLabel(): string {
return this.checkTypeLabels[this.formData.checkType] || 'Assumption';
}
private getStatusModeLabel(): string {
return this.formData.statusMode === 'auto' ? 'Auto' : 'Manual';
}
private intervalOptions = [
{ value: 60000, label: '1 min' },
{ value: 300000, label: '5 min' },
{ value: 900000, label: '15 min' },
{ value: 1800000, label: '30 min' },
{ value: 3600000, label: '1 hour' },
];
public static styles = [ public static styles = [
plugins.domtools.elementBasic.staticStyles, plugins.domtools.elementBasic.staticStyles,
sharedStyles.commonStyles, sharedStyles.commonStyles,
css` css`
:host { :host {
display: block; display: block;
font-family: ${unsafeCSS(sharedStyles.fonts.base)};
} }
.form-container { .form-container {
background: ${sharedStyles.colors.background.secondary}; background: ${cssManager.bdTheme('#ffffff', '#09090b')};
border: 1px solid ${sharedStyles.colors.border.default}; border: 1px solid ${cssManager.bdTheme('#e5e7eb', '#27272a')};
border-radius: ${unsafeCSS(sharedStyles.borderRadius.lg)}; border-radius: 12px;
overflow: hidden; overflow: hidden;
} }
.form-header { .form-header {
display: flex; display: flex;
align-items: center; align-items: center;
gap: ${unsafeCSS(sharedStyles.spacing.md)}; gap: 12px;
padding: ${unsafeCSS(sharedStyles.spacing.lg)}; padding: 20px 24px;
border-bottom: 1px solid ${sharedStyles.colors.border.default}; border-bottom: 1px solid ${cssManager.bdTheme('#e5e7eb', '#27272a')};
background: ${sharedStyles.colors.background.muted};
} }
.form-header dees-icon { .form-header dees-icon {
--icon-color: ${cssManager.bdTheme('#3b82f6', '#60a5fa')}; --icon-color: ${cssManager.bdTheme('#3b82f6', '#60a5fa')};
} }
.form-title-wrapper {
flex: 1;
}
.form-title { .form-title {
font-size: 18px; font-size: 18px;
font-weight: 600; font-weight: 600;
color: ${sharedStyles.colors.text.primary}; color: ${cssManager.bdTheme('#09090b', '#fafafa')};
margin: 0; margin: 0;
} }
.form-subtitle { .form-subtitle {
font-size: 13px; font-size: 14px;
color: ${sharedStyles.colors.text.muted}; color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
margin-top: 4px; margin: 4px 0 0 0;
} }
.form-body { .form-body {
display: grid; padding: 24px;
gap: ${unsafeCSS(sharedStyles.spacing.lg)}; display: flex;
padding: ${unsafeCSS(sharedStyles.spacing.lg)}; flex-direction: column;
} gap: 24px;
dees-form {
display: contents;
} }
.form-row { .form-row {
display: grid; display: grid;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
gap: ${unsafeCSS(sharedStyles.spacing.md)}; gap: 16px;
} }
@media (max-width: 600px) { @media (max-width: 600px) {
@@ -127,89 +136,64 @@ export class UpladminMonitorForm extends DeesElement {
} }
} }
.form-section {
display: flex;
flex-direction: column;
gap: 16px;
}
.section-label {
font-size: 14px;
font-weight: 500;
color: ${cssManager.bdTheme('#09090b', '#fafafa')};
margin: 0;
}
.config-box {
background: ${cssManager.bdTheme('#fafafa', '#18181b')};
border: 1px solid ${cssManager.bdTheme('#e5e7eb', '#27272a')};
border-radius: 8px;
padding: 16px;
display: flex;
flex-direction: column;
gap: 16px;
}
.editor-container {
border: 1px solid ${cssManager.bdTheme('#e5e7eb', '#27272a')};
border-radius: 8px;
overflow: hidden;
}
.editor-container dees-editor {
height: 180px;
display: block;
}
.editor-hint {
font-size: 12px;
color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
margin-top: 8px;
}
.form-actions { .form-actions {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
gap: ${unsafeCSS(sharedStyles.spacing.sm)}; gap: 8px;
padding: ${unsafeCSS(sharedStyles.spacing.md)} ${unsafeCSS(sharedStyles.spacing.lg)}; padding: 16px 24px;
border-top: 1px solid ${sharedStyles.colors.border.default}; border-top: 1px solid ${cssManager.bdTheme('#e5e7eb', '#27272a')};
background: ${sharedStyles.colors.background.muted}; background: ${cssManager.bdTheme('#fafafa', '#18181b')};
} }
.status-section { .search-engines {
margin-top: ${unsafeCSS(sharedStyles.spacing.sm)};
}
.status-options {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
gap: ${unsafeCSS(sharedStyles.spacing.sm)};
}
.status-option {
display: flex; display: flex;
align-items: center; gap: 16px;
gap: 12px;
padding: 14px 16px;
background: ${sharedStyles.colors.background.primary};
border: 2px solid ${sharedStyles.colors.border.default};
border-radius: ${unsafeCSS(sharedStyles.borderRadius.base)};
cursor: pointer;
transition: all ${unsafeCSS(sharedStyles.durations.fast)} ${unsafeCSS(sharedStyles.easings.default)};
}
.status-option:hover {
border-color: ${sharedStyles.colors.border.strong};
background: ${sharedStyles.colors.background.muted};
}
.status-option.selected {
border-color: ${sharedStyles.colors.accent.primary};
background: ${cssManager.bdTheme('rgba(59, 130, 246, 0.05)', 'rgba(96, 165, 250, 0.1)')};
}
.status-option input {
display: none;
}
.status-option dees-icon {
flex-shrink: 0;
}
.status-option.operational dees-icon { --icon-color: ${sharedStyles.colors.status.operational}; }
.status-option.degraded dees-icon { --icon-color: ${sharedStyles.colors.status.degraded}; }
.status-option.partial_outage dees-icon { --icon-color: ${sharedStyles.colors.status.partialOutage}; }
.status-option.major_outage dees-icon { --icon-color: ${sharedStyles.colors.status.majorOutage}; }
.status-option.maintenance dees-icon { --icon-color: ${sharedStyles.colors.status.maintenance}; }
.status-label {
font-size: 14px;
font-weight: 500;
color: ${sharedStyles.colors.text.primary};
}
.field-label {
display: block;
font-size: 13px;
font-weight: 500;
color: ${sharedStyles.colors.text.primary};
margin-bottom: ${unsafeCSS(sharedStyles.spacing.sm)};
}
.field-label.required::after {
content: ' *';
color: ${sharedStyles.colors.accent.danger};
}
/* Style dees-input components */
dees-input-text,
dees-input-dropdown {
--dees-input-background: ${sharedStyles.colors.background.primary};
--dees-input-border-color: ${sharedStyles.colors.border.default};
} }
` `
]; ];
private subscriptions: Array<{ unsubscribe: () => void }> = [];
async connectedCallback() { async connectedCallback() {
await super.connectedCallback(); await super.connectedCallback();
if (this.monitor) { if (this.monitor) {
@@ -217,121 +201,185 @@ export class UpladminMonitorForm extends DeesElement {
} }
} }
async disconnectedCallback() {
await super.disconnectedCallback();
this.subscriptions.forEach(sub => sub.unsubscribe());
this.subscriptions = [];
}
async firstUpdated() {
await this.updateComplete;
this.setupMultitoggleSubscriptions();
}
updated(changedProperties: Map<string, unknown>) { updated(changedProperties: Map<string, unknown>) {
if (changedProperties.has('monitor') && this.monitor) { if (changedProperties.has('monitor') && this.monitor) {
this.formData = { ...this.monitor }; this.formData = { ...this.monitor };
} }
// Re-setup subscriptions after each render in case elements changed
this.setupMultitoggleSubscriptions();
}
private subscribedElements = new WeakSet<Element>();
private setupMultitoggleSubscriptions() {
// Subscribe to check type toggle (only if not already subscribed)
const checkTypeToggle = this.shadowRoot?.querySelector('#checkTypeToggle') as DeesInputMultitoggle;
if (checkTypeToggle && !this.subscribedElements.has(checkTypeToggle)) {
this.subscribedElements.add(checkTypeToggle);
const sub = checkTypeToggle.changeSubject.subscribe(() => {
this.handleCheckTypeChange(checkTypeToggle.selectedOption);
});
this.subscriptions.push(sub);
}
// Subscribe to status mode toggle (only if not already subscribed)
const statusModeToggle = this.shadowRoot?.querySelector('#statusModeToggle') as DeesInputMultitoggle;
if (statusModeToggle && !this.subscribedElements.has(statusModeToggle)) {
this.subscribedElements.add(statusModeToggle);
const sub = statusModeToggle.changeSubject.subscribe(() => {
this.handleStatusModeChange(statusModeToggle.selectedOption);
});
this.subscriptions.push(sub);
}
} }
public render(): TemplateResult { public render(): TemplateResult {
const isEdit = !!this.monitor?.id; const isEdit = !!this.monitor?.id;
const statusOptions: Array<{ value: TStatusType; label: string }> = [
{ value: 'operational', label: 'Operational' },
{ value: 'degraded', label: 'Degraded' },
{ value: 'partial_outage', label: 'Partial Outage' },
{ value: 'major_outage', label: 'Major Outage' },
{ value: 'maintenance', label: 'Maintenance' },
];
const categoryOptions = this.categories.map(cat => ({ key: cat, option: cat, payload: null })); const categoryOptions = this.categories.map(cat => ({ key: cat, option: cat, payload: null }));
const dependencyOptions = this.availableMonitors const dependencyOptions = this.availableMonitors
.filter(m => m.id !== this.monitor?.id) .filter(m => m.id !== this.monitor?.id)
.map(m => ({ key: m.id, option: m.displayName || m.name, payload: null })); .map(m => ({ key: m.id, option: m.displayName || m.name, payload: null }));
const intervalOptions = this.intervalOptions.map(opt => ({ key: String(opt.value), option: opt.label, payload: null }));
return html` return html`
<div class="form-container"> <div class="form-container">
<div class="form-header"> <div class="form-header">
<dees-icon .icon=${isEdit ? 'lucide:Pencil' : 'lucide:Plus'} .iconSize=${24}></dees-icon> <dees-icon .icon=${isEdit ? 'lucide:Pencil' : 'lucide:Plus'} .iconSize=${24}></dees-icon>
<div class="form-title-wrapper"> <div>
<h2 class="form-title">${isEdit ? 'Edit Monitor' : 'Create Monitor'}</h2> <h2 class="form-title">${isEdit ? 'Edit Monitor' : 'Create Monitor'}</h2>
<p class="form-subtitle"> <p class="form-subtitle">${isEdit ? 'Update monitor configuration' : 'Add a new service to monitor'}</p>
${isEdit ? 'Update the monitor configuration' : 'Add a new service to monitor'}
</p>
</div> </div>
</div> </div>
<div class="form-body"> <div class="form-body">
<dees-form> <dees-form>
<!-- Basic Info -->
<div class="form-row"> <div class="form-row">
<dees-input-text <dees-input-text
key="name" .label=${'Internal Name'}
label="Internal Name" .value=${this.formData.name}
.value="${this.formData.name}" .placeholder=${'api-server'}
placeholder="api-server" .required=${true}
required .description=${'Lowercase, no spaces'}
description="Lowercase, no spaces. Used as identifier." @changeSubject=${(e: CustomEvent) => this.updateField('name', e.detail.value)}
@changeSubject="${this.handleNameChange}"
></dees-input-text> ></dees-input-text>
<dees-input-text <dees-input-text
key="displayName" .label=${'Display Name'}
label="Display Name" .value=${this.formData.displayName}
.value="${this.formData.displayName}" .placeholder=${'API Server'}
placeholder="API Server" .required=${true}
required .description=${'Human-readable name'}
description="Human-readable name shown to users." @changeSubject=${(e: CustomEvent) => this.updateField('displayName', e.detail.value)}
@changeSubject="${this.handleDisplayNameChange}"
></dees-input-text> ></dees-input-text>
</div> </div>
<dees-input-text <dees-input-text
key="description" .label=${'Description'}
label="Description" .inputType=${'textarea'}
inputType="textarea" .value=${this.formData.description || ''}
.value="${this.formData.description || ''}" .placeholder=${'Brief description of this service...'}
placeholder="Brief description of what this service does..." @changeSubject=${(e: CustomEvent) => this.updateField('description', e.detail.value)}
@changeSubject="${this.handleDescriptionChange}"
></dees-input-text> ></dees-input-text>
<div class="form-row"> <div class="form-row">
<dees-input-dropdown <dees-input-dropdown
key="category" .label=${'Category'}
label="Category" .options=${categoryOptions}
.options="${categoryOptions}" .selectedOption=${this.formData.category || ''}
.selectedOption="${this.formData.category || ''}" @selectedOption=${(e: CustomEvent) => this.updateField('category', e.detail)}
placeholder="Select category..."
@selectedOption="${this.handleCategoryChange}"
></dees-input-dropdown> ></dees-input-dropdown>
<dees-input-dropdown <dees-input-dropdown
key="dependencies" .label=${'Dependencies'}
label="Dependencies" .options=${dependencyOptions}
.options="${dependencyOptions}" .selectedOptions=${this.formData.dependencies || []}
.selectedOptions="${this.formData.dependencies || []}" .multiple=${true}
multiple @selectedOption=${(e: CustomEvent) => this.updateField('dependencies', Array.isArray(e.detail) ? e.detail : [e.detail])}
description="Services this monitor depends on."
@selectedOption="${this.handleDependenciesChange}"
></dees-input-dropdown> ></dees-input-dropdown>
</div> </div>
<div class="status-section"> <!-- Check Type -->
<label class="field-label required">Current Status</label> <div class="form-section">
<div class="status-options"> <dees-input-multitoggle
${statusOptions.map(opt => html` id="checkTypeToggle"
<label .label=${'Check Type'}
class="status-option ${opt.value} ${this.formData.currentStatus === opt.value ? 'selected' : ''}" .options=${['Assumption', 'Function', 'PWA', 'PageRank']}
@click="${() => this.handleStatusChange(opt.value)}" .selectedOption=${this.getCheckTypeLabel()}
> ></dees-input-multitoggle>
<input </div>
type="radio"
name="currentStatus" <!-- Check Configuration -->
value="${opt.value}" <div class="form-section">
?checked="${this.formData.currentStatus === opt.value}" <div class="config-box">
/> ${this.renderCheckConfigFields()}
<dees-icon .icon=${this.statusIcons[opt.value]} .iconSize=${20}></dees-icon>
<span class="status-label">${opt.label}</span>
</label>
`)}
</div> </div>
</div> </div>
<!-- Interval -->
<dees-input-dropdown
.label=${'Check Interval'}
.options=${intervalOptions}
.selectedOption=${String(this.formData.intervalMs)}
@selectedOption=${(e: CustomEvent) => this.updateField('intervalMs', parseInt(e.detail))}
></dees-input-dropdown>
<!-- Pause Toggle -->
<dees-input-checkbox
.label=${'Pause Monitor'}
.description=${'When paused, status will show as "paused" and checks won\'t run'}
.value=${this.formData.paused}
@newValue=${(e: CustomEvent) => this.updateField('paused', e.detail)}
></dees-input-checkbox>
<!-- Status Override (Edit mode only) -->
${isEdit ? html`
<div class="form-section">
<dees-input-multitoggle
id="statusModeToggle"
.label=${'Status Mode'}
.description=${'Auto uses check results, Manual lets you override'}
.options=${['Auto', 'Manual']}
.selectedOption=${this.getStatusModeLabel()}
></dees-input-multitoggle>
${this.formData.statusMode === 'manual' ? html`
<dees-input-radiogroup
.label=${'Manual Status'}
.options=${[
{ key: 'operational', option: 'Operational' },
{ key: 'degraded', option: 'Degraded' },
{ key: 'partial_outage', option: 'Partial Outage' },
{ key: 'major_outage', option: 'Major Outage' },
{ key: 'maintenance', option: 'Maintenance' },
]}
.selectedOption=${this.formData.manualStatus || 'operational'}
.direction=${'horizontal'}
@change=${(e: CustomEvent) => this.updateField('manualStatus', e.detail.value)}
></dees-input-radiogroup>
` : ''}
</div>
` : ''}
</dees-form> </dees-form>
</div> </div>
<div class="form-actions"> <div class="form-actions">
<dees-button type="discreet" @click="${this.handleCancel}" ?disabled="${this.loading}"> <dees-button .type=${'discreet'} @click=${this.handleCancel} ?disabled=${this.loading}>
Cancel Cancel
</dees-button> </dees-button>
<dees-button type="highlighted" @click="${this.handleSave}" ?disabled="${this.loading}"> <dees-button .type=${'highlighted'} @click=${this.handleSave} ?disabled=${this.loading}>
${this.loading ? html`<dees-spinner .size=${16}></dees-spinner>` : ''} ${this.loading ? html`<dees-spinner .size=${16}></dees-spinner>` : ''}
${isEdit ? 'Update Monitor' : 'Create Monitor'} ${isEdit ? 'Update Monitor' : 'Create Monitor'}
</dees-button> </dees-button>
@@ -340,40 +388,168 @@ export class UpladminMonitorForm extends DeesElement {
`; `;
} }
private handleNameChange(e: CustomEvent) { private renderCheckConfigFields(): TemplateResult {
this.formData = { ...this.formData, name: e.detail }; const config = this.formData.checkConfig;
if (this.errors.name) {
this.errors = { ...this.errors, name: '' }; switch (this.formData.checkType) {
case 'assumption':
return html`
<dees-input-text
.label=${'Domain'}
.value=${config.domain || ''}
.placeholder=${'api.example.com'}
.required=${true}
@changeSubject=${(e: CustomEvent) => this.updateCheckConfig('domain', e.detail.value)}
></dees-input-text>
<div class="form-row">
<dees-input-text
.label=${'Expected Status Code'}
.value=${config.expectedStatusCode || ''}
.placeholder=${'200'}
@changeSubject=${(e: CustomEvent) => this.updateCheckConfig('expectedStatusCode', e.detail.value)}
></dees-input-text>
<dees-input-text
.label=${'Expected Title'}
.value=${config.expectedTitle || ''}
.placeholder=${'Page Title'}
@changeSubject=${(e: CustomEvent) => this.updateCheckConfig('expectedTitle', e.detail.value)}
></dees-input-text>
</div>
`;
case 'function':
return html`
<dees-input-text
.label=${'Domain'}
.value=${config.domain || ''}
.placeholder=${'api.example.com'}
.required=${true}
@changeSubject=${(e: CustomEvent) => this.updateCheckConfig('domain', e.detail.value)}
></dees-input-text>
<div>
<p class="section-label">Function Definition</p>
<div class="editor-container">
<dees-editor
.value=${config.functionDef || `async (context: { domain: string }) => {
const response = await fetch(\`https://\${context.domain}\`);
return response.status === 200;
}`}
.language=${'typescript'}
.options=${{
lineNumbers: 'on',
minimap: { enabled: false },
scrollBeyondLastLine: false,
fontSize: 13,
tabSize: 2,
}}
@change=${(e: CustomEvent) => this.updateCheckConfig('functionDef', e.detail)}
></dees-editor>
</div>
<p class="editor-hint">Return true for success, false for failure</p>
</div>
`;
case 'pwa':
return html`
<dees-input-text
.label=${'Domain'}
.value=${config.domain || ''}
.placeholder=${'example.com'}
.required=${true}
.description=${'Domain to run Lighthouse PWA analysis on'}
@changeSubject=${(e: CustomEvent) => this.updateCheckConfig('domain', e.detail.value)}
></dees-input-text>
`;
case 'pagerank':
return html`
<div class="form-row">
<dees-input-text
.label=${'Domain'}
.value=${config.domain || ''}
.placeholder=${'example.com'}
.required=${true}
@changeSubject=${(e: CustomEvent) => this.updateCheckConfig('domain', e.detail.value)}
></dees-input-text>
<dees-input-text
.label=${'Search Term'}
.value=${config.searchTerm || ''}
.placeholder=${'your brand name'}
.required=${true}
@changeSubject=${(e: CustomEvent) => this.updateCheckConfig('searchTerm', e.detail.value)}
></dees-input-text>
</div>
<div class="search-engines">
<dees-input-checkbox
.label=${'Google'}
.value=${config.checkGoogle !== false}
@newValue=${(e: CustomEvent) => this.updateCheckConfig('checkGoogle', e.detail)}
></dees-input-checkbox>
<dees-input-checkbox
.label=${'Bing'}
.value=${config.checkBing === true}
@newValue=${(e: CustomEvent) => this.updateCheckConfig('checkBing', e.detail)}
></dees-input-checkbox>
</div>
<div class="form-row">
${config.checkGoogle !== false ? html`
<dees-input-text
.label=${'Google Min Rank'}
.value=${config.googleMinRank?.toString() || ''}
.placeholder=${'10'}
.description=${'Alert if rank drops below this'}
@changeSubject=${(e: CustomEvent) => this.updateCheckConfig('googleMinRank', parseInt(e.detail.value) || undefined)}
></dees-input-text>
` : ''}
${config.checkBing ? html`
<dees-input-text
.label=${'Bing Min Rank'}
.value=${config.bingMinRank?.toString() || ''}
.placeholder=${'10'}
.description=${'Alert if rank drops below this'}
@changeSubject=${(e: CustomEvent) => this.updateCheckConfig('bingMinRank', parseInt(e.detail.value) || undefined)}
></dees-input-text>
` : ''}
</div>
`;
default:
return html``;
} }
} }
private handleDisplayNameChange(e: CustomEvent) { private updateField(field: keyof IMonitorFormData, value: any) {
this.formData = { ...this.formData, displayName: e.detail }; this.formData = { ...this.formData, [field]: value };
if (this.errors.displayName) { if (this.errors[field]) {
this.errors = { ...this.errors, displayName: '' }; this.errors = { ...this.errors, [field]: '' };
} }
} }
private handleDescriptionChange(e: CustomEvent) { private updateCheckConfig(field: keyof ICheckConfig, value: any) {
this.formData = { ...this.formData, description: e.detail }; this.formData = {
...this.formData,
checkConfig: { ...this.formData.checkConfig, [field]: value },
};
} }
private handleCategoryChange(e: CustomEvent) { private handleCheckTypeChange(label: string) {
this.formData = { ...this.formData, category: e.detail }; const checkType = (Object.keys(this.checkTypeLabels) as TCheckType[])
.find(key => this.checkTypeLabels[key] === label) || 'assumption';
const domain = this.formData.checkConfig?.domain || '';
this.formData = {
...this.formData,
checkType,
checkConfig: { domain },
};
} }
private handleDependenciesChange(e: CustomEvent) { private handleStatusModeChange(label: string) {
const selected = e.detail; const mode: TStatusMode = label === 'Auto' ? 'auto' : 'manual';
if (Array.isArray(selected)) { this.formData = {
this.formData = { ...this.formData, dependencies: selected }; ...this.formData,
} else if (selected) { statusMode: mode,
// Single selection mode, convert to array manualStatus: mode === 'manual' && !this.formData.manualStatus ? 'operational' : this.formData.manualStatus,
this.formData = { ...this.formData, dependencies: [selected] }; };
}
}
private handleStatusChange(status: TStatusType) {
this.formData = { ...this.formData, currentStatus: status };
} }
private validate(): boolean { private validate(): boolean {
@@ -389,6 +565,14 @@ export class UpladminMonitorForm extends DeesElement {
errors.displayName = 'Display name is required'; errors.displayName = 'Display name is required';
} }
if (!this.formData.checkConfig?.domain?.trim()) {
errors.domain = 'Domain is required';
}
if (this.formData.checkType === 'pagerank' && !this.formData.checkConfig?.searchTerm?.trim()) {
errors.searchTerm = 'Search term is required for PageRank checks';
}
this.errors = errors; this.errors = errors;
return Object.keys(errors).length === 0; return Object.keys(errors).length === 0;
} }
@@ -419,7 +603,11 @@ export class UpladminMonitorForm extends DeesElement {
description: '', description: '',
category: '', category: '',
dependencies: [], dependencies: [],
currentStatus: 'operational', statusMode: 'auto',
paused: false,
checkType: 'assumption',
checkConfig: { domain: '' },
intervalMs: 300000,
}; };
this.errors = {}; this.errors = {};
} }

84
ts_web/elements/upladmin-monitor-list/upladmin-monitor-list.ts
View File

@@ -11,7 +11,7 @@ import {
state, state,
} from '@design.estate/dees-element'; } from '@design.estate/dees-element';
import * as sharedStyles from '../../styles/shared.styles.js'; import * as sharedStyles from '../../styles/shared.styles.js';
import type { IServiceStatus } from '../../interfaces/index.js'; import type { IServiceStatus, TStatusType } from '../../interfaces/index.js';
import { demoFunc } from './upladmin-monitor-list.demo.js'; import { demoFunc } from './upladmin-monitor-list.demo.js';
import type { Column, ITableAction, DeesTable } from '@design.estate/dees-catalog'; import type { Column, ITableAction, DeesTable } from '@design.estate/dees-catalog';
@@ -21,8 +21,6 @@ declare global {
} }
} }
type TStatusType = 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance';
@customElement('upladmin-monitor-list') @customElement('upladmin-monitor-list')
export class UpladminMonitorList extends DeesElement { export class UpladminMonitorList extends DeesElement {
public static demo = demoFunc; public static demo = demoFunc;
@@ -45,6 +43,9 @@ export class UpladminMonitorList extends DeesElement {
partial_outage: 'lucide:AlertOctagon', partial_outage: 'lucide:AlertOctagon',
major_outage: 'lucide:XCircle', major_outage: 'lucide:XCircle',
maintenance: 'lucide:Wrench', maintenance: 'lucide:Wrench',
initializing: 'lucide:Loader',
error: 'lucide:AlertCircle',
paused: 'lucide:PauseCircle',
}; };
private statusLabels: Record<TStatusType, string> = { private statusLabels: Record<TStatusType, string> = {
@@ -53,6 +54,9 @@ export class UpladminMonitorList extends DeesElement {
partial_outage: 'Partial Outage', partial_outage: 'Partial Outage',
major_outage: 'Major Outage', major_outage: 'Major Outage',
maintenance: 'Maintenance', maintenance: 'Maintenance',
initializing: 'Initializing',
error: 'Monitor Error',
paused: 'Paused',
}; };
public static styles = [ public static styles = [
@@ -124,6 +128,12 @@ export class UpladminMonitorList extends DeesElement {
box-shadow: 0 0 0 3px ${cssManager.bdTheme('rgba(59, 130, 246, 0.1)', 'rgba(96, 165, 250, 0.15)')}; box-shadow: 0 0 0 3px ${cssManager.bdTheme('rgba(59, 130, 246, 0.1)', 'rgba(96, 165, 250, 0.15)')};
} }
@media (prefers-color-scheme: dark) {
.filter-select {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23a1a1aa' d='M2.5 4.5L6 8l3.5-3.5'/%3E%3C/svg%3E");
}
}
.table-container { .table-container {
padding: 0; padding: 0;
} }
@@ -183,6 +193,51 @@ export class UpladminMonitorList extends DeesElement {
--icon-color: ${sharedStyles.colors.status.maintenance}; --icon-color: ${sharedStyles.colors.status.maintenance};
} }
.status-badge.initializing {
background: ${cssManager.bdTheme('rgba(107, 114, 128, 0.1)', 'rgba(107, 114, 128, 0.15)')};
color: ${cssManager.bdTheme('#6b7280', '#9ca3af')};
--icon-color: ${cssManager.bdTheme('#6b7280', '#9ca3af')};
}
.status-badge.error {
background: ${cssManager.bdTheme('rgba(220, 38, 38, 0.1)', 'rgba(220, 38, 38, 0.15)')};
color: ${cssManager.bdTheme('#dc2626', '#f87171')};
--icon-color: ${cssManager.bdTheme('#dc2626', '#f87171')};
}
.status-badge.paused {
background: ${cssManager.bdTheme('rgba(139, 92, 246, 0.1)', 'rgba(139, 92, 246, 0.15)')};
color: ${cssManager.bdTheme('#8b5cf6', '#a78bfa')};
--icon-color: ${cssManager.bdTheme('#8b5cf6', '#a78bfa')};
}
/* Status indicators for override and pause */
.status-cell {
display: flex;
align-items: center;
gap: 8px;
}
.status-indicator {
display: inline-flex;
align-items: center;
justify-content: center;
width: 20px;
height: 20px;
border-radius: 4px;
font-size: 12px;
}
.status-indicator.override {
background: ${cssManager.bdTheme('rgba(234, 179, 8, 0.15)', 'rgba(234, 179, 8, 0.2)')};
--icon-color: ${cssManager.bdTheme('#d97706', '#fbbf24')};
}
.status-indicator.paused {
background: ${cssManager.bdTheme('rgba(139, 92, 246, 0.15)', 'rgba(139, 92, 246, 0.2)')};
--icon-color: ${cssManager.bdTheme('#8b5cf6', '#a78bfa')};
}
.monitor-info { .monitor-info {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@@ -316,10 +371,22 @@ export class UpladminMonitorList extends DeesElement {
header: 'Status', header: 'Status',
sortable: true, sortable: true,
renderer: (value, item) => html` renderer: (value, item) => html`
<span class="status-badge ${item.currentStatus}"> <div class="status-cell">
<dees-icon .icon=${this.statusIcons[item.currentStatus]} .iconSize=${14}></dees-icon> <span class="status-badge ${item.currentStatus}">
${this.statusLabels[item.currentStatus]} <dees-icon .icon=${this.statusIcons[item.currentStatus]} .iconSize=${14}></dees-icon>
</span> ${this.statusLabels[item.currentStatus]}
</span>
${item.statusMode === 'manual' ? html`
<span class="status-indicator override" title="Manual Override">
<dees-icon .icon=${'lucide:AlertTriangle'} .iconSize=${12}></dees-icon>
</span>
` : ''}
${item.paused && item.currentStatus !== 'paused' ? html`
<span class="status-indicator paused" title="Execution Paused">
<dees-icon .icon=${'lucide:Pause'} .iconSize=${12}></dees-icon>
</span>
` : ''}
</div>
`, `,
}, },
{ {
@@ -391,6 +458,9 @@ export class UpladminMonitorList extends DeesElement {
<option value="partial_outage" ?selected="${this.statusFilter === 'partial_outage'}">Partial Outage</option> <option value="partial_outage" ?selected="${this.statusFilter === 'partial_outage'}">Partial Outage</option>
<option value="major_outage" ?selected="${this.statusFilter === 'major_outage'}">Major Outage</option> <option value="major_outage" ?selected="${this.statusFilter === 'major_outage'}">Major Outage</option>
<option value="maintenance" ?selected="${this.statusFilter === 'maintenance'}">Maintenance</option> <option value="maintenance" ?selected="${this.statusFilter === 'maintenance'}">Maintenance</option>
<option value="paused" ?selected="${this.statusFilter === 'paused'}">Paused</option>
<option value="initializing" ?selected="${this.statusFilter === 'initializing'}">Initializing</option>
<option value="error" ?selected="${this.statusFilter === 'error'}">Monitor Error</option>
</select> </select>
${this.categories.length > 0 ? html` ${this.categories.length > 0 ? html`

1
ts_web/elements/upladmin-option-card/index.ts Normal file
View File

@@ -0,0 +1 @@
export * from './upladmin-option-card.js';

118
ts_web/elements/upladmin-option-card/upladmin-option-card.demo.ts Normal file
View File

@@ -0,0 +1,118 @@
import { html, css, cssManager } from '@design.estate/dees-element';
import type { UpladminOptionCard } from './upladmin-option-card.js';
export const demoFunc = () => html`
<style>
.demo-container {
padding: 24px;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
min-height: 100vh;
}
.demo-section {
margin-bottom: 32px;
}
.demo-title {
font-size: 14px;
font-weight: 600;
color: ${cssManager.bdTheme('#09090b', '#fafafa')};
margin-bottom: 16px;
}
.demo-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
gap: 12px;
}
</style>
<div class="demo-container">
<div class="demo-section">
<div class="demo-title">Severity Variants</div>
<div class="demo-grid">
<upladmin-option-card
variant="critical"
icon="lucide:AlertCircle"
label="Critical"
description="Severe impact"
></upladmin-option-card>
<upladmin-option-card
variant="major"
icon="lucide:AlertTriangle"
label="Major"
description="Significant impact"
></upladmin-option-card>
<upladmin-option-card
variant="minor"
icon="lucide:Info"
label="Minor"
description="Limited impact"
></upladmin-option-card>
<upladmin-option-card
variant="maintenance"
icon="lucide:Wrench"
label="Maintenance"
description="Scheduled work"
selected
></upladmin-option-card>
</div>
</div>
<div class="demo-section">
<div class="demo-title">Status Variants</div>
<div class="demo-grid">
<upladmin-option-card
variant="investigating"
icon="lucide:Search"
label="Investigating"
description="Looking into it"
></upladmin-option-card>
<upladmin-option-card
variant="identified"
icon="lucide:Target"
label="Identified"
description="Root cause found"
></upladmin-option-card>
<upladmin-option-card
variant="monitoring"
icon="lucide:Eye"
label="Monitoring"
description="Fix applied"
selected
></upladmin-option-card>
<upladmin-option-card
variant="resolved"
icon="lucide:CheckCircle"
label="Resolved"
description="Issue fixed"
></upladmin-option-card>
<upladmin-option-card
variant="postmortem"
icon="lucide:FileText"
label="Postmortem"
description="Analysis complete"
></upladmin-option-card>
</div>
</div>
<div class="demo-section">
<div class="demo-title">States</div>
<div class="demo-grid">
<upladmin-option-card
variant="primary"
icon="lucide:Star"
label="Normal"
></upladmin-option-card>
<upladmin-option-card
variant="primary"
icon="lucide:Star"
label="Selected"
selected
></upladmin-option-card>
<upladmin-option-card
variant="primary"
icon="lucide:Star"
label="Disabled"
disabled
></upladmin-option-card>
</div>
</div>
</div>
`;

178
ts_web/elements/upladmin-option-card/upladmin-option-card.ts Normal file
View File

@@ -0,0 +1,178 @@
import {
DeesElement,
property,
html,
customElement,
type TemplateResult,
css,
cssManager,
unsafeCSS,
} from '@design.estate/dees-element';
import * as sharedStyles from '../../styles/shared.styles.js';
import { demoFunc } from './upladmin-option-card.demo.js';
declare global {
interface HTMLElementTagNameMap {
'upladmin-option-card': UpladminOptionCard;
}
}
export type TOptionVariant =
// Severity variants
| 'critical' | 'major' | 'minor' | 'maintenance'
// Status variants
| 'investigating' | 'identified' | 'monitoring' | 'resolved' | 'postmortem'
// Generic variants
| 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'info';
@customElement('upladmin-option-card')
export class UpladminOptionCard extends DeesElement {
public static demo = demoFunc;
@property({ type: String })
accessor icon: string = '';
@property({ type: String })
accessor label: string = '';
@property({ type: String })
accessor description: string = '';
@property({ type: String, reflect: true })
accessor variant: TOptionVariant = 'default';
@property({ type: Boolean, reflect: true })
accessor selected: boolean = false;
@property({ type: Boolean, reflect: true })
accessor disabled: boolean = false;
public static styles = [
cssManager.defaultStyles,
css`
:host {
display: block;
font-family: ${unsafeCSS(sharedStyles.fonts.base)};
}
.option-card {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
padding: 18px 14px;
background: ${cssManager.bdTheme('#ffffff', '#09090b')};
border: 2px solid ${cssManager.bdTheme('#e4e4e7', '#27272a')};
border-radius: 6px;
cursor: pointer;
transition: all 0.1s ease;
text-align: center;
user-select: none;
}
.option-card:hover:not(.disabled) {
border-color: ${cssManager.bdTheme('#d4d4d8', '#3f3f46')};
background: ${cssManager.bdTheme('#f4f4f5', '#18181b')};
}
:host([selected]) .option-card {
border-color: ${cssManager.bdTheme('#3b82f6', '#60a5fa')};
background: ${cssManager.bdTheme('rgba(59, 130, 246, 0.05)', 'rgba(96, 165, 250, 0.1)')};
}
:host([disabled]) .option-card {
opacity: 0.5;
cursor: not-allowed;
}
.option-label {
font-size: 13px;
font-weight: 600;
color: ${cssManager.bdTheme('#09090b', '#fafafa')};
}
.option-desc {
font-size: 11px;
color: ${cssManager.bdTheme('#a1a1aa', '#71717a')};
line-height: 1.3;
}
/* Variant icon colors - all using bdTheme for proper light/dark support */
/* Severity variants */
:host([variant="critical"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#dc2626', '#f87171')};
}
:host([variant="major"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#ea580c', '#fb923c')};
}
:host([variant="minor"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#ca8a04', '#fbbf24')};
}
:host([variant="maintenance"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#2563eb', '#60a5fa')};
}
/* Status variants */
:host([variant="investigating"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#ea580c', '#fb923c')};
}
:host([variant="identified"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#ca8a04', '#fbbf24')};
}
:host([variant="monitoring"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#2563eb', '#60a5fa')};
}
:host([variant="resolved"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#16a34a', '#22c55e')};
}
:host([variant="postmortem"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#9333ea', '#a855f7')};
}
/* Generic variants */
:host([variant="default"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
}
:host([variant="primary"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#3b82f6', '#60a5fa')};
}
:host([variant="success"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#16a34a', '#22c55e')};
}
:host([variant="warning"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#ca8a04', '#fbbf24')};
}
:host([variant="danger"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#dc2626', '#f87171')};
}
:host([variant="info"]) dees-icon {
--icon-color: ${cssManager.bdTheme('#2563eb', '#60a5fa')};
}
dees-icon {
color: var(--icon-color);
}
`,
];
public render(): TemplateResult {
return html`
<div class="option-card ${this.disabled ? 'disabled' : ''}" @click="${this.handleClick}">
${this.icon ? html`<dees-icon .icon=${this.icon} .iconSize=${24}></dees-icon>` : ''}
${this.label ? html`<span class="option-label">${this.label}</span>` : ''}
${this.description ? html`<span class="option-desc">${this.description}</span>` : ''}
</div>
`;
}
private handleClick() {
if (this.disabled) return;
this.dispatchEvent(new CustomEvent('select', {
detail: { selected: !this.selected },
bubbles: true,
composed: true,
}));
}
}

73
ts_web/elements/upladmin-statuspage-config/upladmin-statuspage-config.ts
View File

@@ -33,7 +33,7 @@ export class UpladminStatuspageConfig extends DeesElement {
@state() @state()
accessor formData: IStatusPageConfig = {}; accessor formData: IStatusPageConfig = {};
@state() @property({ type: String })
accessor activeSection: string = 'branding'; accessor activeSection: string = 'branding';
@state() @state()
@@ -49,67 +49,10 @@ export class UpladminStatuspageConfig extends DeesElement {
} }
.config-container { .config-container {
display: grid; display: block;
grid-template-columns: 220px 1fr;
gap: ${unsafeCSS(sharedStyles.spacing.lg)};
min-height: 500px; min-height: 500px;
} }
@media (max-width: 768px) {
.config-container {
grid-template-columns: 1fr;
}
}
.config-nav {
background: ${sharedStyles.colors.background.secondary};
border: 1px solid ${sharedStyles.colors.border.default};
border-radius: ${unsafeCSS(sharedStyles.borderRadius.lg)};
padding: ${unsafeCSS(sharedStyles.spacing.sm)};
height: fit-content;
}
.nav-item {
display: flex;
align-items: center;
gap: 12px;
width: 100%;
padding: 14px 16px;
font-size: 14px;
font-weight: 500;
font-family: ${unsafeCSS(sharedStyles.fonts.base)};
color: ${sharedStyles.colors.text.secondary};
background: transparent;
border: none;
border-radius: ${unsafeCSS(sharedStyles.borderRadius.base)};
cursor: pointer;
text-align: left;
transition: all ${unsafeCSS(sharedStyles.durations.fast)} ${unsafeCSS(sharedStyles.easings.default)};
}
.nav-item:hover {
background: ${sharedStyles.colors.background.muted};
color: ${sharedStyles.colors.text.primary};
}
.nav-item.active {
background: ${sharedStyles.colors.accent.primary};
color: white;
}
.nav-item.active dees-icon {
--icon-color: white;
}
.nav-item dees-icon {
--icon-color: ${sharedStyles.colors.text.muted};
transition: color ${unsafeCSS(sharedStyles.durations.fast)} ${unsafeCSS(sharedStyles.easings.default)};
}
.nav-item:hover dees-icon {
--icon-color: ${sharedStyles.colors.text.primary};
}
.config-content { .config-content {
background: ${sharedStyles.colors.background.secondary}; background: ${sharedStyles.colors.background.secondary};
border: 1px solid ${sharedStyles.colors.border.default}; border: 1px solid ${sharedStyles.colors.border.default};
@@ -343,18 +286,6 @@ export class UpladminStatuspageConfig extends DeesElement {
return html` return html`
<div class="config-container"> <div class="config-container">
<nav class="config-nav">
${sections.map(section => html`
<button
class="nav-item ${this.activeSection === section.id ? 'active' : ''}"
@click="${() => this.activeSection = section.id}"
>
<dees-icon .icon=${section.icon} .iconSize=${18}></dees-icon>
<span>${section.label}</span>
</button>
`)}
</nav>
<div class="config-content"> <div class="config-content">
<div class="content-header"> <div class="content-header">
<div> <div>

1
ts_web/index.ts
View File

@@ -1,4 +1,5 @@
export * from './elements/index.js'; export * from './elements/index.js';
export * from './views/index.js';
export * from './pages/index.js'; export * from './pages/index.js';
export * from './interfaces/index.js'; export * from './interfaces/index.js';
export * from './services/index.js'; export * from './services/index.js';

175
ts_web/interfaces/index.ts
View File

@@ -1,10 +1,81 @@
// Re-export interfaces from the public catalog for consistency // ============================================
// Re-export shared types from @uptime.link/interfaces
// ============================================
import { data } from '@uptime.link/interfaces';
// Re-export core types
export type TStatusType = data.TStatusType;
export type TCheckType = data.TCheckType;
export type TStatusMode = data.TStatusMode;
export type TIncidentSeverity = data.TIncidentSeverity;
export type TIncidentStatus = data.TIncidentStatus;
export type TCheckResultStatus = data.TCheckResultStatus;
export type TCheckLastResult = data.TCheckLastResult;
// Re-export check configuration interfaces
export type ICheckBase = data.ICheckBase;
export type IAssumptionCheckConfig = data.IAssumptionCheckConfig;
export type IFunctionCheckConfig = data.IFunctionCheckConfig;
export type IPwaCheckConfig = data.IPwaCheckConfig;
export type IPageRankCheckConfig = data.IPageRankCheckConfig;
export type TCheckConfig = data.TCheckConfig;
// Re-export check execution interfaces
export type IAssumptionCheck = data.IAssumptionCheck;
export type IFunctionCheck = data.IFunctionCheck;
export type IPwaCheck = data.IPwaCheck;
export type IPageRankCheck = data.IPageRankCheck;
export type ICheckCollection = data.ICheckCollection;
// Re-export incident interfaces
export type IIncident = data.IIncident;
export type IIncidentUpdateBase = data.IIncidentUpdate;
// Re-export status page config
export type IServiceGroup = data.IServiceGroup;
// ============================================
// Extended/UI-specific Interfaces
// ============================================
/**
* Flat check configuration for forms.
* Maps to TCheckConfig discriminated union when saving.
*/
export interface ICheckConfig {
domain: string;
// Assumption check fields
expectedTitle?: string;
expectedStatusCode?: string;
expectedDescription?: string;
assumedStatus?: TStatusType;
// Function check fields
functionDef?: string;
functionUrl?: string;
expectedStatusCodeNum?: number;
timeoutMs?: number;
// PWA check fields
targetUrl?: string;
lighthouseThreshold?: number;
// PageRank check fields
searchTerm?: string;
checkBing?: boolean;
checkGoogle?: boolean;
bingMinRank?: number;
googleMinRank?: number;
}
/**
* Service status for display and management.
* Extended with UI-specific fields.
*/
export interface IServiceStatus { export interface IServiceStatus {
id: string; id: string;
name: string; name: string;
displayName: string; displayName: string;
description?: string; description?: string;
currentStatus: 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance'; currentStatus: TStatusType;
lastChecked: number; lastChecked: number;
uptime30d: number; uptime30d: number;
uptime90d: number; uptime90d: number;
@@ -12,45 +83,40 @@ export interface IServiceStatus {
category?: string; category?: string;
dependencies?: string[]; dependencies?: string[];
selected?: boolean; selected?: boolean;
// Status management
statusMode?: TStatusMode;
manualStatus?: TStatusType;
paused?: boolean;
// Check configuration
checkType?: TCheckType;
checkConfig?: ICheckConfig;
intervalMs?: number;
} }
/**
* Status history point.
*/
export interface IStatusHistoryPoint { export interface IStatusHistoryPoint {
timestamp: number; timestamp: number;
status: 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance'; status: TStatusType;
responseTime?: number; responseTime?: number;
errorRate?: number; errorRate?: number;
} }
export interface IIncidentUpdate { /**
id: string; * Overall status with service counts for dashboard.
timestamp: number; */
status: 'investigating' | 'identified' | 'monitoring' | 'resolved' | 'postmortem';
message: string;
author?: string;
}
export interface IIncidentDetails {
id: string;
title: string;
status: 'investigating' | 'identified' | 'monitoring' | 'resolved' | 'postmortem';
severity: 'critical' | 'major' | 'minor' | 'maintenance';
affectedServices: string[];
startTime: number;
endTime?: number;
updates: IIncidentUpdate[];
impact: string;
rootCause?: string;
resolution?: string;
}
export interface IOverallStatus { export interface IOverallStatus {
status: 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance'; status: TStatusType;
message: string; message: string;
lastUpdated: number; lastUpdated: number;
affectedServices: number; affectedServices: number;
totalServices: number; totalServices: number;
} }
/**
* Status page configuration.
*/
export interface IStatusPageConfig { export interface IStatusPageConfig {
apiEndpoint?: string; apiEndpoint?: string;
refreshInterval?: number; refreshInterval?: number;
@@ -69,7 +135,41 @@ export interface IStatusPageConfig {
legalUrl?: string; legalUrl?: string;
} }
// Admin-specific interfaces /**
* Incident update entry (UI version with timestamp).
*/
export interface IIncidentUpdate {
id: string;
timestamp: number;
status: TIncidentStatus;
message: string;
author?: string;
}
/**
* Incident details for display.
*/
export interface IIncidentDetails {
id: string;
title: string;
status: TIncidentStatus;
severity: TIncidentSeverity;
affectedServices: string[];
startTime: number;
endTime?: number;
updates: IIncidentUpdate[];
impact: string;
rootCause?: string;
resolution?: string;
}
// ============================================
// Form Interfaces (UI-specific)
// ============================================
/**
* Monitor form data for creating/editing monitors.
*/
export interface IMonitorFormData { export interface IMonitorFormData {
id?: string; id?: string;
name: string; name: string;
@@ -77,22 +177,35 @@ export interface IMonitorFormData {
description?: string; description?: string;
category?: string; category?: string;
dependencies?: string[]; dependencies?: string[];
currentStatus: 'operational' | 'degraded' | 'partial_outage' | 'major_outage' | 'maintenance'; // Status management
statusMode: TStatusMode;
manualStatus?: TStatusType;
paused: boolean;
// Check configuration
checkType: TCheckType;
checkConfig: ICheckConfig;
intervalMs: number;
} }
/**
* Incident form data for creating/editing incidents.
*/
export interface IIncidentFormData { export interface IIncidentFormData {
id?: string; id?: string;
title: string; title: string;
severity: 'critical' | 'major' | 'minor' | 'maintenance'; severity: TIncidentSeverity;
status: 'investigating' | 'identified' | 'monitoring' | 'resolved' | 'postmortem'; status: TIncidentStatus;
affectedServices: string[]; affectedServices: string[];
impact: string; impact: string;
rootCause?: string; rootCause?: string;
resolution?: string; resolution?: string;
} }
/**
* Incident update form data.
*/
export interface IIncidentUpdateFormData { export interface IIncidentUpdateFormData {
status: 'investigating' | 'identified' | 'monitoring' | 'resolved' | 'postmortem'; status: TIncidentStatus;
message: string; message: string;
author?: string; author?: string;
} }

83
ts_web/pages/adminpage-config.ts
View File

@@ -1,83 +0,0 @@
import { html, cssManager } from "@design.estate/dees-element";
import type { IStatusPageConfig } from '../interfaces/index.js';
import '../elements/index.js';
export const adminpageConfig = () => html`
<style>
.demo-page-wrapper {
min-height: 100vh;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
padding: 24px;
}
</style>
<div class="demo-page-wrapper">
<dees-demowrapper
.runAfterRender=${async (wrapperElement: any) => {
const config = wrapperElement.querySelector('upladmin-statuspage-config') as any;
const configData: IStatusPageConfig = {
companyName: 'CloudFlow Inc.',
companyLogo: '',
supportEmail: 'support@cloudflow.io',
statusPageUrl: 'https://status.cloudflow.io',
legalUrl: 'https://cloudflow.io/terms',
apiEndpoint: 'https://api.cloudflow.io/status',
refreshInterval: 60,
showHistoricalDays: 90,
theme: 'auto',
language: 'en',
timeZone: 'UTC',
dateFormat: 'relative',
enableWebSocket: true,
enableNotifications: false,
whitelabel: false,
};
config.config = configData;
}}
>
<upladmin-statuspage-config></upladmin-statuspage-config>
</dees-demowrapper>
</div>
`;
export const adminpageConfigWhitelabel = () => html`
<style>
.demo-page-wrapper {
min-height: 100vh;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
padding: 24px;
}
</style>
<div class="demo-page-wrapper">
<dees-demowrapper
.runAfterRender=${async (wrapperElement: any) => {
const config = wrapperElement.querySelector('upladmin-statuspage-config') as any;
const configData: IStatusPageConfig = {
companyName: 'Enterprise Corp',
companyLogo: 'https://via.placeholder.com/200x60/1a1a2e/ffffff?text=ENTERPRISE',
supportEmail: 'support@enterprise.com',
statusPageUrl: 'https://status.enterprise.com',
legalUrl: 'https://enterprise.com/legal',
apiEndpoint: 'https://api.enterprise.com/v2/status',
refreshInterval: 30,
showHistoricalDays: 180,
theme: 'dark',
language: 'en',
timeZone: 'America/New_York',
dateFormat: 'absolute',
enableWebSocket: true,
enableNotifications: true,
whitelabel: true,
};
config.config = configData;
}}
>
<upladmin-statuspage-config></upladmin-statuspage-config>
</dees-demowrapper>
</div>
`;

156
ts_web/pages/adminpage-dashboard.ts
View File

@@ -1,156 +0,0 @@
import { html, cssManager } from "@design.estate/dees-element";
import type { IServiceStatus, IIncidentDetails } from '../interfaces/index.js';
import '../elements/index.js';
export const adminpageDashboard = () => html`
<style>
.demo-page-wrapper {
min-height: 100vh;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
padding: 24px;
}
</style>
<div class="demo-page-wrapper">
<dees-demowrapper
.runAfterRender=${async (wrapperElement: any) => {
const dashboard = wrapperElement.querySelector('upladmin-dashboard') as any;
// Demo monitors
const monitors: IServiceStatus[] = [
{
id: 'api-server',
name: 'api-server',
displayName: 'API Server',
description: 'Main REST API endpoint',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.98,
uptime90d: 99.95,
responseTime: 45,
category: 'Core Services',
},
{
id: 'web-app',
name: 'web-app',
displayName: 'Web Application',
description: 'Customer-facing web application',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.99,
uptime90d: 99.97,
responseTime: 120,
category: 'Core Services',
},
{
id: 'database-primary',
name: 'database-primary',
displayName: 'Primary Database',
description: 'PostgreSQL primary node',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.999,
uptime90d: 99.998,
responseTime: 5,
category: 'Infrastructure',
},
{
id: 'cdn',
name: 'cdn',
displayName: 'Content Delivery Network',
description: 'Global CDN for static assets',
currentStatus: 'degraded',
lastChecked: Date.now(),
uptime30d: 99.5,
uptime90d: 99.8,
responseTime: 200,
category: 'Infrastructure',
},
{
id: 'email-service',
name: 'email-service',
displayName: 'Email Service',
description: 'Transactional email delivery',
currentStatus: 'operational',
lastChecked: Date.now(),
uptime30d: 99.9,
uptime90d: 99.85,
responseTime: 500,
category: 'External Services',
},
{
id: 'payment-gateway',
name: 'payment-gateway',
displayName: 'Payment Gateway',
description: 'Payment processing integration',
currentStatus: 'maintenance',
lastChecked: Date.now(),
uptime30d: 99.95,
uptime90d: 99.9,
responseTime: 350,
category: 'External Services',
},
];
// Demo incidents
const incidents: IIncidentDetails[] = [
{
id: 'inc-001',
title: 'CDN Performance Degradation',
status: 'monitoring',
severity: 'minor',
affectedServices: ['cdn'],
startTime: Date.now() - 2 * 60 * 60 * 1000,
impact: 'Some users may experience slower loading times for images and static assets.',
updates: [
{
id: 'upd-001',
timestamp: Date.now() - 2 * 60 * 60 * 1000,
status: 'investigating',
message: 'We are investigating reports of slow asset loading.',
author: 'Platform Team',
},
{
id: 'upd-002',
timestamp: Date.now() - 1 * 60 * 60 * 1000,
status: 'identified',
message: 'We have identified the issue as a problem with one of our CDN edge nodes.',
author: 'Platform Team',
},
{
id: 'upd-003',
timestamp: Date.now() - 30 * 60 * 1000,
status: 'monitoring',
message: 'Traffic has been rerouted to healthy nodes. Monitoring for stability.',
author: 'Platform Team',
},
],
},
{
id: 'inc-002',
title: 'Payment Gateway Scheduled Maintenance',
status: 'investigating',
severity: 'maintenance',
affectedServices: ['payment-gateway'],
startTime: Date.now() - 30 * 60 * 1000,
impact: 'Payment processing is temporarily unavailable during the maintenance window.',
updates: [
{
id: 'upd-004',
timestamp: Date.now() - 30 * 60 * 1000,
status: 'investigating',
message: 'Scheduled maintenance has begun. Expected duration: 2 hours.',
author: 'DevOps Team',
},
],
},
];
dashboard.monitors = monitors;
dashboard.incidents = incidents;
}}
>
<upladmin-dashboard></upladmin-dashboard>
</dees-demowrapper>
</div>
`;

166
ts_web/pages/adminpage-incidents.ts
View File

@@ -1,166 +0,0 @@
import { html, cssManager } from "@design.estate/dees-element";
import type { IServiceStatus, IIncidentDetails } from '../interfaces/index.js';
import '../elements/index.js';
export const adminpageIncidents = () => html`
<style>
.demo-page-wrapper {
min-height: 100vh;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
padding: 24px;
}
</style>
<div class="demo-page-wrapper">
<dees-demowrapper
.runAfterRender=${async (wrapperElement: any) => {
const incidentList = wrapperElement.querySelector('upladmin-incident-list') as any;
const incidents: IIncidentDetails[] = [
{
id: 'inc-001',
title: 'CDN Performance Degradation',
status: 'monitoring',
severity: 'minor',
affectedServices: ['cdn'],
startTime: Date.now() - 2 * 60 * 60 * 1000,
impact: 'Some users may experience slower loading times for images and static assets.',
updates: [
{ id: 'upd-001', timestamp: Date.now() - 2 * 60 * 60 * 1000, status: 'investigating', message: 'We are investigating reports of slow asset loading.', author: 'Platform Team' },
{ id: 'upd-002', timestamp: Date.now() - 1 * 60 * 60 * 1000, status: 'identified', message: 'We have identified the issue as a problem with one of our CDN edge nodes.', author: 'Platform Team' },
{ id: 'upd-003', timestamp: Date.now() - 30 * 60 * 1000, status: 'monitoring', message: 'Traffic has been rerouted to healthy nodes. Monitoring for stability.', author: 'Platform Team' },
],
},
{
id: 'inc-002',
title: 'Payment Gateway Scheduled Maintenance',
status: 'investigating',
severity: 'maintenance',
affectedServices: ['payment-gateway'],
startTime: Date.now() - 30 * 60 * 1000,
impact: 'Payment processing is temporarily unavailable during the maintenance window.',
updates: [
{ id: 'upd-004', timestamp: Date.now() - 30 * 60 * 1000, status: 'investigating', message: 'Scheduled maintenance has begun. Expected duration: 2 hours.', author: 'DevOps Team' },
],
},
{
id: 'inc-003',
title: 'Search Engine Partial Outage',
status: 'identified',
severity: 'major',
affectedServices: ['search-engine', 'api-server'],
startTime: Date.now() - 45 * 60 * 1000,
impact: 'Search functionality is degraded. Some queries may timeout or return incomplete results.',
updates: [
{ id: 'upd-005', timestamp: Date.now() - 45 * 60 * 1000, status: 'investigating', message: 'We are aware of issues with search functionality.', author: 'Engineering Team' },
{ id: 'upd-006', timestamp: Date.now() - 20 * 60 * 1000, status: 'identified', message: 'Root cause identified: disk space exhaustion on search cluster nodes.', author: 'Engineering Team' },
],
},
{
id: 'inc-004',
title: 'API Server Outage',
status: 'resolved',
severity: 'critical',
affectedServices: ['api-server', 'web-app'],
startTime: Date.now() - 24 * 60 * 60 * 1000,
endTime: Date.now() - 23 * 60 * 60 * 1000,
impact: 'Complete service unavailability for all API-dependent services.',
rootCause: 'Database connection pool exhaustion due to a query performance regression.',
resolution: 'Rolled back recent deployment and optimized database queries.',
updates: [
{ id: 'upd-007', timestamp: Date.now() - 24 * 60 * 60 * 1000, status: 'investigating', message: 'We are aware of service unavailability and actively investigating.', author: 'Platform Team' },
{ id: 'upd-008', timestamp: Date.now() - 23.5 * 60 * 60 * 1000, status: 'identified', message: 'Root cause identified as database connection pool exhaustion.', author: 'Platform Team' },
{ id: 'upd-009', timestamp: Date.now() - 23 * 60 * 60 * 1000, status: 'resolved', message: 'Service has been restored. All systems operational.', author: 'Platform Team' },
],
},
{
id: 'inc-005',
title: 'Email Delivery Delays',
status: 'resolved',
severity: 'minor',
affectedServices: ['email-service'],
startTime: Date.now() - 48 * 60 * 60 * 1000,
endTime: Date.now() - 46 * 60 * 60 * 1000,
impact: 'Email notifications may be delayed by up to 30 minutes.',
rootCause: 'Third-party email provider experiencing capacity issues.',
resolution: 'Provider resolved their capacity issues.',
updates: [
{ id: 'upd-010', timestamp: Date.now() - 48 * 60 * 60 * 1000, status: 'investigating', message: 'Investigating reports of delayed email delivery.', author: 'Support Team' },
{ id: 'upd-011', timestamp: Date.now() - 46 * 60 * 60 * 1000, status: 'resolved', message: 'Email delivery has returned to normal.', author: 'Support Team' },
],
},
];
incidentList.incidents = incidents;
}}
>
<upladmin-incident-list></upladmin-incident-list>
</dees-demowrapper>
</div>
`;
export const adminpageIncidentForm = () => html`
<style>
.demo-page-wrapper {
min-height: 100vh;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
padding: 24px;
}
</style>
<div class="demo-page-wrapper">
<dees-demowrapper
.runAfterRender=${async (wrapperElement: any) => {
const incidentForm = wrapperElement.querySelector('upladmin-incident-form') as any;
const services: IServiceStatus[] = [
{ id: 'api-server', name: 'api-server', displayName: 'API Server', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.98, uptime90d: 99.95, responseTime: 45 },
{ id: 'web-app', name: 'web-app', displayName: 'Web Application', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.99, uptime90d: 99.97, responseTime: 120 },
{ id: 'database-primary', name: 'database-primary', displayName: 'Primary Database', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.999, uptime90d: 99.998, responseTime: 5 },
{ id: 'cdn', name: 'cdn', displayName: 'Content Delivery Network', currentStatus: 'degraded', lastChecked: Date.now(), uptime30d: 99.5, uptime90d: 99.8, responseTime: 200 },
{ id: 'email-service', name: 'email-service', displayName: 'Email Service', currentStatus: 'operational', lastChecked: Date.now(), uptime30d: 99.9, uptime90d: 99.85, responseTime: 500 },
{ id: 'payment-gateway', name: 'payment-gateway', displayName: 'Payment Gateway', currentStatus: 'maintenance', lastChecked: Date.now(), uptime30d: 99.95, uptime90d: 99.9, responseTime: 350 },
];
incidentForm.availableServices = services;
}}
>
<upladmin-incident-form></upladmin-incident-form>
</dees-demowrapper>
</div>
`;
export const adminpageIncidentUpdate = () => html`
<style>
.demo-page-wrapper {
min-height: 100vh;
background: ${cssManager.bdTheme('#fafafa', '#0a0a0a')};
padding: 24px;
}
</style>
<div class="demo-page-wrapper">
<dees-demowrapper
.runAfterRender=${async (wrapperElement: any) => {
const incidentUpdate = wrapperElement.querySelector('upladmin-incident-update') as any;
incidentUpdate.incident = {
id: 'inc-001',
title: 'CDN Performance Degradation',
status: 'monitoring',
severity: 'minor',
affectedServices: ['cdn'],
startTime: Date.now() - 2 * 60 * 60 * 1000,
impact: 'Some users may experience slower loading times for images and static assets.',
updates: [
{ id: 'upd-001', timestamp: Date.now() - 2 * 60 * 60 * 1000, status: 'investigating', message: 'We are investigating reports of slow asset loading.', author: 'Platform Team' },
{ id: 'upd-002', timestamp: Date.now() - 1 * 60 * 60 * 1000, status: 'identified', message: 'We have identified the issue as a problem with one of our CDN edge nodes.', author: 'Platform Team' },
{ id: 'upd-003', timestamp: Date.now() - 30 * 60 * 1000, status: 'monitoring', message: 'Traffic has been rerouted to healthy nodes. Monitoring for stability.', author: 'Platform Team' },
],
};
}}
>
<upladmin-incident-update></upladmin-incident-update>
</dees-demowrapper>
</div>
`;

Some files were not shown because too many files have changed in this diff Show More