Release (#702)

* Uses HD thumbnail for opengraph when available. (#696) Co-authored-by: Benjamin Piouffle <[email protected]> * chore(deps): [security] bump npm-user-validate from 1.0.0 to 1.0.1 (#697) Bumps [npm-user-validate](https://github.com/npm/npm-user-validate) from 1.0.0 to 1.0.1. **This update includes a security fix.** - [Release notes](https://github.com/npm/npm-user-validate/releases) - [Commits](npm/npm-user-validate@v1.0.0...v1.0.1) Signed-off-by: dependabot-preview[bot] <[email protected]> Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com> * set required reputation to add video to 75 (#701) * Shows number of actions which are pending moderation. (#698) * Shows number of actions which are pending moderation. * Format code. * Merge mistake on format. * Fixes margin of menu tag. * enhancement(queries/ModerationCount): Add id to the fetch Co-authored-by: Benjamin Piouffle <[email protected]> Co-authored-by: Abou Konaté <[email protected]> Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com>
CaptainFact · Nov 14, 2020 · 6c5c2db · 6c5c2db
1 parent 7773a89
commit 6c5c2db
Show file tree

Hide file tree

Showing 7 changed files with 52 additions and 11 deletions.
diff --git a/app/API/graphql_queries.js b/app/API/graphql_queries.js
@@ -72,3 +72,12 @@ export const loggedInUserUnreadNotificationsCount = gql`
     }
   }
 `
+
+export const loggedInUserPendingModerationCount = gql`
+  query LoggedInUserUnreadNotificationsCount {
+    loggedInUser {
+      id
+      actions_pending_moderation
+    }
+  }
+`
diff --git a/app/components/App/Sidebar.jsx b/app/components/App/Sidebar.jsx
@@ -1,8 +1,10 @@
 import React from 'react'
 import { connect } from 'react-redux'
 import { Link } from 'react-router'
+import { Query } from 'react-apollo'
 import { withNamespaces } from 'react-i18next'
 import classNames from 'classnames'
+import { get } from 'lodash'
 import capitalize from 'voca/capitalize'
 import { Flex } from '@rebass/grid'
 
@@ -15,12 +17,14 @@ import { Facebook } from 'styled-icons/fa-brands/Facebook'
 
 import { LinkExternal } from 'styled-icons/octicons/LinkExternal'
 
+import { loggedInUserPendingModerationCount } from '../../API/graphql_queries'
 import { MOBILE_WIDTH_THRESHOLD, MIN_REPUTATION_MODERATION } from '../../constants'
 import RawIcon from '../Utils/RawIcon'
 import ReputationGuard from '../Utils/ReputationGuard'
 import { closeSidebar, toggleSidebar } from '../../state/user_preferences/reducer'
 import UserLanguageSelector from '../LoggedInUser/UserLanguageSelector'
 import ExternalLinkNewTab from '../Utils/ExternalLinkNewTab'
+import Tag from '../Utils/Tag'
 
 @connect((state) => ({ sidebarExpended: state.UserPreferences.sidebarExpended }), {
   toggleSidebar,
@@ -142,9 +146,21 @@ export default class Sidebar extends React.PureComponent {
           {capitalize(t('entities.video_plural'))}
         </this.MenuListLink>
         <ReputationGuard requiredRep={MIN_REPUTATION_MODERATION}>
-          <this.MenuListLink to="/moderation" iconName="flag">
-            {t('menu.moderation')}
-          </this.MenuListLink>
+          <Query
+            fetchPolicy="network-only"
+            pollInterval={25000}
+            query={loggedInUserPendingModerationCount}
+          >
+            {({ data }) => {
+              const pendingCount = get(data, 'loggedInUser.actions_pending_moderation', 0)
+              return (
+                <this.MenuListLink to="/moderation" iconName="flag">
+                  {t('menu.moderation')}
+                  <Tag type="danger">{pendingCount}</Tag>
+                </this.MenuListLink>
+              )
+            }}
+          </Query>
         </ReputationGuard>
       </ul>
     )

diff --git a/app/components/VideoDebate/index.jsx b/app/components/VideoDebate/index.jsx
@@ -17,6 +17,7 @@ import { resetVideoDebate } from '../../state/video_debate/actions'
 import { ColumnVideo } from './ColumnVideo'
 import { ColumnDebate } from './ColumnDebate'
 import { videoURL, toAbsoluteURL } from '../../lib/cf_routes'
+import { getHDThumbnailUrl } from '../../lib/video_utils'
 
 @connect(
   (state) => ({
@@ -55,7 +56,7 @@ export class VideoDebate extends React.PureComponent {
 
   renderMeta(video) {
     const title = `Vérification complète de : ${video.title}`
-    const image = video.thumbnail
+    const image = getHDThumbnailUrl(video)
     const description = `${video.title} vérifiée citation par citation par la communauté CaptainFact`
     return (
       <Helmet>

diff --git a/app/constants.js b/app/constants.js
@@ -54,7 +54,7 @@ export const MIN_REPUTATION_REMOVE_STATEMENT = 75
 export const MIN_REPUTATION_RESTORE_ENTITY = 75
 export const MIN_REPUTATION_REMOVE_SPEAKER = 75
 export const MIN_REPUTATION_UPDATE_VIDEO = 75
-export const MIN_REPUTATION_ADD_VIDEO = 15
+export const MIN_REPUTATION_ADD_VIDEO = 75
 export const MIN_REPUTATION_MODERATION = 125
 
 /* ------ UI, animations ------ */

diff --git a/app/lib/video_utils.js b/app/lib/video_utils.js
@@ -19,6 +19,17 @@ export const getTimecode = (videoPlayer, video, baseTimecode) => {
   return getTimecodesOffset(video, videoPlayer) + baseTimecode
 }
 
+/**
+ * Returns HD thumbnail URL if any, otherwise returns the default thumbnail URL.
+ */
+export const getHDThumbnailUrl = (video) => {
+  if (video.youtube_id) {
+    return `https://img.youtube.com/vi/${video.youtube_id}/hqdefault.jpg`
+  }
+
+  return video.thumbnail
+}
+
 export const THUMBNAILS_SIZES = {
   MEDIUM: 'MEDIUM',
   LARGE: 'LARGE',

diff --git a/app/styles/_components/App/sidebar.sass b/app/styles/_components/App/sidebar.sass
@@ -43,6 +43,8 @@ $border-color: lightgrey
 
   .menu-content
     padding: 9px
+    & .tag
+      margin: 0 5px
 
   .link-with-icon > i
     width: 20px
@@ -104,6 +106,8 @@ $border-color: lightgrey
           width: 100%
         &> span
           display: none
+        &> .tag
+          margin: 0 5px
 
   .connect-register-buttons
     margin-bottom: 5px

diff --git a/package-lock.json b/package-lock.json