Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

add wrapper function for reactable #87

Open
wants to merge 8 commits into
base: main
Choose a base branch
from

Conversation

oadetayo
Copy link

Brief overview of changes

Added a new dfe_reactable function to the dfeshiny package, which serves as a pre-configured wrapper around the reactable::reactable function. This function simplifies the creation of interactive and accessible tables with default styling and configurations tailored to Department for Education requirements.


Why are these changes being made?

This change is being made to standardize the use of interactive tables across applications developed with dfeshiny, ensuring consistent design, accessibility, and functionality. It reduces repetitive coding for developers and provides users with a clean, user-friendly experience when viewing data in table formats.


Detailed description of changes

  • Introduced a dfe_reactable function, which:

    • Sets default styling and configurations for reactable tables, including row highlighting, borderless design, and full-width tables.
    • Applies default column definitions, such as alignment, minimum width, and handling of NA values.
    • Customizes the global search input styling and placeholder text.
    • Integrates a default theme with consistent visual styling.
  • Added a unit test to validate the structure and configuration of the reactable object produced by the dfe_reactable function. This includes:

    • Checking key attributes like highlight, borderless, and columns.
    • Verifying the presence of custom themes and language options.

Additional information for reviewers

  • This function is intended to be used as a default table generation tool within applications leveraging dfeshiny.
  • The current implementation does not support direct customization of some attributes (e.g., highlight, borderless) but allows passing additional arguments through the ... parameter for advanced use cases.
  • A small test dataset has been used in the unit tests to ensure function reliability and reusability.

Issue ticket number/s and link

Closes #73

R/dfe_reactable.R Fixed Show fixed Hide fixed
Copy link
Contributor

@rmbielby rmbielby left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Handful of things just to make it clear to end users how it's expected to be used and how it looks:

  • Add a shinyapp style example in @examples
  • Add a page with a dfe_reactable in the test dashboard (tests/test_dashboard/ui.R)

Also, dfe_reactable needs adding to the reference contents in _pkgdown.yml. Probably needs a new section, maybe "Charts and tables".

Finally, I think the following means that if you're going to document the params, then they should also be included in line 74. So I think for each one, we either remove the @params entry or add the param name on line 74.

  • checking Rd \usage sections ... WARNING
    Warning: Documented arguments not in \usage in Rd file 'dfe_reactable.Rd':
    ‘columns’ ‘columnGroups’ ‘rownames’ ‘groupBy’ ‘sortable’ ‘filterable’
    ‘searchable’ ‘searchMethod’ ‘defaultColDef’ ‘defaultColGroup’
    ‘defaultSortOrder’ ‘defaultSorted’ ‘pagination’ ‘defaultPageSize’
    ‘showPageSizeOptions’ ‘pageSizeOptions’ ‘paginationType’
    ‘showPagination’ ‘showPageInfo’ ‘minRows’ ‘paginateSubRows’ ‘details’
    ‘defaultExpanded’ ‘selection’ ‘defaultSelected’ ‘onClick’ ‘striped’
    ‘compact’ ‘wrap’ ‘class’ ‘style’ ‘rowClass’ ‘rowStyle’ ‘width’
    ‘height’ ‘meta’ ‘elementId’ ‘static’ ‘selectionId’

R/dfe_reactable.R Outdated Show resolved Hide resolved
@oadetayo oadetayo requested a review from rmbielby January 15, 2025 09:59
Copy link
Contributor

@rmbielby rmbielby left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, that's helpful being able to see it in the test dashboard now. I think we should try and tie it in to the standard GDS CSS, so just a handful of suggestions on where to do that and then I think we're there.

R/dfe_reactable.R Show resolved Hide resolved
R/dfe_reactable.R Show resolved Hide resolved
R/dfe_reactable.R Show resolved Hide resolved
R/dfe_reactable.R Outdated Show resolved Hide resolved
R/dfe_reactable.R Show resolved Hide resolved
@oadetayo oadetayo requested a review from rmbielby January 17, 2025 10:33
Copy link
Contributor

@rmbielby rmbielby left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, just about there now I think. Just a few small suggestions and then I think we're good.

R/dfe_reactable.R Outdated Show resolved Hide resolved
R/dfe_reactable.R Outdated Show resolved Hide resolved
tests/test_dashboard/server.R Outdated Show resolved Hide resolved
oadetayo and others added 3 commits January 17, 2025 12:20
@oadetayo oadetayo requested a review from rmbielby January 17, 2025 12:22
@@ -15,4 +15,8 @@
input_cookies = shiny::reactive(input$cookies),
google_analytics_key = ga_key # nolint: [object_usage_linter]
)

output$reactable_example <- reactable::renderReactable(
dfe_reactable(mtcars |> dplyr::select("mpg", "cyl", "hp", "gear"))

Check notice

Code scanning / lintr

Indentation should be 4 spaces but is 5 spaces. Note test

Indentation should be 4 spaces but is 5 spaces.
Copy link
Contributor

@rmbielby rmbielby left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like it just needs styler::style_dir() running and then it's good to go.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

dfetable function as wrapper for reactable
2 participants