Added back button

eea · Sep 23, 2020 · 6c4e9f1 · 6c4e9f1
1 parent 8f661c5
commit 6c4e9f1
Show file tree

Hide file tree

Showing 3 changed files with 70 additions and 52 deletions.
diff --git a/src/components/manage/Blocks/DetailedLink/View.jsx b/src/components/manage/Blocks/DetailedLink/View.jsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { compose } from 'redux';
 import { connect } from 'react-redux';
+import { useHistory } from 'react-router-dom';
 import { Link } from 'react-router-dom';
 import { settings } from '~/config';
 import cx from 'classnames';
@@ -15,8 +16,13 @@ const getPath = (url) => {
 };
 
 const View = (props) => {
+  const history = useHistory();
   const detailedLink = props.data.detailedLink || null;
-  const { hideTitle = false, hideDescription = false } = props.data;
+  const {
+    backButton = false,
+    hideTitle = false,
+    hideDescription = false,
+  } = props.data;
   const {
     textAlign = null,
     title = '',
@@ -36,58 +42,64 @@ const View = (props) => {
         `text-align-${textAlign || 'left'}`,
       )}
     >
-      {(detailedLink && (
-        <>
-          {!hideTitle ? (
-            <div className={cx('detailed-link-title', titleClassname || '')}>
-              {title || detailedLink.title || ''}
+      {detailedLink ||
+        (backButton && (
+          <>
+            {!hideTitle && (title || detailedLink?.title) ? (
+              <div className={cx('detailed-link-title', titleClassname || '')}>
+                {title || detailedLink?.title || ''}
+              </div>
+            ) : (
+              ''
+            )}
+            {!hideDescription && (description || detailedLink?.description) ? (
+              <p
+                className={cx(
+                  'detailed-link-description',
+                  descriptionClassname || '',
+                )}
+              >
+                {description || detailedLink?.description || ''}
+              </p>
+            ) : (
+              ''
+            )}
+            <div>
+              <Link
+                className={cx(
+                  'detailed-link-button display-inline-block',
+                  buttonClassname || '',
+                )}
+                onClick={(e) => {
+                  if (
+                    props.discodata_query.search.facilityInspireId ||
+                    props.discodata_query.search.installationInspireId ||
+                    props.discodata_query.search.lcpInspireId
+                  ) {
+                    props.deleteQueryParam({
+                      queryParam: [
+                        'facilityInspireId',
+                        'installationInspireId',
+                        'lcpInspireId',
+                      ],
+                    });
+                  }
+                  if (backButton) {
+                    history.goBack();
+                  }
+                  return e.preventDefault;
+                }}
+                to={!backButton && getPath(detailedLink?.path)}
+              >
+                <span>{buttonTitle || detailedLink?.title || 'Go'}</span>
+              </Link>
             </div>
-          ) : (
-            ''
-          )}
-          {!hideDescription && (description || detailedLink.description) ? (
-            <p
-              className={cx(
-                'detailed-link-description',
-                descriptionClassname || '',
-              )}
-            >
-              {description || detailedLink.description || ''}
-            </p>
-          ) : (
-            ''
-          )}
-          <div>
-            <Link
-              className={cx(
-                'detailed-link-button display-inline-block',
-                buttonClassname || '',
-              )}
-              onClick={(e) => {
-                if (
-                  props.discodata_query.search.facilityInspireId ||
-                  props.discodata_query.search.installationInspireId ||
-                  props.discodata_query.search.lcpInspireId
-                ) {
-                  props.deleteQueryParam({
-                    queryParam: [
-                      'facilityInspireId',
-                      'installationInspireId',
-                      'lcpInspireId',
-                    ],
-                  });
-                }
-                return e.preventDefault;
-              }}
-              to={getPath(detailedLink.path)}
-            >
-              <span>{buttonTitle || detailedLink.title || 'Go'}</span>
-            </Link>
-          </div>
-        </>
-      )) || (
-        <p className="detailed-link-placeholder">Select a page from sidebar</p>
-      )}
+          </>
+        )) || (
+          <p className="detailed-link-placeholder">
+            Select a page from sidebar
+          </p>
+        )}
     </div>
   );
 };

diff --git a/src/components/manage/Blocks/DetailedLink/schema.jsx b/src/components/manage/Blocks/DetailedLink/schema.jsx
@@ -12,6 +12,7 @@ export const getSchema = (props) => {
         id: 'properties',
         title: 'Properties',
         fields: [
+          'backButton',
           'hideTitle',
           'hideDescription',
           'title',
@@ -32,6 +33,10 @@ export const getSchema = (props) => {
     ],
 
     properties: {
+      backButton: {
+        title: 'Back button',
+        type: 'boolean',
+      },
       hideTitle: {
         title: 'Hide title',
         type: 'boolean',

diff --git a/theme/site/globals/site.overrides b/theme/site/globals/site.overrides
@@ -641,6 +641,7 @@ p {
 
 //  BROWSE TABLE
 .browse-table {
+  overflow-x: auto;
   .ui.grid {
     margin-top: 0 !important;
   }