[#15] Show 2 buckets in row of dashboard (#17)

* show 2 buckets in row * update CHANGELOG
reductstore · Jun 25, 2022 · 9b849e6 · 9b849e6
1 parent 9950018
commit 9b849e6
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 8 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,22 +1,24 @@
-## Release 0.2.1 (in progress)
+## Release 0.2.1 (2022-06-25)
 
 **Bugs**:
 
 * Fix API and UI paths for embedded console, [PR-16](https://github.com/reduct-storage/web-console/pull/16)
+* Fix different size of bucket card in dashboard, [PR-17] (https://github.com/reduct-storage/web-console/pull/17)
 
 ## Release 0.2.0 (2022-06-17)
 
 **Features**:
 
 * Use Reduct's colours for UI, [PR-7](https://github.com/reduct-storage/web-console/pull/7)
 * Implement changing bucket settings, [PR-9](https://github.com/reduct-storage/web-console/pull/9)
-* Show error in CreateOrUpdate form if don't get settings, [PR-10](https://github.com/reduct-storage/web-console/pull/10)
+* Show error in CreateOrUpdate form if don't get
+  settings, [PR-10](https://github.com/reduct-storage/web-console/pull/10)
 * Add Login Form for authentication with token, [PR0-13](https://github.com/reduct-storage/web-console/pull/13)
 
 **Bugs**:
 
 * Fix bigint conversions in bucket settings, [PR-11](https://github.com/reduct-storage/web-console/pull/11)
-* Use SI sizes for bucket settings, [PR0-13](https://github.com/reduct-storage/web-console/pull/13) 
+* Use SI sizes for bucket settings, [PR0-13](https://github.com/reduct-storage/web-console/pull/13)
 
 **Other**:
 

diff --git a/src/Components/Bucket/BucketCard.tsx b/src/Components/Bucket/BucketCard.tsx
@@ -25,7 +25,7 @@ export default function BucketCard(props: Readonly<Props>) {
     const getHistory = () => {
         return humanizeDuration(
             n(bucket.latestRecord.valueOf() - bucket.oldestRecord.valueOf()) / 1000,
-            {largest: 1});
+            {largest: 1, round: true});
     };
 
     const onOk = () => {
@@ -41,14 +41,14 @@ export default function BucketCard(props: Readonly<Props>) {
                       <DeleteOutlined title="Remove" onClick={() => setVisible(true)}/>,
 
                   ]}>
-        <Row gutter={16}>
+        <Row gutter={24}>
             <Col span={8}>
                 <Statistic title="Size" value={prettierBytes(n(bucket.size))}/>
             </Col>
-            <Col span={8}>
+            <Col span={6}>
                 <Statistic title="Entries" value={n(bucket.entryCount)}/>
             </Col>
-            <Col span={8}>
+            <Col span={10}>
                 <Statistic title="History" value={bucket.entryCount > 0n ? getHistory() : "---"}/>
             </Col>
         </Row>

diff --git a/src/Views/Dashboard/Dashboard.tsx b/src/Views/Dashboard/Dashboard.tsx
@@ -76,7 +76,7 @@ export default class Dashboard extends React.Component<Props, State> {
             return Number(big.valueOf());
         };
 
-        const renderBucket = (numberInRow = 3) => {
+        const renderBucket = (numberInRow = 2) => {
             const fillRow = (row: number) => {
                 const cards = [];
                 for (let j = 0; j < numberInRow; ++j) {