opuscapita / react-async-select Goto Github PK

Background:
Paging controls "Next" and "Previous" send two requests to the server, both with different offsets.

Task:
Reduce the number of requests to server to one, if ReactTable component's internal logic allows it.

I'm implementing a feature related to approval limits and I need few things:

• Disable some rows.
• Add some JSX component to headers.
• Customize search field in header.

Issue - https://github.com/OpusCapita/invoice/issues/1822.
Specs - https://github.com/OpusCapita/ipa-specs/issues/123.
Mockups - https://github.com/OpusCapita/ipa-specs/files/2615354/Approval.limits.UI.-.v6.pptx (last two screens).

Background:
The react-select component's behaviour should be customizeable by the caller as it was before react-select v2 upgrade. Examples of different behavior:

• In the usual case, when a value is selected, it should be displayed on the react-select component.
• In approval assignee selectors, the selected value is added to a list below the select component. Here, the react-select should not display a selected value after the selection has been made.

Task:

• Fix the component so that customized behavior works as it did before react-select v2 upgrade.

Currently there are hardcoded strings and object property names shown on the UI. Improve localization by:

• processing all UI texts with i18n object's getMessage function
• providing a method for transforming the translation keys defined within the component

Background:
To improve the advanced search, it would be beneficial to provide additional information to the user. For this purpose, provide a method to display a custom component as a side panel for the advanced search.

Tasks:

• Modify SearchModal to render a custom component as a sidepanel
• Add a demo with a custom sidepanel component
• Update README

Related issue in invoice: https://github.com/OpusCapita/invoice/issues/1798

Background:
The customized behavior of the dropdown component for Approval Assignees requires that the result set for any input will be modified by what has been selected before – for one input there may be different result sets. Therefore, we should be able to disable result set caching and similar features.

Task:

• Investigate if react-select v2 caches result sets by default.
• Ensure that result sets may be defined only by the fetcher function and any caching methods can be turned off.

Currently special chars like 'ä', 'ö' is returned as a, o.
ignoreAccents sets to false will help.

Background:
When the user has selected a large number of items to be shown in the ReactTable, empty lines are shown if there are not enough results to fill the table.

Task:

• remove empty lines, showing less than selected number of rows if there are not enough results.

Related issue in posting: https://github.com/OpusCapita/posting/issues/588

Background:
React-select component's dropdown options have ended up behind other components or hidden due to overflow styles. Since then the react-select component used by react-async-select has been updated to v2.

Task:

• Investigate if any overlap / overflow issues still exist.
• Fix remaining overlap / overflow issues.

Related issue in invoice: https://github.com/OpusCapita/invoice/issues/1833

Background:
It is possible to freeze the entire UI by using the paging controls in ReactTable.

Task:

• Investigate what is the procedure to end up in an infinite loop of paging related requests.
• Fix the freezing problem if possible.

Example code import the {Dropdown} from react-component-example, whereas it instructed to install a different package which, when used, gives error that dropdown isnt exported from the file.