Pagination button at DatabaseDetails page doesn't work

[dechoma]

Affected module
UI

Describe the bug
Clicking on the pagination button, [Previous/Next], at the DatabaseDetails page does not trigger any action, so it doesn't allow the user to paginate through the database schemas list.

pagination_error.mov

To Reproduce

Ingest 20 database schemas under a single db, and try to paginate through them via the Previous/Next button from the UI

Expected behavior
Paginate button Previous/Next should allow the user to paginate through the database schema list.

Version:

• OS: iOS
• Python version:
• OpenMetadata version: 1.2.0
• OpenMetadata Ingestion package version: openmetadata-ingestion[docker]==1.2.0.1

Additional context
It seems that in the DatabaseDetailsPage.tsx file, this line: Boolean(searchSchema) is setting the isNumberBased flag in the NextPrevious component to true.

 const searchSchema = async (
    searchValue: string,
    pageNumber = INITIAL_PAGING_VALUE
  ) => {.....}

const databaseTable = useMemo(
    () =>
      getDatabaseSchemaTable(
        schemaData,
        schemaDataLoading,
        databaseSchemaPaging,
        currentPage,
        databaseSchemaPagingHandler,
        Boolean(searchSchema)
      ),
    [
      schemaData,
      schemaDataLoading,
      databaseSchemaPaging,
      currentPage,
      databaseSchemaPagingHandler,
      searchSchema,
    ]
  );

export const getDatabaseSchemaTable = (
  schemaData: DatabaseSchema[],
  schemaDataLoading: boolean,
  databaseSchemaPaging: Paging,
  currentPage: number,
  databaseSchemaPagingHandler: NextPreviousProps['pagingHandler'],
  isNumberBased = false
) => {
  return (
    <Col span={24}>
      <Space className="w-full m-b-md" direction="vertical" size="middle">
        <Table
          bordered
          columns={schemaTableColumns}
          data-testid="database-databaseSchemas"
          dataSource={schemaData}
          loading={schemaDataLoading}
          locale={{
            emptyText: <ErrorPlaceHolder className="m-y-md" />,
          }}
          pagination={false}
          rowKey="id"
          size="small"
        />
        {databaseSchemaPaging.total > PAGE_SIZE && (
          <NextPrevious
            currentPage={currentPage}
            isNumberBased={isNumberBased}
            pageSize={PAGE_SIZE}
            paging={databaseSchemaPaging}
            pagingHandler={databaseSchemaPagingHandler}
          />
        )}
      </Space>
    </Col>

When the isNumberBased flag is set to true in the NextPrevious pagination component, then cursorType is not passed to pagingHandler.

  const onNextHandler = () => {
    if (isNumberBased) {
      pagingHandler({ currentPage: currentPage + 1 });
    } else {
      pagingHandler({
        cursorType: CursorType.AFTER,
        currentPage: currentPage + 1,
      });
    }
  };

When no cursorType type object is passed to databaseSchemaPagingHandler, the databaseSchemaPagingHandler logic is disabled.

  const databaseSchemaPagingHandler = ({
    cursorType,
    currentPage,
  }: PagingHandlerParams) => {
    if (cursorType) {
      if (isString(cursorType)) {
        const pagingString = `&${cursorType}=${
          databaseSchemaPaging[cursorType as keyof typeof databaseSchemaPaging]
        }`;
        setSchemaDataLoading(true);
        fetchDatabaseSchemas(pagingString).finally(() => {
          setSchemaDataLoading(false);
        });
        setCurrentPage(currentPage);
      } else {
        setCurrentPage(cursorType);
        searchValue && searchSchema(searchValue, cursorType);
      }
    }
  };

[harshach]

Thanks @dechoma for filing the issue.
@chirag-madlani @karanh37 can we take a look for 1.2.1