Proper spacing is added

Author: UdayRajSahai2

app/[locale]/dashboard/[entityType]/[entitySlug]/usecases/edit/[id]/metadata/page.tsx

@@ -483,8 +483,10 @@ const Metadata = () => {
           <div className="w-full py-4 pr-4 sm:w-1/2 md:w-1/2 lg:w-1/2 xl:w-1/2">
             <Combobox
               displaySelected
-              label="SDG Goals *"
+              label="SDG Goals"
               name="sdgs"
+              required
+              requiredIndicator={true}
               list={
                 getSDGsList?.data?.sdgs?.map((item: any) => {
                   const num = item.number 
@@ -503,7 +505,7 @@ const Metadata = () => {
               }}
             />
           </div>
-          <div className="w-full py-4 pr-4 sm:w-1/2 md:w-1/2 lg:w-1/2 xl:w-1/2">
+          <div className="w-full py-4 pl-2 pr-4 sm:w-1/2 md:w-1/2 lg:w-1/2 xl:w-1/2">
             <Combobox
               displaySelected
               name="tags"
@@ -527,8 +529,10 @@ const Metadata = () => {
           <div className="w-full py-4 pr-4 sm:w-1/2 md:w-1/2 lg:w-1/2 xl:w-1/2">
             <Combobox
               displaySelected
-              label="Sectors *"
+              label="Sectors"
               name="sectors"
+              required
+              requiredIndicator={true}
               list={
                 getSectorsList?.data.sectors?.map((item: TypeSector) => ({
                   label: item.name,
@@ -541,22 +545,24 @@ const Metadata = () => {
                 handleSave({ ...formData, sectors: value });
               }}
             />
-            <Combobox
-              displaySelected
-              label="Geographies"
-              name="geographies"
-              list={
-                getGeographiesList?.data?.geographies?.map((item: any) => ({
-                  label: `${item.name}${item.parentId ? ` (${item.parentId.name})` : ''}`,
-                  value: item.id,
-                })) || []
-              }
-              selectedValue={formData.geographies}
-              onChange={(value) => {
-                handleChange('geographies', value);
-                handleSave({ ...formData, geographies: value });
-              }}
-            />
+            <div className="mt-8 w-full">
+              <Combobox
+                displaySelected
+                label="Geographies"
+                name="geographies"
+                list={
+                  getGeographiesList?.data?.geographies?.map((item: any) => ({
+                    label: `${item.name}${item.parentId ? ` (${item.parentId.name})` : ''}`,
+                    value: item.id,
+                  })) || []
+                }
+                selectedValue={formData.geographies}
+                onChange={(value) => {
+                  handleChange('geographies', value);
+                  handleSave({ ...formData, geographies: value });
+                }}
+              />
+            </div>
           </div>
         </div>
 

package.json

@@ -40,7 +40,7 @@
     "next-auth": "^4.24.7",
     "next-intl": "^3.4.0",
     "nuqs": "^2.0.0",
-    "opub-ui": "^0.4.41",
+    "opub-ui": "^0.4.42",
     "react": "^19.2.0",
     "react-aria": "^3.36.0",
     "react-dom": "^19.2.0",