Refactoring the store to use the data dictionary: Phase 2

[surchs]

With phase 1 (#251) of the store refactor done, we now focus on getting the getters, mutations, and actions for the annotation part of the app updated.

Resources:

Here is a great blog post by one of the cypress maintainers on how to unit-test, mock, stub, etc Vuex methods.

There are also some examples for these unit tests in our wiki now: https://github.com/neurobagel/documentation/wiki/Cypress-Test-Snippets

Completion checklist

Every implemented method should have:

1. the method implemented in the correct section (getter, mutation, ...) in the store
2. all necessary state variables that the method relies on are initialized in the state (i.e. defined, not assigned real data)
3. unit test(s) that test the core functionality of the method (required state variables in the store and any other needed inputs should be mocked)
4. any component that depends on this method existing (check miro board and codebase) is checked to make sure it is calling the new method by the correct name and is refactored (including its component tests) where necessary to do so

Phase 2 - everything after the categorization page

ready

• Re-enable e2e tests that were previously failing #341
• Rename store field 'columnToCategoryMapping' to 'columnToCategoryMap' #352
• create getter for json version of data dictionary #268

need review

• Annotation Page Refactor for Phase 2 Store Refactor #347
• Annot-tab refactor for Phase 2 Store Refactor #348

done

• Feature: Ability to choose different transform heuristics for columns in continuous values component #336
• create getter for preview of value after heuristic transformation #272
• create mutation for setting current heuristic of continuous values column #270
• create getter for value options of a column (categorical or continuous) #276
• create a getter for the active heuristic for a column #266
• create getter for specialized vue component of a category #267
• Disable e2e tests that are not expected to pass #338
• create getter for category explanation #271
• create getter for columns of the category being annotated #273
• Transition refactored store to Vuex syntax #300
• create mutation to change 'missing' status of a column's value #275
• create getter for missing values of a category #278
• create getter for unique values of a category #277
• create a mutation to select an option for the value of a categorical column(s) #274

[jarmoza]

As of today, here is what is outstanding with phase 2 of the store refactor. These are listed in group order in which they should be done, small to large.

Small, Independent Tasks

• create getter for json version of data dictionary #268
  This json output has begun to be well described in the issue. @surchs Has provided an example files.
• create a mutation to select an option for the value of a categorical column(s) #274
  This will likely require a new field in the column entries of store field a map between raw values and annotated values in dataDictionary.annotated.<column_name>. The field has yet been specified on the Miro board store draft, though the mutation itself has been: selectAnOption.
• create getter for unique values of a category #277
  This getter retrieves a list of all unique values specified in columns linked to a category.

Transformation Heuristics for Continuous Values and Options for Categorical Values

• create getter for preview of value after heuristic transformation #272
  For the time being we are going to be essentially transferring the continuous value transformation code from the previous version of the annotation tool. (See annot-age-values utility functions convertAge, detectAge, etc.)
• Feature: Ability to choose different transform heuristics for columns in continuous values component #336
  We want to give the ability for columns that have the continuous values data type to individually change their transformation heuristic. This involves a new UI feature as well as altering the transformation heuristic-related functions to accept columns instead of categories.

Annotation tab and page refactor (a.k.a. Making the annotation and/or download pages work

• Annotation Page Refactor for Phase 2 Store Refactor #347
  Refactor the annot-tab component so we can start seeing its various child components loading, and test it with stubs
• Annot-tab refactor for Phase 2 Store Refactor #348
  Now refactor the annotation page itself to allow it to function with its components. (And if some components are not yet working, file issues for them.)
• Re-enable e2e tests that were previously failing #341
  Now re-enable the e2e test for the annotation page (and possibly the download page) by removing the spec directive in the .github/workflows/test_e2e.yml file

[surchs]

@jarmoza: I just noticed that we're using the getSelectedOption getter in the annot-categorical component to populate the dropdown with the currently selected term (see here). This getter isn't implemented in the store yet, and I can't find an issue for it. Maybe we just forgot this guy? Mind taking a look to confirm it's missing? I could take care of it together with #371.

[jarmoza]

@surchs Yes! We forgot it. I noticed this as well during the work I've been doing though I was going to address it in a later PR. I currently have the annotation page functioning without this function. In my viewgetSelectedOption essentially is the solution to the field wipe bug in that getSelectedOption retrieves what's been stored for the original value in datDictionary.annotated.

Are you sure you meant #371? Maybe you had a different idea of what this getter should do.

[github-actions]

We want to keep our issues up to date and active. This issue hasn't seen any activity in the last 30 days.
We have applied the stale-issue label to indicate that this issue should be reviewed again and then either prioritized or closed.

[jarmoza]

Closed by #437