Skip to content

Commit

Permalink
adds docker container list + start, stop, delete
Browse files Browse the repository at this point in the history
  • Loading branch information
Snider committed Mar 15, 2024
1 parent ab3a4b0 commit 26fe249
Show file tree
Hide file tree
Showing 7 changed files with 148 additions and 3 deletions.
6 changes: 6 additions & 0 deletions frontend/lethean/src/app/app.routes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {WalletSendComponent} from "./wallet/send/wallet-send.component";
import {WalletReceiveComponent} from "./wallet/receive/wallet-receive.component";
import {WalletSettingsComponent} from "./wallet/settings/wallet-settings.component";
import {SettingsFullNodeComponent} from "./settings/full-node/settings-full-node.component";
import {SettingsDockerComponent} from "./settings/docker/settings-docker.component";

export const routes: Routes = [

Expand Down Expand Up @@ -53,6 +54,11 @@ export const routes: Routes = [
path: 'settings/full-node',
component: SettingsFullNodeComponent

},
{
path: 'settings/docker',
component: SettingsDockerComponent

},
{
path: 'reports',
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
<main class=" pb-8">
<div class="mx-auto max-w-3xl px-4 sm:px-6 lg:max-w-7xl lg:px-8">
<h1 class="sr-only">Docker Setup Page</h1>
<p class="sr-only">This page will communicate with your local docker service, download and bootstrap Lethean.</p>
<!-- Main 3 column grid -->

<section aria-labelledby="section-1-title">
<h2 class="sr-only" id="section-1-title">Section title</h2>
<div class="overflow-hidden rounded-lg bg-white shadow">
<div class="p-6">
<!-- Your content -->

<table class="min-w-full divide-y divide-gray-300">
<thead>
<tr>
<th>Name</th>
<th>State</th>
<th>Actions</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-300">
<tr *ngFor="let cont of containers">
<td class="px-6 py-4 whitespace-nowrap">{{ cont.Names[0] }}</td>
<td class="px-6 py-4 whitespace-nowrap">{{ cont.State }}</td>
<td class="px-6 py-4 whitespace-nowrap">
<button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-1 px-2 rounded" (click)="startContainer(cont.Id)">
Start
</button>
<button class="bg-orange-500 hover:bg-orange-700 text-white font-bold py-1 px-2 rounded" (click)="stopContainer(cont.Id)">
Stop
</button>
<button class="bg-red-500 hover:bg-red-700 text-white font-bold py-1 px-2 rounded" (click)="deleteContainer(cont.Id)">
Delete
</button>
</td>
</table>
</div>
</div>
</section>




</div>
</main>
Empty file.
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';

import { SettingsDockerComponent } from './settings-docker.component';

describe('SettingsDockerComponent', () => {
let component: SettingsDockerComponent;
let fixture: ComponentFixture<SettingsDockerComponent>;

beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [SettingsDockerComponent]
})
.compileComponents();

fixture = TestBed.createComponent(SettingsDockerComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});

it('should create', () => {
expect(component).toBeTruthy();
});
});
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
import {Component, OnInit} from '@angular/core';
import {NgForOf, NgIf} from "@angular/common";

@Component({
selector: 'app-docker',
standalone: true,
imports: [
NgIf,
NgForOf
],
templateUrl: './settings-docker.component.html',
styleUrl: './settings-docker.component.scss'
})
export class SettingsDockerComponent implements OnInit {
containers: any;

ngOnInit(): void {

this.getContainers()
}

getContainers() {
fetch('http://localhost:36911/docker/container/list')
.then(response => response.json()).then(data => {
this.containers = data;
});
}

deleteContainer(Id: string) {
fetch(`http://localhost:36911/docker/container/remove/${Id}`, {
method: 'GET',
headers: {
'Content-Type': 'application/json'
}
}).then(response => response.json()).then(data => {
this.getContainers()
})
}

stopContainer(Id: string) {
fetch(`http://localhost:36911/docker/container/stop/${Id}`, {
method: 'GET',
headers: {
'Content-Type': 'application/json'
}
}).then(response => response.json()).then(data => {
this.getContainers()
})
}

startContainer(Id: string) {
fetch(`http://localhost:36911/docker/container/start/${Id}`, {
method: 'GET',
headers: {
'Content-Type': 'application/json'
}
}).then(response => response.json()).then(data => {
this.getContainers()
})
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export class SettingsFullNodeComponent implements OnInit{

const docker = fetch('http://localhost:36911/docker/container/list')
.then(response => response.json()).then(data => {
if(data.length > 0){
if(data.length >= 0){
this.status_docker = 'Installed'
for (let i = 0; i < data.length; i++) {
if(data[i].Names.includes('/letheannode')){
Expand Down
14 changes: 12 additions & 2 deletions frontend/lethean/src/app/settings/settings.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
</div>
</div>
<div class="flex flex-none items-center gap-x-4">
<button [routerLink]="['/', 'settings', 'full-node']" class="hidden rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 sm:block">Configure</button>
<a [routerLink]="['/', 'settings', 'full-node']" class="hidden rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 sm:block">Configure</a>
</div>
</li>
<li class="flex items-center justify-between gap-x-6 py-5">
Expand All @@ -16,7 +16,17 @@
</div>
</div>
<div class="flex flex-none items-center gap-x-4">
<button [routerLink]="['/', 'settings', 'chain-node']" class="hidden rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 sm:block">Configure</button>
<a [routerLink]="['/', 'settings', 'chain-node']" class="hidden rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 sm:block">Configure</a>
</div>
</li>
<li class="flex items-center justify-between gap-x-6 py-5">
<div class="min-w-0">
<div class="flex items-start gap-x-3">
<p class="text-sm font-semibold leading-6 text-gray-900">Docker Browser</p>
</div>
</div>
<div class="flex flex-none items-center gap-x-4">
<a [routerLink]="['/', 'settings', 'docker']" class="hidden rounded-md bg-white px-2.5 py-1.5 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 sm:block">Manage Containers</a>
</div>
</li>
</ul>

0 comments on commit 26fe249

Please sign in to comment.