Merge pull request #6 from commercelayer/update-actions

Update actions UI
commercelayer · Apr 23, 2024 · fff7232 · fff7232
2 parents 828401c + 2f4434f
commit fff7232
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 4 deletions.
diff --git a/packages/app/src/components/PriceTiers.tsx b/packages/app/src/components/PriceTiers.tsx
@@ -76,8 +76,17 @@ export const PriceTiers: FC<Props> = ({
               priceListId,
               priceId: price.id
             })}
+            asChild
           >
-            Add tier
+            <Button
+              variant='secondary'
+              size='mini'
+              alignItems='center'
+              aria-label='Add tier'
+            >
+              <Icon name='plus' />
+              Tier
+            </Button>
           </Link>
         )
       }

diff --git a/packages/app/src/pages/Home.tsx b/packages/app/src/pages/Home.tsx
@@ -5,6 +5,7 @@ import {
   Button,
   EmptyState,
   HomePageLayout,
+  Icon,
   useResourceFilters,
   useTokenProvider
 } from '@commercelayer/app-elements'
@@ -79,7 +80,17 @@ export function Home(): JSX.Element {
         }
         actionButton={
           canUser('create', 'price_lists') ? (
-            <Link href={appRoutes.priceListNew.makePath({})}>Add new</Link>
+            <Link href={appRoutes.priceListNew.makePath({})} asChild>
+              <Button
+                variant='secondary'
+                size='mini'
+                alignItems='center'
+                aria-label='Add price list'
+              >
+                <Icon name='plus' />
+                Price list
+              </Button>
+            </Link>
           ) : undefined
         }
       />

diff --git a/packages/app/src/pages/PriceDetails.tsx b/packages/app/src/pages/PriceDetails.tsx
@@ -4,6 +4,7 @@ import {
   DropdownDivider,
   DropdownItem,
   EmptyState,
+  Icon,
   PageLayout,
   SkeletonTemplate,
   Spacer,
@@ -93,6 +94,11 @@ export function PriceDetails(): JSX.Element {
 
   const contextMenu = (
     <Dropdown
+      dropdownLabel={
+        <Button variant='secondary' size='small'>
+          <Icon name='dotsThree' size={16} weight='bold' />
+        </Button>
+      }
       dropdownItems={
         <>
           {contextMenuEdit}

diff --git a/packages/app/src/pages/PricesList.tsx b/packages/app/src/pages/PricesList.tsx
@@ -9,6 +9,7 @@ import {
   DropdownDivider,
   DropdownItem,
   EmptyState,
+  Icon,
   PageLayout,
   SkeletonTemplate,
   useCoreSdkProvider,
@@ -95,6 +96,11 @@ export function PricesList(): JSX.Element {
 
   const contextMenu = (
     <Dropdown
+      dropdownLabel={
+        <Button variant='secondary' size='small'>
+          <Icon name='dotsThree' size={16} weight='bold' />
+        </Button>
+      }
       dropdownItems={
         <>
           {contextMenuEdit}
@@ -153,8 +159,16 @@ export function PricesList(): JSX.Element {
         }}
         actionButton={
           canUser('create', 'prices') && (
-            <Link href={appRoutes.priceNew.makePath({ priceListId })}>
-              Add new
+            <Link href={appRoutes.priceNew.makePath({ priceListId })} asChild>
+              <Button
+                variant='secondary'
+                size='mini'
+                alignItems='center'
+                aria-label='Add price'
+              >
+                <Icon name='plus' />
+                Price
+              </Button>
             </Link>
           )
         }