[ResourceInfo component][xs]: small improvements in the table to show more info.
This commit is contained in:
parent
5c0b053fe2
commit
2c42d3d83d
16
dist/index.cjs.js
vendored
16
dist/index.cjs.js
vendored
@ -312,7 +312,9 @@ var ResourcesInfo = function ResourcesInfo(_ref) {
|
||||
className: "text-1xl font-bold mb-2"
|
||||
}, "Size")), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
className: "text-1xl font-bold mb-2"
|
||||
}, "Last Changed")), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
}, "Created")), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
className: "text-1xl font-bold mb-2"
|
||||
}, "Updated")), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
className: "text-1xl font-bold mb-2"
|
||||
}, "Download"))), resources.map(function (resource, index) {
|
||||
return /*#__PURE__*/React__default['default'].createElement("div", {
|
||||
@ -320,19 +322,21 @@ var ResourcesInfo = function ResourcesInfo(_ref) {
|
||||
className: "grid grid-cols-7 gap-4"
|
||||
}, /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.name)), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
}, resource.title || resource.name)), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.description || "No description")), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.size && filesize__default['default'](resource.size, {
|
||||
}, resource.size ? filesize__default['default'](resource.size, {
|
||||
bits: true
|
||||
}))), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
}) : 0)), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.updated)), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
}, resource.created && timeago__namespace.format(resource.created))), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.updated && timeago__namespace.format(resource.updated))), /*#__PURE__*/React__default['default'].createElement("div", null, /*#__PURE__*/React__default['default'].createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, /*#__PURE__*/React__default['default'].createElement("a", {
|
||||
className: "text-yellow-600",
|
||||
href: "/dataset/".concat(resource.path)
|
||||
href: resource.path
|
||||
}, resource.format))));
|
||||
})));
|
||||
};
|
||||
|
||||
16
dist/index.esm.js
vendored
16
dist/index.esm.js
vendored
@ -278,7 +278,9 @@ var ResourcesInfo = function ResourcesInfo(_ref) {
|
||||
className: "text-1xl font-bold mb-2"
|
||||
}, "Size")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
className: "text-1xl font-bold mb-2"
|
||||
}, "Last Changed")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
}, "Created")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
className: "text-1xl font-bold mb-2"
|
||||
}, "Updated")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
className: "text-1xl font-bold mb-2"
|
||||
}, "Download"))), resources.map(function (resource, index) {
|
||||
return /*#__PURE__*/React.createElement("div", {
|
||||
@ -286,19 +288,21 @@ var ResourcesInfo = function ResourcesInfo(_ref) {
|
||||
className: "grid grid-cols-7 gap-4"
|
||||
}, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.name)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
}, resource.title || resource.name)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.description || "No description")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.size && filesize(resource.size, {
|
||||
}, resource.size ? filesize(resource.size, {
|
||||
bits: true
|
||||
}))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
}) : 0)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.updated)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
}, resource.created && timeago.format(resource.created))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, resource.updated && timeago.format(resource.updated))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h3", {
|
||||
className: "text-1xl"
|
||||
}, /*#__PURE__*/React.createElement("a", {
|
||||
className: "text-yellow-600",
|
||||
href: "/dataset/".concat(resource.path)
|
||||
href: resource.path
|
||||
}, resource.format))));
|
||||
})));
|
||||
};
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import React from 'react';
|
||||
import filesize from 'filesize'
|
||||
import * as timeago from 'timeago.js';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
/**
|
||||
@ -22,7 +23,10 @@ const ResourcesInfo = ({ resources }) => {
|
||||
<h3 className="text-1xl font-bold mb-2">Size</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-1xl font-bold mb-2">Last Changed</h3>
|
||||
<h3 className="text-1xl font-bold mb-2">Created</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-1xl font-bold mb-2">Updated</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-1xl font-bold mb-2">Download</h3>
|
||||
@ -33,20 +37,24 @@ const ResourcesInfo = ({ resources }) => {
|
||||
return (
|
||||
<div key={`${index}_${resource.name}`} className="grid grid-cols-7 gap-4">
|
||||
<div>
|
||||
<h3 className="text-1xl">{resource.name}</h3>
|
||||
<h3 className="text-1xl">{resource.title || resource.name}</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-1xl">{resource.description || "No description"}</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-1xl">{resource.size && filesize(resource.size, { bits: true })}</h3>
|
||||
<h3 className="text-1xl">{resource.size ? filesize(resource.size, { bits: true }) : 0}</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-1xl">{resource.updated}</h3>
|
||||
<h3 className="text-1xl">{resource.created && timeago.format(resource.created)}</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-1xl">{resource.updated && timeago.format(resource.updated)}</h3>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-1xl">
|
||||
<a className="text-yellow-600" href={`/dataset/${resource.path}`}>
|
||||
{/* We assume that resource.path is a URL but not relative path. */}
|
||||
<a className="text-yellow-600" href={resource.path}>
|
||||
{resource.format}
|
||||
</a>
|
||||
</h3>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user