diff --git a/app/ui/lib/Combobox.tsx b/app/ui/lib/Combobox.tsx
index d49237a016..a9c8a29e9e 100644
--- a/app/ui/lib/Combobox.tsx
+++ b/app/ui/lib/Combobox.tsx
@@ -16,7 +16,7 @@ import {
 } from '@headlessui/react'
 import cn from 'classnames'
 import { matchSorter } from 'match-sorter'
-import { useState } from 'react'
+import { useId, useState } from 'react'
 
 import { SelectArrows6Icon } from '@oxide/design-system/icons/react'
 
@@ -81,7 +81,7 @@ export const Combobox = ({
   })
 
   const zIndex = usePopoverZIndex()
-
+  const id = useId()
   return (
     <>
       <HCombobox
@@ -93,17 +93,18 @@ export const Combobox = ({
         disabled={disabled || isLoading}
       >
         {label && (
-          // TODO: FieldLabel needs a real ID
           <div className="mb-2">
             <FieldLabel
-              id="FieldLabel"
+              id={`${id}-label`}
               as="div"
               tip={tooltipText}
               optional={!required && !hideOptionalTag}
             >
               <Label>{label}</Label>
             </FieldLabel>
-            {description && <TextInputHint id="TextInputHint">{description}</TextInputHint>}
+            {description && (
+              <TextInputHint id={`${id}-help-text`}>{description}</TextInputHint>
+            )}
           </div>
         )}
         <ComboboxButton
diff --git a/app/ui/lib/Listbox.tsx b/app/ui/lib/Listbox.tsx
index a910d4bbeb..eca55b7f7a 100644
--- a/app/ui/lib/Listbox.tsx
+++ b/app/ui/lib/Listbox.tsx
@@ -13,7 +13,7 @@ import {
   ListboxOptions,
 } from '@headlessui/react'
 import cn from 'classnames'
-import { type ReactNode, type Ref } from 'react'
+import { useId, type ReactNode, type Ref } from 'react'
 
 import { SelectArrows6Icon } from '@oxide/design-system/icons/react'
 
@@ -70,7 +70,7 @@ export const Listbox = <Value extends string = string>({
   const noItems = !isLoading && items.length === 0
   const isDisabled = disabled || noItems
   const zIndex = usePopoverZIndex()
-
+  const id = useId()
   return (
     <div className={cn('relative', className)}>
       <HListbox
@@ -86,14 +86,16 @@ export const Listbox = <Value extends string = string>({
             {label && (
               <div className="mb-2">
                 <FieldLabel
-                  id={``}
+                  id={`${id}-label`}
                   as="div"
                   tip={tooltipText}
                   optional={!required && !hideOptionalTag}
                 >
                   <Label>{label}</Label>
                 </FieldLabel>
-                {description && <TextInputHint id={``}>{description}</TextInputHint>}
+                {description && (
+                  <TextInputHint id={`${id}-help-text`}>{description}</TextInputHint>
+                )}
               </div>
             )}
             <ListboxButton