record editor breadcrumb: show code labels

core/survey/_survey/surveyNodeDefs.js

@@ -144,11 +144,14 @@ export const getNodeDefSiblingByName = (nodeDef, name) => (survey) => {
   return getNodeDefChildByName(parentDef, name)(survey)
 }
 
-export const getNodeDefKeys = (nodeDef) =>
-  R.pipe(
-    getNodeDefChildren(nodeDef),
-    R.filter((n) => NodeDef.isKey(n) && !NodeDef.isDeleted(n))
-  )
+const _nodeDefKeysFilter = (n) => NodeDef.isKey(n) && !NodeDef.isDeleted(n)
+
+export const getNodeDefKeys = (nodeDef) => (survey) => getNodeDefChildren(nodeDef)(survey).filter(_nodeDefKeysFilter)
+
+export const getNodeDefKeysSorted =
+  ({ nodeDef, cycle }) =>
+  (survey) =>
+    getNodeDefChildrenSorted({ nodeDef, cycle })(survey).filter(_nodeDefKeysFilter)
 
 export const getNodeDefRootKeys = (survey) => {
   const root = getNodeDefRoot(survey)

core/survey/survey.js

@@ -160,6 +160,7 @@ export const {
   getNodeDefParent,
   getNodeDefSource,
   getNodeDefKeys,
+  getNodeDefKeysSorted,
   isNodeDefRootKey,
   findNodeDef,
   getNodeDefAreaBasedEstimate,

webapp/components/survey/SurveyForm/FormHeader/usePath.js

@@ -1,29 +1,44 @@
 import * as Survey from '@core/survey/survey'
 import * as NodeDef from '@core/survey/nodeDef'
+import * as NodeDefLayout from '@core/survey/nodeDefLayout'
 import * as CategoryItem from '@core/survey/categoryItem'
 import * as Taxon from '@core/survey/taxon'
 import * as Record from '@core/record/record'
 import * as Node from '@core/record/node'
 import * as NodeRefData from '@core/record/nodeRefData'
 
-import { useSurvey, useSurveyPreferredLang } from '@webapp/store/survey'
+import { useSurvey, useSurveyCycleKey, useSurveyPreferredLang } from '@webapp/store/survey'
 import { useNodeDefLabelType, useNodeDefPage, usePagesUuidMap } from '@webapp/store/ui/surveyForm'
 import { useRecord } from '@webapp/store/ui/record'
 
-const getNodeValue = (nodeDef, node) => {
+const getNodeValue = ({ survey, cycle, nodeDef, node, lang }) => {
+  if (Node.isValueBlank(node)) return null
+
   if (NodeDef.isCode(nodeDef)) {
-    const categoryItem = NodeRefData.getCategoryItem(node)
-    return CategoryItem.getCode(categoryItem)
+    const categoryItem =
+      NodeRefData.getCategoryItem(node) ?? Survey.getCategoryItemByUuid(Node.getCategoryItemUuid(node))(survey)
+    if (!categoryItem) return null
+
+    const result = NodeDefLayout.isCodeShown(cycle)(nodeDef)
+      ? CategoryItem.getLabelWithCode(lang)(categoryItem)
+      : CategoryItem.getLabel(lang)(categoryItem)
+    return result ?? CategoryItem.getCode(categoryItem)
   }
   if (NodeDef.isTaxon(nodeDef)) {
     const taxon = NodeRefData.getTaxon(node)
     return Taxon.getCode(taxon)
   }
-  return Node.getValue(node, null)
+  const value = Node.getValue(node, null)
+  if (NodeDef.isText(nodeDef)) {
+    // wrap text values in quotes
+    return `'${value}'`
+  }
+  return value
 }
 
 export const usePath = (entry) => {
   const survey = useSurvey()
+  const cycle = useSurveyCycleKey()
   let nodeDefCurrent = useNodeDefPage()
   const pagesUuidMap = usePagesUuidMap()
   const lang = useSurveyPreferredLang()
@@ -45,10 +60,10 @@ export const usePath = (entry) => {
         : Record.getNodeByUuid(nodeUuidCurrent)(record)
 
       if (nodeCurrent) {
-        const nodeDefKeys = Survey.getNodeDefKeys(nodeDefCurrent)(survey)
+        const nodeDefKeys = Survey.getNodeDefKeysSorted({ nodeDef: nodeDefCurrent, cycle })(survey)
         const keys = nodeDefKeys.map((nodeDefKey) => {
           const nodeKeys = Record.getNodeChildrenByDefUuid(nodeCurrent, NodeDef.getUuid(nodeDefKey))(record)
-          return nodeKeys.map((nodeKey) => getNodeValue(nodeDefKey, nodeKey))
+          return nodeKeys.map((nodeKey) => getNodeValue({ survey, cycle, nodeDef: nodeDefKey, node: nodeKey, lang }))
         })
         label += ` [${keys.flat().join(', ')}]`
       }