Add button to directly open the resource editor (#506)

GeoNode · Oct 13, 2021 · f44ba40 · f44ba40
1 parent d498b7a
commit f44ba40
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 5 deletions.
diff --git a/geonode_mapstore_client/client/js/components/ResourceCard/ResourceCard.jsx b/geonode_mapstore_client/client/js/components/ResourceCard/ResourceCard.jsx
@@ -10,6 +10,7 @@ import React, { forwardRef } from 'react';
 import Message from '@mapstore/framework/components/I18N/Message';
 import FaIcon from '@js/components/FaIcon';
 import Dropdown from '@js/components/Dropdown';
+import Button from '@js/components/Button';
 import Spinner from '@js/components/Spinner';
 import { getUserName } from '@js/utils/SearchUtils';
 import { getResourceTypesInfo } from '@js/utils/ResourceUtils';
@@ -36,7 +37,10 @@ const ResourceCard = forwardRef(({
     const res = data;
     const types = getTypesInfo();
     const { icon } = types[res.subtype] || types[res.resource_type] || {};
-
+    const {
+        formatDetailUrl = resource => resource?.detail_url
+    } = res && (types[res.subtype] || types[res.resource_type]) || {};
+    const detailUrl = res?.pk && formatDetailUrl(res);
     return (
         <div
             ref={ref}
@@ -89,8 +93,18 @@ const ResourceCard = forwardRef(({
                             }
                         })}>{getUserName(res.owner)}</ALink>
                     </p>
+                </div>
+                {(!readOnly && options && options.length === 0) && detailUrl &&
+                <div className="gn-card-view-editor">
+                    <Button
+                        variant="default"
+                        href={detailUrl}
+                        rel="noopener noreferrer"><FaIcon name={'edit'} />
+                        <Message msgId={`gnhome.view`} />
 
+                    </Button>
                 </div>
+                }
                 {(!readOnly && options && options.length > 0) && <Dropdown
                     className="gn-card-options"
                     pullRight
@@ -127,7 +141,9 @@ const ResourceCard = forwardRef(({
                                 );
                             })}
                     </Dropdown.Menu>
-                </Dropdown>}
+                </Dropdown>
+
+                }
             </div>
         </div>
     );

diff --git a/geonode_mapstore_client/client/static/mapstore/configs/localConfig.json b/geonode_mapstore_client/client/static/mapstore/configs/localConfig.json
@@ -411,7 +411,7 @@
                 {
                     "type": "link",
                     "href": "${detail_url}",
-                    "labelId": "gnhome.open",
+                    "labelId": "gnhome.view",
                     "icon": "edit",
                     "perms": [
                         {

diff --git a/geonode_mapstore_client/client/themes/geonode/less/_resource-card.less b/geonode_mapstore_client/client/themes/geonode/less/_resource-card.less
@@ -34,7 +34,7 @@
         &:not(.read-only):hover {
             .border-color-var(@theme-vars[focus-color]);
         }
-        .gn-card-options {
+        .gn-card-options, .gn-card-view-editor {
             .color-var(@theme-vars[main-color]);
             .background-color-var(@theme-vars[main-bg]);
         }
@@ -61,7 +61,8 @@
         width: 100%;
         height: 100%;
     }
-    .gn-card-options {
+
+    .gn-card-options, .gn-card-view-editor  {
         position: absolute;
         right: 0;
         bottom: 0;
@@ -74,13 +75,25 @@
         }
     }
 
+    .gn-card-view-editor  {
+        margin-bottom: 0.9rem;
+    }
+
     .gn-card-options .dropdown-toggle::after {
         display: none;
     }
     .gn-card-options,
     a {
         pointer-events: auto;
     }
+    .gn-card-view-editor{
+        span{
+            margin: 0 0.2rem;
+        }
+        a {
+            font-size: 0.75rem;
+        }
+    }
     .card-body {
         position: relative;
         pointer-events: none;