From bc40b26994cb2baf93e0a29d0fa5cc62f9f49134 Mon Sep 17 00:00:00 2001 From: Aydan Gasimova <62059163+Aydawka@users.noreply.github.com> Date: Wed, 19 Jun 2024 13:14:36 -0700 Subject: [PATCH] =?UTF-8?q?chore:=20=F0=9F=94=A8=20redirect=20omop=20mappi?= =?UTF-8?q?ng=20table=20to=20new=20page=20(#19)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * chore: 🔨 move omop mapping table to new page * style: 🎨 fix margin * style: 🎨 fix margin * style: 🎨 fix margin for header * chore: 🔨 update table header * chore: 🔨 separate page * chore: 🔨 update omop table * style: 🎨 font size * fix: 🐛 browseronly issue * fix: 🐛 add redirection * fix: 🐛 fix table style * chore: 🔨 redirect to a new page * chore: 🔨 redirect to a new page * style: 🎨 format * style: 🎨 format * style: 🎨 fix the table cell width * style: 🎨 format * style: 🎨 format * style: 🎨 format * style: 🎨 format * fix: 🐛 change sidebar header name for table * chore: 🔨 add data domain table as separate * chore: 🔨 set file processing table to a new page * chore: 🔨 direct to the page --- .../OMOP-Clinical-Data-Structure.mdx} | 8 +- .../OMOP-Mapping-Table.mdx | 13 ++ .../_category_.json | 4 + .../clinical-lab-tests/_category_.json | 4 + .../clinical-lab-tests.mdx | 3 +- .../clinical-lab-tests/data-Domain-Table.mdx | 11 ++ docs/dataset/clinical-data/cognition-MoCA.mdx | 2 +- .../file-processing-table.mdx | 11 ++ .../wearable-activity-monitor.mdx | 58 +++---- src/components/ClinicalLabTable.jsx | 107 ++----------- src/components/DirectDataDomainTable.jsx | 13 ++ src/components/DirectFileProcessingTable.jsx | 13 ++ src/components/DirectOmopTable.jsx | 13 ++ src/components/FileProcessingTable.jsx | 47 ++++++ src/components/StructureTable.jsx | 144 +++-------------- src/css/custom.css | 148 ++++++++++++++++++ src/pages/dataDomainTable.jsx | 13 ++ src/pages/fileProcessingTable.jsx | 13 ++ src/pages/omopTable.jsx | 13 ++ static/json/fileProcesing.json | 132 ++++++++++++++++ static/json/mappings.json | 8 +- 21 files changed, 529 insertions(+), 249 deletions(-) rename docs/dataset/clinical-data/{structure.mdx => OMOP-Clinical-Data-Structure/OMOP-Clinical-Data-Structure.mdx} (87%) create mode 100644 docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/OMOP-Mapping-Table.mdx create mode 100644 docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/_category_.json create mode 100644 docs/dataset/clinical-data/clinical-lab-tests/_category_.json rename docs/dataset/clinical-data/{ => clinical-lab-tests}/clinical-lab-tests.mdx (98%) create mode 100644 docs/dataset/clinical-data/clinical-lab-tests/data-Domain-Table.mdx create mode 100644 docs/dataset/wearable-activity-monitor/file-processing-table.mdx create mode 100644 src/components/DirectDataDomainTable.jsx create mode 100644 src/components/DirectFileProcessingTable.jsx create mode 100644 src/components/DirectOmopTable.jsx create mode 100644 src/components/FileProcessingTable.jsx create mode 100644 src/pages/dataDomainTable.jsx create mode 100644 src/pages/fileProcessingTable.jsx create mode 100644 src/pages/omopTable.jsx create mode 100644 static/json/fileProcesing.json diff --git a/docs/dataset/clinical-data/structure.mdx b/docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/OMOP-Clinical-Data-Structure.mdx similarity index 87% rename from docs/dataset/clinical-data/structure.mdx rename to docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/OMOP-Clinical-Data-Structure.mdx index f4a36bd..daf794f 100644 --- a/docs/dataset/clinical-data/structure.mdx +++ b/docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/OMOP-Clinical-Data-Structure.mdx @@ -34,9 +34,9 @@ This data model is **person-centric**. Therefore, all of the clinical data table ## Examples in AI-READI Documentation -You will see in our documentation site that we have described these notations in detail for particular types of clinical data, including [clinical lab tests](clinical-lab-tests), [cognitive testing](cognition-MoCA), [monofilament testing](monofilament-testing), [physical assessment](physical-assessment), and [vision assessment](vision-assessment). By going to each of those individual pages, you can see which table contains that particular data type, what each column header is, a description for each, and example output in the data file. +You will see in our documentation site that we have described these notations in detail for particular types of clinical data, including [clinical lab tests](../clinical-lab-tests), [cognitive testing](../cognition-MoCA), [monofilament testing](../monofilament-testing), [physical assessment](../physical-assessment), and [vision assessment](../vision-assessment). By going to each of those individual pages, you can see which table contains that particular data type, what each column header is, a description for each, and example output in the data file. -For example, let's use the [physical assessment](physical-assessment) information as a specific illustration. Physical assessment in AI-READI includes height, weight, body mass index, waist circumference, hip circumference, waist-to-hip ratio, heart rate, and blood pressure. By looking at the [documentation page](physical-assessment), you can see that if you are interested in analyzing these values from the dataset, you would find them in the 'measurement.csv' file in the Clinical Data folder. The final section on 'Metadata and Example Outputs' will walk you through how to interpret the file, and what each column in the header row represents. Note that there are multiple columns to help you identify the concept. There is a column listing the standard OMOP concept ID number (measurement_concept_id, e.g. '4245997') and a text description (measurement_source_value, e.g. 'BMI'). The reason the standard OMOP concept ID number is important is because different data sources can have different ways of representing 'BMI' - for example, one health system may represent it as 'BMI' while another represents it as 'Body Mass Index.' By mapping the various source descriptions to a common, standardized data element (concept ID 4245997), this allows for non-ambiguous representation and ability to then aggregate those data from different sources into a single data repository. In this particular study, we have a uniform protocol across all three data collection sites, so this is less of a harmonization issue at the level of the study itself (i.e., difficulties of harmonizing data across the 3 sites is reduced because we are starting out with a consistent method of data acquisition). However, this is important for downstream analyses wherein data from AI-READI may be used as a validation dataset for analyses performed using other datasets (or vice versa). Having data mapped to standardized terminologies and to a common data model facilitates reproducibility. +For example, let's use the [physical assessment](../physical-assessment) information as a specific illustration. Physical assessment in AI-READI includes height, weight, body mass index, waist circumference, hip circumference, waist-to-hip ratio, heart rate, and blood pressure. By looking at the [documentation page](../physical-assessment), you can see that if you are interested in analyzing these values from the dataset, you would find them in the 'measurement.csv' file in the Clinical Data folder. The final section on 'Metadata and Example Outputs' will walk you through how to interpret the file, and what each column in the header row represents. Note that there are multiple columns to help you identify the concept. There is a column listing the standard OMOP concept ID number (measurement_concept_id, e.g. '4245997') and a text description (measurement_source_value, e.g. 'BMI'). The reason the standard OMOP concept ID number is important is because different data sources can have different ways of representing 'BMI' - for example, one health system may represent it as 'BMI' while another represents it as 'Body Mass Index.' By mapping the various source descriptions to a common, standardized data element (concept ID 4245997), this allows for non-ambiguous representation and ability to then aggregate those data from different sources into a single data repository. In this particular study, we have a uniform protocol across all three data collection sites, so this is less of a harmonization issue at the level of the study itself (i.e., difficulties of harmonizing data across the 3 sites is reduced because we are starting out with a consistent method of data acquisition). However, this is important for downstream analyses wherein data from AI-READI may be used as a validation dataset for analyses performed using other datasets (or vice versa). Having data mapped to standardized terminologies and to a common data model facilitates reproducibility. Table 2 provides an overview of each data type and which table associated variables can be found. This is a high-level overview guide so that if you are looking for a particular variable, you know which file to access to get information on that variable. @@ -79,7 +79,7 @@ Table 2 provides an overview of each data type and which table associated variab General categories include demographics, general health, diabetes self care, depression, social determinants of health, diet, substance use, and vision and access to eye care. For - individual survey items, see the [Questionnaires](questionnaires) page for more information. + individual survey items, see the [Questionnaires](../questionnaires) page for more information. Note, in OHDSI OMOP CDM, data for patients with negative events isn't typically recorded. However, to capture both negative and positive responses to survey questions, we're recording negative responses alongside positive ones in the observation domain, using the specific question ID as the observation_concept_id. Most survey questions are mapped to the Observation domain. Some questions (for example, summary scores) are mapped to the Measurement domain. If a participant reports having a health condition/ clinical disorder, then the self reported clinical disorder or the condition is mapped to the proper condition_concept_id and is recorded in the Condition domain. @@ -137,7 +137,7 @@ Resources to learn more about SSSOM: import StructureTable from '@site/src/components/StructureTable'; - +See the table here import PageFeedback from '@site/src/components/PageFeedback'; diff --git a/docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/OMOP-Mapping-Table.mdx b/docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/OMOP-Mapping-Table.mdx new file mode 100644 index 0000000..dccc3fa --- /dev/null +++ b/docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/OMOP-Mapping-Table.mdx @@ -0,0 +1,13 @@ +--- +sidebar_position: 2 +title: OMOP Mapping Table +--- + + +import {Redirect} from '@docusaurus/router'; +import DirectOmopTable from '@site/src/components/DirectOmopTable'; + + + + + diff --git a/docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/_category_.json b/docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/_category_.json new file mode 100644 index 0000000..d1ec4ad --- /dev/null +++ b/docs/dataset/clinical-data/OMOP-Clinical-Data-Structure/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "OMOP Clinical Data Structure", + "position": 1 +} diff --git a/docs/dataset/clinical-data/clinical-lab-tests/_category_.json b/docs/dataset/clinical-data/clinical-lab-tests/_category_.json new file mode 100644 index 0000000..2d891d9 --- /dev/null +++ b/docs/dataset/clinical-data/clinical-lab-tests/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Clinical Lab Tests", + "position": 2 +} diff --git a/docs/dataset/clinical-data/clinical-lab-tests.mdx b/docs/dataset/clinical-data/clinical-lab-tests/clinical-lab-tests.mdx similarity index 98% rename from docs/dataset/clinical-data/clinical-lab-tests.mdx rename to docs/dataset/clinical-data/clinical-lab-tests/clinical-lab-tests.mdx index be37706..e0b3b7b 100644 --- a/docs/dataset/clinical-data/clinical-lab-tests.mdx +++ b/docs/dataset/clinical-data/clinical-lab-tests/clinical-lab-tests.mdx @@ -20,8 +20,9 @@ Clinical lab tests are a fundamental component of medical diagnostics and patien ## Variables included in Data Domain +See the table here - +{/* */} #### NT-proBNP Reference Intervals | Age | Female Range | Male Range | diff --git a/docs/dataset/clinical-data/clinical-lab-tests/data-Domain-Table.mdx b/docs/dataset/clinical-data/clinical-lab-tests/data-Domain-Table.mdx new file mode 100644 index 0000000..2712133 --- /dev/null +++ b/docs/dataset/clinical-data/clinical-lab-tests/data-Domain-Table.mdx @@ -0,0 +1,11 @@ +--- +sidebar_position: 2 +title: Data Domain Table +--- + + +import {Redirect} from '@docusaurus/router'; +import DirectDataDomainTable from '@site/src/components/DirectDataDomainTable'; + + + diff --git a/docs/dataset/clinical-data/cognition-MoCA.mdx b/docs/dataset/clinical-data/cognition-MoCA.mdx index 994bf7d..67a3971 100644 --- a/docs/dataset/clinical-data/cognition-MoCA.mdx +++ b/docs/dataset/clinical-data/cognition-MoCA.mdx @@ -1,5 +1,5 @@ --- -sidebar_position: 2 +sidebar_position: 3 title: Cognition/MoCA --- diff --git a/docs/dataset/wearable-activity-monitor/file-processing-table.mdx b/docs/dataset/wearable-activity-monitor/file-processing-table.mdx new file mode 100644 index 0000000..66af543 --- /dev/null +++ b/docs/dataset/wearable-activity-monitor/file-processing-table.mdx @@ -0,0 +1,11 @@ +--- +sidebar_position: 2 +title: File Processing Table +--- + + +import {Redirect} from '@docusaurus/router'; +import DirectFileProcessingTable from '@site/src/components/DirectFileProcessingTable'; + + + diff --git a/docs/dataset/wearable-activity-monitor/wearable-activity-monitor.mdx b/docs/dataset/wearable-activity-monitor/wearable-activity-monitor.mdx index 86197ca..faaaa99 100644 --- a/docs/dataset/wearable-activity-monitor/wearable-activity-monitor.mdx +++ b/docs/dataset/wearable-activity-monitor/wearable-activity-monitor.mdx @@ -1058,34 +1058,36 @@ Stress: The negative stress values (-1 & -2) originate from the source, possibly There may be cases in which certain participants do not have certain files, e.g have no measurement file for sleep data. In these cases, the file path will display "none." However, there are also instances where a measurement file exists, but it contains no observations, similar to having data with no meaningful content. -| Metadata Elements | Description | Example | -| ------------------------------ | -------------------------------------------------------------- | ---------------------------------------------------------------------------------------------- | -| participant_id | Identification number of study participant | 0000 | -| wrist_worn_on | Which wrist the fitness tracker was worn on by the participant | Left | -| dominant_hand | Participants dominant hand | Right hand | -| heartrate_filename | Filename containing participants heart rate data | /wearable_activity_monitor/heart_rate/garmin_vivosmart5/1043/0000_heartrate.json | -| heartrate_record_count | Total number of heart rate measurements recorded | 15780 | -| average_heartrate_bpm | Average heart rate during the recording period | 79.35743649 | -| oxygen_saturation_filename | Filename containing participants oxygen saturation (SpO2) data | /wearable_activity_monitor/oxygen_saturation/garmin_vivosmart5/0000/0000_oxygensaturation.json | -| oxygen_saturation_record_count | Total number of SpO2 measurements recorded | 2094 | -| average_oxygen_saturation_pct | Average SpO2 during the recording period | 91.71% | -| stress_level_filename | Filename containing participants stress level data | /wearable_activity_monitor/stress/garmin_vivosmart5/0000/0000_stress.json | -| stress_level_record_count | Total number of stress level measurements recorded | 24659 | -| average_stress_level | Average stress levels during the recording period | 15.37 | -| sleep_filename | Filename containing participants sleep data | /wearable_activity_monitor/sleep/garmin_vivosmart5/0000/0000_sleep.json | -| sleep_record_count | Total number of sleep measurements recorded | 12 | -| average_sleep_hours | Average sleep duration during the recording period | 7.25 | -| respiratory_rate_filename | Filename containing participants respiratory rate data | /wearable_activity_monitor/respiratory_rate/garmin_vivosmart5/0000/0000_respiratoryrate.json | -| respiratory_rate_record_count | Total number of respiratory rate measurements recorded | 2164 | -| average_respiratory_rate_bpm | Average respiratory rate during the recording period | 27.02 | -| physical_activity_filename | Filename containing participants physical activity data | /wearable_activity_monitor/physical_activity/garmin_vivosmart5/0000/0000_activity.json | -| physical_activity_num_records | Total number of measurements recorded | 5524 | -| average_daily_activity | Average number of steps during the recording period | 7897.21 | -| active_calories_filename | Filename containing participants active calories data | /wearable_activity_monitor/physical_activity_calorie/garmin_vivosmart5/0000/0000_calorie.json | -| active_calories_record_count | Total number of calorie measurements recorded | 1773 | -| average_active_calories_kcal | Average number of calories burned during the recording period | 194.11 | -| sensor_sampling_duration_days | How many days the participant wore the fitness tracker | 12 | -| fitness_manufacturer_model | Model of the fitness tracker | Garmin Vivosmart 5 | +See the table here + + + + + + + + + + + + + + + + + + + + + + + + + + + + + import PageFeedback from '@site/src/components/PageFeedback'; diff --git a/src/components/ClinicalLabTable.jsx b/src/components/ClinicalLabTable.jsx index 63a8255..2034975 100644 --- a/src/components/ClinicalLabTable.jsx +++ b/src/components/ClinicalLabTable.jsx @@ -16,7 +16,9 @@ export default function ClinicalLabTable() { ) : (
See table below called - {record.tableName} + + {record.tableName} +
); }; @@ -90,96 +92,19 @@ export default function ClinicalLabTable() { return ( {() => ( - - - - - -
- -
- - +
+

Data Domain Table

+ +
)} ); diff --git a/src/components/DirectDataDomainTable.jsx b/src/components/DirectDataDomainTable.jsx new file mode 100644 index 0000000..0c0e009 --- /dev/null +++ b/src/components/DirectDataDomainTable.jsx @@ -0,0 +1,13 @@ +import { useEffect } from 'react'; + +function DirectDataDomainTable() { + useEffect(() => { + // Open OMOP Table in a new tab + window.open('/dataDomainTable', '_blank'); + + // Redirect the current page to the documentation + window.location.replace('/docs/1/dataset/clinical-data/clinical-lab-tests'); + }, []); +} + +export default DirectDataDomainTable; diff --git a/src/components/DirectFileProcessingTable.jsx b/src/components/DirectFileProcessingTable.jsx new file mode 100644 index 0000000..73e8216 --- /dev/null +++ b/src/components/DirectFileProcessingTable.jsx @@ -0,0 +1,13 @@ +import { useEffect } from 'react'; + +function DirectFileProcessingTable() { + useEffect(() => { + // Open OMOP Table in a new tab + window.open('/fileProcessingTable', '_blank'); + + // Redirect the current page to the documentation + window.location.replace('/docs/1/dataset/wearable-activity-monitor'); + }, []); +} + +export default DirectFileProcessingTable; diff --git a/src/components/DirectOmopTable.jsx b/src/components/DirectOmopTable.jsx new file mode 100644 index 0000000..9c5ec56 --- /dev/null +++ b/src/components/DirectOmopTable.jsx @@ -0,0 +1,13 @@ +import { useEffect } from 'react'; + +function DirectOmopTable() { + useEffect(() => { + // Open OMOP Table in a new tab + window.open('/omopTable', '_blank'); + + // Redirect the current page to the documentation + window.location.replace('/docs/1/dataset/clinical-data/OMOP-Clinical-Data-Structure'); + }, []); +} + +export default DirectOmopTable; diff --git a/src/components/FileProcessingTable.jsx b/src/components/FileProcessingTable.jsx new file mode 100644 index 0000000..b74c967 --- /dev/null +++ b/src/components/FileProcessingTable.jsx @@ -0,0 +1,47 @@ +/* eslint-disable react/button-has-type */ +import React from 'react'; +import FilterableTable from 'react-filterable-table'; +// eslint-disable-next-line import/no-unresolved +import BrowserOnly from '@docusaurus/BrowserOnly'; +import fileProcessing from '../../static/json/fileProcesing.json'; + +export default function ClinicalLabTable() { + // Fields to show in the table, and what object properties in the data they bind to + const fields = [ + { + name: 'Metadata Elements', + displayName: 'Metadata Elements', + inputFilterable: true, + }, + { + name: 'Description', + displayName: 'Description', + inputFilterable: true, + }, + { + name: 'Example', + displayName: 'Example', + inputFilterable: true, + }, + ]; + + return ( + + {() => ( +
+

File Processing Table

+ +
+ )} + + ); +} diff --git a/src/components/StructureTable.jsx b/src/components/StructureTable.jsx index 4f57b07..752219b 100644 --- a/src/components/StructureTable.jsx +++ b/src/components/StructureTable.jsx @@ -32,212 +32,116 @@ export default function StructureTable() { name: 'Protected or open-source?', displayName: 'Protected or open-source?', inputFilterable: true, - sortable: true, }, { name: 'FORM_NAME', displayName: 'FORM_NAME', inputFilterable: true, - sortable: true, }, { name: 'FIELD_TYPE', displayName: 'FIELD_TYPE', inputFilterable: true, - sortable: true, }, { name: 'FIELD_ID', displayName: 'FIELD_ID', inputFilterable: true, - sortable: true, }, { name: 'FIELD_ID_NUM', - displayName: 'FIELD_ID_NUM', + displayName: 'FIELD_ ID_NUM', inputFilterable: true, - sortable: true, }, { name: 'SRC_CODE', displayName: 'SRC_CODE', inputFilterable: true, - sortable: true, }, { name: 'SRC_CODE_ID', displayName: 'SRC_CODE_ID', inputFilterable: true, - sortable: true, }, { name: 'SRC_CD_DESCRIPTION', - displayName: 'SRC_CD_DESCRIPTION', + displayName: 'SRC_CD_ DESCRIPTION', inputFilterable: true, - sortable: true, }, { name: 'Choices, Calculations, OR Slider Labels From REDCap CODEBOOK', displayName: 'Choices, Calculations, OR Slider Labels From REDCap CODEBOOK', inputFilterable: true, - sortable: true, }, { name: 'TARGET_CONCEPT_ID', - displayName: 'TARGET_CONCEPT_ID', + displayName: 'TARGET_ CONCEPT_ID', inputFilterable: true, - sortable: true, render: targetConceptIdRender, }, { name: 'LOCAL_CONCEPT_ID', - displayName: 'LOCAL_CONCEPT_ID', + displayName: 'LOCAL _CONCEPT_ID', inputFilterable: true, - sortable: true, }, { name: 'TARGET_CONCEPT_NAME', - displayName: 'TARGET_CONCEPT_NAME', + displayName: 'TARGET_ CONCEPT_NAME', inputFilterable: true, - sortable: true, }, { name: 'TARGET_DOMAIN_ID', - displayName: 'TARGET_DOMAIN_ID', + displayName: 'TARGET_ DOMAIN_ID', inputFilterable: true, - sortable: true, }, { name: 'TARGET_VOCABULARY_ID', - displayName: 'TARGET_VOCABULARY_ID', + displayName: 'TARGET_ VOCABULARY_ ID', inputFilterable: true, - sortable: true, }, { name: 'TARGET_CONCEPT_CLASS_ID', - displayName: 'TARGET_CONCEPT_CLASS_ID', + displayName: 'TARGET_ CONCEPT _CLASS_ID', inputFilterable: true, - sortable: true, }, { name: 'TARGET_STANDARD_CONCEPT', - displayName: 'TARGET_STANDARD_CONCEPT', + displayName: 'TARGET_ STANDARD _CONCEPT', inputFilterable: true, - sortable: true, }, { name: 'TARGET_CONCEPT_CODE', - displayName: 'TARGET_CONCEPT_CODE', + displayName: 'TARGET_ CONCEPT_CODE', inputFilterable: true, - sortable: true, }, { name: 'PREDICATE_ID', - displayName: 'PREDICATE_ID', + displayName: 'PREDICATE _ID', inputFilterable: true, - sortable: true, }, { name: 'CONFIDENCE', displayName: 'CONFIDENCE', inputFilterable: true, - sortable: true, }, ]; return ( {() => ( - - - - - -
- -
- - +
+

OMOP Mapping Table

+ +
)} ); diff --git a/src/css/custom.css b/src/css/custom.css index d9d8701..810a580 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -7,6 +7,7 @@ html { scroll-behavior: smooth; + scrollbar-gutter: stable; } /* You can override the default Infima variables here. */ @@ -20,6 +21,7 @@ html { --ifm-color-primary-darker: #185796; --ifm-color-primary-darkest: #14477b; --ifm-link-color: #2e7a99; + --table-header-color: #f3f4f6; --ifm-toc-link-color: #94a3b8; @@ -170,3 +172,149 @@ html[data-theme='dark'] .snapshot { html[data-theme='dark'] .button { color: var(--ifm-heading-color); } + +.filterable-table-container { + z-index: -1; +} +.filterable-table-container .close.clear-filter { + display: none; +} +.filterable-table-container .row.header-row:nth-child(1) { + display: flex; + gap: 10px; +} +.form-control.filter-input, +.form-control.pull-sm-right.pull-md-right.pull-lg-right { + border: 1px solid rgb(218, 221, 225); + font-size: medium; + border-color: #dadde1; + padding: 0.5rem; + min-width: 20rem; + + border-radius: 4px; +} +.form-control.pull-sm-right.pull-md-right.pull-lg-right { + min-width: 10rem; + height: 40px; +} +.btn-next-page::marker, +.btn-first-page::marker, +.btn-numbered-page::marker, +.btn-last-page::marker, +.btn-prev-more::marker, +.btn-next-more::marker, +.btn-prev-page::marker { + content: ''; +} + +.pagination, +.filterable-table-container .row.header-row:nth-child(2) { + margin-top: 1rem; + display: flex; + justify-content: flex-start; +} + +nav:nth-child(2) .pagination { + display: none; +} + +.pagination li a { + color: #777; + background-color: #fff; + border: 1px solid #ddd; + padding: 10px; +} +.pagination li.btn-numbered-page.active a { + background-color: #337ab7; + border-color: #337ab7; +} +.pagination li.btn-numbered-page.active a { + color: #fff; +} +.btn-first-page { + height: 38px; +} +.row { + margin: 0; +} +.col-sm-3.filter-container { + margin-right: 8rem; +} + +.text-center.text-muted.record-count { + padding-top: 10px; + font-size: small; + min-width: 20rem; + text-align: start; +} +.col-sm-5.col-sm-push-4 { + padding-right: 2rem; +} + +.btn-next-page:hover a, +.btn-first-page:hover a, +.btn-numbered-page:hover a, +.btn-last-page:hover a, +.btn-prev-more:hover a, +.btn-next-more:hover a, +.btn-prev-page:hover a { + background: #e0f2fe; + cursor: pointer; +} + +.filterable-table-container { + font-size: 0.75rem; +} + +/*.omop-filtered-table {*/ +/* display: flex;*/ +/* flex-flow: column nowrap;*/ +/* align-items: stretch;*/ +/* height: 100vh;*/ +/*}*/ + +.filtered-table h1 { + margin: 2rem; +} + +/*.filteredTable {*/ +/* flex-grow: 1;*/ +/* flex-basis: 0;*/ +/* z-index: 100;*/ +/* display: flex;*/ +/* flex-flow: column nowrap;*/ +/* align-items: stretch;*/ +/*}*/ + +.filteredTable div:has(.row.header-row) { + margin: 2rem; +} + +/*.omop-filtered-table .filteredTable .table-container {*/ +/* flex-grow: 1;*/ +/* flex-basis: 0;*/ +/*}*/ + +.table.table-condensed.filterable-table { + border-collapse: collapse; + position: relative; +} + +.table.table-condensed.filterable-table th { + position: sticky; + top: 0; + background: var(--table-header-color); +} + +/*#__docusaurus:has(.main-wrapper .omop-filtered-table) .footer--dark {*/ +/* display: none;*/ +/*}*/ + +.table.table-condensed.filterable-table tbody td { + width: 16rem !important; + max-width: 16rem !important; +} + +.table.table-condensed.filterable-table td span { + max-width: 16rem !important; +} diff --git a/src/pages/dataDomainTable.jsx b/src/pages/dataDomainTable.jsx new file mode 100644 index 0000000..7e9b8eb --- /dev/null +++ b/src/pages/dataDomainTable.jsx @@ -0,0 +1,13 @@ +/* eslint-disable react/prop-types */ +/* eslint-disable react/button-has-type */ +import React from 'react'; + +import ClinicalLabTable from '../components/ClinicalLabTable'; + +export default function dataDomainTable() { + return ( +
+ +
+ ); +} diff --git a/src/pages/fileProcessingTable.jsx b/src/pages/fileProcessingTable.jsx new file mode 100644 index 0000000..ce455f1 --- /dev/null +++ b/src/pages/fileProcessingTable.jsx @@ -0,0 +1,13 @@ +/* eslint-disable react/prop-types */ +/* eslint-disable react/button-has-type */ +import React from 'react'; + +import FileProcessingTable from '../components/FileProcessingTable'; + +export default function fileProcessingTable() { + return ( +
+ +
+ ); +} diff --git a/src/pages/omopTable.jsx b/src/pages/omopTable.jsx new file mode 100644 index 0000000..1c365c4 --- /dev/null +++ b/src/pages/omopTable.jsx @@ -0,0 +1,13 @@ +/* eslint-disable react/prop-types */ +/* eslint-disable react/button-has-type */ +import React from 'react'; + +import StructureTable from '../components/StructureTable'; + +export default function OmopTable() { + return ( +
+ +
+ ); +} diff --git a/static/json/fileProcesing.json b/static/json/fileProcesing.json new file mode 100644 index 0000000..12f7d9f --- /dev/null +++ b/static/json/fileProcesing.json @@ -0,0 +1,132 @@ +[ + { + "Metadata Element": "participant_id", + "Description": "Identification number of study participant", + "Example": "0000" + }, + { + "Metadata Elements": "wrist_worn_on", + "Description": "Which wrist the fitness tracker was worn on by the participant", + "Example": "Left" + }, + { + "Metadata Elements": "dominant_hand", + "Description": "Participants dominant hand", + "Example": "Right hand" + }, + { + "Metadata Elements": "heartrate_filename", + "Description": "Filename containing participants heart rate data", + "Example": "/wearable_activity_monitor/heart_rate/garmin_vivosmart5/1043/0000_heartrate.json" + }, + { + "Metadata Elements": "heartrate_record_count", + "Description": "Total number of heart rate measurements recorded", + "Example": "15780" + }, + { + "Metadata Elements": "average_heartrate_bpm", + "Description": "Average heart rate during the recording period", + "Example": "79.35743649" + }, + { + "Metadata Elements": "oxygen_saturation_filename", + "Description": "Filename containing participants oxygen saturation (SpO2) data", + "Example": "/wearable_activity_monitor/oxygen_saturation/garmin_vivosmart5/0000/0000_oxygensaturation.json" + }, + { + "Metadata Elements": "oxygen_saturation_record_count", + "Description": "Total number of SpO2 measurements recorded", + "Example": "2094" + }, + { + "Metadata Elements": "average_oxygen_saturation_pct", + "Description": "Average SpO2 during the recording period", + "Example": "91.71%" + }, + { + "Metadata Elements": "stress_level_filename", + "Description": "Filename containing participants stress level data", + "Example": "/wearable_activity_monitor/stress/garmin_vivosmart5/0000/0000_stress.json" + }, + { + "Metadata Elements": "stress_level_record_count", + "Description": "Total number of stress level measurements recorded", + "Example": "24659" + }, + { + "Metadata Elements": "average_stress_level", + "Description": "Average stress levels during the recording period", + "Example": "15.37" + }, + { + "Metadata Elements": "sleep_filename", + "Description": "Filename containing participants sleep data", + "Example": "/wearable_activity_monitor/sleep/garmin_vivosmart5/0000/0000_sleep.json" + }, + { + "Metadata Elements": "sleep_record_count", + "Description": "Total number of sleep measurements recorded", + "Example": "12" + }, + { + "Metadata Elements": "average_sleep_hours", + "Description": "Average sleep duration during the recording period", + "Example": "7.25" + }, + { + "Metadata Elements": "respiratory_rate_filename", + "Description": "Filename containing participants respiratory rate data", + "Example": "/wearable_activity_monitor/respiratory_rate/garmin_vivosmart5/0000/0000_respiratoryrate.json" + }, + { + "Metadata Elements": "respiratory_rate_record_count", + "Description": "Total number of respiratory rate measurements recorded", + "Example": "2164" + }, + { + "Metadata Elements": "average_respiratory_rate_bpm", + "Description": "Average respiratory rate during the recording period", + "Example": "27.02" + }, + { + "Metadata Elements": "physical_activity_filename", + "Description": "Filename containing participants physical activity data", + "Example": "/wearable_activity_monitor/physical_activity/garmin_vivosmart5/0000/0000_activity.json" + }, + { + "Metadata Elements": "physical_activity_num_records", + "Description": "Total number of measurements recorded", + "Example": "5524" + }, + { + "Metadata Elements": "average_daily_activity", + "Description": "Average number of steps during the recording period", + "Example": "7897.21" + }, + { + "Metadata Elements": "active_calories_filename", + "Description": "Filename containing participants active calories data", + "Example": "/wearable_activity_monitor/physical_activity_calorie/garmin_vivosmart5/0000/0000_calorie.json" + }, + { + "Metadata Elements": "active_calories_record_count", + "Description": "Total number of calorie measurements recorded", + "Example": "1773" + }, + { + "Metadata Elements": "average_active_calories_kcal", + "Description": "Average number of calories burned during the recording period", + "Example": "194.11" + }, + { + "Metadata Elements": "sensor_sampling_duration_days", + "Description": "How many days the participant wore the fitness tracker", + "Example": "12" + }, + { + "Metadata Elements": "fitness_manufacturer_model", + "Description": "Model of the fitness tracker", + "Example": "Garmin Vivosmart 5" + } +] diff --git a/static/json/mappings.json b/static/json/mappings.json index 6036385..b5335d7 100644 --- a/static/json/mappings.json +++ b/static/json/mappings.json @@ -17167,7 +17167,7 @@ "SRC_CD_DESCRIPTION": "2 or less", "Choices, Calculations, OR Slider Labels From REDCap CODEBOOK": "", "TARGET_CONCEPT_ID": 2005200241, - "LOCAL_CONCEPT_ID": "###############################################################################################################################################################################################################################################################", + "LOCAL_CONCEPT_ID": 2005200241, "TARGET_CONCEPT_NAME": "2 or less", "TARGET_DOMAIN_ID": "Meas Value", "TARGET_VOCABULARY_ID": "AIREADI", @@ -17251,7 +17251,7 @@ "SRC_CD_DESCRIPTION": "2 or less", "Choices, Calculations, OR Slider Labels From REDCap CODEBOOK": "", "TARGET_CONCEPT_ID": 2005200241, - "LOCAL_CONCEPT_ID": "###############################################################################################################################################################################################################################################################", + "LOCAL_CONCEPT_ID": 2005200241, "TARGET_CONCEPT_NAME": "2 or less", "TARGET_DOMAIN_ID": "Meas Value", "TARGET_VOCABULARY_ID": "AIREADI", @@ -21556,7 +21556,7 @@ "SRC_CD_DESCRIPTION": "1 - 10 times", "Choices, Calculations, OR Slider Labels From REDCap CODEBOOK": "", "TARGET_CONCEPT_ID": 2005200262, - "LOCAL_CONCEPT_ID": "###############################################################################################################################################################################################################################################################", + "LOCAL_CONCEPT_ID": 2005200262, "TARGET_CONCEPT_NAME": "1 - 10 times", "TARGET_DOMAIN_ID": "Meas Value", "TARGET_VOCABULARY_ID": "AIREADI", @@ -21745,7 +21745,7 @@ "SRC_CD_DESCRIPTION": "1 - 10 times", "Choices, Calculations, OR Slider Labels From REDCap CODEBOOK": "", "TARGET_CONCEPT_ID": 2005200262, - "LOCAL_CONCEPT_ID": "###############################################################################################################################################################################################################################################################", + "LOCAL_CONCEPT_ID": 2005200262, "TARGET_CONCEPT_NAME": "1 - 10 times", "TARGET_DOMAIN_ID": "Meas Value", "TARGET_VOCABULARY_ID": "AIREADI",