Skip to content

Commit 43b9a0e

Browse files
PhilleziPhillezi
authored
Merge pull request #365 from kthcloud/gpu-deployment-updates
Update deployment creation to include visibility, specs and gpu selection
2 parents 72e1cc4 + 2fafc80 commit 43b9a0e

10 files changed

Lines changed: 968 additions & 356 deletions

File tree

‎src/api/deploy/deployments.ts‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Job } from "../../types";
1+
import { DeploymentSpecsGPU, Job, Visibility } from "../../types";
22

33
export const getDeployment = async (token: string, id: string) => {
44
const url = `${import.meta.env.VITE_DEPLOY_API_URL}/deployments/${id}`;
@@ -90,7 +90,9 @@ export const createDeployment = async (
9090
imageArgs: any,
9191
envs: any,
9292
volumes: any,
93-
token: string
93+
token: string,
94+
visibility: Visibility,
95+
specs?: DeploymentSpecsGPU
9496
) => {
9597
let body: any = {
9698
name,
@@ -99,8 +101,14 @@ export const createDeployment = async (
99101
if (zone) body = { ...body, zone };
100102
if (image) body = { ...body, image };
101103
if (imageArgs) body = { ...body, args: imageArgs };
104+
if (visibility) body = { ...body, visibility };
102105
if (envs) body = { ...body, envs };
103106
if (volumes) body = { ...body, volumes };
107+
if (specs?.cpuCores) body = { ...body, cpuCores: specs.cpuCores };
108+
if (specs?.ram) body = { ...body, ram: specs.ram };
109+
if (specs?.replicas != undefined)
110+
body = { ...body, replicas: specs.replicas };
111+
if (specs?.gpus) body = { ...body, gpus: specs.gpus };
104112

105113
const res = await fetch(
106114
import.meta.env.VITE_DEPLOY_API_URL + "/deployments",

‎src/components/create/EnvironmentVariableSelector.tsx‎

Lines changed: 155 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,155 @@
1+
import {
2+
Card,
3+
CardContent,
4+
CardHeader,
5+
IconButton,
6+
Paper,
7+
Stack,
8+
TableBody,
9+
TableCell,
10+
TableContainer,
11+
TableHead,
12+
TableRow,
13+
TextField,
14+
} from "@mui/material";
15+
import { NoWrapTable as Table } from "../../components/NoWrapTable";
16+
import Iconify from "../Iconify";
17+
import { Dispatch, SetStateAction } from "react";
18+
import { EnvVar } from "../../types";
19+
import { useTranslation } from "react-i18next";
20+
21+
export type EnvironmentVariableSelectorProps = {
22+
envs: EnvVar[];
23+
setEnvs: Dispatch<SetStateAction<EnvVar[]>>;
24+
currentEnv: EnvVar;
25+
setCurrentEnv: Dispatch<SetStateAction<EnvVar>>;
26+
};
27+
28+
export default function EnvironmentVariableSelector({
29+
envs,
30+
setEnvs,
31+
currentEnv,
32+
setCurrentEnv,
33+
}: EnvironmentVariableSelectorProps) {
34+
const { t } = useTranslation();
35+
36+
return (
37+
<Card sx={{ boxShadow: 20 }}>
38+
<CardHeader
39+
title={t("create-deployment-env")}
40+
subheader={t("create-deployment-env-subheader")}
41+
/>
42+
<CardContent>
43+
<TableContainer component={Paper}>
44+
<Table sx={{ minWidth: 650 }} aria-label="simple table">
45+
<TableHead>
46+
<TableRow>
47+
<TableCell>{t("create-deployment-env-key")}</TableCell>
48+
<TableCell>{t("create-deployment-env-value")}</TableCell>
49+
<TableCell align="right">{t("admin-actions")}</TableCell>
50+
</TableRow>
51+
</TableHead>
52+
<TableBody>
53+
{envs.map((env) => (
54+
<TableRow
55+
key={"env_row_" + env.name}
56+
sx={{
57+
"&:last-child td, &:last-child th": { border: 0 },
58+
}}
59+
>
60+
<TableCell component="th" scope="row">
61+
<b style={{ fontFamily: "monospace" }}>{env.name}</b>
62+
</TableCell>
63+
<TableCell>
64+
<b style={{ fontFamily: "monospace" }}>{env.value}</b>
65+
</TableCell>
66+
<TableCell align="right">
67+
<Stack
68+
direction="row"
69+
spacing={1}
70+
useFlexGap
71+
alignItems={"center"}
72+
justifyContent={"flex-end"}
73+
>
74+
<IconButton
75+
color="primary"
76+
aria-label="edit env"
77+
component="label"
78+
onClick={() => {
79+
setCurrentEnv({ name: env.name, value: env.value });
80+
setEnvs(
81+
envs.filter((item) => item.name !== env.name)
82+
);
83+
}}
84+
>
85+
<Iconify icon="mdi:pencil" />
86+
</IconButton>
87+
88+
<IconButton
89+
color="error"
90+
aria-label="delete env"
91+
component="label"
92+
onClick={() =>
93+
setEnvs(envs.filter((item) => item.name !== env.name))
94+
}
95+
>
96+
<Iconify icon="mdi:delete" />
97+
</IconButton>
98+
</Stack>
99+
</TableCell>
100+
</TableRow>
101+
))}
102+
103+
<TableRow
104+
sx={{
105+
"&:last-child td, &:last-child th": { border: 0 },
106+
}}
107+
>
108+
<TableCell component="th" scope="row">
109+
<TextField
110+
label={t("admin-name")}
111+
variant="outlined"
112+
value={currentEnv.name}
113+
onChange={(e) => {
114+
setCurrentEnv({ ...currentEnv, name: e.target.value });
115+
}}
116+
/>
117+
</TableCell>
118+
<TableCell>
119+
<TextField
120+
label={t("create-deployment-env-value")}
121+
variant="outlined"
122+
value={currentEnv.value}
123+
onChange={(e) => {
124+
setCurrentEnv({ ...currentEnv, value: e.target.value });
125+
}}
126+
fullWidth
127+
/>
128+
</TableCell>
129+
<TableCell align="right">
130+
<IconButton
131+
color="primary"
132+
component="label"
133+
disabled={
134+
!(currentEnv.name != "" && currentEnv.value != "")
135+
}
136+
onClick={() => {
137+
if (!(currentEnv.name != "" && currentEnv.value != ""))
138+
return;
139+
140+
setEnvs([...envs, currentEnv]);
141+
142+
setCurrentEnv({ name: "", value: "" });
143+
}}
144+
>
145+
<Iconify icon="mdi:content-save" />
146+
</IconButton>
147+
</TableCell>
148+
</TableRow>
149+
</TableBody>
150+
</Table>
151+
</TableContainer>
152+
</CardContent>
153+
</Card>
154+
);
155+
}

0 commit comments

Comments
 (0)