sts-sponsors team mailing list archive

[Jones Ogolo <mp+442634@xxxxxxxxxxxxxxxxxx>]

Review: Needs Fixing qa

A little bit og the message is still cut off on the tokens page and the bottom border also goes hidden when the error message is displayed, screenshot below
https://imgur.com/a/MADpezy

Diff comments:

> diff --git a/frontend/src/components/base/PaginationBar/PaginationBar.tsx b/frontend/src/components/base/PaginationBar/PaginationBar.tsx
> index 0c1eefe..69d8bb4 100644
> --- a/frontend/src/components/base/PaginationBar/PaginationBar.tsx
> +++ b/frontend/src/components/base/PaginationBar/PaginationBar.tsx
> @@ -49,28 +49,30 @@ const PaginationBar = ({
>  
>    return (
>      <section className="pagination-bar u-flex u-flex--justify-between u-flex--wrap">
> -      <strong className="pagination-bar__description">
> -        Showing {getDisplayedDataCount()} out of {totalItems} {dataContext}
> -      </strong>
> +      <div className="p-form p-form--inline">
> +        <strong className="pagination-bar__description">
> +          Showing {getDisplayedDataCount()} out of {totalItems} {dataContext}
> +        </strong>
>  
> -      <div className="u-flex u-flex--wrap u-flex--column-x-small pagination-bar__right">
> -        <TablePagination
> -          currentPage={currentPage}
> -          isLoading={isLoading}
> -          itemsPerPage={itemsPerPage}
> -          onNextClick={onNextClick}
> -          onPreviousClick={onPreviousClick}
> -          setCurrentPage={setCurrentPage}
> -          totalItems={totalItems}
> -        />
> +        <div className="u-flex u-flex--wrap u-flex--column-x-small pagination-bar__right">
> +          <TablePagination
> +            currentPage={currentPage}
> +            isLoading={isLoading}
> +            itemsPerPage={itemsPerPage}
> +            onNextClick={onNextClick}
> +            onPreviousClick={onPreviousClick}
> +            setCurrentPage={setCurrentPage}
> +            totalItems={totalItems}
> +          />
>  
> -        <Select
> -          aria-label="Tokens per page"
> -          name="Tokens per page"
> -          onChange={handleSizeChange}
> -          options={pageOptions}
> -          value={itemsPerPage}
> -        />
> +          <Select
> +            aria-label="Tokens per page"
> +            name="Tokens per page"

This is not your doing but I just noticed that we need to give a more generic label e.g: "Data per page" so it's not misleading, we can do this in another MP if it's out of scope

> +            onChange={handleSizeChange}
> +            options={pageOptions}
> +            value={itemsPerPage}
> +          />
> +        </div>
>        </div>
>      </section>
>    );


-- 
https://code.launchpad.net/~petermakowski/maas-site-manager/+git/site-manager/+merge/442634
Your team MAAS Committers is subscribed to branch ~petermakowski/maas-site-manager:fix-validation-message-cutoff-MAASENG-1611.