From 14eace49cd82838cdf974c65711f4d8d9f20350f Mon Sep 17 00:00:00 2001
From: Claudia Malzer <claudia.malzer@tu-darmstadt.de>
Date: Fri, 20 Oct 2023 14:58:23 +0200
Subject: [PATCH 1/5] #745 Add order parameter back to managament interface

* pass order value to Section, Page, and Question
---
 .../assets/js/components/common/Links.js      | 27 +++++-----
 .../assets/js/components/element/Page.js      | 38 +++++++-------
 .../assets/js/components/element/Question.js  | 19 +++----
 .../assets/js/components/element/Section.js   | 50 ++++++++++++-------
 .../js/components/nested/NestedCatalog.js     | 45 +++++++++++------
 5 files changed, 108 insertions(+), 71 deletions(-)

diff --git a/rdmo/management/assets/js/components/common/Links.js b/rdmo/management/assets/js/components/common/Links.js
index 0c291ad8ed..687e7fa9ae 100644
--- a/rdmo/management/assets/js/components/common/Links.js
+++ b/rdmo/management/assets/js/components/common/Links.js
@@ -7,7 +7,7 @@ import isUndefined from 'lodash/isUndefined'
 import Link from 'rdmo/core/assets/js/components/Link'
 import LinkButton from 'rdmo/core/assets/js/components/LinkButton'
 
-const NestedLink = ({ href, title, onClick, show=true }) => {
+const NestedLink = ({ href, title, onClick, show = true }) => {
   return show && <Link href={href} className="element-link fa fa-align-right flip" title={title} onClick={onClick} />
 }
 
@@ -74,7 +74,7 @@ const AvailableLink = ({ available, locked, title, onClick, disabled }) => {
   })
 
   return <LinkButton className={className} title={locked ? gettext('Locked') : title}
-                     disabled={locked || disabled} onClick={onClick} />
+    disabled={locked || disabled} onClick={onClick} />
 }
 
 AvailableLink.propTypes = {
@@ -120,7 +120,7 @@ ShowElementsLink.propTypes = {
   onClick: PropTypes.func.isRequired
 }
 
-const ExportLink = ({ exportUrl, title, exportFormats, csv=false, full=false }) => {
+const ExportLink = ({ exportUrl, title, exportFormats, csv = false, full = false }) => {
   return (
     <span className="dropdown">
       <button className="element-btn-link btn-link fa fa-download" title={title} data-toggle="dropdown"></button>
@@ -144,8 +144,8 @@ const ExportLink = ({ exportUrl, title, exportFormats, csv=false, full=false })
         {
           exportFormats.map(([key, label], index) => <li key={index}>
             <a href={`${exportUrl}${key}/`}
-               target={['pdf', 'html'].includes(key) ? '_blank' : '_self'}
-               rel="noreferrer">{label}</a>
+              target={['pdf', 'html'].includes(key) ? '_blank' : '_self'}
+              rel="noreferrer">{label}</a>
           </li>)
         }
       </ul>
@@ -169,7 +169,7 @@ const ExtendLink = ({ extend, onClick }) => {
   })
 
   const title = extend ? gettext('Show less')
-                       : gettext('Show more')
+    : gettext('Show more')
 
   return <Link className={className} title={title} onClick={onClick} />
 }
@@ -179,18 +179,19 @@ ExtendLink.propTypes = {
   onClick: PropTypes.func.isRequired
 }
 
-const CodeLink = ({ className, uri, onClick }) => {
+const CodeLink = ({ className, uri, onClick, order }) => {
   return (
-    <Link onClick={onClick}>
+    <><Link onClick={onClick}>
       <code className={className}>{uri}</code>
-    </Link>
+    </Link>{order !== undefined && order !== null ? <code className="code-order ng-binding">{order}</code> : null}</>
   )
 }
 
 CodeLink.propTypes = {
   className: PropTypes.string.isRequired,
   uri: PropTypes.string.isRequired,
-  onClick: PropTypes.func.isRequired
+  onClick: PropTypes.func.isRequired,
+  order: PropTypes.number
 }
 
 const ErrorLink = ({ element, onClick }) => {
@@ -235,5 +236,7 @@ ShowLink.propTypes = {
   onClick: PropTypes.func.isRequired
 }
 
-export { EditLink, CopyLink, AddLink, AvailableLink, LockedLink, ShowElementsLink,
-         NestedLink, ExportLink, ExtendLink, CodeLink, ErrorLink, WarningLink, ShowLink }
+export {
+  EditLink, CopyLink, AddLink, AvailableLink, LockedLink, ShowElementsLink,
+  NestedLink, ExportLink, ExtendLink, CodeLink, ErrorLink, WarningLink, ShowLink
+}
diff --git a/rdmo/management/assets/js/components/element/Page.js b/rdmo/management/assets/js/components/element/Page.js
index af692967be..d30a08c13d 100644
--- a/rdmo/management/assets/js/components/element/Page.js
+++ b/rdmo/management/assets/js/components/element/Page.js
@@ -8,13 +8,15 @@ import { buildPath } from '../../utils/location'
 import QuestionSet from './QuestionSet'
 import Question from './Question'
 import { ElementErrors } from '../common/Errors'
-import { EditLink, CopyLink, AddLink, LockedLink, NestedLink,
-         ExportLink, CodeLink, ShowElementsLink } from '../common/Links'
+import {
+  EditLink, CopyLink, AddLink, LockedLink, NestedLink,
+  ExportLink, CodeLink, ShowElementsLink
+} from '../common/Links'
 import { ReadOnlyIcon } from '../common/Icons'
 import { Drag, Drop } from '../common/DragAndDrop'
 
-const Page = ({ config, page, configActions, elementActions, display='list', indent=0,
-                filter=false, filterEditors=false }) => {
+const Page = ({ config, page, configActions, elementActions, display = 'list', indent = 0,
+  filter = false, filterEditors = false, order }) => {
 
   const showElement = filterElement(config, filter, false, filterEditors, page)
   const showElements = get(config, `display.elements.pages.${page.id}`, true)
@@ -27,7 +29,7 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
   const fetchEdit = () => elementActions.fetchElement('pages', page.id)
   const fetchCopy = () => elementActions.fetchElement('pages', page.id, 'copy')
   const fetchNested = () => elementActions.fetchElement('pages', page.id, 'nested')
-  const toggleLocked = () => elementActions.storeElement('pages', {...page, locked: !page.locked })
+  const toggleLocked = () => elementActions.storeElement('pages', { ...page, locked: !page.locked })
   const toggleElements = () => configActions.toggleElements(page)
 
   const createQuestionSet = () => elementActions.createElement('questionsets', { page })
@@ -35,7 +37,6 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
 
   const fetchAttribute = () => elementActions.fetchElement('attributes', page.attribute)
   const fetchCondition = (index) => elementActions.fetchElement('conditions', page.conditions[index])
-
   const elementNode = (
     <div className="element">
       <div className="pull-right">
@@ -45,11 +46,11 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
         <EditLink title={gettext('Edit page')} href={editUrl} onClick={fetchEdit} />
         <CopyLink title={gettext('Copy page')} href={copyUrl} onClick={fetchCopy} />
         <AddLink title={gettext('Add question')} altTitle={gettext('Add question set')}
-                 onClick={createQuestion} onAltClick={createQuestionSet} disabled={page.read_only} />
+          onClick={createQuestion} onAltClick={createQuestionSet} disabled={page.read_only} />
         <LockedLink title={page.locked ? gettext('Unlock page') : gettext('Lock page')}
-                    locked={page.locked} onClick={toggleLocked} disabled={page.read_only} />
+          locked={page.locked} onClick={toggleLocked} disabled={page.read_only} />
         <ExportLink title={gettext('Export page')} exportUrl={exportUrl}
-                    exportFormats={config.settings.export_formats} full={true} />
+          exportFormats={config.settings.export_formats} full={true} />
         <Drag element={page} show={display == 'nested'} />
       </div>
       <div>
@@ -58,7 +59,7 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
         </p>
         {
           get(config, 'display.uri.pages', true) && <p>
-            <CodeLink className="code-questions" uri={page.uri} onClick={() => fetchEdit()} />
+            <CodeLink className="code-questions" uri={page.uri} onClick={() => fetchEdit()} order={order} />
           </p>
         }
         {
@@ -82,7 +83,7 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
     case 'list':
       return showElement && (
         <li className="list-group-item">
-          { elementNode }
+          {elementNode}
         </li>
       )
     case 'nested':
@@ -93,7 +94,7 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
               <Drop element={page} elementActions={elementActions}>
                 <div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
                   <div className="panel-heading">
-                    { elementNode }
+                    {elementNode}
                   </div>
                 </div>
               </Drop>
@@ -101,14 +102,16 @@ const Page = ({ config, page, configActions, elementActions, display='list', ind
           }
           {
             showElements && page.elements.map((element, index) => {
+              const questionInfo = page.questions.find(info => info.question === element.id)
+              const questionOrder = questionInfo ? questionInfo.order : null // Get the order value
               if (element.model == 'questions.questionset') {
                 return <QuestionSet key={index} config={config} questionset={element}
-                                    configActions={configActions} elementActions={elementActions}
-                                    display="nested" filter={filter}  indent={indent + 1} />
+                  configActions={configActions} elementActions={elementActions}
+                  display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
               } else {
                 return <Question key={index} config={config} question={element}
-                                 configActions={configActions} elementActions={elementActions}
-                                 display="nested" filter={filter}  indent={indent + 1}  />
+                  configActions={configActions} elementActions={elementActions}
+                  display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
               }
             })
           }
@@ -128,7 +131,8 @@ Page.propTypes = {
   display: PropTypes.string,
   indent: PropTypes.number,
   filter: PropTypes.string,
-  filterEditors: PropTypes.bool
+  filterEditors: PropTypes.bool,
+  order: PropTypes.number
 }
 
 export default Page
diff --git a/rdmo/management/assets/js/components/element/Question.js b/rdmo/management/assets/js/components/element/Question.js
index ecf280573f..27faedeec9 100644
--- a/rdmo/management/assets/js/components/element/Question.js
+++ b/rdmo/management/assets/js/components/element/Question.js
@@ -10,8 +10,8 @@ import { EditLink, CopyLink, LockedLink, ExportLink, CodeLink } from '../common/
 import { ReadOnlyIcon } from '../common/Icons'
 import { Drag, Drop } from '../common/DragAndDrop'
 
-const Question = ({ config, question, elementActions, display='list', indent=0,
-                    filter=false, filterEditors=false }) => {
+const Question = ({ config, question, elementActions, display = 'list', indent = 0,
+  filter = false, filterEditors = false, order }) => {
 
   const showElement = filterElement(config, filter, false, filterEditors, question)
 
@@ -21,7 +21,7 @@ const Question = ({ config, question, elementActions, display='list', indent=0,
 
   const fetchEdit = () => elementActions.fetchElement('questions', question.id)
   const fetchCopy = () => elementActions.fetchElement('questions', question.id, 'copy')
-  const toggleLocked = () => elementActions.storeElement('questions', {...question, locked: !question.locked })
+  const toggleLocked = () => elementActions.storeElement('questions', { ...question, locked: !question.locked })
 
   const fetchAttribute = () => elementActions.fetchElement('attributes', question.attribute)
   const fetchCondition = (index) => elementActions.fetchElement('conditions', question.conditions[index])
@@ -34,9 +34,9 @@ const Question = ({ config, question, elementActions, display='list', indent=0,
         <EditLink title={gettext('Edit question')} href={editUrl} onClick={fetchEdit} />
         <CopyLink title={gettext('Copy question')} href={copyUrl} onClick={fetchCopy} />
         <LockedLink title={question.locked ? gettext('Unlock question') : gettext('Lock question')}
-                    locked={question.locked} onClick={toggleLocked} disabled={question.read_only} />
+          locked={question.locked} onClick={toggleLocked} disabled={question.read_only} />
         <ExportLink title={gettext('Export question')} exportUrl={exportUrl}
-                    exportFormats={config.settings.export_formats} full={true} />
+          exportFormats={config.settings.export_formats} full={true} />
         <Drag element={question} show={display == 'nested'} />
       </div>
       <div>
@@ -46,7 +46,7 @@ const Question = ({ config, question, elementActions, display='list', indent=0,
         </p>
         {
           get(config, 'display.uri.questions', true) && <p>
-            <CodeLink className="code-questions" uri={question.uri} onClick={() => fetchEdit()} />
+            <CodeLink className="code-questions" uri={question.uri} onClick={() => fetchEdit()} order={order} />
           </p>
         }
         {
@@ -77,7 +77,7 @@ const Question = ({ config, question, elementActions, display='list', indent=0,
     case 'list':
       return showElement && (
         <li className="list-group-item">
-          { elementNode }
+          {elementNode}
         </li>
       )
     case 'nested':
@@ -87,7 +87,7 @@ const Question = ({ config, question, elementActions, display='list', indent=0,
             showElement && (
               <div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
                 <div className="panel-body">
-                  { elementNode }
+                  {elementNode}
                 </div>
               </div>
             )
@@ -106,7 +106,8 @@ Question.propTypes = {
   display: PropTypes.string,
   indent: PropTypes.number,
   filter: PropTypes.string,
-  filterEditors: PropTypes.bool
+  filterEditors: PropTypes.bool,
+  order: PropTypes.number
 }
 
 export default Question
diff --git a/rdmo/management/assets/js/components/element/Section.js b/rdmo/management/assets/js/components/element/Section.js
index c675ee8103..d893b5836a 100644
--- a/rdmo/management/assets/js/components/element/Section.js
+++ b/rdmo/management/assets/js/components/element/Section.js
@@ -8,14 +8,16 @@ import { buildPath } from '../../utils/location'
 
 import Page from './Page'
 import { ElementErrors } from '../common/Errors'
-import { EditLink, CopyLink, AddLink, LockedLink, NestedLink, ExportLink,
-         CodeLink, ShowElementsLink } from '../common/Links'
+import {
+  EditLink, CopyLink, AddLink, LockedLink, NestedLink, ExportLink,
+  CodeLink, ShowElementsLink
+} from '../common/Links'
 import { ReadOnlyIcon } from '../common/Icons'
 import { Drag, Drop } from '../common/DragAndDrop'
 
 
-const Section = ({ config, section, configActions, elementActions, display='list', indent=0,
-                   filter=false, filterEditors=false }) => {
+const Section = ({ config, section, configActions, elementActions, display = 'list', indent = 0,
+  filter = false, filterEditors = false, order }) => {
 
   const showElement = filterElement(config, filter, false, filterEditors, section)
   const showElements = get(config, `display.elements.sections.${section.id}`, true)
@@ -28,7 +30,7 @@ const Section = ({ config, section, configActions, elementActions, display='list
   const fetchEdit = () => elementActions.fetchElement('sections', section.id)
   const fetchCopy = () => elementActions.fetchElement('sections', section.id, 'copy')
   const fetchNested = () => elementActions.fetchElement('sections', section.id, 'nested')
-  const toggleLocked = () => elementActions.storeElement('sections', {...section, locked: !section.locked })
+  const toggleLocked = () => elementActions.storeElement('sections', { ...section, locked: !section.locked })
   const toggleElements = () => configActions.toggleElements(section)
 
   const createPage = () => elementActions.createElement('pages', { section })
@@ -43,10 +45,10 @@ const Section = ({ config, section, configActions, elementActions, display='list
         <CopyLink title={gettext('Copy section')} href={copyUrl} onClick={fetchCopy} />
         <AddLink title={gettext('Add page')} onClick={createPage} disabled={section.read_only} />
         <LockedLink title={section.locked ? gettext('Unlock section')
-                                          : gettext('Lock section')}
-                    locked={section.locked} onClick={toggleLocked} disabled={section.read_only} />
+          : gettext('Lock section')}
+          locked={section.locked} onClick={toggleLocked} disabled={section.read_only} />
         <ExportLink title={gettext('Export section')} exportUrl={exportUrl}
-                    exportFormats={config.settings.export_formats} full={true} />
+          exportFormats={config.settings.export_formats} full={true} />
         <Drag element={section} show={display == 'nested'} />
       </div>
       <div>
@@ -55,7 +57,7 @@ const Section = ({ config, section, configActions, elementActions, display='list
         </p>
         {
           get(config, 'display.uri.sections', true) &&
-          <CodeLink className="code-questions" uri={section.uri} onClick={() => fetchEdit()} />
+          <CodeLink className="code-questions" uri={section.uri} onClick={() => fetchEdit()} order={order} />
         }
         <ElementErrors element={section} />
       </div>
@@ -66,7 +68,7 @@ const Section = ({ config, section, configActions, elementActions, display='list
     case 'list':
       return showElement && (
         <li className="list-group-item">
-          { elementNode }
+          {elementNode}
         </li>
       )
     case 'nested':
@@ -77,7 +79,7 @@ const Section = ({ config, section, configActions, elementActions, display='list
               <Drop element={section} elementActions={elementActions}>
                 <div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
                   <div className="panel-heading">
-                    { elementNode }
+                    {elementNode}
                   </div>
                 </div>
               </Drop>
@@ -88,11 +90,24 @@ const Section = ({ config, section, configActions, elementActions, display='list
             <Drop element={section.elements[0]} elementActions={elementActions} indent={indent + 1} mode="before" />
           }
           {
-            showElements && section.elements.map((page, index) => (
-              <Page key={index} config={config} page={page}
-                    configActions={configActions} elementActions={elementActions}
-                    display="nested" filter={filter} indent={indent + 1} />
-            ))
+            showElements && section.elements.map((page, index) => {
+              const pageInfo = section.pages.find(info => info.page === page.id)
+              const pageOrder = pageInfo ? pageInfo.order : null // Get the order value
+
+              return (
+                <Page
+                  key={index}
+                  config={config}
+                  page={page}
+                  configActions={configActions}
+                  elementActions={elementActions}
+                  display="nested"
+                  filter={filter}
+                  indent={indent + 1}
+                  order={pageOrder}
+                />
+              )
+            })
           }
           <Drop element={section} elementActions={elementActions} indent={indent} mode="after" />
         </>
@@ -110,7 +125,8 @@ Section.propTypes = {
   display: PropTypes.string,
   indent: PropTypes.number,
   filter: PropTypes.string,
-  filterEditors: PropTypes.bool
+  filterEditors: PropTypes.bool,
+  order: PropTypes.number
 }
 
 export default Section
diff --git a/rdmo/management/assets/js/components/nested/NestedCatalog.js b/rdmo/management/assets/js/components/nested/NestedCatalog.js
index 3b2809f909..654e868d9a 100644
--- a/rdmo/management/assets/js/components/nested/NestedCatalog.js
+++ b/rdmo/management/assets/js/components/nested/NestedCatalog.js
@@ -40,18 +40,18 @@ const NestedCatalog = ({ config, catalog, configActions, elementActions }) => {
             <BackButton />
           </div>
           <Catalog config={config} catalog={catalog}
-                   configActions={configActions} elementActions={elementActions} display="plain" />
+            configActions={configActions} elementActions={elementActions} display="plain" />
         </div>
 
         <div className="panel-body">
           <div className="row">
             <div className="col-sm-8">
               <FilterString value={get(config, 'filter.catalog.search', '')} onChange={updateFilterString}
-                            placeholder={gettext('Filter catalogs')} />
+                placeholder={gettext('Filter catalogs')} />
             </div>
             <div className="col-sm-4">
               <FilterUriPrefix value={get(config, 'filter.catalog.uri_prefix', '')} onChange={updateFilterUriPrefix}
-                               options={getUriPrefixes(catalog.elements)} />
+                options={getUriPrefixes(catalog.elements)} />
             </div>
           </div>
           <div className="mt-10">
@@ -63,21 +63,21 @@ const NestedCatalog = ({ config, catalog, configActions, elementActions }) => {
           <div className="checkboxes">
             <span className="mr-10">{gettext('Show URIs:')}</span>
             <Checkbox label={<code className="code-questions">{gettext('Catalogs')}</code>}
-                      value={get(config, 'display.uri.catalogs', true)} onChange={updateDisplayCatalogURI} />
+              value={get(config, 'display.uri.catalogs', true)} onChange={updateDisplayCatalogURI} />
             <Checkbox label={<code className="code-questions">{gettext('Sections')}</code>}
-                      value={get(config, 'display.uri.sections', true)} onChange={updateDisplaySectionsURI} />
+              value={get(config, 'display.uri.sections', true)} onChange={updateDisplaySectionsURI} />
             <Checkbox label={<code className="code-questions">{gettext('Pages')}</code>}
-                      value={get(config, 'display.uri.pages', true)} onChange={updateDisplayPagesURI} />
+              value={get(config, 'display.uri.pages', true)} onChange={updateDisplayPagesURI} />
             <Checkbox label={<code className="code-questions">{gettext('Question sets')}</code>}
-                      value={get(config, 'display.uri.questionsets', true)} onChange={updateDisplayQuestionSetsURI} />
+              value={get(config, 'display.uri.questionsets', true)} onChange={updateDisplayQuestionSetsURI} />
             <Checkbox label={<code className="code-questions'">{gettext('Questions')}</code>}
-                      value={get(config, 'display.uri.questions', true)} onChange={updateDisplayQuestionsURI} />
+              value={get(config, 'display.uri.questions', true)} onChange={updateDisplayQuestionsURI} />
             <Checkbox label={<code className="code-domain">{gettext('Attributes')}</code>}
-                      value={get(config, 'display.uri.attributes', true)} onChange={updateDisplayAttributesURI} />
+              value={get(config, 'display.uri.attributes', true)} onChange={updateDisplayAttributesURI} />
             <Checkbox label={<code className="code-conditions">{gettext('Conditions')}</code>}
-                      value={get(config, 'display.uri.conditions', true)} onChange={updateDisplayConditionsURI} />
+              value={get(config, 'display.uri.conditions', true)} onChange={updateDisplayConditionsURI} />
             <Checkbox label={<code className="code-options">{gettext('Option sets')}</code>}
-                      value={get(config, 'display.uri.optionsets', true)} onChange={updateDisplayOptionSetURI} />
+              value={get(config, 'display.uri.optionsets', true)} onChange={updateDisplayOptionSetURI} />
           </div>
         </div>
       </div>
@@ -86,12 +86,25 @@ const NestedCatalog = ({ config, catalog, configActions, elementActions }) => {
         <Drop element={catalog.elements[0]} elementActions={elementActions} indent={0} mode="before" />
       }
       {
-        catalog.elements.map((section, index) => (
-          <Section key={index} config={config} section={section}
-                   configActions={configActions} elementActions={elementActions}
-                   display="nested" filter="catalog" indent={0} />
-        ))
+        catalog.elements.map((section, index) => {
+          const sectionInfo = catalog.sections.find(info => info.section === section.id)
+          const sectionOrder = sectionInfo ? sectionInfo.order : null // Get the order value
+
+          return (
+            <Section key={index}
+              config={config}
+              section={section}
+              configActions={configActions}
+              elementActions={elementActions}
+              display="nested"
+              filter="catalog"
+              indent={0}
+              order={sectionOrder} // Pass the order value as a prop
+            />
+          )
+        })
       }
+
     </>
   )
 }

From de725c352b5da44c651823149d89f537d852225d Mon Sep 17 00:00:00 2001
From: Claudia Malzer <claudia.malzer@tu-darmstadt.de>
Date: Fri, 20 Oct 2023 15:38:24 +0200
Subject: [PATCH 2/5] #745 Add order parameter back to managament interface

* pass order value to QuestionSet
* pass order value to Question from QuestionSet
---
 .../assets/js/components/element/Page.js      |  8 ++--
 .../js/components/element/QuestionSet.js      | 41 +++++++++++--------
 .../assets/js/components/element/Section.js   |  2 +-
 .../js/components/nested/NestedCatalog.js     |  4 +-
 4 files changed, 32 insertions(+), 23 deletions(-)

diff --git a/rdmo/management/assets/js/components/element/Page.js b/rdmo/management/assets/js/components/element/Page.js
index d30a08c13d..2bf9f79614 100644
--- a/rdmo/management/assets/js/components/element/Page.js
+++ b/rdmo/management/assets/js/components/element/Page.js
@@ -102,13 +102,15 @@ const Page = ({ config, page, configActions, elementActions, display = 'list', i
           }
           {
             showElements && page.elements.map((element, index) => {
-              const questionInfo = page.questions.find(info => info.question === element.id)
-              const questionOrder = questionInfo ? questionInfo.order : null // Get the order value
               if (element.model == 'questions.questionset') {
+                const questionSetInfo = page.questionsets.find(info => info.questionset === element.id)
+                const questionSetOrder = questionSetInfo ? questionSetInfo.order : undefined
                 return <QuestionSet key={index} config={config} questionset={element}
                   configActions={configActions} elementActions={elementActions}
-                  display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
+                  display="nested" filter={filter} indent={indent + 1} order={questionSetOrder} />
               } else {
+                const questionInfo = page.questions.find(info => info.question === element.id)
+                const questionOrder = questionInfo ? questionInfo.order : undefined
                 return <Question key={index} config={config} question={element}
                   configActions={configActions} elementActions={elementActions}
                   display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
diff --git a/rdmo/management/assets/js/components/element/QuestionSet.js b/rdmo/management/assets/js/components/element/QuestionSet.js
index 024652536f..bf975e37b2 100644
--- a/rdmo/management/assets/js/components/element/QuestionSet.js
+++ b/rdmo/management/assets/js/components/element/QuestionSet.js
@@ -7,13 +7,15 @@ import { buildPath } from '../../utils/location'
 
 import Question from './Question'
 import { ElementErrors } from '../common/Errors'
-import { EditLink, CopyLink, AddLink, LockedLink,
-         NestedLink, ExportLink, CodeLink, ShowElementsLink } from '../common/Links'
+import {
+  EditLink, CopyLink, AddLink, LockedLink,
+  NestedLink, ExportLink, CodeLink, ShowElementsLink
+} from '../common/Links'
 import { ReadOnlyIcon } from '../common/Icons'
 import { Drag, Drop } from '../common/DragAndDrop'
 
-const QuestionSet = ({ config, questionset, configActions, elementActions, display='list', indent=0,
-                       filter=false, filterEditors=false }) => {
+const QuestionSet = ({ config, questionset, configActions, elementActions, display = 'list', indent = 0,
+  filter = false, filterEditors = false, order }) => {
 
   const showElement = filterElement(config, filter, false, filterEditors, questionset)
   const showElements = get(config, `display.elements.questionsets.${questionset.id}`, true)
@@ -26,7 +28,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
   const fetchEdit = () => elementActions.fetchElement('questionsets', questionset.id)
   const fetchCopy = () => elementActions.fetchElement('questionsets', questionset.id, 'copy')
   const fetchNested = () => elementActions.fetchElement('questionsets', questionset.id, 'nested')
-  const toggleLocked = () => elementActions.storeElement('questionsets', {...questionset, locked: !questionset.locked })
+  const toggleLocked = () => elementActions.storeElement('questionsets', { ...questionset, locked: !questionset.locked })
   const toggleElements = () => configActions.toggleElements(questionset)
 
   const createQuestionSet = () => elementActions.createElement('questionsets', { questionset })
@@ -44,11 +46,11 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
         <EditLink title={gettext('Edit question set')} href={editUrl} onClick={fetchEdit} />
         <CopyLink title={gettext('Copy question set')} href={copyUrl} onClick={fetchCopy} />
         <AddLink title={gettext('Add question')} altTitle={gettext('Add question set')}
-                 onClick={createQuestion} onAltClick={createQuestionSet} disabled={questionset.read_only} />
+          onClick={createQuestion} onAltClick={createQuestionSet} disabled={questionset.read_only} />
         <LockedLink title={questionset.locked ? gettext('Unlock question set') : gettext('Lock question set')}
-                    locked={questionset.locked} onClick={toggleLocked} disabled={questionset.read_only} />
+          locked={questionset.locked} onClick={toggleLocked} disabled={questionset.read_only} />
         <ExportLink title={gettext('Export question set')} exportUrl={exportUrl}
-                    exportFormats={config.settings.export_formats} full={true} />
+          exportFormats={config.settings.export_formats} full={true} />
         <Drag element={questionset} show={display == 'nested'} />
       </div>
       <div>
@@ -57,11 +59,11 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
         </p>
         {
           get(config, 'display.uri.questionsets', true) && <p>
-            <CodeLink className="code-questions" uri={questionset.uri} onClick={() => fetchEdit()} />
+            <CodeLink className="code-questions" uri={questionset.uri} onClick={() => fetchEdit()} order={order} />
           </p>
         }
         {
-          get(config, 'display.uri.attributes', true) && questionset.attribute_uri &&<p>
+          get(config, 'display.uri.attributes', true) && questionset.attribute_uri && <p>
             <CodeLink className="code-domain" uri={questionset.attribute_uri} onClick={() => fetchAttribute()} />
           </p>
         }
@@ -81,7 +83,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
     case 'list':
       return showElement && (
         <li className="list-group-item">
-          { elementNode }
+          {elementNode}
         </li>
       )
     case 'nested':
@@ -92,7 +94,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
               <Drop element={questionset} elementActions={elementActions}>
                 <div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
                   <div className="panel-heading">
-                    { elementNode }
+                    {elementNode}
                   </div>
                 </div>
               </Drop>
@@ -101,13 +103,17 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
           {
             showElements && questionset.elements.map((element, index) => {
               if (element.model == 'questions.questionset') {
+                const questionSetInfo = questionset.questionsets.find(info => info.questionset === element.id)
+                const questionSetOrder = questionSetInfo ? questionSetInfo.order : undefined
                 return <QuestionSet key={index} config={config} questionset={element}
-                                    configActions={configActions} elementActions={elementActions}
-                                    display="nested" filter={filter} indent={indent + 1}  />
+                  configActions={configActions} elementActions={elementActions}
+                  display="nested" filter={filter} indent={indent + 1} order={questionSetOrder} />
               } else {
+                const questionInfo = questionset.questions.find(info => info.question === element.id)
+                const questionOrder = questionInfo ? questionInfo.order : undefined
                 return <Question key={index} config={config} question={element}
-                                 configActions={configActions} elementActions={elementActions}
-                                 display="nested" filter={filter} indent={indent + 1} />
+                  configActions={configActions} elementActions={elementActions}
+                  display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
               }
             })
           }
@@ -127,7 +133,8 @@ QuestionSet.propTypes = {
   display: PropTypes.string,
   indent: PropTypes.number,
   filter: PropTypes.string,
-  filterEditors: PropTypes.bool
+  filterEditors: PropTypes.bool,
+  order: PropTypes.number
 }
 
 export default QuestionSet
diff --git a/rdmo/management/assets/js/components/element/Section.js b/rdmo/management/assets/js/components/element/Section.js
index d893b5836a..2b6de70075 100644
--- a/rdmo/management/assets/js/components/element/Section.js
+++ b/rdmo/management/assets/js/components/element/Section.js
@@ -92,7 +92,7 @@ const Section = ({ config, section, configActions, elementActions, display = 'li
           {
             showElements && section.elements.map((page, index) => {
               const pageInfo = section.pages.find(info => info.page === page.id)
-              const pageOrder = pageInfo ? pageInfo.order : null // Get the order value
+              const pageOrder = pageInfo ? pageInfo.order : undefined
 
               return (
                 <Page
diff --git a/rdmo/management/assets/js/components/nested/NestedCatalog.js b/rdmo/management/assets/js/components/nested/NestedCatalog.js
index 654e868d9a..2eb1895c91 100644
--- a/rdmo/management/assets/js/components/nested/NestedCatalog.js
+++ b/rdmo/management/assets/js/components/nested/NestedCatalog.js
@@ -88,7 +88,7 @@ const NestedCatalog = ({ config, catalog, configActions, elementActions }) => {
       {
         catalog.elements.map((section, index) => {
           const sectionInfo = catalog.sections.find(info => info.section === section.id)
-          const sectionOrder = sectionInfo ? sectionInfo.order : null // Get the order value
+          const sectionOrder = sectionInfo ? sectionInfo.order : undefined
 
           return (
             <Section key={index}
@@ -99,7 +99,7 @@ const NestedCatalog = ({ config, catalog, configActions, elementActions }) => {
               display="nested"
               filter="catalog"
               indent={0}
-              order={sectionOrder} // Pass the order value as a prop
+              order={sectionOrder}
             />
           )
         })

From 8c31431bb1c562500259b524947cd5e540f03e4c Mon Sep 17 00:00:00 2001
From: Claudia Malzer <claudia.malzer@tu-darmstadt.de>
Date: Sat, 28 Oct 2023 09:44:51 +0200
Subject: [PATCH 3/5] * revert auto formatting * fix change requests

---
 .../assets/js/components/common/Links.js      | 29 +++++++++--------
 .../assets/js/components/element/Page.js      | 31 +++++++++---------
 .../assets/js/components/element/Question.js  | 14 ++++----
 .../js/components/element/QuestionSet.js      | 32 +++++++++----------
 .../assets/js/components/element/Section.js   | 20 ++++++------
 .../js/components/nested/NestedCatalog.js     | 22 ++++++-------
 6 files changed, 73 insertions(+), 75 deletions(-)

diff --git a/rdmo/management/assets/js/components/common/Links.js b/rdmo/management/assets/js/components/common/Links.js
index 687e7fa9ae..8fbe780447 100644
--- a/rdmo/management/assets/js/components/common/Links.js
+++ b/rdmo/management/assets/js/components/common/Links.js
@@ -7,7 +7,7 @@ import isUndefined from 'lodash/isUndefined'
 import Link from 'rdmo/core/assets/js/components/Link'
 import LinkButton from 'rdmo/core/assets/js/components/LinkButton'
 
-const NestedLink = ({ href, title, onClick, show = true }) => {
+const NestedLink = ({ href, title, onClick, show=true }) => {
   return show && <Link href={href} className="element-link fa fa-align-right flip" title={title} onClick={onClick} />
 }
 
@@ -74,7 +74,7 @@ const AvailableLink = ({ available, locked, title, onClick, disabled }) => {
   })
 
   return <LinkButton className={className} title={locked ? gettext('Locked') : title}
-    disabled={locked || disabled} onClick={onClick} />
+                     disabled={locked || disabled} onClick={onClick} />
 }
 
 AvailableLink.propTypes = {
@@ -120,7 +120,7 @@ ShowElementsLink.propTypes = {
   onClick: PropTypes.func.isRequired
 }
 
-const ExportLink = ({ exportUrl, title, exportFormats, csv = false, full = false }) => {
+const ExportLink = ({ exportUrl, title, exportFormats, csv=false, full=false }) => {
   return (
     <span className="dropdown">
       <button className="element-btn-link btn-link fa fa-download" title={title} data-toggle="dropdown"></button>
@@ -144,8 +144,8 @@ const ExportLink = ({ exportUrl, title, exportFormats, csv = false, full = false
         {
           exportFormats.map(([key, label], index) => <li key={index}>
             <a href={`${exportUrl}${key}/`}
-              target={['pdf', 'html'].includes(key) ? '_blank' : '_self'}
-              rel="noreferrer">{label}</a>
+               target={['pdf', 'html'].includes(key) ? '_blank' : '_self'}
+               rel="noreferrer">{label}</a>
           </li>)
         }
       </ul>
@@ -169,7 +169,7 @@ const ExtendLink = ({ extend, onClick }) => {
   })
 
   const title = extend ? gettext('Show less')
-    : gettext('Show more')
+                       : gettext('Show more')
 
   return <Link className={className} title={title} onClick={onClick} />
 }
@@ -181,9 +181,14 @@ ExtendLink.propTypes = {
 
 const CodeLink = ({ className, uri, onClick, order }) => {
   return (
-    <><Link onClick={onClick}>
-      <code className={className}>{uri}</code>
-    </Link>{order !== undefined && order !== null ? <code className="code-order ng-binding">{order}</code> : null}</>
+    <>
+      <Link onClick={onClick}>
+        <code className={className}>{uri}</code>
+      </Link>
+      {order !== undefined && order !== null ? (
+        <>{' '}<code className="code-order ng-binding">{order}</code></>
+      ) : null}
+    </>
   )
 }
 
@@ -236,7 +241,5 @@ ShowLink.propTypes = {
   onClick: PropTypes.func.isRequired
 }
 
-export {
-  EditLink, CopyLink, AddLink, AvailableLink, LockedLink, ShowElementsLink,
-  NestedLink, ExportLink, ExtendLink, CodeLink, ErrorLink, WarningLink, ShowLink
-}
+export { EditLink, CopyLink, AddLink, AvailableLink, LockedLink, ShowElementsLink,
+         NestedLink, ExportLink, ExtendLink, CodeLink, ErrorLink, WarningLink, ShowLink }
diff --git a/rdmo/management/assets/js/components/element/Page.js b/rdmo/management/assets/js/components/element/Page.js
index 2bf9f79614..0a7e086296 100644
--- a/rdmo/management/assets/js/components/element/Page.js
+++ b/rdmo/management/assets/js/components/element/Page.js
@@ -8,15 +8,13 @@ import { buildPath } from '../../utils/location'
 import QuestionSet from './QuestionSet'
 import Question from './Question'
 import { ElementErrors } from '../common/Errors'
-import {
-  EditLink, CopyLink, AddLink, LockedLink, NestedLink,
-  ExportLink, CodeLink, ShowElementsLink
-} from '../common/Links'
+import { EditLink, CopyLink, AddLink, LockedLink, NestedLink,
+         ExportLink, CodeLink, ShowElementsLink } from '../common/Links'
 import { ReadOnlyIcon } from '../common/Icons'
 import { Drag, Drop } from '../common/DragAndDrop'
 
-const Page = ({ config, page, configActions, elementActions, display = 'list', indent = 0,
-  filter = false, filterEditors = false, order }) => {
+const Page = ({ config, page, configActions, elementActions, display='list', indent=0,
+                filter=false, filterEditors=false, order }) => {
 
   const showElement = filterElement(config, filter, false, filterEditors, page)
   const showElements = get(config, `display.elements.pages.${page.id}`, true)
@@ -29,7 +27,7 @@ const Page = ({ config, page, configActions, elementActions, display = 'list', i
   const fetchEdit = () => elementActions.fetchElement('pages', page.id)
   const fetchCopy = () => elementActions.fetchElement('pages', page.id, 'copy')
   const fetchNested = () => elementActions.fetchElement('pages', page.id, 'nested')
-  const toggleLocked = () => elementActions.storeElement('pages', { ...page, locked: !page.locked })
+  const toggleLocked = () => elementActions.storeElement('pages', {...page, locked: !page.locked })
   const toggleElements = () => configActions.toggleElements(page)
 
   const createQuestionSet = () => elementActions.createElement('questionsets', { page })
@@ -37,6 +35,7 @@ const Page = ({ config, page, configActions, elementActions, display = 'list', i
 
   const fetchAttribute = () => elementActions.fetchElement('attributes', page.attribute)
   const fetchCondition = (index) => elementActions.fetchElement('conditions', page.conditions[index])
+
   const elementNode = (
     <div className="element">
       <div className="pull-right">
@@ -46,11 +45,11 @@ const Page = ({ config, page, configActions, elementActions, display = 'list', i
         <EditLink title={gettext('Edit page')} href={editUrl} onClick={fetchEdit} />
         <CopyLink title={gettext('Copy page')} href={copyUrl} onClick={fetchCopy} />
         <AddLink title={gettext('Add question')} altTitle={gettext('Add question set')}
-          onClick={createQuestion} onAltClick={createQuestionSet} disabled={page.read_only} />
+                 onClick={createQuestion} onAltClick={createQuestionSet} disabled={page.read_only} />
         <LockedLink title={page.locked ? gettext('Unlock page') : gettext('Lock page')}
-          locked={page.locked} onClick={toggleLocked} disabled={page.read_only} />
+                    locked={page.locked} onClick={toggleLocked} disabled={page.read_only} />
         <ExportLink title={gettext('Export page')} exportUrl={exportUrl}
-          exportFormats={config.settings.export_formats} full={true} />
+                    exportFormats={config.settings.export_formats} full={true} />
         <Drag element={page} show={display == 'nested'} />
       </div>
       <div>
@@ -83,7 +82,7 @@ const Page = ({ config, page, configActions, elementActions, display = 'list', i
     case 'list':
       return showElement && (
         <li className="list-group-item">
-          {elementNode}
+          { elementNode }
         </li>
       )
     case 'nested':
@@ -94,7 +93,7 @@ const Page = ({ config, page, configActions, elementActions, display = 'list', i
               <Drop element={page} elementActions={elementActions}>
                 <div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
                   <div className="panel-heading">
-                    {elementNode}
+                    { elementNode }
                   </div>
                 </div>
               </Drop>
@@ -106,14 +105,14 @@ const Page = ({ config, page, configActions, elementActions, display = 'list', i
                 const questionSetInfo = page.questionsets.find(info => info.questionset === element.id)
                 const questionSetOrder = questionSetInfo ? questionSetInfo.order : undefined
                 return <QuestionSet key={index} config={config} questionset={element}
-                  configActions={configActions} elementActions={elementActions}
-                  display="nested" filter={filter} indent={indent + 1} order={questionSetOrder} />
+                                    configActions={configActions} elementActions={elementActions}
+                                    display="nested" filter={filter} indent={indent + 1} order={questionSetOrder} />
               } else {
                 const questionInfo = page.questions.find(info => info.question === element.id)
                 const questionOrder = questionInfo ? questionInfo.order : undefined
                 return <Question key={index} config={config} question={element}
-                  configActions={configActions} elementActions={elementActions}
-                  display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
+                                 configActions={configActions} elementActions={elementActions}
+                                 display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
               }
             })
           }
diff --git a/rdmo/management/assets/js/components/element/Question.js b/rdmo/management/assets/js/components/element/Question.js
index 27faedeec9..e9864d8cd2 100644
--- a/rdmo/management/assets/js/components/element/Question.js
+++ b/rdmo/management/assets/js/components/element/Question.js
@@ -10,8 +10,8 @@ import { EditLink, CopyLink, LockedLink, ExportLink, CodeLink } from '../common/
 import { ReadOnlyIcon } from '../common/Icons'
 import { Drag, Drop } from '../common/DragAndDrop'
 
-const Question = ({ config, question, elementActions, display = 'list', indent = 0,
-  filter = false, filterEditors = false, order }) => {
+const Question = ({ config, question, elementActions, display='list', indent=0,
+                    filter=false, filterEditors=false, order }) => {
 
   const showElement = filterElement(config, filter, false, filterEditors, question)
 
@@ -21,7 +21,7 @@ const Question = ({ config, question, elementActions, display = 'list', indent =
 
   const fetchEdit = () => elementActions.fetchElement('questions', question.id)
   const fetchCopy = () => elementActions.fetchElement('questions', question.id, 'copy')
-  const toggleLocked = () => elementActions.storeElement('questions', { ...question, locked: !question.locked })
+  const toggleLocked = () => elementActions.storeElement('questions', {...question, locked: !question.locked })
 
   const fetchAttribute = () => elementActions.fetchElement('attributes', question.attribute)
   const fetchCondition = (index) => elementActions.fetchElement('conditions', question.conditions[index])
@@ -34,9 +34,9 @@ const Question = ({ config, question, elementActions, display = 'list', indent =
         <EditLink title={gettext('Edit question')} href={editUrl} onClick={fetchEdit} />
         <CopyLink title={gettext('Copy question')} href={copyUrl} onClick={fetchCopy} />
         <LockedLink title={question.locked ? gettext('Unlock question') : gettext('Lock question')}
-          locked={question.locked} onClick={toggleLocked} disabled={question.read_only} />
+                    locked={question.locked} onClick={toggleLocked} disabled={question.read_only} />
         <ExportLink title={gettext('Export question')} exportUrl={exportUrl}
-          exportFormats={config.settings.export_formats} full={true} />
+                    exportFormats={config.settings.export_formats} full={true} />
         <Drag element={question} show={display == 'nested'} />
       </div>
       <div>
@@ -77,7 +77,7 @@ const Question = ({ config, question, elementActions, display = 'list', indent =
     case 'list':
       return showElement && (
         <li className="list-group-item">
-          {elementNode}
+          { elementNode }
         </li>
       )
     case 'nested':
@@ -87,7 +87,7 @@ const Question = ({ config, question, elementActions, display = 'list', indent =
             showElement && (
               <div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
                 <div className="panel-body">
-                  {elementNode}
+                  { elementNode }
                 </div>
               </div>
             )
diff --git a/rdmo/management/assets/js/components/element/QuestionSet.js b/rdmo/management/assets/js/components/element/QuestionSet.js
index bf975e37b2..56d3bdd701 100644
--- a/rdmo/management/assets/js/components/element/QuestionSet.js
+++ b/rdmo/management/assets/js/components/element/QuestionSet.js
@@ -7,15 +7,13 @@ import { buildPath } from '../../utils/location'
 
 import Question from './Question'
 import { ElementErrors } from '../common/Errors'
-import {
-  EditLink, CopyLink, AddLink, LockedLink,
-  NestedLink, ExportLink, CodeLink, ShowElementsLink
-} from '../common/Links'
+import { EditLink, CopyLink, AddLink, LockedLink,
+         NestedLink, ExportLink, CodeLink, ShowElementsLink } from '../common/Links'
 import { ReadOnlyIcon } from '../common/Icons'
 import { Drag, Drop } from '../common/DragAndDrop'
 
-const QuestionSet = ({ config, questionset, configActions, elementActions, display = 'list', indent = 0,
-  filter = false, filterEditors = false, order }) => {
+const QuestionSet = ({ config, questionset, configActions, elementActions, display='list', indent=0,
+                       filter=false, filterEditors=false, order }) => {
 
   const showElement = filterElement(config, filter, false, filterEditors, questionset)
   const showElements = get(config, `display.elements.questionsets.${questionset.id}`, true)
@@ -28,7 +26,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
   const fetchEdit = () => elementActions.fetchElement('questionsets', questionset.id)
   const fetchCopy = () => elementActions.fetchElement('questionsets', questionset.id, 'copy')
   const fetchNested = () => elementActions.fetchElement('questionsets', questionset.id, 'nested')
-  const toggleLocked = () => elementActions.storeElement('questionsets', { ...questionset, locked: !questionset.locked })
+  const toggleLocked = () => elementActions.storeElement('questionsets', {...questionset, locked: !questionset.locked })
   const toggleElements = () => configActions.toggleElements(questionset)
 
   const createQuestionSet = () => elementActions.createElement('questionsets', { questionset })
@@ -46,11 +44,11 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
         <EditLink title={gettext('Edit question set')} href={editUrl} onClick={fetchEdit} />
         <CopyLink title={gettext('Copy question set')} href={copyUrl} onClick={fetchCopy} />
         <AddLink title={gettext('Add question')} altTitle={gettext('Add question set')}
-          onClick={createQuestion} onAltClick={createQuestionSet} disabled={questionset.read_only} />
+                 onClick={createQuestion} onAltClick={createQuestionSet} disabled={questionset.read_only} />
         <LockedLink title={questionset.locked ? gettext('Unlock question set') : gettext('Lock question set')}
-          locked={questionset.locked} onClick={toggleLocked} disabled={questionset.read_only} />
+                    locked={questionset.locked} onClick={toggleLocked} disabled={questionset.read_only} />
         <ExportLink title={gettext('Export question set')} exportUrl={exportUrl}
-          exportFormats={config.settings.export_formats} full={true} />
+                    exportFormats={config.settings.export_formats} full={true} />
         <Drag element={questionset} show={display == 'nested'} />
       </div>
       <div>
@@ -63,7 +61,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
           </p>
         }
         {
-          get(config, 'display.uri.attributes', true) && questionset.attribute_uri && <p>
+          get(config, 'display.uri.attributes', true) && questionset.attribute_uri &&<p>
             <CodeLink className="code-domain" uri={questionset.attribute_uri} onClick={() => fetchAttribute()} />
           </p>
         }
@@ -83,7 +81,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
     case 'list':
       return showElement && (
         <li className="list-group-item">
-          {elementNode}
+          { elementNode }
         </li>
       )
     case 'nested':
@@ -94,7 +92,7 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
               <Drop element={questionset} elementActions={elementActions}>
                 <div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
                   <div className="panel-heading">
-                    {elementNode}
+                    { elementNode }
                   </div>
                 </div>
               </Drop>
@@ -106,14 +104,14 @@ const QuestionSet = ({ config, questionset, configActions, elementActions, displ
                 const questionSetInfo = questionset.questionsets.find(info => info.questionset === element.id)
                 const questionSetOrder = questionSetInfo ? questionSetInfo.order : undefined
                 return <QuestionSet key={index} config={config} questionset={element}
-                  configActions={configActions} elementActions={elementActions}
-                  display="nested" filter={filter} indent={indent + 1} order={questionSetOrder} />
+                                    configActions={configActions} elementActions={elementActions}
+                                    display="nested" filter={filter} indent={indent + 1} order={questionSetOrder}  />
               } else {
                 const questionInfo = questionset.questions.find(info => info.question === element.id)
                 const questionOrder = questionInfo ? questionInfo.order : undefined
                 return <Question key={index} config={config} question={element}
-                  configActions={configActions} elementActions={elementActions}
-                  display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
+                                 configActions={configActions} elementActions={elementActions}
+                                 display="nested" filter={filter} indent={indent + 1} order={questionOrder} />
               }
             })
           }
diff --git a/rdmo/management/assets/js/components/element/Section.js b/rdmo/management/assets/js/components/element/Section.js
index 2b6de70075..acea3b6ed7 100644
--- a/rdmo/management/assets/js/components/element/Section.js
+++ b/rdmo/management/assets/js/components/element/Section.js
@@ -8,16 +8,14 @@ import { buildPath } from '../../utils/location'
 
 import Page from './Page'
 import { ElementErrors } from '../common/Errors'
-import {
-  EditLink, CopyLink, AddLink, LockedLink, NestedLink, ExportLink,
-  CodeLink, ShowElementsLink
-} from '../common/Links'
+import { EditLink, CopyLink, AddLink, LockedLink, NestedLink, ExportLink,
+         CodeLink, ShowElementsLink } from '../common/Links'
 import { ReadOnlyIcon } from '../common/Icons'
 import { Drag, Drop } from '../common/DragAndDrop'
 
 
-const Section = ({ config, section, configActions, elementActions, display = 'list', indent = 0,
-  filter = false, filterEditors = false, order }) => {
+const Section = ({ config, section, configActions, elementActions, display='list', indent=0,
+                   filter=false, filterEditors=false, order }) => {
 
   const showElement = filterElement(config, filter, false, filterEditors, section)
   const showElements = get(config, `display.elements.sections.${section.id}`, true)
@@ -30,7 +28,7 @@ const Section = ({ config, section, configActions, elementActions, display = 'li
   const fetchEdit = () => elementActions.fetchElement('sections', section.id)
   const fetchCopy = () => elementActions.fetchElement('sections', section.id, 'copy')
   const fetchNested = () => elementActions.fetchElement('sections', section.id, 'nested')
-  const toggleLocked = () => elementActions.storeElement('sections', { ...section, locked: !section.locked })
+  const toggleLocked = () => elementActions.storeElement('sections', {...section, locked: !section.locked })
   const toggleElements = () => configActions.toggleElements(section)
 
   const createPage = () => elementActions.createElement('pages', { section })
@@ -45,10 +43,10 @@ const Section = ({ config, section, configActions, elementActions, display = 'li
         <CopyLink title={gettext('Copy section')} href={copyUrl} onClick={fetchCopy} />
         <AddLink title={gettext('Add page')} onClick={createPage} disabled={section.read_only} />
         <LockedLink title={section.locked ? gettext('Unlock section')
-          : gettext('Lock section')}
+                                          : gettext('Lock section')}
           locked={section.locked} onClick={toggleLocked} disabled={section.read_only} />
         <ExportLink title={gettext('Export section')} exportUrl={exportUrl}
-          exportFormats={config.settings.export_formats} full={true} />
+                    exportFormats={config.settings.export_formats} full={true} />
         <Drag element={section} show={display == 'nested'} />
       </div>
       <div>
@@ -68,7 +66,7 @@ const Section = ({ config, section, configActions, elementActions, display = 'li
     case 'list':
       return showElement && (
         <li className="list-group-item">
-          {elementNode}
+          { elementNode }
         </li>
       )
     case 'nested':
@@ -79,7 +77,7 @@ const Section = ({ config, section, configActions, elementActions, display = 'li
               <Drop element={section} elementActions={elementActions}>
                 <div className="panel panel-default panel-nested" style={{ marginLeft: 30 * indent }}>
                   <div className="panel-heading">
-                    {elementNode}
+                    { elementNode }
                   </div>
                 </div>
               </Drop>
diff --git a/rdmo/management/assets/js/components/nested/NestedCatalog.js b/rdmo/management/assets/js/components/nested/NestedCatalog.js
index 2eb1895c91..b57840b9c6 100644
--- a/rdmo/management/assets/js/components/nested/NestedCatalog.js
+++ b/rdmo/management/assets/js/components/nested/NestedCatalog.js
@@ -40,18 +40,18 @@ const NestedCatalog = ({ config, catalog, configActions, elementActions }) => {
             <BackButton />
           </div>
           <Catalog config={config} catalog={catalog}
-            configActions={configActions} elementActions={elementActions} display="plain" />
+                   configActions={configActions} elementActions={elementActions} display="plain" />
         </div>
 
         <div className="panel-body">
           <div className="row">
             <div className="col-sm-8">
               <FilterString value={get(config, 'filter.catalog.search', '')} onChange={updateFilterString}
-                placeholder={gettext('Filter catalogs')} />
+                            placeholder={gettext('Filter catalogs')} />
             </div>
             <div className="col-sm-4">
               <FilterUriPrefix value={get(config, 'filter.catalog.uri_prefix', '')} onChange={updateFilterUriPrefix}
-                options={getUriPrefixes(catalog.elements)} />
+                               options={getUriPrefixes(catalog.elements)} />
             </div>
           </div>
           <div className="mt-10">
@@ -63,21 +63,21 @@ const NestedCatalog = ({ config, catalog, configActions, elementActions }) => {
           <div className="checkboxes">
             <span className="mr-10">{gettext('Show URIs:')}</span>
             <Checkbox label={<code className="code-questions">{gettext('Catalogs')}</code>}
-              value={get(config, 'display.uri.catalogs', true)} onChange={updateDisplayCatalogURI} />
+                      value={get(config, 'display.uri.catalogs', true)} onChange={updateDisplayCatalogURI} />
             <Checkbox label={<code className="code-questions">{gettext('Sections')}</code>}
-              value={get(config, 'display.uri.sections', true)} onChange={updateDisplaySectionsURI} />
+                      value={get(config, 'display.uri.sections', true)} onChange={updateDisplaySectionsURI} />
             <Checkbox label={<code className="code-questions">{gettext('Pages')}</code>}
-              value={get(config, 'display.uri.pages', true)} onChange={updateDisplayPagesURI} />
+                      value={get(config, 'display.uri.pages', true)} onChange={updateDisplayPagesURI} />
             <Checkbox label={<code className="code-questions">{gettext('Question sets')}</code>}
-              value={get(config, 'display.uri.questionsets', true)} onChange={updateDisplayQuestionSetsURI} />
+                      value={get(config, 'display.uri.questionsets', true)} onChange={updateDisplayQuestionSetsURI} />
             <Checkbox label={<code className="code-questions'">{gettext('Questions')}</code>}
-              value={get(config, 'display.uri.questions', true)} onChange={updateDisplayQuestionsURI} />
+                      value={get(config, 'display.uri.questions', true)} onChange={updateDisplayQuestionsURI} />
             <Checkbox label={<code className="code-domain">{gettext('Attributes')}</code>}
-              value={get(config, 'display.uri.attributes', true)} onChange={updateDisplayAttributesURI} />
+                      value={get(config, 'display.uri.attributes', true)} onChange={updateDisplayAttributesURI} />
             <Checkbox label={<code className="code-conditions">{gettext('Conditions')}</code>}
-              value={get(config, 'display.uri.conditions', true)} onChange={updateDisplayConditionsURI} />
+                      value={get(config, 'display.uri.conditions', true)} onChange={updateDisplayConditionsURI} />
             <Checkbox label={<code className="code-options">{gettext('Option sets')}</code>}
-              value={get(config, 'display.uri.optionsets', true)} onChange={updateDisplayOptionSetURI} />
+                      value={get(config, 'display.uri.optionsets', true)} onChange={updateDisplayOptionSetURI} />
           </div>
         </div>
       </div>

From 5ae2e54243d2c64fd10ca9aa65b1879991e9f1b6 Mon Sep 17 00:00:00 2001
From: Claudia Malzer <claudia.malzer@tu-darmstadt.de>
Date: Mon, 30 Oct 2023 09:42:26 +0100
Subject: [PATCH 4/5] #745 Add order parameter back to managament interface

* use isNil
---
 rdmo/management/assets/js/components/common/Links.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/rdmo/management/assets/js/components/common/Links.js b/rdmo/management/assets/js/components/common/Links.js
index 8fbe780447..8f816dd64a 100644
--- a/rdmo/management/assets/js/components/common/Links.js
+++ b/rdmo/management/assets/js/components/common/Links.js
@@ -2,6 +2,7 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 import isEmpty from 'lodash/isEmpty'
+import isNil from 'lodash/isNil'
 import isUndefined from 'lodash/isUndefined'
 
 import Link from 'rdmo/core/assets/js/components/Link'
@@ -185,7 +186,7 @@ const CodeLink = ({ className, uri, onClick, order }) => {
       <Link onClick={onClick}>
         <code className={className}>{uri}</code>
       </Link>
-      {order !== undefined && order !== null ? (
+      {!isNil(order) ? (
         <>{' '}<code className="code-order ng-binding">{order}</code></>
       ) : null}
     </>

From f11bf6c250eb72951229569eacb84d31d2b0dda5 Mon Sep 17 00:00:00 2001
From: Claudia Malzer <claudia.malzer@tu-darmstadt.de>
Date: Mon, 30 Oct 2023 09:47:42 +0100
Subject: [PATCH 5/5] * fix indent

---
 rdmo/management/assets/js/components/element/Section.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/rdmo/management/assets/js/components/element/Section.js b/rdmo/management/assets/js/components/element/Section.js
index acea3b6ed7..92e0150ad7 100644
--- a/rdmo/management/assets/js/components/element/Section.js
+++ b/rdmo/management/assets/js/components/element/Section.js
@@ -44,7 +44,7 @@ const Section = ({ config, section, configActions, elementActions, display='list
         <AddLink title={gettext('Add page')} onClick={createPage} disabled={section.read_only} />
         <LockedLink title={section.locked ? gettext('Unlock section')
                                           : gettext('Lock section')}
-          locked={section.locked} onClick={toggleLocked} disabled={section.read_only} />
+                    locked={section.locked} onClick={toggleLocked} disabled={section.read_only} />
         <ExportLink title={gettext('Export section')} exportUrl={exportUrl}
                     exportFormats={config.settings.export_formats} full={true} />
         <Drag element={section} show={display == 'nested'} />