Просмотр исходного кода

Added pointer when row has onClick function

jnfrati 4 лет назад
Родитель
Сommit
2a151a40a6
1 измененных файлов с 11 добавлено и 3 удалено
  1. 11 3
      dashboard/src/components/Table.tsx

+ 11 - 3
dashboard/src/components/Table.tsx

@@ -82,6 +82,7 @@ const Table: React.FC<TableProps> = ({
           return (
             <StyledTr
               {...row.getRowProps()}
+              enablePointer={!!onRowClick}
               onClick={() => onRowClick && onRowClick(row)}
               selected={false}
             >
@@ -129,14 +130,21 @@ const TableWrapper = styled.div`
   padding-bottom: 20px;
 `;
 
+type StyledTrProps = {
+  enablePointer?: boolean;
+  disableHover?: boolean;
+  selected?: boolean;
+};
+
 export const StyledTr = styled.tr`
   line-height: 2.2em;
-  background: ${(props: { disableHover?: boolean; selected?: boolean }) =>
-    props.selected ? "#ffffff11" : ""};
+  background: ${(props: StyledTrProps) => (props.selected ? "#ffffff11" : "")};
   :hover {
-    background: ${(props: { disableHover?: boolean; selected?: boolean }) =>
+    background: ${(props: StyledTrProps) =>
       props.disableHover ? "" : "#ffffff22"};
   }
+  cursor: ${(props: StyledTrProps) =>
+    props.enablePointer ? "pointer" : "unset"};
 `;
 
 export const StyledTd = styled.td`