Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve Responisveness Obol Generate ENR Modal #1848

Merged
merged 2 commits into from
Apr 25, 2024
Merged

Improve Responisveness Obol Generate ENR Modal #1848

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
72a4232
ADD:animation to generate ENR
mabasian Apr 25, 2024
92e110f
update img alt
mabasian Apr 25, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions launcher/public/output.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2208,6 +2208,10 @@ video {
width: 100vw;
}

.w-\[50\%\]{
width: 50%;
}

.min-w-\[100px\]{
min-width: 100px;
}
Expand Down
52 changes: 29 additions & 23 deletions launcher/src/backend/ValidatorAccountManager.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,9 @@ export class ValidatorAccountManager {
if (slashingDB) var slashing_protection_content = JSON.parse(readFileSync(slashingDB, { encoding: "utf8" }));
let passwords = Array(files.length).fill(password);
const content = files.map((file, index) => {
const passwordFile = passwordFiles.find((p) => path.basename(p.name, ".txt") === path.basename(file.name, ".json"));
const passwordFile = passwordFiles.find(
(p) => path.basename(p.name, ".txt") === path.basename(file.name, ".json")
);
if (passwordFile) {
passwords[index] = readFileSync(passwordFile.path, { encoding: "utf8" });
}
Expand Down Expand Up @@ -320,7 +322,8 @@ export class ValidatorAccountManager {
if (!apiToken) apiToken = await this.getApiToken(service);
let command = [
"docker run --rm --network=stereum curlimages/curl",
`curl ${service.service.includes("Teku") ? "--insecure https" : "http"}://stereum-${service.id}:${validatorPorts[service.service]
`curl ${service.service.includes("Teku") ? "--insecure https" : "http"}://stereum-${service.id}:${
validatorPorts[service.service]
}${apiPath}`,
`-X ${method.toUpperCase()}`,
`-H 'Content-Type: application/json'`,
Expand Down Expand Up @@ -584,7 +587,9 @@ export class ValidatorAccountManager {
walletPath = service.volumes.find((v) => v.servicePath == "/opt/app/data/wallets").destinationPath;
}
//Make sure keystores have correct permissions
const chmodResult = await this.nodeConnection.sshService.exec("chmod -Rv 600 " + walletPath + "/direct/accounts/*");
const chmodResult = await this.nodeConnection.sshService.exec(
"chmod -Rv 600 " + walletPath + "/direct/accounts/*"
);
log.info(chmodResult.stdout);
if (walletPath) {
result = await this.nodeConnection.sshService.exec("cat " + walletPath + "/auth-token");
Expand Down Expand Up @@ -926,14 +931,14 @@ export class ValidatorAccountManager {
result = await this.nodeConnection.sshService.exec(charonClient.getWriteENRPrivateKeyCommand(privateKey));
if (SSHService.checkExecError(result) && result.stderr) throw SSHService.extractExecError(result);

let enr = await this.getObolENRPublicKey()
let enr = await this.getObolENRPublicKey();
return enr;
} else {
let result = await this.nodeConnection.sshService.exec(charonClient.getCreateEnrCommand());
if (SSHService.checkExecError(result) && result.stderr) throw SSHService.extractExecError(result);
const data = result.stdout.split('\n')
const enr = data.find((line) => line.includes('enr:-'));
return enr
const data = result.stdout.split("\n");
const enr = data.find((line) => line.includes("enr:-"));
return enr;
}
} catch (err) {
log.error("Error creating Obol ENR: ", err);
Expand All @@ -951,12 +956,12 @@ export class ValidatorAccountManager {
if (SSHService.checkExecError(result) && result.stderr) throw SSHService.extractExecError(result);
const data = result.stdout;
return {
privateKey: data.includes('charon-enr-private-key'), //ENR Created
clusterDefinition: data.includes('cluster-definition.json'), //Cluster Definition Created / Successfull DKG
depositData: data.includes('deposit-data.json'), //Successfull DKG
clusterLock: data.includes('cluster-lock.json'), //Successfull DKG
validatorKeys: data.includes('validator_keys'), //Successfull DKG
}
privateKey: data.includes("charon-enr-private-key"), //ENR Created
clusterDefinition: data.includes("cluster-definition.json"), //Cluster Definition Created / Successfull DKG
depositData: data.includes("deposit-data.json"), //Successfull DKG
clusterLock: data.includes("cluster-lock.json"), //Successfull DKG
validatorKeys: data.includes("validator_keys"), //Successfull DKG
};
} catch (err) {
log.error("Error checking Obol ENR: ", err);
return {
Expand All @@ -965,8 +970,8 @@ export class ValidatorAccountManager {
depositData: false,
clusterLock: false,
validatorKeys: false,
error: err
}
error: err,
};
}
}

Expand Down Expand Up @@ -1042,9 +1047,12 @@ export class ValidatorAccountManager {
if (!charonClient) throw "Couldn't find CharonService";

let contentResult = await this.nodeConnection.sshService.exec(charonClient.getListCharonFolderContentsCommand());
if (SSHService.checkExecError(contentResult) && contentResult.stderr) throw SSHService.extractExecError(contentResult);
if (SSHService.checkExecError(contentResult) && contentResult.stderr)
throw SSHService.extractExecError(contentResult);
const content = contentResult.stdout;
const dkgCommand = charonClient.getDKGCommand(content.includes('cluster-definition.json') ? "" : input.match(/http(s)?:.*\/[0-9a-zA-z]*/)[0]);
const dkgCommand = charonClient.getDKGCommand(
content.includes("cluster-definition.json") ? "" : input.match(/http(s)?:.*\/[0-9a-zA-z]*/)[0]
);

let result = await this.nodeConnection.sshService.exec(dkgCommand);
if (SSHService.checkExecError(result) && result.stderr) throw SSHService.extractExecError(result);
Expand All @@ -1058,10 +1066,9 @@ export class ValidatorAccountManager {
async checkObolDKG() {
try {
//get all names of running docker containers
const result = await this.nodeConnection.sshService.exec("docker ps --format '{{.Names}}'")
const containerNames = result.stdout.split('\n');
if (containerNames.includes('dkg-container'))
return true;
const result = await this.nodeConnection.sshService.exec("docker ps --format '{{.Names}}'");
const containerNames = result.stdout.split("\n");
if (containerNames.includes("dkg-container")) return true;
return false;
} catch (error) {
log.error("Error checking Status of Obol DKG: ", error);
Expand All @@ -1071,7 +1078,7 @@ export class ValidatorAccountManager {

async getObolDKGLogs() {
try {
const result = await this.nodeConnection.sshService.exec("docker logs dkg-container")
const result = await this.nodeConnection.sshService.exec("docker logs dkg-container");
return result.stdout + result.stderr;
} catch (error) {
log.error("Error getting Obol DKG Logs: ", error);
Expand Down Expand Up @@ -1108,5 +1115,4 @@ export class ValidatorAccountManager {
log.error("Error uploading Obol Backup: ", err);
}
}

}
14 changes: 13 additions & 1 deletion launcher/src/components/UI/services-modal/EnrGenerator.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,10 @@
backgroundImage: backupDistributedValidator || distributedCompleted ? distrubutedValidatorAnimation : '',
}"
>
<div v-if="enrGeneratorAnim" class="generatingAnim w-full h-full items-center justify-center flex">
<img class="w-1/2" src="/animation/services/obol/obol-animation.gif" alt="ENR generating" />
</div>

<div v-if="!backupDistributedValidator" class="obol-modal-plugin_wapper">
<span v-if="!headerStore.distrubutedValidatorGenerator">{{ headerStore.generatedENR }}</span>
<div v-else class="span-wrapper">
Expand Down Expand Up @@ -46,7 +50,7 @@
</template>
<script setup>
import { useNodeHeader } from "@/store/nodeHeader";
import { ref, onMounted, computed, onBeforeUnmount } from "vue";
import { ref, onMounted, computed, onBeforeUnmount, onUnmounted } from "vue";
import ControlService from "@/store/ControlService";
import { saveToFile } from "@/composables/utils";

Expand All @@ -65,6 +69,7 @@ const polling = ref(null);
const dkgLogs = ref([]);
const backupPath = ref("");
const runningBackup = ref(false);
const enrGeneratorAnim = ref(false);

const headerStore = useNodeHeader();

Expand Down Expand Up @@ -115,13 +120,18 @@ const enrBtnToShow = computed(() => {
onMounted(() => {
if (!headerStore.distrubutedValidatorGenerator && headerStore.enrIsGenerating) {
createEnr();
enrGeneratorAnim.value = true;
}
headerStore.generatedENR = "";
if (headerStore.distrubutedValidatorGenerator && !headerStore.enrIsGenerating) {
startDKG(props.clusterDefinition);
}
});

onUnmounted(() => {
enrGeneratorAnim.value = false;
});

onBeforeUnmount(() => {
clearInterval(polling.value);
});
Expand All @@ -140,8 +150,10 @@ const createEnr = async () => {
headerStore.generatedENR = enr;

if (enr.includes("enr:-")) {
enrGeneratorAnim.value = false;
enrGeneratedSuccess.value = true;
} else {
enrGeneratedFailed.value = false;
enrGeneratedFailed.value = true;
}

Expand Down