diff --git a/app/components/Table.tsx b/app/components/Table.tsx index 5af1eb2a6..b3842a6f0 100644 --- a/app/components/Table.tsx +++ b/app/components/Table.tsx @@ -9,6 +9,7 @@ import Button from "~/components/Button"; import DelayedMount from "~/components/DelayedMount"; import Empty from "~/components/Empty"; import Flex from "~/components/Flex"; +import NudeButton from "~/components/NudeButton"; import PlaceholderText from "~/components/PlaceholderText"; export type Props = { @@ -243,6 +244,7 @@ const SortWrapper = styled(Flex)<{ $sortable: boolean }>` height: 24px; user-select: none; border-radius: 4px; + white-space: nowrap; margin: 0 -4px; padding: 0 4px; @@ -253,7 +255,7 @@ const SortWrapper = styled(Flex)<{ $sortable: boolean }>` `; const Cell = styled.td` - padding: 8px 6px; + padding: 10px 6px; border-bottom: 1px solid ${(props) => props.theme.divider}; font-size: 14px; @@ -267,6 +269,13 @@ const Cell = styled.td` text-align: right; vertical-align: bottom; } + + ${NudeButton} { + &:hover, + &[aria-expanded="true"] { + background: ${(props) => props.theme.sidebarControlHoverBackground}; + } + } `; const Row = styled.tr` @@ -289,7 +298,7 @@ const Head = styled.th` text-align: left; position: sticky; top: 54px; - padding: 6px; + padding: 6px 6px 0; border-bottom: 1px solid ${(props) => props.theme.divider}; background: ${(props) => props.theme.background}; transition: ${(props) => props.theme.backgroundTransition}; diff --git a/app/scenes/Settings/Shares.tsx b/app/scenes/Settings/Shares.tsx index 99c03a38f..c9bae0811 100644 --- a/app/scenes/Settings/Shares.tsx +++ b/app/scenes/Settings/Shares.tsx @@ -58,7 +58,12 @@ function Shares() { React.useEffect(() => { // sort the resulting data by the original order from the server - setData(sortBy(shares.orderedData, (item) => shareIds.indexOf(item.id))); + setData( + sortBy( + shares.orderedData.filter((item) => shareIds.includes(item.id)), + (item) => shareIds.indexOf(item.id) + ) + ); }, [shares.orderedData, shareIds]); return ( @@ -88,8 +93,6 @@ function Shares() { -

{t("Shared documents")}

- - value ? : null + value ? ( + + + + ) : null ), }, canManage @@ -67,7 +72,9 @@ function SharesTable({ canManage, ...rest }: Props) { disableSortBy: true, Cell: observer( ({ row }: { value: string; row: { original: Share } }) => ( - + + + ) ), }