V1.1.7 patch 1 (#1196)

* adjusting the layout of the timeslider

(cherry picked from commit d94d941)

* Remove unused user-datasets-legacy package

(cherry picked from commit 87bb71d)

* adjusting margins

(cherry picked from commit 52220b6)

* Add support for discord link in header (#1187)

(cherry picked from commit 8e8b18c)

* Fix how validation bundle error responses are handled (#1188)

* Fix how validation bundle error responses are handled

* Remove unused imports

* Use decoder function directly

* Remove unused function

(cherry picked from commit 422f3d0)

* Add searching to user and community study tables

(cherry picked from commit 81d9a4d)

* Adjust styling and position of UD attributes

(cherry picked from commit 5f30f99)

* Remove `searchTree` from redux store (#1191)

(cherry picked from commit a5d60cd)

* Eda user dataset detail (#1192)

* Add ability to hide header elements in user dataset detail page

* Add SCSS files to all pages that need it

* Use UserDatasetDetailController for user dataset studies

(cherry picked from commit 08316b8)

* User datasets tweaks (#1193)

* Verbiage updates, and make description optional by default

* Remove link to user dataset workspace from study summaries page

* Make spacing between elements more consistent

* Reorder attributes on detail page, remove quota usage, and refactor some page sections

* Refactor

(cherry picked from commit eb7af83)

---------

Co-authored-by: Dae Kun (DK) Kwon <[email protected]>
Co-authored-by: Jeremy Myers <[email protected]>

packages/libs/eda/src/lib/map/analysis/MapAnalysis.tsx

@@ -86,6 +86,8 @@ import { AnalysisError } from '../../core/components/AnalysisError';
 import useSnackbar from '@veupathdb/coreui/lib/components/notifications/useSnackbar';
 import SettingsButton from '@veupathdb/coreui/lib/components/containers/DraggablePanel/SettingsButton';
 import { getGeoConfig } from '../../core/utils/geoVariables';
+import UserDatasetDetailController from '@veupathdb/user-datasets/lib/Controllers/UserDatasetDetailController';
+import { wdkRecordIdToDiyUserDatasetId } from '@veupathdb/user-datasets/lib/Utils/diyDatasets';
 
 enum MapSideNavItemLabels {
   Download = 'Download',
@@ -235,6 +237,7 @@ function MapAnalysisImpl(props: ImplProps) {
   const downloadClient = useDownloadClient();
   const subsettingClient = useSubsettingClient();
   const history = useHistory();
+  const { url } = useRouteMatch();
 
   const sharingUrl = new URL(
     sharingUrlPrefix
@@ -703,10 +706,34 @@ function MapAnalysisImpl(props: ImplProps) {
             }}
           >
             <H5 additionalStyles={{ margin: '25px 0 0 0' }}>Study Details</H5>
-            <RecordController
-              recordClass="dataset"
-              primaryKey={studyRecord.id.map((p) => p.value).join('/')}
-            />
+            {studyMetadata.isUserStudy ? (
+              // TODO Make both cases below configurable via the root component.
+              // This will need to be done if we want EDA to stand on its own.
+
+              // Note that we are not inluding the custom detail page.
+              // As of this writing, details pages only add a link to
+              // EDA. Since we are in EDA, we don't want to add it here.
+              <UserDatasetDetailController
+                baseUrl={url}
+                detailsPageTitle={'My Study'}
+                workspaceTitle={'My Studies'}
+                id={wdkRecordIdToDiyUserDatasetId(
+                  studyRecord.attributes.dataset_id as string
+                )}
+                dataNoun={{
+                  singular: 'Study',
+                  plural: 'Studies',
+                }}
+                enablePublicUserDatasets
+                includeAllLink={false}
+                includeNameHeader={false}
+              />
+            ) : (
+              <RecordController
+                recordClass="dataset"
+                primaryKey={studyRecord.id.map((p) => p.value).join('/')}
+              />
+            )}
           </div>
         );
       },

packages/libs/eda/src/lib/map/analysis/TimeSliderQuickFilter.tsx

@@ -386,7 +386,7 @@ export default function TimeSliderQuickFilter({
         >
           {!minimized && (
             <>
-              <div style={{}}>
+              <div style={{ maxWidth: 200, marginRight: 'auto' }}>
                 <InputVariables
                   inputs={[
                     {
@@ -406,10 +406,9 @@ export default function TimeSliderQuickFilter({
                   constraints={timeSliderVariableConstraints}
                 />
               </div>
-              <div>
+              <div style={{ marginRight: '1em', marginLeft: 'auto' }}>
                 <button
                   title={'move range left'}
-                  style={{ marginRight: '1em', marginLeft: '2em' }}
                   onClick={() => handleArrowClick('left')}
                   disabled={!active || disableLeftArrow}
                 >
@@ -424,28 +423,29 @@ export default function TimeSliderQuickFilter({
                 </button>
               </div>
               {/* add axis range control */}
-              <AxisRangeControl
-                range={
-                  selectedRange != null
-                    ? {
-                        min: selectedRange.start,
-                        max: selectedRange.end,
-                      }
-                    : undefined
-                }
-                onRangeChange={handleAxisRangeChange}
-                valueType={'date'}
-                containerStyles={{
-                  flex: 1,
-                }}
-                // change the height of the input element
-                inputHeight={30}
-                disabled={!active}
-              />
               <div>
+                <AxisRangeControl
+                  range={
+                    selectedRange != null
+                      ? {
+                          min: selectedRange.start,
+                          max: selectedRange.end,
+                        }
+                      : undefined
+                  }
+                  onRangeChange={handleAxisRangeChange}
+                  valueType={'date'}
+                  containerStyles={{
+                    flex: 1,
+                  }}
+                  // change the height of the input element
+                  inputHeight={30}
+                  disabled={!active}
+                />
+              </div>
+              <div style={{ marginRight: 'auto', marginLeft: '1em' }}>
                 <button
                   title={'move range right'}
-                  style={{ marginLeft: '1em', marginRight: '1em' }}
                   onClick={() => handleArrowClick('right')}
                   disabled={!active || disableRightArrow}
                 >

packages/libs/eda/src/lib/workspace/AnalysisPanel.tsx

@@ -29,6 +29,7 @@ import { useGeoConfig } from '../core/hooks/geoConfig';
 
 // Components
 import WorkspaceNavigation from '@veupathdb/wdk-client/lib/Components/Workspace/WorkspaceNavigation';
+import UserDatasetDetailController from '@veupathdb/user-datasets/lib/Controllers/UserDatasetDetailController';
 import { AnalysisSummary } from './AnalysisSummary';
 import { EntityDiagram } from '../core';
 import { ComputationRoute } from './ComputationRoute';
@@ -56,6 +57,7 @@ import FilterChipList from '../core/components/FilterChipList';
 import { Public } from '@material-ui/icons';
 import { Link } from 'react-router-dom';
 import { AnalysisError } from '../core/components/AnalysisError';
+import { wdkRecordIdToDiyUserDatasetId } from '@veupathdb/user-datasets/lib/Utils/diyDatasets';
 
 const AnalysisTabErrorBoundary = ({
   children,
@@ -418,10 +420,36 @@ export function AnalysisPanel({
             path={`${routeBase}/details`}
             render={() => (
               <AnalysisTabErrorBoundary>
-                <RecordController
-                  recordClass="dataset"
-                  primaryKey={studyRecord.id.map((p) => p.value).join('/')}
-                />
+                {studyMetadata.isUserStudy ? (
+                  // TODO Make both cases below configurable via the root component.
+                  // This will need to be done if we want EDA to stand on its own.
+
+                  // Note that we are not inluding the custom detail page.
+                  // As of this writing, details pages only add a link to
+                  // EDA. Since we are in EDA, we don't want to add it here.
+                  <div style={{ marginBlockStart: '1em' }}>
+                    <UserDatasetDetailController
+                      baseUrl={`${routeBase}/details`}
+                      detailsPageTitle={'My Study'}
+                      workspaceTitle={'My Studies'}
+                      id={wdkRecordIdToDiyUserDatasetId(
+                        studyRecord.attributes.dataset_id as string
+                      )}
+                      dataNoun={{
+                        singular: 'Study',
+                        plural: 'Studies',
+                      }}
+                      enablePublicUserDatasets={true}
+                      includeAllLink={false}
+                      includeNameHeader={false}
+                    />
+                  </div>
+                ) : (
+                  <RecordController
+                    recordClass="dataset"
+                    primaryKey={studyRecord.id.map((p) => p.value).join('/')}
+                  />
+                )}
               </AnalysisTabErrorBoundary>
             )}
           />