chore: remove useless RelationshipCheckboxWrapper

commercelayer · Aug 16, 2023 · 4c6cde1 · 4c6cde1
1 parent b1bfd2b
commit 4c6cde1
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 45 deletions.
diff --git a/packages/app-elements/src/ui/internals/RelationshipCheckboxWrapper.tsx b/packages/app-elements/src/ui/internals/RelationshipCheckboxWrapper.tsx
diff --git a/packages/app-elements/src/ui/resources/RelationshipSelector/Checkbox.tsx b/packages/app-elements/src/ui/resources/RelationshipSelector/Checkbox.tsx
@@ -25,17 +25,19 @@ export function Checkbox({
   const isLoading = item.value === '' // is mock
   return (
     <SkeletonTemplate isLoading={isLoading} delayMs={0}>
-      <InputCheckbox
-        onChange={onChange}
-        checked={checked}
-        icon={
-          showIcon != null && showIcon ? (
-            <AvatarLetter text={item.label} />
-          ) : undefined
-        }
-      >
-        <Text weight='semibold'>{item.label}</Text>
-      </InputCheckbox>
+      <div className='p-3 hover:bg-gray-50 mb-[1px] last:mb-0'>
+        <InputCheckbox
+          onChange={onChange}
+          checked={checked}
+          icon={
+            showIcon != null && showIcon ? (
+              <AvatarLetter text={item.label} />
+            ) : undefined
+          }
+        >
+          <Text weight='semibold'>{item.label}</Text>
+        </InputCheckbox>
+      </div>
     </SkeletonTemplate>
   )
 }

diff --git a/packages/app-elements/src/ui/resources/RelationshipSelector/FullList.tsx b/packages/app-elements/src/ui/resources/RelationshipSelector/FullList.tsx
@@ -4,7 +4,6 @@ import { SkeletonTemplate } from '#ui/atoms/SkeletonTemplate'
 import { Spacer } from '#ui/atoms/Spacer'
 import { Text } from '#ui/atoms/Text'
 import { SearchBar } from '#ui/composite/SearchBar'
-import { RelationshipCheckboxWrapper } from '#ui/internals/RelationshipCheckboxWrapper'
 import { ResourceList } from '#ui/resources/ResourceList'
 import { type ListableResourceType } from '@commercelayer/sdk/lib/cjs/api'
 import { type QueryFilter } from '@commercelayer/sdk/lib/cjs/query'
@@ -157,16 +156,14 @@ export function FullList({
               fieldForValue
             })
             return (
-              <RelationshipCheckboxWrapper>
-                <Checkbox
-                  item={item}
-                  checked={values.includes(item.value)}
-                  onChange={() => {
-                    toggleValue(item.value)
-                  }}
-                  showIcon={showCheckboxIcon}
-                />
-              </RelationshipCheckboxWrapper>
+              <Checkbox
+                item={item}
+                checked={values.includes(item.value)}
+                onChange={() => {
+                  toggleValue(item.value)
+                }}
+                showIcon={showCheckboxIcon}
+              />
             )
           }}
         />

diff --git a/packages/app-elements/src/ui/resources/RelationshipSelector/index.tsx b/packages/app-elements/src/ui/resources/RelationshipSelector/index.tsx
@@ -5,7 +5,6 @@ import { Card } from '#ui/atoms/Card'
 import { SkeletonTemplate } from '#ui/atoms/SkeletonTemplate'
 import { Spacer } from '#ui/atoms/Spacer'
 import { Text } from '#ui/atoms/Text'
-import { RelationshipCheckboxWrapper } from '#ui/internals/RelationshipCheckboxWrapper'
 import { type QueryParamsList } from '@commercelayer/sdk'
 import type { ListableResourceType } from '@commercelayer/sdk/lib/cjs/api'
 import { type QueryFilter } from '@commercelayer/sdk/lib/cjs/query'
@@ -108,16 +107,15 @@ export function RelationshipSelector({
       <Card gap='1'>
         {list.map((item, idx) => {
           return (
-            <RelationshipCheckboxWrapper key={`${item.value}-${idx}`}>
-              <Checkbox
-                item={item}
-                checked={values.includes(item.value)}
-                onChange={() => {
-                  toggleValue(item.value)
-                }}
-                showIcon={showCheckboxIcon}
-              />
-            </RelationshipCheckboxWrapper>
+            <Checkbox
+              key={`${item.value}-${idx}`}
+              item={item}
+              checked={values.includes(item.value)}
+              onChange={() => {
+                toggleValue(item.value)
+              }}
+              showIcon={showCheckboxIcon}
+            />
           )
         })}
       </Card>