From 9e5c76f57e8c3171e1d672db29c5e21c36fc1c20 Mon Sep 17 00:00:00 2001 From: Rafael Ramalho Date: Wed, 3 Jun 2020 16:12:34 +0100 Subject: [PATCH 1/4] feat: add all blocks translation --- public/locales/en/files.json | 1 + 1 file changed, 1 insertion(+) diff --git a/public/locales/en/files.json b/public/locales/en/files.json index 321fd9204..7988e119e 100644 --- a/public/locales/en/files.json +++ b/public/locales/en/files.json @@ -120,6 +120,7 @@ "pins": "Pins", "pinned": "Pinned", "blocks": "Blocks", + "allBlocks": "all blocks", "more": "More", "files": "Files", "cidNotFileNorDir": "The current link isn't a file, nor a directory. Try to <0>inspect it instead." From 20247ed8f662936ede631fdf577cac07137dddeb Mon Sep 17 00:00:00 2001 From: Rafael Ramalho Date: Wed, 3 Jun 2020 16:48:47 +0100 Subject: [PATCH 2/4] feat: redesign files bar --- src/bundles/files/selectors.js | 4 ++++ src/files/header/Header.js | 23 +++++++++++++---------- 2 files changed, 17 insertions(+), 10 deletions(-) diff --git a/src/bundles/files/selectors.js b/src/bundles/files/selectors.js index 8af9e00d0..6486a7df7 100644 --- a/src/bundles/files/selectors.js +++ b/src/bundles/files/selectors.js @@ -5,6 +5,8 @@ import { infoFromPath } from './utils' export default () => ({ selectFiles: (state) => state.files.pageContent, + selectCurrentDirectorySize: (state) => state.files.pageContent?.content?.reduce((prev, curr) => prev + curr.size, 0), + selectPins: (state) => state.files.pins, selectFilesSize: (state) => state.files.mfsSize, @@ -26,6 +28,8 @@ export default () => ({ selectFilesErrors: (state) => state.files.failed, + selectHasUpperDirectory: (state) => !!state.files.pageContent?.upper, + selectFilesPathInfo: createSelector( 'selectRouteInfo', (routeInfo) => { diff --git a/src/files/header/Header.js b/src/files/header/Header.js index 07a294306..192a86377 100644 --- a/src/files/header/Header.js +++ b/src/files/header/Header.js @@ -42,14 +42,15 @@ class Header extends React.Component { render () { const { + currentDirectorySize, + hasUpperDirectory, files, - t, - pins, filesPathInfo, filesSize, - repoNumObjects, + onNavigate, + pins, repoSize, - onNavigate + t } = this.props return ( @@ -60,18 +61,18 @@ class Header extends React.Component {
{ onNavigate('/files') }}> - { humanSize(filesSize) } + { hasUpperDirectory + ? ( + { humanSize(currentDirectorySize) }/{ humanSize(filesSize) } + ) + : humanSize(filesSize) } { onNavigate('/pins') }}> { pins ? SimplifyNumber(pins.length) : '-' } - - { repoNumObjects ? SimplifyNumber(repoNumObjects, { decimal: 0 }) : 'N/A' } - - - + { humanSize(repoSize) } @@ -104,10 +105,12 @@ class Header extends React.Component { } export default connect( + 'selectHasUpperDirectory', 'selectPins', 'selectFilesSize', 'selectRepoSize', 'selectRepoNumObjects', 'selectFilesPathInfo', + 'selectCurrentDirectorySize', withTranslation('files')(Header) ) From cc84d1feefca5dd2721527594d4cf9c9ad8a5f27 Mon Sep 17 00:00:00 2001 From: Rafael Ramalho Date: Wed, 3 Jun 2020 17:26:50 +0100 Subject: [PATCH 3/4] feat: redesign files tab --- src/bundles/files/selectors.js | 2 -- src/files/header/Header.js | 36 +++++++++------------------------- 2 files changed, 9 insertions(+), 29 deletions(-) diff --git a/src/bundles/files/selectors.js b/src/bundles/files/selectors.js index 6486a7df7..c08cc2e16 100644 --- a/src/bundles/files/selectors.js +++ b/src/bundles/files/selectors.js @@ -28,8 +28,6 @@ export default () => ({ selectFilesErrors: (state) => state.files.failed, - selectHasUpperDirectory: (state) => !!state.files.pageContent?.upper, - selectFilesPathInfo: createSelector( 'selectRouteInfo', (routeInfo) => { diff --git a/src/files/header/Header.js b/src/files/header/Header.js index 192a86377..9ff492470 100644 --- a/src/files/header/Header.js +++ b/src/files/header/Header.js @@ -1,6 +1,6 @@ import React from 'react' import filesize from 'filesize' -import SimplifyNumber from 'simplify-number' +import classNames from 'classnames' import { connect } from 'redux-bundler-react' import { withTranslation } from 'react-i18next' // Components @@ -10,18 +10,12 @@ import Button from '../../components/button/Button' // Icons import GlyphDots from '../../icons/GlyphDots' -function BarOption ({ children, title, isLink = false, className = '', ...etc }) { - className += ' tc pa3' - - if (etc.onClick) className += ' pointer' - - return ( -
- {children} - {title} -
- ) -} +const BarOption = ({ children, title, className = '', ...etc }) => ( +
+ {children} + {title} +
+) function humanSize (size) { if (!size) return 'N/A' @@ -43,12 +37,10 @@ class Header extends React.Component { render () { const { currentDirectorySize, - hasUpperDirectory, files, filesPathInfo, filesSize, onNavigate, - pins, repoSize, t } = this.props @@ -60,16 +52,8 @@ class Header extends React.Component {
- { onNavigate('/files') }}> - { hasUpperDirectory - ? ( - { humanSize(currentDirectorySize) }/{ humanSize(filesSize) } - ) - : humanSize(filesSize) } - - - { onNavigate('/pins') }}> - { pins ? SimplifyNumber(pins.length) : '-' } + + { humanSize(currentDirectorySize) }/{ humanSize(filesSize) } @@ -105,8 +89,6 @@ class Header extends React.Component { } export default connect( - 'selectHasUpperDirectory', - 'selectPins', 'selectFilesSize', 'selectRepoSize', 'selectRepoNumObjects', From c922860a66d4d39cebcb1a3f27e79c73715c6fca Mon Sep 17 00:00:00 2001 From: Rafael Ramalho Date: Wed, 3 Jun 2020 17:44:30 +0100 Subject: [PATCH 4/4] feat: redesign files tab --- src/bundles/files/selectors.js | 2 ++ src/files/header/Header.js | 10 +++++++++- 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/src/bundles/files/selectors.js b/src/bundles/files/selectors.js index c08cc2e16..6486a7df7 100644 --- a/src/bundles/files/selectors.js +++ b/src/bundles/files/selectors.js @@ -28,6 +28,8 @@ export default () => ({ selectFilesErrors: (state) => state.files.failed, + selectHasUpperDirectory: (state) => !!state.files.pageContent?.upper, + selectFilesPathInfo: createSelector( 'selectRouteInfo', (routeInfo) => { diff --git a/src/files/header/Header.js b/src/files/header/Header.js index 9ff492470..66888f32a 100644 --- a/src/files/header/Header.js +++ b/src/files/header/Header.js @@ -37,6 +37,7 @@ class Header extends React.Component { render () { const { currentDirectorySize, + hasUpperDirectory, files, filesPathInfo, filesSize, @@ -53,7 +54,13 @@ class Header extends React.Component {
- { humanSize(currentDirectorySize) }/{ humanSize(filesSize) } + { hasUpperDirectory + ? ( + + { humanSize(currentDirectorySize) }/{ humanSize(filesSize) } + + ) + : humanSize(filesSize) } @@ -89,6 +96,7 @@ class Header extends React.Component { } export default connect( + 'selectHasUpperDirectory', 'selectFilesSize', 'selectRepoSize', 'selectRepoNumObjects',