asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

fix(admin-ui): table action gap (#3386)

Browse Source 
* add gap in table actions

* add changeset

* Update .changeset/light-frogs-smoke.md

Co-authored-by: Kasper Fabricius Kristensen <45367945+kasperkristensen@users.noreply.github.com>

---------

Co-authored-by: Kasper Fabricius Kristensen <45367945+kasperkristensen@users.noreply.github.com>
Co-authored-by: Oliver Windall Juhl <59018053+olivermrbl@users.noreply.github.com>
This commit is contained in:
Philip Korsholm
2023-03-07 13:14:14 +01:00
committed by GitHub
parent b4eba69911
commit 06f567f446
3 changed files with 25 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
packages/admin-ui/ui/src/components/molecules/table/index.tsx
View File

@@ -1,13 +1,11 @@
import clsx from "clsx"
import React from "react"
import { useNavigate } from "react-router-dom"
import Spinner from "../../atoms/spinner"
import ArrowLeftIcon from "../../fundamentals/icons/arrow-left-icon"
import ArrowRightIcon from "../../fundamentals/icons/arrow-right-icon"
import SortingIcon from "../../fundamentals/icons/sorting-icon"
import Actionables, { ActionType } from "../../molecules/actionables"
import FilteringOptions, { FilteringOptionProps } from "./filtering-option"
import React from "react"
import SortingIcon from "../../fundamentals/icons/sorting-icon"
import TableSearch from "./table-search"
import clsx from "clsx"
import { useNavigate } from "react-router-dom"
type TableRowProps = React.HTMLAttributes<HTMLTableRowElement> & {
forceDropdown?: boolean
@@ -73,9 +71,9 @@ const Table = React.forwardRef<HTMLTableElement, TableProps>(
return (
<div className={`flex flex-col ${containerClassName}`}>
<div className="w-full flex justify-between mb-2">
<div className="mb-2 flex w-full justify-between">
{filteringOptions ? (
<div className="flex mb-2 self-end">
<div className="mb-2 flex self-end">
{Array.isArray(filteringOptions)
? filteringOptions.map((fo) => <FilteringOptions {...fo} />)
: filteringOptions}
@@ -83,7 +81,7 @@ const Table = React.forwardRef<HTMLTableElement, TableProps>(
) : (
<span aria-hidden />
)}
<div className="flex items-center">
<div className="gap-x-xsmall flex items-center">
{tableActions && <div>{tableActions}</div>}
{enableSearch && (
<TableSearch
@@ -116,7 +114,7 @@ Table.Head = React.forwardRef<
<thead
ref={ref}
className={clsx(
"whitespace-nowrap inter-small-semibold text-grey-50 border-t border-b border-grey-20",
"inter-small-semibold text-grey-50 border-grey-20 whitespace-nowrap border-t border-b",
className
)}
{...props}
@@ -138,7 +136,7 @@ Table.HeadCell = React.forwardRef<
HTMLTableCellElement,
React.HTMLAttributes<HTMLTableCellElement>
>(({ className, children, ...props }, ref) => (
<th ref={ref} className={clsx("text-left h-[40px]", className)} {...props}>
<th ref={ref} className={clsx("h-[40px] text-left", className)} {...props}>
{children}
</th>
))
@@ -159,9 +157,9 @@ Table.SortingHeadCell = React.forwardRef<
ref
) => {
return (
<th ref={ref} className={clsx("text-left py-2.5", className)} {...props}>
<th ref={ref} className={clsx("py-2.5 text-left", className)} {...props}>
<div
className="flex items-center cursor-pointer select-none"
className="flex cursor-pointer select-none items-center"
onClick={(e) => {
e.preventDefault()
if (!sortDirection) {
@@ -225,9 +223,9 @@ Table.Row = React.forwardRef<HTMLTableRowElement, TableRowProps>(
<tr
ref={ref}
className={clsx(
"inter-small-regular border-t border-b border-grey-20 text-grey-90",
"inter-small-regular border-grey-20 text-grey-90 border-t border-b",
className,
{ "cursor-pointer hover:bg-grey-5": linkTo !== undefined }
{ "hover:bg-grey-5 cursor-pointer": linkTo !== undefined }
)}
{...props}
{...(linkTo && {