You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@superset.apache.org by GitBox <gi...@apache.org> on 2021/02/26 06:35:15 UTC

[GitHub] [superset] rusackas commented on a change in pull request #13277: test: Pagination component

rusackas commented on a change in pull request #13277:
URL: https://github.com/apache/superset/pull/13277#discussion_r583413307



##########
File path: superset-frontend/src/components/Pagination/index.tsx
##########
@@ -16,62 +16,16 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import React, { PureComponent } from 'react';
-import cx from 'classnames';
-import { styled } from '@superset-ui/core';
-
-interface PaginationButton {
-  disabled?: boolean;
-  onClick: React.EventHandler<React.SyntheticEvent<HTMLElement>>;
-}
-
-interface PaginationItemButton extends PaginationButton {
-  active: boolean;
-  children: React.ReactNode;
-}
-
-function Prev({ disabled, onClick }: PaginationButton) {
-  return (
-    <li className={cx({ disabled })}>
-      <span role="button" tabIndex={disabled ? -1 : 0} onClick={onClick}>
-        «
-      </span>
-    </li>
-  );
-}
-
-function Next({ disabled, onClick }: PaginationButton) {
-  return (
-    <li className={cx({ disabled })}>
-      <span role="button" tabIndex={disabled ? -1 : 0} onClick={onClick}>
-        »
-      </span>
-    </li>
-  );
-}
 
-function Item({ active, children, onClick }: PaginationItemButton) {
-  return (
-    <li className={cx({ active })}>
-      <span role="button" tabIndex={active ? -1 : 0} onClick={onClick}>
-        {children}
-      </span>
-    </li>
-  );
-}
-
-function Ellipsis({ disabled, onClick }: PaginationButton) {
-  return (
-    <li className={cx({ disabled })}>
-      <span role="button" tabIndex={disabled ? -1 : 0} onClick={onClick}>
-        …
-      </span>
-    </li>
-  );
-}
+import React from 'react';
+import { styled } from '@superset-ui/core';
+import { Next } from './Next';
+import { Prev } from './Prev';
+import { Item } from './Item';
+import { Ellipsis } from './Ellipsis';
 
 interface PaginationProps {
-  children: React.ReactNode;
+  children: JSX.Element | JSX.Element[];
 }
 
 const PaginationList = styled.ul`

Review comment:
       I see a bunch of pixel values in the styles here that should be changed to `gridUnit` but have no business holding up this PR, so I'll apply the `revisit: theme vars` label here to tackle later as a rainy day or onboarding task.




----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org