Skip to content

Commit 6791c2a

Browse files
PhilleziPhillezi
committed
change dra gpu selection style
1 parent 8f97c9b commit 6791c2a

4 files changed

Lines changed: 65 additions & 40 deletions

File tree

‎bun.lockb‎

5.5 KB
Binary file not shown.

‎src/contexts/ResourceContext.tsx‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,8 @@ import {
2828
import { listGpuGroups } from "../api/deploy/gpuGroups";
2929
import { listGpuLeases } from "../api/deploy/gpuLeases";
3030
import { listMigrations } from "../api/deploy/resourceMigrations";
31+
import { GpuClaimRead } from "../temporaryTypesRemoveMe";
32+
import { listGpuClaims } from "../api/deploy/gpuClaims";
3133

3234
type ResourceContextType = {
3335
rows: Resource[];
@@ -52,6 +54,7 @@ type ResourceContextType = {
5254
setGpuGroups: (gpuGroups: GpuGroupRead[]) => void;
5355
gpuLeases: GpuLeaseRead[];
5456
setGpuLeases: (gpuLeases: GpuLeaseRead[]) => void;
57+
gpuClaims: GpuClaimRead[] | undefined;
5558
resourceMigrations: ResourceMigrationRead[];
5659
setResourceMigrations: (resourceMigrations: ResourceMigrationRead[]) => void;
5760
queueJob: (job: Job) => void;
@@ -87,6 +90,7 @@ const initialState: ResourceContextType = {
8790
setGpuGroups: () => {},
8891
gpuLeases: new Array<GpuLeaseRead>(),
8992
setGpuLeases: () => {},
93+
gpuClaims: new Array<GpuClaimRead>(),
9094
resourceMigrations: new Array<ResourceMigrationRead>(),
9195
setResourceMigrations: () => {},
9296
queueJob: () => {},
@@ -124,6 +128,7 @@ export const ResourceContextProvider = ({
124128
const [zones, setZones] = useState<Zone[]>([]);
125129
const [gpuGroups, setGpuGroups] = useState<GpuGroupRead[]>([]);
126130
const [gpuLeases, setGpuLeases] = useState<GpuLeaseRead[]>([]);
131+
const [gpuClaims, setGpuClaims] = useState<GpuClaimRead[]>([]);
127132
const [resourceMigrations, setResourceMigrations] = useState<
128133
ResourceMigrationRead[]
129134
>([]);
@@ -253,6 +258,20 @@ export const ResourceContextProvider = ({
253258
}
254259
};
255260

261+
const loadGpuClaims = async () => {
262+
if (!(initialized && keycloak.authenticated && keycloak.token)) return;
263+
try {
264+
const gpuClaims = await listGpuClaims(keycloak.token);
265+
setGpuLeases(gpuClaims);
266+
} catch (error: any) {
267+
errorHandler(error).forEach((e) =>
268+
enqueueSnackbar("Error fetching GPU claims: " + e, {
269+
variant: "error",
270+
})
271+
);
272+
}
273+
};
274+
256275
const loadResourceMigrations = async () => {
257276
if (!(initialized && keycloak.authenticated && keycloak.token)) return;
258277
try {
@@ -391,6 +410,7 @@ export const ResourceContextProvider = ({
391410
loadZones();
392411
loadGpuGroups();
393412
loadGpuLeases();
413+
loadGpuClaims();
394414
loadResourceMigrations();
395415

396416
// eslint-disable-next-line
@@ -440,6 +460,7 @@ export const ResourceContextProvider = ({
440460
setGpuGroups,
441461
gpuLeases,
442462
setGpuLeases,
463+
gpuClaims,
443464
resourceMigrations,
444465
setResourceMigrations,
445466
queueJob,

‎src/pages/edit/Specs.tsx‎

Lines changed: 44 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import {
2+
Autocomplete,
23
Button,
34
Card,
45
CardActions,
@@ -33,7 +34,7 @@ export const Specs = ({ resource }: { resource: Resource }) => {
3334
const theme: CustomTheme = useTheme();
3435
const { initialized, keycloak } = useKeycloak();
3536

36-
const { user, queueJob } = useResource();
37+
const { user, queueJob, zones, gpuClaims } = useResource();
3738

3839
const STEP_DEPLOYMENT = 0.2;
3940
const MIN_CPU_DEPLOYMENT = 0.2;
@@ -67,8 +68,19 @@ export const Specs = ({ resource }: { resource: Resource }) => {
6768
return resource.specs.ram || 0;
6869
};
6970

71+
const gpuEnabledZone =
72+
resource.type === "deployment" &&
73+
resource.zone &&
74+
zones
75+
.find(
76+
(zone) =>
77+
zone.name === resource.zone &&
78+
zone.capabilities.includes(resource.type)
79+
)
80+
?.capabilities.includes("dra");
81+
7082
const getInitialGPUs = () =>
71-
resource.type === "deployment" ? resource.specs.gpus : undefined;
83+
gpuEnabledZone ? resource.specs.gpus : undefined;
7284

7385
const [cpu, setCpu] = useState<number>(getInitialCpu());
7486
const [ram, setRam] = useState<number>(getInitialRam());
@@ -114,11 +126,7 @@ export const Specs = ({ resource }: { resource: Resource }) => {
114126
};
115127

116128
const validateGPU = (gpu: DeploymentGPU): boolean =>
117-
!!gpu.name &&
118-
Boolean(
119-
(gpu.templateName && !gpu.claimName) ||
120-
(!gpu.templateName && gpu.claimName)
121-
);
129+
!!gpu.name && Boolean(gpu.claimName);
122130

123131
useEffect(() => {
124132
if (user) {
@@ -395,14 +403,7 @@ export const Specs = ({ resource }: { resource: Resource }) => {
395403
>
396404
<span style={{ opacity: 0.8 }}>GPU:</span>
397405
<b>{gpu.name}</b>
398-
{gpu.claimName ||
399-
(gpu.templateName && (
400-
<span
401-
style={{ opacity: 0.6, fontSize: "0.8rem" }}
402-
>
403-
({gpu.claimName || gpu.templateName})
404-
</span>
405-
))}
406+
{gpu.claimName}
406407
</span>
407408
}
408409
/>
@@ -627,7 +628,7 @@ export const Specs = ({ resource }: { resource: Resource }) => {
627628
)}
628629

629630
{/* GPUs */}
630-
{resource.type === "deployment" && (
631+
{gpuEnabledZone && (
631632
<>
632633
<Grid
633634
container
@@ -685,10 +686,13 @@ export const Specs = ({ resource }: { resource: Resource }) => {
685686
startIcon={<AddCircleOutline />}
686687
variant="outlined"
687688
size="small"
689+
disabled={
690+
gpuClaims == undefined || gpuClaims.length < 1
691+
}
688692
onClick={() =>
689693
setGpus((prev) => [
690694
...(prev || []),
691-
{ name: "", templateName: "", claimName: "" },
695+
{ name: "", claimName: "" },
692696
])
693697
}
694698
>
@@ -751,7 +755,7 @@ export const Specs = ({ resource }: { resource: Resource }) => {
751755
p: 2,
752756
}}
753757
>
754-
<TextField
758+
{/*<TextField
755759
label={t("deployment-gpu-name")}
756760
value={gpu.name}
757761
onChange={(e) =>
@@ -760,30 +764,31 @@ export const Specs = ({ resource }: { resource: Resource }) => {
760764
required
761765
size="small"
762766
sx={{ flex: 1 }}
763-
/>
764-
<TextField
765-
label={t(
766-
"deployment-gpu-resourceclaimtemplate-name"
767-
)}
768-
value={gpu.templateName ?? ""}
769-
onChange={(e) =>
767+
/>*/}
768+
<Autocomplete
769+
fullWidth
770+
value={gpu.claimName || ""}
771+
onChange={(_, newValue) => {
770772
handleChange(
771773
index,
772-
"templateName",
773-
e.target.value
774-
)
775-
}
776-
size="small"
777-
sx={{ flex: 1 }}
778-
/>
779-
<TextField
780-
label={t("deployment-gpu-resourceclaim-name")}
781-
value={gpu.claimName ?? ""}
782-
onChange={(e) =>
783-
handleChange(index, "claimName", e.target.value)
774+
"claimName",
775+
newValue ? newValue : ""
776+
);
777+
}}
778+
options={gpuClaims?.map((c) => c.name) || []}
779+
getOptionLabel={(option) => option}
780+
renderInput={(params) => (
781+
<TextField
782+
{...params}
783+
label={t("deployment-gpu-resourceclaim-name")}
784+
size="small"
785+
sx={{ flex: 1 }}
786+
/>
787+
)}
788+
isOptionEqualToValue={(option, value) =>
789+
option === value
784790
}
785-
size="small"
786-
sx={{ flex: 1 }}
791+
disableClearable
787792
/>
788793
<Tooltip title={t("deployment-gpu-remove")}>
789794
<IconButton

‎src/types.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ export interface Vm extends V2VmRead {
2020

2121
export interface DeploymentGPU {
2222
name: string;
23-
templateName?: string;
2423
claimName?: string;
2524
}
2625

0 commit comments

Comments
 (0)