ClusterConfig() — ui Function Reference

Architecture documentation for the ClusterConfig() function in field-demo.tsx from the ui codebase.

Function tsx DocumentationAtlas SearchAPI

Entity Profile

DocumentationAtlas→ SearchAPI→ ClusterConfig() — ui Function Reference

Dependency Diagram

graph TD
  14808930_eb60_3061_202e_17407d1630b6["ClusterConfig()"]
  b9b36d9d_9701_6134_d4ee_41213e7f1788["field-demo.tsx"]
  14808930_eb60_3061_202e_17407d1630b6 -->|defined in| b9b36d9d_9701_6134_d4ee_41213e7f1788
  style 14808930_eb60_3061_202e_17407d1630b6 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/app/(internal)/sink/components/field-demo.tsx lines 828–966

function ClusterConfig() {
  return (
    <Card>
      <CardHeader>
        <CardTitle>Buy your cluster</CardTitle>
        <CardDescription>
          Need a custom setup? <a href="#">Contact us</a>.
        </CardDescription>
      </CardHeader>
      <CardContent>
        <form>
          <FieldGroup>
            <FieldSet>
              <FieldLegend>GPU Type</FieldLegend>
              <FieldDescription>
                Select the GPU type for your cluster.
              </FieldDescription>
              <RadioGroup defaultValue="h100">
                <FieldLabel htmlFor="h100-k9s">
                  <Field orientation="horizontal">
                    <RadioGroupItem value="h100" id="h100-k9s" />
                    <FieldContent>
                      <FieldTitle>NVIDIA H100</FieldTitle>
                      <FieldDescription>SXM5 80GB VRAM</FieldDescription>
                    </FieldContent>
                  </Field>
                </FieldLabel>
                <FieldLabel htmlFor="h200-m3v">
                  <Field orientation="horizontal">
                    <RadioGroupItem value="h200" id="h200-m3v" />
                    <FieldContent>
                      <FieldTitle>NVIDIA H200</FieldTitle>
                      <FieldDescription>SXM5 141GB VRAM</FieldDescription>
                    </FieldContent>
                  </Field>
                </FieldLabel>
              </RadioGroup>
            </FieldSet>
            <Field>
              <FieldLabel htmlFor="compute-environment-p8w">
                Compute Environment
              </FieldLabel>
              <RadioGroup defaultValue="kubernetes">
                <FieldLabel htmlFor="kubernetes-r2h">
                  <Field orientation="horizontal">
                    <RadioGroupItem value="kubernetes" id="kubernetes-r2h" />
                    <FieldContent>
                      <FieldTitle>Kubernetes</FieldTitle>
                      <FieldDescription>
                        Run GPU workloads on a K8s configured cluster.
                      </FieldDescription>
                    </FieldContent>
                  </Field>
                </FieldLabel>
                <FieldLabel htmlFor="vm-z4k">
                  <Field orientation="horizontal">
                    <RadioGroupItem value="vm" id="vm-z4k" />
                    <FieldContent>
                      <FieldTitle>Virtual Machine</FieldTitle>
                      <FieldDescription>
                        Access a VM configured cluster via SSH to run GPU
                        workloads.
                      </FieldDescription>
                    </FieldContent>
                  </Field>
                </FieldLabel>
              </RadioGroup>
            </Field>
            <Field>
              <FieldLabel htmlFor="number-of-gpus-f6l">
                Number of GPUs
              </FieldLabel>
              <FieldDescription>
                Buy a single node with 8 GPUs or many interconnected nodes. You
                can add more GPUs later.
              </FieldDescription>
              <ButtonGroup>
                <Input />
                <Button variant="outline" size="icon">
                  <IconMinus />
                </Button>