Skip to content

Commit

Permalink
feat: integrate selection details in tf_peertube
Browse files Browse the repository at this point in the history
  • Loading branch information
@MohamedElmdary
MohamedElmdary committed Dec 18, 2023
1 parent f45fc39 commit 5132df6
Showing 1 changed file with 50 additions and 110 deletions.
160 changes: 50 additions & 110 deletions packages/playground/src/weblets/tf_peertube.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
:ipv4="ipv4"
:certified="certified"
:dedicated="dedicated"
:SelectedNode="selectedNode"
:SelectedNode="selectionDetails?.node"
title-image="images/icons/peertube.png"
>
<template #title>Deploy a Peertube Instance</template>
Expand Down Expand Up @@ -61,122 +61,76 @@
</input-validator>
</password-input-wrapper>

<SelectSolutionFlavor v-model="solution" :disabled="loadingFarm" />
<!-- <Networks v-model:ipv4="ipv4" /> -->
<FarmGatewayManager>
<input-tooltip
inline
tooltip="Click to know more about dedicated nodes."
href="https://manual.grid.tf/dashboard/portal/dashboard_portal_dedicated_nodes.html"
>
<v-switch color="primary" inset label="Dedicated" v-model="dedicated" :disabled="loadingFarm" hide-details />
</input-tooltip>
<input-tooltip inline tooltip="Renting capacity on certified nodes is charged 25% extra.">
<v-switch color="primary" inset label="Certified" v-model="certified" :disabled="loadingFarm" hide-details />
</input-tooltip>
<SelectFarmManager>
<NodeSelector v-model="selection" />
<SelectFarm
v-if="selection == Selection.AUTOMATED"
:filters="{
cpu: solution?.cpu,
memory: solution?.memory,
ssd: (solution?.disk ?? 0) + rootFilesystemSize,
publicIp: ipv4,
rentedBy: dedicated ? profileManager.profile?.twinId : undefined,
certified: certified,
}"
v-model="farm"
v-model:loading="loadingFarm"
v-model:search="farmName"
/>
<SelectSolutionFlavor v-model="solution" />

<SelectNode
v-model="selectedNode"
:selection="selection"
:filters="{
farmId: farm?.farmID,
cpu: solution?.cpu,
memory: solution?.memory,
diskSizes: [solution?.disk],
rentedBy: dedicated ? profileManager.profile?.twinId : undefined,
certified: certified,
country: farm?.country,
region: farm?.region,
}"
:loading-farm="loadingFarm"
:root-file-system-size="rootFilesystemSize"
/>
</SelectFarmManager>
<DomainName :hasIPv4="ipv4" ref="domainNameCmp" />
</FarmGatewayManager>
<input-tooltip
inline
tooltip="Click to know more about dedicated nodes."
href="https://manual.grid.tf/dashboard/portal/dashboard_portal_dedicated_nodes.html"
>
<v-switch color="primary" inset label="Dedicated" v-model="dedicated" hide-details />
</input-tooltip>

<input-tooltip inline tooltip="Renting capacity on certified nodes is charged 25% extra.">
<v-switch color="primary" inset label="Certified" v-model="certified" hide-details />
</input-tooltip>

<TfSelectionDetails
:filters="{
ipv4,
certified,
dedicated,
cpu: solution?.cpu,
solutionDisk: solution?.disk,
memory: solution?.memory,
rootFilesystemSize,
}"
require-domain
v-model="selectionDetails"
/>
</form-validator>

<template #footer-actions>
<v-btn
color="primary"
variant="tonal"
@click="deploy(domainNameCmp?.domain, domainNameCmp?.customDomain)"
:disabled="!valid"
>
Deploy
</v-btn>
<v-btn color="primary" variant="tonal" @click="deploy()" :disabled="!valid"> Deploy </v-btn>
</template>
</weblet-layout>
</template>

<script lang="ts" setup>
import type { GridClient } from "@threefold/grid_client";
import { computed, type Ref, ref, watch } from "vue";
import { computed, type Ref, ref } from "vue";
import { Selection } from "@/utils/types";
import NodeSelector from "../components/node_selection.vue";
import { useLayout } from "../components/weblet_layout.vue";
import { useProfileManager } from "../stores";
import type { FarmInterface, Flist, GatewayNode, solutionFlavor as SolutionFlavor } from "../types";
import type { Flist, solutionFlavor as SolutionFlavor } from "../types";
import { ProjectName } from "../types";
import { deployVM } from "../utils/deploy_vm";
import { deployGatewayName, getSubdomain, rollbackDeployment } from "../utils/gateway";
import { deployGatewayName2, getSubdomain, rollbackDeployment } from "../utils/gateway";
import { generateName, generatePassword } from "../utils/strings";
const layout = useLayout();
const valid = ref(false);
const profileManager = useProfileManager();
const selection = ref();
const name = ref(generateName({ prefix: "pt" }));
const email = ref("");
const password = ref(generatePassword());
const solution = ref() as Ref<SolutionFlavor>;
const farm = ref() as Ref<FarmInterface>;
const farmName = ref();
const loadingFarm = ref(false);
const flist: Flist = {
value: "https://hub.grid.tf/tf-official-apps/peertube-v3.1.1.flist",
entryPoint: "/sbin/zinit init",
};
const dedicated = ref(false);
const certified = ref(false);
const selectedNode = ref() as Ref<INode>;
const ipv4 = ref(false);
const domainNameCmp = ref();
const rootFilesystemSize = computed(() => rootFs(solution.value?.cpu ?? 0, solution.value?.memory ?? 0));
watch(
() => selection.value,
(value, oldValue) => {
if (value !== oldValue) {
loadingFarm.value = false;
}
},
{ deep: false },
);
const selectionDetails = ref<SelectionDetails>();
function finalize(deployment: any) {
layout.value.reloadDeploymentsList();
layout.value.setStatus("success", "Successfully deployed a peertube instance.");
layout.value.openDialog(deployment, deploymentListEnvironments.peertube);
}
async function deploy(gatewayName: GatewayNode, customDomain: boolean) {
async function deploy() {
layout.value.setStatus("deploy");
const projectName = ProjectName.Peertube.toLowerCase() + "/" + name.value;
Expand All @@ -186,7 +140,10 @@ async function deploy(gatewayName: GatewayNode, customDomain: boolean) {
projectName,
twinId: profileManager.profile!.twinId,
});
const domain = customDomain ? gatewayName.domain : subdomain + "." + gatewayName.domain;
const domain = selectionDetails.value?.domain?.enabledCustomDomain
? selectionDetails.value.domain.customDomain
: subdomain + "." + selectionDetails.value?.domain?.selectedDomain?.publicConfig.domain;
let grid: GridClient | null;
let vm: any;
Expand All @@ -200,8 +157,8 @@ async function deploy(gatewayName: GatewayNode, customDomain: boolean) {
vm = await deployVM(grid!, {
name: name.value,
network: {
addAccess: !!gatewayName.id,
accessNodeId: gatewayName.id,
addAccess: selectionDetails.value!.domain!.enableSelectedDomain,
accessNodeId: selectionDetails.value?.domain?.selectedDomain?.nodeId,
},
machines: [
{
Expand All @@ -216,18 +173,15 @@ async function deploy(gatewayName: GatewayNode, customDomain: boolean) {
],
flist: flist.value,
entryPoint: flist.entryPoint,
farmId: farm.value.farmID,
farmName: farm.value.name,
publicIpv4: ipv4.value,
country: farm.value.country,
planetary: true,
envs: [
{ key: "SSH_KEY", value: profileManager.profile!.ssh },
{ key: "PEERTUBE_ADMIN_EMAIL", value: email.value },
{ key: "PT_INITIAL_ROOT_PASSWORD", value: password.value },
{ key: "PEERTUBE_WEBSERVER_HOSTNAME", value: domain },
],
nodeId: selectedNode.value.nodeId,
nodeId: selectionDetails.value!.node!.nodeId,
rentedBy: dedicated.value ? grid!.twinId : undefined,
certified: certified.value,
rootFilesystemSize: rootFilesystemSize.value,
Expand All @@ -237,21 +191,21 @@ async function deploy(gatewayName: GatewayNode, customDomain: boolean) {
} catch (e) {
return layout.value.setStatus("failed", normalizeError(e, "Failed to deploy a peertube instance."));
}
if (customDomain && ipv4.value) {
vm[0].customDomain = gatewayName.domain;
if (!selectionDetails.value?.domain?.enableSelectedDomain) {
vm[0].customDomain = selectionDetails.value?.domain?.customDomain;
finalize(vm);
return;
}
try {
layout.value.setStatus("deploy", "Preparing to deploy gateway...");
await deployGatewayName(grid!, {
name: subdomain,
nodeId: gatewayName.id!,
await deployGatewayName2(grid, selectionDetails.value.domain, {
subdomain,
ip: vm[0].interfaces[0].ip,
port: 9000,
networkName: vm[0].interfaces[0].network,
fqdn: gatewayName?.useFQDN ? gatewayName.domain : undefined,
port: 80,
network: vm[0].interfaces[0].network,
});
finalize(vm);
Expand All @@ -265,29 +219,15 @@ async function deploy(gatewayName: GatewayNode, customDomain: boolean) {
</script>

<script lang="ts">
import DomainName from "../components/domain_name.vue";
import FarmGatewayManager from "../components/farm_gateway_manager.vue";
// import Networks from "../components/networks.vue";
import SelectFarm from "../components/select_farm.vue";
import SelectFarmManager from "../components/select_farm_manager.vue";
import SelectNode from "../components/select_node.vue";
import SelectSolutionFlavor from "../components/select_solution_flavor.vue";
import { deploymentListEnvironments } from "../constants";
import type { INode } from "../utils/filter_nodes";
import type { SelectionDetails } from "../types/nodeSelector";
import { getGrid } from "../utils/grid";
import { normalizeError } from "../utils/helpers";
import rootFs from "../utils/root_fs";
export default {
name: "TfPeertube",
components: {
SelectSolutionFlavor,
SelectFarm,
SelectNode,
// Networks,
DomainName,
FarmGatewayManager,
SelectFarmManager,
},
components: { SelectSolutionFlavor },
};
</script>

0 comments on commit 5132df6

Please sign in to comment.