diff --git a/client/coral-admin/src/containers/Dashboard/FlagWidget.js b/client/coral-admin/src/containers/Dashboard/FlagWidget.js index 537b89b8f..da71ac04a 100644 --- a/client/coral-admin/src/containers/Dashboard/FlagWidget.js +++ b/client/coral-admin/src/containers/Dashboard/FlagWidget.js @@ -15,28 +15,36 @@ const FlagWidget = (props) => { - {/* empty on purpose */} - + { assets.length - ? assets.map((asset, index) => { + ? assets.map(asset => { const flagSummary = asset.action_summaries.find(s => s.type === 'FlagAssetActionSummary'); return ( - - + + - ); }) - : + : + } + { /* rows in a table with a fixed height will expand and ignore height. + this extra row will expand to fill the extra space. */ + assets.length < 10 ? : null }
{lang.t('streams.article')}{lang.t('modqueue.flagged')}{lang.t('dashboard.flags')}
{index + 1}.
- {asset.title} -

{asset.author} - Published: {new Date(asset.created_at).toLocaleDateString()}

+ +

{asset.title}

+

{asset.author} — Published: {new Date(asset.created_at).toLocaleDateString()}

+ +
+ +

{flagSummary ? flagSummary.actionCount : 0}

+
{flagSummary ? flagSummary.actionCount : 0}
{lang.t('dashboard.no_flags')}
{lang.t('dashboard.no_flags')}
diff --git a/client/coral-admin/src/containers/Dashboard/LikeWidget.js b/client/coral-admin/src/containers/Dashboard/LikeWidget.js index ed6a0c0ae..25e851966 100644 --- a/client/coral-admin/src/containers/Dashboard/LikeWidget.js +++ b/client/coral-admin/src/containers/Dashboard/LikeWidget.js @@ -16,7 +16,6 @@ const LikeWidget = (props) => { - {/* empty on purpose */} @@ -24,20 +23,29 @@ const LikeWidget = (props) => { { assets.length - ? assets.map((asset, index) => { + ? assets.map(asset => { const likeSummary = asset.action_summaries.find(s => s.type === 'LikeAssetActionSummary'); return ( - - + + - ); }) - : + : + } + { /* rows in a table with a fixed height will expand and ignore height. + this extra row will expand to fill the extra space. */ + assets.length < 10 ? : null }
{lang.t('streams.article')} {lang.t('modqueue.likes')}
{index + 1}.
- {asset.title} -

{asset.author} - Published: {new Date(asset.created_at).toLocaleDateString()}

+ +

{asset.title}

+

{asset.author} — Published: {new Date(asset.created_at).toLocaleDateString()}

+ +
+ +

{likeSummary ? likeSummary.actionCount : 0}

+
{likeSummary ? likeSummary.actionCount : 0}
{lang.t('dashboard.no_likes')}
{lang.t('dashboard.no_likes')}
diff --git a/client/coral-admin/src/containers/Dashboard/Widget.css b/client/coral-admin/src/containers/Dashboard/Widget.css index 624b72519..cb764d9cc 100644 --- a/client/coral-admin/src/containers/Dashboard/Widget.css +++ b/client/coral-admin/src/containers/Dashboard/Widget.css @@ -1,13 +1,19 @@ +:root { + --row-height: 80px; +} + .widget { box-sizing: border-box; margin: 10px 5px 5px 5px; box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2); padding: 15px; flex: 1; + background-color: white; } .heading { margin: 0; + padding-left: 10px; font-size: 1.5rem; font-weight: bold; } @@ -15,28 +21,64 @@ .widgetTable { width: 100%; border-collapse: collapse; - box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2); + user-select: none; + height: calc(var(--row-height) * 10); } .widgetTable thead th { - border-bottom: 1px solid #f47e6b; + color: rgb(35, 102, 223); padding: 10px; text-align: left; + text-transform: capitalize; } -.widgetTable tbody tr { +.widgetTable thead th:last-child { + width: 10%; +} + +.rowLinkify { + cursor: pointer; border-bottom: 1px solid lightgrey; + color: #555; + height: var(--row-height); } -.widgetTable tbody tr:last-child { +.rowLinkify:last-child { border-bottom: none; } +.rowLinkify:hover { + background-color: #f8f8f8; +} + .widgetTable tbody td { padding: 10px; } +.linkToAsset { + display: block; + text-decoration: none; +} + .lede { font-size: 0.9em; - color: grey; + color: #aaa; +} + +.assetTitle { + color: #555; + text-decoration: none; + font-size: 1.2em; + font-weight: normal; + margin: 0; +} + +.assetTitle:hover { + text-decoration: underline; +} + +.widgetCount { + color: #555; + font-size: 1.3em; + font-weight: 400; } diff --git a/client/coral-admin/src/translations.json b/client/coral-admin/src/translations.json index dbb3e650e..92e0cbbff 100644 --- a/client/coral-admin/src/translations.json +++ b/client/coral-admin/src/translations.json @@ -112,6 +112,7 @@ "dashboard": { "no_flags": "There have been no flags in the last 5 minutes! Hooray!", "no_likes": "There have been no likes in the last 5 minutes. All quiet.", + "flags": "Flags", "comment_count": "comments" }, "streams": { @@ -222,6 +223,7 @@ "dashbord": { "no_flags": "¡Nadie ha marcado nada en los últimos 5 minutos! ¡Bravo!", "no_likes": "A nadie le ha gustado algún comentario en los últimos 5 minutos. Todo tranquilo.", + "flags": "Marcados", "comment_count": "comentarios" }, "streams": { diff --git a/graph/loaders/metrics.js b/graph/loaders/metrics.js index 2627d82d9..a6fe5afe4 100644 --- a/graph/loaders/metrics.js +++ b/graph/loaders/metrics.js @@ -54,7 +54,7 @@ const getAssetMetrics = ({loaders: {Metrics, Assets, Comments}}, {from, to, sort .filter((asset) => { let contextActionSummary = asset.action_summaries.find((({action_type}) => action_type === sort)); - if (contextActionSummary === null) { + if (contextActionSummary === null || contextActionSummary.actionCount === 0) { return false; }