Add code for filter and update dependencies

[mlan225]

Resolves #210

Draft PR

[mlan225]

Non filter related adjustments that I can across, just so I don't forget about having changed it when the PR gets finished up.

• The dropdown menu changed opacity rather than hiding the menu, so settings were still clickable when the menu was hidden. Changed this to hide the menu in here and in my status filter dropdown

(menu items were clickable from here)

[mlan225]

Added a fix for the query string issue and the pagination can persist the status filter. Here are some approaches I attempted along the way and was reminded of some issues with them:

The URI methods ❌

From looking into it, it seems there are methods to encode a string, turning special characters into something that can be sent in a query string. For example, %20 for a space, etc. The example we looked at on that page seemed like it was good at grabbing data from the string, but I could not come to a solution for putting special characters into the string, does not seem possible.

Modify the asp-route element ❌

At first, I attempted to switch the filter from a form to a route element and build a value to input into the asp-route to plug in with javascript. However, you cannot modify the asp-route value with javascript, as it is created server side.

Create my own string of statuses in the stimulus.js filter controller and send through an input in the filter form ✅

After switching it back to a form and submitting my string of statuses to the route as a single string input delimited by commas and split into an array on the backend, I realized that the asp-route tag helper is the only one permitted to input characters into a query string. When I submit my data using the checkboxes, the commas are replaced in the query string with %2C. Besides the appearance, this functions the same as it would with a comma. But when submit with a asp-route it is permitted to use the commas. Its makes the URL kinda ugly, but it works 🤔

[mlan225]

Pushed an implementation for our move away from js for the status filter. The filter now works with C#

I feel that I can split some of these methods into a filter specific namespace for easier implementation in the future, but this may be a good approach to our issue.

The OnGet for visit index requires default statuses in the query parameters, this is provided by page link buttons that go to the visit index. This is a means of setting a default and dynamic status value to the url.

[mlan225]

If a page route is created to go to the visit index, this custom error will prevent developers from routing to the visit index without the correct route parameters provided for the filter. Without statuses parameters, the pagination links will not work correctly on first load of the visit index page.

[mlan225]

Filter Update

• The filter now has a service method to allow for easier implementation into existing page models
• Filter default parameters to the index view can be set within the asp-route that links to that page. If no parameters are provided, then all filter items will be checked. If no filter items are checked, all will be checked upon submission.
• In the checkbox select all javascript, the js will unselect "select all" if a checkbox is selected

Implimentation

1. Inject the _filterService
2. Initialize a new FilterModel providing a string array for your checkbox items. This can accept manual entry as well using new string[] { "item1", "item2" } as an argument
3. Add a filter string parameter to the route. This will be needed for the previous/next buttons partial to read data from the queryString
4. Modify the initialized Filter object using the filter service. Provide a domain object parameter and return a viewModel object to the page model
5. service methods that retrieve data will need an array of items to filter by, this can be provided by the SelectedItems property of the Filter object

[mlan225]

Filter structure has been adjusted

• The filterModel now handles applying supplied filter items and selected filter items data, no longer using a service for this
• The filter model now has one constructor, so implementation only needs to create one FilterModel object with the provided enum array and currently selected items
• If a filterModel is created with no default selected values, then all the filter selections will be selected by default. This will allow flexibility with not requiring query parameters in order to get data to return

[ashleybot]

Reviewing...

[ashleybot]

@mlan225 Feature branch behind main. Merging in main... no conflicts.

[ashleybot]

@mlan225 Looking good overall and great iteration since the last review. There are some opportunities for simplifying and making FilterModel's constructor null safe.

[mlan225]

Address potential null errors

if selected items are not provided during construction, then it will default to an empty string list. My concern here would be if a developer were to not provide the parameter for selected items, then all values will always return selected as a result of defaulting to an empty list. Should I just make the selected items a required parameter? The query parameter will always return an array of count 0 if no selected items values are provided in the route BUT the query Parameters are still given during construction.

Should the construction reach a compilation error if a selected items array of any length is not provided during construction or should I allow for a dev to not add it and get all items selected on every return until they provide the parameter?

Adjust the constructor property type for items (enum of filter items)

previously, the Enum.getValues method would return an Array type. I changed this to use getName to return the text of the enums and additionally, implemented the spread collection expression to simplify the value and return a list instead of an Array class type. With this change, you can now provide ["item1", "item2", item3"] in as a custom list argument if a enum is not available.

example: Filter = new FilterModel(["Pending", "Finalized"], [.. filter]);

Model params

Calling the constructor

[ashleybot]

@mlan225 We paired and made the code more readable and null safe. 👍