From a9f515e144c0c8b4ac672f57e5ba0ca3a0c885f2 Mon Sep 17 00:00:00 2001
From: Mathias Oterhals Myklebust <mom@variant.no>
Date: Tue, 3 Sep 2024 13:53:25 +0200
Subject: [PATCH] fix(soMeInputs): add missing label identifiers

---
 studio/components/SoMeInputs.tsx | 20 +++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/studio/components/SoMeInputs.tsx b/studio/components/SoMeInputs.tsx
index d6912bb98..8c627a59f 100644
--- a/studio/components/SoMeInputs.tsx
+++ b/studio/components/SoMeInputs.tsx
@@ -45,12 +45,19 @@ const SoMeInputs: React.FC<ObjectInputProps<Record<string, any>>> = ({
     onChange(set(newPlatform, ["platform"]));
   };
 
+  const urlInputName = "social-url-input";
+  const platformInputName = "social-platform-input";
+
   return (
     <Stack space={6}>
       <Box>
         <Stack space={3}>
-          <Label>URL</Label>
+          <Label htmlFor={urlInputName} as={"label"}>
+            URL
+          </Label>
           <TextInput
+            id={urlInputName}
+            name={urlInputName}
             value={value.url}
             onChange={handleUrlChange}
             placeholder="Enter URL"
@@ -59,8 +66,15 @@ const SoMeInputs: React.FC<ObjectInputProps<Record<string, any>>> = ({
       </Box>
       <Box>
         <Stack space={3}>
-          <Label>Platform</Label>
-          <Select value={value.platform} onChange={handlePlatformChange}>
+          <Label htmlFor={platformInputName} as={"label"}>
+            Platform
+          </Label>
+          <Select
+            id={platformInputName}
+            name={platformInputName}
+            value={value.platform}
+            onChange={handlePlatformChange}
+          >
             <option value="">Select Platform</option>
             {Object.values(SoMePlatforms).map((platform) => (
               <option key={platform} value={platform}>