Libpitt/multi rev

src/components/custom/layout/entity/VersionsDropdown.jsx

@@ -0,0 +1,86 @@
+import {useContext, useEffect, useState} from 'react'
+import PropTypes from 'prop-types'
+import Dropdown from 'react-bootstrap/Dropdown'
+import AppContext from "../../../../context/AppContext";
+import {getEntityEndPoint} from "../../../../config/config";
+import {getEntityViewUrl} from "../../js/functions";
+import Select from 'react-select'
+import {get_headers} from "../../../../lib/services";
+
+function VersionsDropdown({data}) {
+
+    const {_t, cache } = useContext(AppContext)
+    const [revisions, setRevisions] = useState(data.multi_revisions || [])
+    const [isBusy, setIsBusy] = useState(false)
+
+    const buildOptions = (r) => {
+        let results = []
+        for (let s of r.uuids) {
+            results.push({value: s.uuid, label: `${s.sennet_id} (${s.data_types[0]})`, revision: r})
+        }
+        return results
+    }
+
+    const handleChange = (e) => {
+        window.location = getEntityViewUrl(cache.entities.dataset, e.value, {isEdit: false})
+    }
+
+
+    const buildRevisions = () => {
+        let results = []
+
+        const currentRevision = getActiveRevision()
+        let options, isActive
+        for (let r of revisions) {
+            options = buildOptions(r)
+            isActive = r.revision_number === currentRevision.revision
+            results.push(
+                <div key={`version-${r.revision_number}`} className={`p-2`}>
+                    <Select className={`revisions-select ${isActive ? 'is-active' : ''}`}
+                            onChange={handleChange}
+                            defaultValue={isActive ? options[currentRevision.index] : undefined}
+                            placeholder={`Revision ${r.revision_number}`}
+                            options={options} />
+                </div>
+            )
+        }
+        return results;
+    }
+
+    const getActiveRevision = () => {
+        let x
+        for (let rev of revisions) {
+            x = 0
+            for (let e of rev.uuids) {
+                if (data.uuid === e.uuid) {
+                    return {revision: rev.revision_number, index: x}
+                }
+                x++
+            }
+        }
+    }
+
+    if (isBusy || (!isBusy && revisions.length <= 0)) {
+        return <></>
+    }
+
+    return (
+        <Dropdown>
+            <Dropdown.Toggle  id="multi-revisions-dropdown">
+                Revision {getActiveRevision().revision}
+            </Dropdown.Toggle>
+
+            <Dropdown.Menu>
+                {buildRevisions()}
+            </Dropdown.Menu>
+        </Dropdown>
+    )
+}
+
+VersionsDropdown.defaultProps = {}
+
+VersionsDropdown.propTypes = {
+    data: PropTypes.object
+}
+
+export default VersionsDropdown

src/components/custom/layout/entity/ViewHeader.jsx

@@ -5,9 +5,9 @@ import {FiletypeJson} from 'react-bootstrap-icons';
 import {equals} from "../../js/functions";
 import PropTypes from 'prop-types'
 import ClipboardCopy from "../../../ClipboardCopy";
-import VersionDropdown from "./VersionDropdown";
 import {ViewHeaderBadges} from "./ViewHeaderBadges";
 import SenNetPopover from "../../../SenNetPopover";
+import VersionsDropdown from "./VersionsDropdown";
 
 const EntityViewHeaderButtons = ({entity, data, hasWritePrivilege}) => {
     const {_t, cache} = useContext(AppContext)
@@ -30,9 +30,7 @@ const EntityViewHeaderButtons = ({entity, data, hasWritePrivilege}) => {
                             variant="outline-primary rounded-0"><FiletypeJson/></Button>
                 </SenNetPopover>
 
-                {equals(entity, cache.entities.dataset) && equals(data.status, 'published') &&
-                    <VersionDropdown data={data}/>
-                }
+                {equals(entity, cache.entities.dataset) && data.multi_revisions && <VersionsDropdown data={data}/>}
             </Stack>
 
         </div>

src/sass/general/misc.scss

@@ -88,4 +88,12 @@ p {
   min-height: calc(100vh - 277px);
   /* new small viewport height for modern browsers */
   min-height: calc(100svh - 277px);
+}
+
+.revisions-select {
+  font-size: 12px !important;
+  &.is-active .css-1s2u09g-control {
+    border: solid 2px var(--bs-success);
+    border-radius: 4px;
+  }
 }