From 7e14bc0e80f4aab9cbee817b12cfbb70577c45eb Mon Sep 17 00:00:00 2001 From: lutangar Date: Fri, 2 Oct 2020 15:37:15 +0200 Subject: [PATCH] feat(NotConnected): Show only popular contributors on popin and add missing links. --- .env.development.example | 1 + .env.example | 1 + .env.proding | 1 + .env.production | 1 + .env.staging | 1 + .../App/Profiles/NotConnectedPopin.tsx | 17 +++++++++-- src/app/utils/env.ts | 12 ++++++++ .../molecules/Popin/PopinBottomBar.tsx | 28 ++++++++++++------- src/types/index.d.ts | 1 + webpack.profiles.config.js | 3 +- 10 files changed, 53 insertions(+), 13 deletions(-) create mode 100644 src/app/utils/env.ts diff --git a/.env.development.example b/.env.development.example index 746df3d5e..a704c1df9 100644 --- a/.env.development.example +++ b/.env.development.example @@ -24,3 +24,4 @@ CHROME_EXTENSION_ID= FIREFOX_EXTENSION_ID= PROFILES_ORIGIN=http://localhost:8080 PROFILES_ASSETS_PATH=/ +POPULAR_CONTRIBUTORS_IDS=[1, 2, 3] diff --git a/.env.example b/.env.example index 9193c9c7f..0a322214a 100644 --- a/.env.example +++ b/.env.example @@ -12,3 +12,4 @@ CHROME_EXTENSION_ID= FIREFOX_EXTENSION_ID= PROFILES_ORIGIN= PROFILES_ASSETS_PATH= +POPULAR_CONTRIBUTORS_IDS=[] diff --git a/.env.proding b/.env.proding index 743f069cd..4d7c9a8e9 100644 --- a/.env.proding +++ b/.env.proding @@ -19,3 +19,4 @@ FIREFOX_EXTENSION_ID={72aad822-62f5-4663-a8f0-025b2f9a3dd5} BABEL_ENV=production PROFILES_ORIGIN=https://proding-profiles.dismoi.io PROFILES_ASSETS_PATH=https://proding-profiles.dismoi.io/ +POPULAR_CONTRIBUTORS_IDS=[53, 54, 59, 46, 65] diff --git a/.env.production b/.env.production index 6da03a8ac..16cb613a0 100644 --- a/.env.production +++ b/.env.production @@ -18,3 +18,4 @@ CHROME_EXTENSION_ID=fpjlnlnbacohacebkadbbjebbipcknbg FIREFOX_EXTENSION_ID=@lmem PROFILES_ORIGIN=https://www.dismoi.io PROFILES_ASSETS_PATH=https://profiles.dismoi.io/ +POPULAR_CONTRIBUTORS_IDS=[53, 54, 59, 46, 65] diff --git a/.env.staging b/.env.staging index 775f075bc..d202489f3 100644 --- a/.env.staging +++ b/.env.staging @@ -19,3 +19,4 @@ FIREFOX_EXTENSION_ID={7d0d2553-c311-4acd-a170-f9a4714eb2c0} BABEL_ENV=production PROFILES_ORIGIN=https://staging-profiles.dismoi.io PROFILES_ASSETS_PATH=https://staging-profiles.dismoi.io/ +POPULAR_CONTRIBUTORS_IDS=[53, 54, 59, 46, 65] diff --git a/src/app/profiles/App/Profiles/NotConnectedPopin.tsx b/src/app/profiles/App/Profiles/NotConnectedPopin.tsx index 7611351ed..827753b18 100644 --- a/src/app/profiles/App/Profiles/NotConnectedPopin.tsx +++ b/src/app/profiles/App/Profiles/NotConnectedPopin.tsx @@ -4,9 +4,11 @@ import Popin, { PopinState } from 'components/molecules/Popin/Popin'; import PopinParagraph from 'components/molecules/Popin/PopinParagraph'; -import { BackgroundButton } from 'components/atoms'; +import { BackgroundButton, ExternalLink } from 'components/atoms'; import { Contributor, StatefulContributor } from 'app/lmem/contributor'; import PopinBottomBar from 'components/molecules/Popin/PopinBottomBar'; +import PopinSmallText from 'components/molecules/Popin/PopinSmallText'; +import { WEBSITE_DOMAIN } from 'app/lmem'; export interface NotConnectedPopinState extends PopinState { contributor?: StatefulContributor; @@ -27,6 +29,11 @@ const NotConnectedPopin = ({ contributors, onContributorClick }: NotConnectedPopinProps) => { + const handleContributorClicked = (contributor: Contributor) => { + onContributorClick(contributor); + setOpened(false); + }; + return ( @@ -37,9 +44,15 @@ const NotConnectedPopin = ({ Ajouter Dismoi à mon navigateur + + Gratuit, sans publicité,{' '} + + respecte votre vie privée + + ); diff --git a/src/app/utils/env.ts b/src/app/utils/env.ts new file mode 100644 index 000000000..9a9345ad1 --- /dev/null +++ b/src/app/utils/env.ts @@ -0,0 +1,12 @@ +export const asArray = ( + environmentVariableValue: string | undefined +): Array => { + if (typeof environmentVariableValue !== 'undefined') { + const parsed = JSON.parse(environmentVariableValue); + if (Array.isArray(parsed)) { + return parsed; + } + } + + return []; +}; diff --git a/src/components/molecules/Popin/PopinBottomBar.tsx b/src/components/molecules/Popin/PopinBottomBar.tsx index 7bf32b1df..3e32ea66f 100644 --- a/src/components/molecules/Popin/PopinBottomBar.tsx +++ b/src/components/molecules/Popin/PopinBottomBar.tsx @@ -4,6 +4,11 @@ import { Link } from 'components/atoms'; import { Contributor, StatefulContributor } from 'app/lmem/contributor'; import ContributorListItem from 'components/atoms/ContributorListItem'; import InteractiveAvatar from '../InteractiveAvatar'; +import { asArray } from 'app/utils/env'; + +const POPULAR_CONTRIBUTORS_IDS = asArray( + process.env.POPULAR_CONTRIBUTORS_IDS +); const PopinBottomBarContainer = styled.div` width: 100%; @@ -40,17 +45,20 @@ const PopinBottomBar = ({ return ( - En savoir plus sur DisMoi et ses informateurs + En savoir plus sur DisMoi et ses + informateurs - {contributors.map(contributor => ( - - onContributorClick(contributor)} - contributor={contributor} - size="small" - /> - - ))} + {contributors + .filter(c => POPULAR_CONTRIBUTORS_IDS.includes(c.id)) + .map(contributor => ( + + onContributorClick(contributor)} + contributor={contributor} + size="small" + /> + + ))} ); diff --git a/src/types/index.d.ts b/src/types/index.d.ts index 3cc1e599e..b7304454e 100644 --- a/src/types/index.d.ts +++ b/src/types/index.d.ts @@ -11,6 +11,7 @@ interface AppEnv extends NodeJS.ProcessEnv { SENTRY_DSN: string; PLATFORM: 'firefox' | 'chromium'; PROFILES_ORIGIN: string; + POPULAR_CONTRIBUTORS_IDS: string; } declare module '*.png' { diff --git a/webpack.profiles.config.js b/webpack.profiles.config.js index e318487bc..5d48ac1a9 100644 --- a/webpack.profiles.config.js +++ b/webpack.profiles.config.js @@ -16,7 +16,8 @@ const requiredEnvVarNames = [ 'REFRESH_CONTRIBUTORS_INTERVAL', 'CHROME_EXTENSION_ID', 'FIREFOX_EXTENSION_ID', - 'PROFILES_ORIGIN' + 'PROFILES_ORIGIN', + 'POPULAR_CONTRIBUTORS_IDS' ]; const formatEnvVar = value => `"${value}"`;