Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 37d1db9ccf | |||
| f78cab7dd8 | |||
| 29922004ea | |||
| 0d9e76bf94 |
19
changelog.md
19
changelog.md
@@ -1,5 +1,24 @@
|
||||
# Changelog
|
||||
|
||||
## 2026-02-24 - 2.2.0 - feat(opsserver)
|
||||
Serve bundled frontend from a dedicated dist_serve directory and update frontend UI/packaging
|
||||
|
||||
- Serve static site using UtilityWebsiteServer with serveDir set to ./dist_serve and pass port into server.start()
|
||||
- Update bundler config: output bundle to ./dist_serve/bundle.js, change outputMode to 'bundle', and include html/index.html
|
||||
- Move root index.html into html/index.html and update .gitignore to ignore dist_serve/ (replace ts_bundled)
|
||||
- Frontend enhancements: add iconName to view tabs and resolvedViewTabs, add Lucide icons for each tab, replace manual stats markup with dees-statsgrid using IStatsTile tiles
|
||||
- Adjust shared CSS: center content, set max-width 1280px and adjust padding
|
||||
- Add npm test script and rename/update tests (test.basic.ts -> test.basic_test.ts)
|
||||
|
||||
## 2026-02-24 - 2.1.0 - feat(opsserver)
|
||||
switch to TypedServer and serve bundled UI assets; add index.html; update bundling output and dev watch configuration
|
||||
|
||||
- Replace UtilityWebsiteServer with TypedServer and load bundledContent from ts_bundled/bundle.ts; enable cors, spaFallback, injectReload, watch, and compression
|
||||
- Add a minimal index.html SPA entry and include it in the bundle so it is served from the bundled assets
|
||||
- Change tsbundle output to ./ts_bundled/bundle.ts with outputMode 'base64ts' and includeFiles ['./index.html']
|
||||
- Add a tswatch bundle config and replace the previous watcher with a backend watcher that runs the server via 'deno run --allow-all mod.ts server' (restart enabled)
|
||||
- Bump devDependency @git.zone/tswatch from ^2.3.13 to ^3.1.0 and update .gitignore to ignore ts_bundled/
|
||||
|
||||
## 2026-02-24 - 2.0.0 - BREAKING CHANGE(providers)
|
||||
switch GitLab and Gitea providers to use @apiclient.xyz client libraries and export clients via plugins
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@serve.zone/gitops",
|
||||
"version": "2.0.0",
|
||||
"version": "2.2.0",
|
||||
"exports": "./mod.ts",
|
||||
"nodeModulesDir": "auto",
|
||||
"tasks": {
|
||||
|
||||
33
html/index.html
Normal file
33
html/index.html
Normal file
@@ -0,0 +1,33 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta
|
||||
name="viewport"
|
||||
content="user-scalable=0, 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" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<title>GitOps</title>
|
||||
<link rel="preconnect" href="https://assetbroker.lossless.one/" crossorigin>
|
||||
<link rel="stylesheet" href="https://assetbroker.lossless.one/fonts/fonts.css">
|
||||
<style>
|
||||
html {
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
body {
|
||||
position: relative;
|
||||
background: #000;
|
||||
margin: 0px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<p style="color: #fff; text-align: center; margin-top: 100px;">
|
||||
JavaScript is required to run the GitOps dashboard.
|
||||
</p>
|
||||
</noscript>
|
||||
</body>
|
||||
<script defer type="module" src="/bundle.js"></script>
|
||||
</html>
|
||||
@@ -6,16 +6,26 @@
|
||||
"to": "./dist_serve/bundle.js",
|
||||
"outputMode": "bundle",
|
||||
"bundler": "esbuild",
|
||||
"production": true
|
||||
"production": true,
|
||||
"includeFiles": ["./html/index.html"]
|
||||
}
|
||||
]
|
||||
},
|
||||
"@git.zone/tswatch": {
|
||||
"bundles": [
|
||||
{
|
||||
"from": "./ts_web/index.ts",
|
||||
"to": "./dist_serve/bundle.js",
|
||||
"watchPatterns": ["./ts_web/**/*"],
|
||||
"triggerReload": true
|
||||
}
|
||||
],
|
||||
"watchers": [
|
||||
{
|
||||
"name": "ui-bundle",
|
||||
"watch": "./ts_web/**/*",
|
||||
"command": "tsbundle",
|
||||
"name": "backend",
|
||||
"watch": "./ts/**/*",
|
||||
"command": "deno run --allow-all mod.ts server",
|
||||
"restart": true,
|
||||
"debounce": 500,
|
||||
"runOnStart": true
|
||||
}
|
||||
|
||||
@@ -1,10 +1,11 @@
|
||||
{
|
||||
"name": "@serve.zone/gitops",
|
||||
"version": "2.0.0",
|
||||
"version": "2.2.0",
|
||||
"description": "GitOps management app for Gitea and GitLab - manage secrets, browse projects, view CI pipelines, and stream build logs",
|
||||
"main": "mod.ts",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"test": "deno task test",
|
||||
"build": "tsbundle",
|
||||
"startTs": "deno run --allow-all mod.ts server",
|
||||
"watch": "tswatch"
|
||||
@@ -18,6 +19,6 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@git.zone/tsbundle": "^2.8.3",
|
||||
"@git.zone/tswatch": "^2.3.13"
|
||||
"@git.zone/tswatch": "^3.1.0"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,6 +3,6 @@
|
||||
*/
|
||||
export const commitinfo = {
|
||||
name: '@serve.zone/gitops',
|
||||
version: '2.0.0',
|
||||
version: '2.2.0',
|
||||
description: 'GitOps management app for Gitea and GitLab - manage secrets, browse projects, view CI pipelines, and stream build logs'
|
||||
}
|
||||
|
||||
@@ -3,6 +3,6 @@
|
||||
*/
|
||||
export const commitinfo = {
|
||||
name: '@serve.zone/gitops',
|
||||
version: '2.0.0',
|
||||
version: '2.2.0',
|
||||
description: 'GitOps management app for Gitea and GitLab - manage secrets, browse projects, view CI pipelines, and stream build logs'
|
||||
}
|
||||
|
||||
@@ -32,16 +32,16 @@ export class GitopsDashboard extends DeesElement {
|
||||
};
|
||||
|
||||
private viewTabs = [
|
||||
{ name: 'Overview', element: (async () => (await import('./views/overview/index.js')).GitopsViewOverview)() },
|
||||
{ name: 'Connections', element: (async () => (await import('./views/connections/index.js')).GitopsViewConnections)() },
|
||||
{ name: 'Projects', element: (async () => (await import('./views/projects/index.js')).GitopsViewProjects)() },
|
||||
{ name: 'Groups', element: (async () => (await import('./views/groups/index.js')).GitopsViewGroups)() },
|
||||
{ name: 'Secrets', element: (async () => (await import('./views/secrets/index.js')).GitopsViewSecrets)() },
|
||||
{ name: 'Pipelines', element: (async () => (await import('./views/pipelines/index.js')).GitopsViewPipelines)() },
|
||||
{ name: 'Build Log', element: (async () => (await import('./views/buildlog/index.js')).GitopsViewBuildlog)() },
|
||||
{ name: 'Overview', iconName: 'lucide:layoutDashboard', element: (async () => (await import('./views/overview/index.js')).GitopsViewOverview)() },
|
||||
{ name: 'Connections', iconName: 'lucide:plug', element: (async () => (await import('./views/connections/index.js')).GitopsViewConnections)() },
|
||||
{ name: 'Projects', iconName: 'lucide:folderGit2', element: (async () => (await import('./views/projects/index.js')).GitopsViewProjects)() },
|
||||
{ name: 'Groups', iconName: 'lucide:users', element: (async () => (await import('./views/groups/index.js')).GitopsViewGroups)() },
|
||||
{ name: 'Secrets', iconName: 'lucide:key', element: (async () => (await import('./views/secrets/index.js')).GitopsViewSecrets)() },
|
||||
{ name: 'Pipelines', iconName: 'lucide:play', element: (async () => (await import('./views/pipelines/index.js')).GitopsViewPipelines)() },
|
||||
{ name: 'Build Log', iconName: 'lucide:scrollText', element: (async () => (await import('./views/buildlog/index.js')).GitopsViewBuildlog)() },
|
||||
];
|
||||
|
||||
private resolvedViewTabs: Array<{ name: string; element: any }> = [];
|
||||
private resolvedViewTabs: Array<{ name: string; iconName: string; element: any }> = [];
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
@@ -100,6 +100,7 @@ export class GitopsDashboard extends DeesElement {
|
||||
this.resolvedViewTabs = await Promise.all(
|
||||
this.viewTabs.map(async (tab) => ({
|
||||
name: tab.name,
|
||||
iconName: tab.iconName,
|
||||
element: await tab.element,
|
||||
})),
|
||||
);
|
||||
|
||||
@@ -3,11 +3,11 @@ import { css } from '@design.estate/dees-element';
|
||||
export const viewHostCss = css`
|
||||
:host {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
margin: auto;
|
||||
max-width: 1280px;
|
||||
padding: 16px 16px;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.view-title {
|
||||
font-size: 24px;
|
||||
|
||||
@@ -10,6 +10,7 @@ import {
|
||||
cssManager,
|
||||
type TemplateResult,
|
||||
} from '@design.estate/dees-element';
|
||||
import { type IStatsTile } from '@design.estate/dees-catalog';
|
||||
|
||||
@customElement('gitops-view-overview')
|
||||
export class GitopsViewOverview extends DeesElement {
|
||||
@@ -45,33 +46,6 @@ export class GitopsViewOverview extends DeesElement {
|
||||
public static styles = [
|
||||
cssManager.defaultStyles,
|
||||
viewHostCss,
|
||||
css`
|
||||
.stats-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
|
||||
gap: 16px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.stat-card {
|
||||
background: #1a1a2e;
|
||||
border: 1px solid #333;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
.stat-value {
|
||||
font-size: 36px;
|
||||
font-weight: 700;
|
||||
color: #00acff;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.stat-label {
|
||||
font-size: 14px;
|
||||
color: #999;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
`,
|
||||
];
|
||||
|
||||
public render(): TemplateResult {
|
||||
@@ -81,31 +55,18 @@ export class GitopsViewOverview extends DeesElement {
|
||||
const pipelineCount = this.dataState.pipelines.length;
|
||||
const failedPipelines = this.dataState.pipelines.filter((p) => p.status === 'failed').length;
|
||||
|
||||
const tiles: IStatsTile[] = [
|
||||
{ id: 'connections', title: 'Connections', value: connCount, type: 'number', icon: 'lucide:plug', color: '#00acff' },
|
||||
{ id: 'projects', title: 'Projects', value: projCount, type: 'number', icon: 'lucide:folderGit2', color: '#00acff' },
|
||||
{ id: 'groups', title: 'Groups', value: groupCount, type: 'number', icon: 'lucide:users', color: '#00acff' },
|
||||
{ id: 'pipelines', title: 'Pipelines', value: pipelineCount, type: 'number', icon: 'lucide:play', color: '#00acff' },
|
||||
{ id: 'failed', title: 'Failed Pipelines', value: failedPipelines, type: 'number', icon: 'lucide:triangleAlert', color: failedPipelines > 0 ? '#ff4444' : '#00ff88' },
|
||||
];
|
||||
|
||||
return html`
|
||||
<div class="view-title">Overview</div>
|
||||
<div class="view-description">GitOps dashboard - manage your Gitea and GitLab instances</div>
|
||||
<div class="stats-grid">
|
||||
<div class="stat-card">
|
||||
<div class="stat-value">${connCount}</div>
|
||||
<div class="stat-label">Connections</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-value">${projCount}</div>
|
||||
<div class="stat-label">Projects</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-value">${groupCount}</div>
|
||||
<div class="stat-label">Groups</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-value">${pipelineCount}</div>
|
||||
<div class="stat-label">Pipelines</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-value" style="color: ${failedPipelines > 0 ? '#ff4444' : '#00ff88'}">${failedPipelines}</div>
|
||||
<div class="stat-label">Failed Pipelines</div>
|
||||
</div>
|
||||
</div>
|
||||
<dees-statsgrid .tiles=${tiles}></dees-statsgrid>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user