Revert "refactor: Remove usages of reactable from TimeTable (apache#1…

…1046)" This reverts commit 3654667.
CybercentreCanada · Oct 3, 2020 · b542a2b · b542a2b
1 parent 5debfbc
commit b542a2b
Show file tree

Hide file tree

Showing 4 changed files with 126 additions and 156 deletions.
diff --git a/superset-frontend/src/components/ListView/ListView.tsx b/superset-frontend/src/components/ListView/ListView.tsx
@@ -17,7 +17,6 @@
  * under the License.
  */
 import { t, styled } from '@superset-ui/core';
-import { css } from '@emotion/core';
 import React, { useState } from 'react';
 import { Alert } from 'react-bootstrap';
 import { Empty } from 'src/common/components';
@@ -38,11 +37,7 @@ import {
 } from './types';
 import { ListViewError, useListViewState } from './utils';
 
-interface ListViewStylesProps {
-  fullHeight: boolean;
-}
-
-const ListViewStyles = styled.div<ListViewStylesProps>`
+const ListViewStyles = styled.div`
   text-align: center;
 
   .superset-list-view {
@@ -53,12 +48,8 @@ const ListViewStyles = styled.div<ListViewStylesProps>`
     padding-bottom: 48px;
 
     .body {
-      ${({ fullHeight }) =>
-        !fullHeight &&
-        css`
-          overflow: scroll;
-          max-height: 64vh;
-        `};
+      overflow: scroll;
+      max-height: 64vh;
     }
   }
 
@@ -211,9 +202,6 @@ export interface ListViewProps<T extends object = any> {
   renderCard?: (row: T & { loading: boolean }) => React.ReactNode;
   cardSortSelectOptions?: Array<CardSortSelectOption>;
   defaultViewMode?: ViewModeType;
-  sticky?: boolean;
-  fullHeight?: boolean;
-  manualSortBy?: boolean;
 }
 
 function ListView<T extends object = any>({
@@ -233,9 +221,6 @@ function ListView<T extends object = any>({
   renderCard,
   cardSortSelectOptions,
   defaultViewMode = 'card',
-  sticky = true,
-  fullHeight = false,
-  manualSortBy = true,
 }: ListViewProps<T>) {
   const {
     getTableProps,
@@ -259,10 +244,8 @@ function ListView<T extends object = any>({
     initialPageSize,
     initialSort,
     initialFilters: filters,
-    manualSortBy,
   });
   const filterable = Boolean(filters.length);
-  const withPagination = Boolean(count);
   if (filterable) {
     const columnAccessors = columns.reduce(
       (acc, col) => ({ ...acc, [col.accessor || col.id]: true }),
@@ -283,7 +266,7 @@ function ListView<T extends object = any>({
   );
 
   return (
-    <ListViewStyles fullHeight={fullHeight}>
+    <ListViewStyles>
       <div className={`superset-list-view ${className}`}>
         <div className="header">
           {cardViewEnabled && (
@@ -367,7 +350,6 @@ function ListView<T extends object = any>({
               rows={rows}
               columns={columns}
               loading={loading}
-              sticky={sticky}
             />
           )}
           {!loading && rows.length === 0 && (
@@ -378,25 +360,23 @@ function ListView<T extends object = any>({
         </div>
       </div>
 
-      {withPagination && (
-        <div className="pagination-container">
-          <Pagination
-            totalPages={pageCount || 0}
-            currentPage={pageCount ? pageIndex + 1 : 0}
-            onChange={(p: number) => gotoPage(p - 1)}
-            hideFirstAndLastPageLinks
-          />
-          <div className="row-count-container">
-            {!loading &&
-              t(
-                '%s-%s of %s',
-                pageSize * pageIndex + (rows.length && 1),
-                pageSize * pageIndex + rows.length,
-                count,
-              )}
-          </div>
+      <div className="pagination-container">
+        <Pagination
+          totalPages={pageCount || 0}
+          currentPage={pageCount ? pageIndex + 1 : 0}
+          onChange={(p: number) => gotoPage(p - 1)}
+          hideFirstAndLastPageLinks
+        />
+        <div className="row-count-container">
+          {!loading &&
+            t(
+              '%s-%s of %s',
+              pageSize * pageIndex + (rows.length && 1),
+              pageSize * pageIndex + rows.length,
+              count,
+            )}
         </div>
-      )}
+      </div>
     </ListViewStyles>
   );
 }

diff --git a/superset-frontend/src/components/ListView/TableCollection.tsx b/superset-frontend/src/components/ListView/TableCollection.tsx
@@ -30,19 +30,14 @@ interface TableCollectionProps {
   rows: TableInstance['rows'];
   columns: TableInstance['column'][];
   loading: boolean;
-  sticky: boolean;
 }
 
-interface TableProps {
-  sticky: boolean;
-}
-
-const Table = styled.table<TableProps>`
+const Table = styled.table`
   border-collapse: separate;
 
   th {
     background: ${({ theme }) => theme.colors.grayscale.light5};
-    position: ${({ sticky }) => sticky && 'sticky'};
+    position: sticky;
     top: 0;
 
     &:first-of-type {
@@ -204,10 +199,9 @@ export default function TableCollection({
   columns,
   rows,
   loading,
-  sticky,
 }: TableCollectionProps) {
   return (
-    <Table {...getTableProps()} sticky={sticky} className="table table-hover">
+    <Table {...getTableProps()} className="table table-hover">
       <thead>
         {headerGroups.map(headerGroup => (
           <tr {...headerGroup.getHeaderGroupProps()}>

diff --git a/superset-frontend/src/components/ListView/utils.ts b/superset-frontend/src/components/ListView/utils.ts
@@ -110,7 +110,6 @@ interface UseListViewConfig {
     Header: (conf: any) => React.ReactNode;
     Cell: (conf: any) => React.ReactNode;
   };
-  manualSortBy: boolean;
 }
 
 export function useListViewState({
@@ -123,7 +122,6 @@ export function useListViewState({
   initialSort = [],
   bulkSelectMode = false,
   bulkSelectColumnConfig,
-  manualSortBy,
 }: UseListViewConfig) {
   const [query, setQuery] = useQueryParams({
     filters: JsonParam,
@@ -179,9 +177,9 @@ export function useListViewState({
       initialState,
       manualFilters: true,
       manualPagination: true,
+      manualSortBy: true,
       autoResetFilters: false,
       pageCount: Math.ceil(count / initialPageSize),
-      manualSortBy,
     },
     useFilters,
     useSortBy,