Skip to content

Fixed text and basic behavior of CascadeSelector component #20

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.

Sign up for GitHub

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

Merged
snyaggarwal merged 3 commits into from
May 8, 2026
Merged

Fixed text and basic behavior of CascadeSelector component #20

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
afe8561
Fixed text and basic behavior of CascadeSelector component
jamlung-ri Apr 30, 2026
4ffae9b
CascadeSelector component translations
jamlung-ri May 5, 2026
d75af58
More translations
jamlung-ri May 6, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

78 changes: 48 additions & 30 deletions src/components/common/CascadeSelector.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import React from 'react'
import { useTranslation } from 'react-i18next'
import Box from '@mui/material/Box'
import TextField from '@mui/material/TextField'
import Collapse from '@mui/material/Collapse'
Expand All @@ -17,22 +18,22 @@ import CodeIcon from '@mui/icons-material/CodeOutlined'
const PRESETS = [
{
id: 'none',
label: 'None',
labelKey: 'common.none',
params: {},
},
{
id: 'sourcemappings',
label: 'Source Mappings',
labelKey: 'reference.source_mappings',
params: { method: 'sourcemappings' },
},
{
id: 'sourcetoconcepts',
label: 'OpenMRS',
labelKey: 'reference.all_source_concepts_and_mappings',
params: { method: 'sourcetoconcepts', mapTypes: 'Q-AND-A,CONCEPT-SET', cascadeLevels: '*', returnMapTypes: '*' },
},
{
id: 'custom',
label: 'Custom',
labelKey: 'common.custom',
params: null,
},
]
Expand All @@ -58,10 +59,12 @@ const buildQueryString = (params, transform) => {
}

const CascadeSelector = ({ onChange, conceptUrl, collectionUrl, showPreviewDefault = false }) => {
const { t } = useTranslation()
const [selectedPresetId, setSelectedPresetId] = React.useState('none')
const [transform, setTransform] = React.useState(false)
const [customParams, setCustomParams] = React.useState(DEFAULT_CUSTOM_PARAMS)
const [showPreview, setShowPreview] = React.useState(showPreviewDefault)
const [showAdvanced, setShowAdvanced] = React.useState(false)

const selectedPreset = PRESETS.find(p => p.id === selectedPresetId)
const baseParams = selectedPresetId === 'custom' ? customParams : (selectedPreset.params || {})
Expand All @@ -85,43 +88,19 @@ const CascadeSelector = ({ onChange, conceptUrl, collectionUrl, showPreviewDefau

return (
<Box>
{/* Cascade dropdown + Transform checkbox on same row */}
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1.5 }}>
<FormControl size="small" sx={{ minWidth: 180 }}>
<FormControl size="small" sx={{ minWidth: 220 }}>
<InputLabel>Cascade</InputLabel>
<Select
value={selectedPresetId}
label="Cascade"
onChange={e => setSelectedPresetId(e.target.value)}
>
{PRESETS.map(preset => (
<MenuItem key={preset.id} value={preset.id}>{preset.label}</MenuItem>
<MenuItem key={preset.id} value={preset.id}>{t(preset.labelKey)}</MenuItem>
))}
</Select>
</FormControl>

<Box sx={{ display: 'flex', alignItems: 'center' }}>
<FormControlLabel
control={
<Checkbox
size="small"
checked={transform}
onChange={e => setTransform(e.target.checked)}
/>
}
label="Transform"
sx={{ mr: 0, '& .MuiFormControlLabel-label': { fontSize: '0.875rem' } }}
/>
<Tooltip
title="Applies the OpenMRS transform to restructure cascade results into OpenMRS-compatible format. Only relevant when using OpenMRS or a custom sourcetoconcepts cascade."
placement="top"
arrow
>
<IconButton size="small" tabIndex={-1} sx={{ p: 0.25, color: 'text.secondary' }}>
<HelpOutlineIcon sx={{ fontSize: '1rem' }} />
</IconButton>
</Tooltip>
</Box>
</Box>

{/* Custom params form */}
Expand Down Expand Up @@ -191,6 +170,45 @@ const CascadeSelector = ({ onChange, conceptUrl, collectionUrl, showPreviewDefau
</Box>
</Collapse>

{/* Advanced options */}
<Box sx={{ mt: 1, display: 'flex', alignItems: 'center', gap: 1 }}>
<Chip
size="small"
label={showAdvanced ? t('reference.hide_advanced') : t('reference.advanced')}
variant="outlined"
clickable
onClick={() => setShowAdvanced(v => !v)}
sx={{ fontSize: '0.7rem' }}
/>
</Box>

<Collapse in={showAdvanced} unmountOnExit>
<Box sx={{ mt: 1.5, pl: 1.5, borderLeft: '2px solid', borderColor: 'divider' }}>
<Box sx={{ display: 'flex', alignItems: 'center' }}>
<FormControlLabel
control={
<Checkbox
size="small"
checked={transform}
onChange={e => setTransform(e.target.checked)}
/>
}
label="Transform"
sx={{ mr: 0, '& .MuiFormControlLabel-label': { fontSize: '0.875rem' } }}
/>
<Tooltip
title={t('reference.transform_tooltip')}
placement="top"
arrow
>
<IconButton size="small" tabIndex={-1} sx={{ p: 0.25, color: 'text.secondary' }}>
<HelpOutlineIcon sx={{ fontSize: '1rem' }} />
</IconButton>
</Tooltip>
</Box>
</Box>
</Collapse>

{/* API call preview */}
<Box sx={{ mt: 1.5, display: 'flex', alignItems: 'center', gap: 1 }}>
<Chip
Expand Down
10 changes: 6 additions & 4 deletions src/i18n/locales/en/translations.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -274,12 +274,16 @@
"intensional": "Intensional",
"extensional": "Extensional",
"cascade": "Cascade",
"unresolved": "Unresolved",
"source_mappings": "Source Mappings",
"all_source_concepts_and_mappings": "All Source Concepts & Mappings",
"versioned_repo": "Versioned (Repo)",
"versioned_resource": "Versioned (Resource)",
"resolved_repo": "Resolved Repo",
"raw": "Raw",
"translation": "Translation"
"translation": "Translation",
"advanced": "Advanced",
"hide_advanced": "Hide advanced",
"transform_tooltip": "Converts the reference to extensional reference(s). References for resolved concepts or mappings will be stored as individual extensional references instead of intensional reference(s)."
},
"checksums": {
"standard": "Standard Checksum",
Expand Down Expand Up @@ -321,7 +325,6 @@
"compositional": "Compositional",
"version_needed": "Version Needed",
"meta": "Meta",
"revision_date": "Revision Date",
"short_code": "Short Code",
"full_name": "Full Name",
"short_name": "Short Name",
Expand Down Expand Up @@ -547,7 +550,6 @@
"last_name": "Last Name",
"company": "Company",
"email_address": "Email Address",
"location": "Location",
"profile_update_success": "Profile updated successfully",
"profile_update_failure": "An error occurred while updating profile.",
"copy_api_token": "Copy API token",
Expand Down
10 changes: 10 additions & 0 deletions src/i18n/locales/es/translations.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,8 @@
"select": "Seleccionar",
"search": "Buscar",
"for": "para",
"none": "Ninguno",
"custom": "Personalizado",
"load_more": "Cargar más"
},
"errors": {
Expand Down Expand Up @@ -67,6 +69,14 @@
"mapping": {
"mappings": "Mapeos"
},
"reference": {
"cascade": "Cascada",
"source_mappings": "Mapeos de la fuente",
"all_source_concepts_and_mappings": "Todos los conceptos y mapeos de la fuente",
"advanced": "Avanzado",
"hide_advanced": "Ocultar avanzado",
"transform_tooltip": "Convierte la referencia en referencia(s) extensional(es). Las referencias para conceptos o mapeos resueltos se almacenaran como referencias extensionales individuales en lugar de referencia(s) intensional(es)."
},
"repo": {
"repos": "Repositorios",
"repo": "Repositorio",
Expand Down
10 changes: 9 additions & 1 deletion src/i18n/locales/zh/translations.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,6 +88,7 @@
"target": "目标",
"properties": "特性",
"custom": "自定义",
"none": "无",
"load_more": "加载更多"
},
"errors": {
Expand Down Expand Up @@ -274,7 +275,6 @@
"last_name": "姓氏",
"company": "公司",
"email_address": "电子邮件地址",
"location": "位置",
"profile_update_success": "已成功更新个人资料",
"profile_update_failure": "更新个人资料时出现错误。",
"copy_api_token": "复制 API 令牌",
Expand All @@ -288,6 +288,14 @@
"user_has_not_created_public_repos_suffix": "尚未创建任何公开的存储库",
"recent_activity": "最近的活动"
},
"reference": {
"cascade": "级联",
"source_mappings": "源映射",
"all_source_concepts_and_mappings": "所有源概念和映射",
"advanced": "高级",
"hide_advanced": "隐藏高级",
"transform_tooltip": "将引用转换为外延引用。已解析概念或映射的引用将作为单独的外延引用存储，而不是作为内涵引用存储。"
},
"search": {
"filters": "筛选项",
"concepts": "概念",
Expand Down