serve.zone/gitops
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(secrets): add ability to fetch and view all secrets across projects and groups, include scopeName, and improve frontend merging/filtering

Browse Source
This commit is contained in:
Jürgen Kunz
2026-02-24 21:09:17 +00:00
parent ee3f01993f
commit 179bb9223e
11 changed files with 156 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
ts_web/00_commitinfo_data.ts
View File

@@ -3,6 +3,6 @@
*/
export const commitinfo = {
name: '@serve.zone/gitops',
version: '2.6.2',
version: '2.7.0',
description: 'GitOps management app for Gitea and GitLab - manage secrets, browse projects, view CI pipelines, and stream build logs'
}

41
ts_web/appstate.ts
View File

@@ -304,6 +304,27 @@ export const fetchSecretsAction = dataStatePart.createAction<{
}
});
export const fetchAllSecretsAction = dataStatePart.createAction<{
connectionId: string;
scope: 'project' | 'group';
}>(async (statePartArg, dataArg) => {
const context = getActionContext();
try {
const typedRequest = new plugins.domtools.plugins.typedrequest.TypedRequest<
interfaces.requests.IReq_GetAllSecrets
>('/typedrequest', 'getAllSecrets');
const response = await typedRequest.fire({
identity: context.identity!,
connectionId: dataArg.connectionId,
scope: dataArg.scope,
});
return { ...statePartArg.getState(), secrets: response.secrets };
} catch (err) {
console.error('Failed to fetch all secrets:', err);
return statePartArg.getState();
}
});
export const createSecretAction = dataStatePart.createAction<{
connectionId: string;
scope: 'project' | 'group';
@@ -320,7 +341,7 @@ export const createSecretAction = dataStatePart.createAction<{
identity: context.identity!,
...dataArg,
});
// Re-fetch secrets
// Re-fetch only the affected entity's secrets and merge
const listReq = new plugins.domtools.plugins.typedrequest.TypedRequest<
interfaces.requests.IReq_GetSecrets
>('/typedrequest', 'getSecrets');
@@ -330,7 +351,11 @@ export const createSecretAction = dataStatePart.createAction<{
scope: dataArg.scope,
scopeId: dataArg.scopeId,
});
return { ...statePartArg.getState(), secrets: listResp.secrets };
const state = statePartArg.getState();
const otherSecrets = state.secrets.filter(
(s) => !(s.scopeId === dataArg.scopeId && s.scope === dataArg.scope),
);
return { ...state, secrets: [...otherSecrets, ...listResp.secrets] };
} catch (err) {
console.error('Failed to create secret:', err);
return statePartArg.getState();
@@ -353,7 +378,7 @@ export const updateSecretAction = dataStatePart.createAction<{
identity: context.identity!,
...dataArg,
});
// Re-fetch
// Re-fetch only the affected entity's secrets and merge
const listReq = new plugins.domtools.plugins.typedrequest.TypedRequest<
interfaces.requests.IReq_GetSecrets
>('/typedrequest', 'getSecrets');
@@ -363,7 +388,11 @@ export const updateSecretAction = dataStatePart.createAction<{
scope: dataArg.scope,
scopeId: dataArg.scopeId,
});
return { ...statePartArg.getState(), secrets: listResp.secrets };
const state = statePartArg.getState();
const otherSecrets = state.secrets.filter(
(s) => !(s.scopeId === dataArg.scopeId && s.scope === dataArg.scope),
);
return { ...state, secrets: [...otherSecrets, ...listResp.secrets] };
} catch (err) {
console.error('Failed to update secret:', err);
return statePartArg.getState();
@@ -388,7 +417,9 @@ export const deleteSecretAction = dataStatePart.createAction<{
const state = statePartArg.getState();
return {
...state,
secrets: state.secrets.filter((s) => s.key !== dataArg.key),
secrets: state.secrets.filter(
(s) => !(s.key === dataArg.key && s.scopeId === dataArg.scopeId && s.scope === dataArg.scope),
),
};
} catch (err) {
console.error('Failed to delete secret:', err);

46
ts_web/elements/views/secrets/index.ts
View File

@@ -36,7 +36,7 @@ export class GitopsViewSecrets extends DeesElement {
accessor selectedScope: 'project' | 'group' = 'project';
@state()
accessor selectedScopeId: string = '';
accessor selectedScopeId: string = '__all__';
private _autoRefreshHandler: () => void;
@@ -70,6 +70,13 @@ export class GitopsViewSecrets extends DeesElement {
viewHostCss,
];
private get filteredSecrets() {
if (this.selectedScopeId === '__all__') {
return this.dataState.secrets;
}
return this.dataState.secrets.filter((s) => s.scopeId === this.selectedScopeId);
}
public render(): TemplateResult {
const connectionOptions = this.connectionsState.connections.map((c) => ({
option: `${c.name} (${c.providerType})`,
@@ -81,10 +88,17 @@ export class GitopsViewSecrets extends DeesElement {
{ option: 'Group', key: 'group' },
];
const entityOptions = this.selectedScope === 'project'
const entities = this.selectedScope === 'project'
? this.dataState.projects.map((p) => ({ option: p.fullPath || p.name, key: p.id }))
: this.dataState.groups.map((g) => ({ option: g.fullPath || g.name, key: g.id }));
const entityOptions = [
{ option: 'All', key: '__all__' },
...entities,
];
const isAllSelected = this.selectedScopeId === '__all__';
return html`
<div class="view-title">Secrets</div>
<div class="view-description">Manage CI/CD secrets and variables</div>
@@ -95,7 +109,9 @@ export class GitopsViewSecrets extends DeesElement {
.selectedOption=${connectionOptions.find((o) => o.key === this.selectedConnectionId) || connectionOptions[0]}
@selectedOption=${(e: CustomEvent) => {
this.selectedConnectionId = e.detail.key;
this.selectedScopeId = '__all__';
this.loadEntities();
this.loadSecrets();
}}
></dees-input-dropdown>
<dees-input-dropdown
@@ -104,7 +120,9 @@ export class GitopsViewSecrets extends DeesElement {
.selectedOption=${scopeOptions.find((o) => o.key === this.selectedScope)}
@selectedOption=${(e: CustomEvent) => {
this.selectedScope = e.detail.key as 'project' | 'group';
this.selectedScopeId = '__all__';
this.loadEntities();
this.loadSecrets();
}}
></dees-input-dropdown>
<dees-input-dropdown
@@ -113,18 +131,21 @@ export class GitopsViewSecrets extends DeesElement {
.selectedOption=${entityOptions.find((o) => o.key === this.selectedScopeId) || entityOptions[0]}
@selectedOption=${(e: CustomEvent) => {
this.selectedScopeId = e.detail.key;
this.loadSecrets();
}}
></dees-input-dropdown>
<dees-button @click=${() => this.addSecret()}>Add Secret</dees-button>
<dees-button
.disabled=${isAllSelected}
@click=${() => this.addSecret()}
>Add Secret</dees-button>
<dees-button @click=${() => this.loadSecrets()}>Refresh</dees-button>
</div>
<dees-table
.heading1=${'Secrets'}
.heading2=${'CI/CD variables for the selected entity'}
.data=${this.dataState.secrets}
.data=${this.filteredSecrets}
.displayFunction=${(item: any) => ({
Key: item.key,
Scope: item.scopeName || item.scopeId,
Value: item.masked ? '******' : item.value,
Protected: item.protected ? 'Yes' : 'No',
Environment: item.environment || '*',
@@ -141,8 +162,8 @@ export class GitopsViewSecrets extends DeesElement {
action: async (item: any) => {
await appstate.dataStatePart.dispatchAction(appstate.deleteSecretAction, {
connectionId: this.selectedConnectionId,
scope: this.selectedScope,
scopeId: this.selectedScopeId,
scope: item.scope,
scopeId: item.scopeId,
key: item.key,
});
},
@@ -158,6 +179,7 @@ export class GitopsViewSecrets extends DeesElement {
if (conns.length > 0 && !this.selectedConnectionId) {
this.selectedConnectionId = conns[0].id;
await this.loadEntities();
await this.loadSecrets();
}
}
@@ -175,15 +197,15 @@ export class GitopsViewSecrets extends DeesElement {
}
private async loadSecrets() {
if (!this.selectedConnectionId || !this.selectedScopeId) return;
await appstate.dataStatePart.dispatchAction(appstate.fetchSecretsAction, {
if (!this.selectedConnectionId) return;
await appstate.dataStatePart.dispatchAction(appstate.fetchAllSecretsAction, {
connectionId: this.selectedConnectionId,
scope: this.selectedScope,
scopeId: this.selectedScopeId,
});
}
private async addSecret() {
if (this.selectedScopeId === '__all__') return;
await plugins.deesCatalog.DeesModal.createAndShow({
heading: 'Add Secret',
content: html`
@@ -234,8 +256,8 @@ export class GitopsViewSecrets extends DeesElement {
const input = modal.shadowRoot.querySelector('dees-input-text');
await appstate.dataStatePart.dispatchAction(appstate.updateSecretAction, {
connectionId: this.selectedConnectionId,
scope: this.selectedScope,
scopeId: this.selectedScopeId,
scope: item.scope,
scopeId: item.scopeId,
key: item.key,
value: input?.value || '',
});