From ebdcd512dc2300abf15bf58f2e98bae7699cb9d3 Mon Sep 17 00:00:00 2001 From: soupette Date: Wed, 31 Mar 2021 12:21:29 +0200 Subject: [PATCH 1/4] Only displayed allowed with rbac locales Signed-off-by: soupette --- .../CMEditViewInjectedComponents/index.js | 2 +- .../src/components/LocalePicker/index.js | 24 +++++++++++++++++-- ...electCollectionTypesRelatedPermissions.js} | 0 3 files changed, 23 insertions(+), 3 deletions(-) rename packages/strapi-plugin-i18n/admin/src/{components/CMEditViewInjectedComponents/selectors.js => selectors/selectCollectionTypesRelatedPermissions.js} (100%) diff --git a/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js b/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js index 80ba661935..1168419b39 100644 --- a/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js +++ b/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js @@ -4,8 +4,8 @@ import { useSelector } from 'react-redux'; import { useParams } from 'react-router-dom'; import { useContentManagerEditViewDataManager, useQueryParams } from 'strapi-helper-plugin'; import selectI18NLocales from '../../selectors/selectI18nLocales'; +import selectCollectionTypesRelatedPermissions from '../../selectors/selectCollectionTypesRelatedPermissions'; import CMEditViewLocalePicker from '../CMEditViewLocalePicker'; -import selectCollectionTypesRelatedPermissions from './selectors'; const CMEditViewInjectedComponents = () => { const { layout, modifiedData, slug, isSingleType } = useContentManagerEditViewDataManager(); diff --git a/packages/strapi-plugin-i18n/admin/src/components/LocalePicker/index.js b/packages/strapi-plugin-i18n/admin/src/components/LocalePicker/index.js index edc02015b6..8d1c52c94c 100644 --- a/packages/strapi-plugin-i18n/admin/src/components/LocalePicker/index.js +++ b/packages/strapi-plugin-i18n/admin/src/components/LocalePicker/index.js @@ -2,9 +2,11 @@ import React, { useState } from 'react'; import { useSelector, useDispatch } from 'react-redux'; import { Picker, Padded, Text, Flex } from '@buffetjs/core'; import { Carret, useQueryParams } from 'strapi-helper-plugin'; +import { useRouteMatch } from 'react-router-dom'; import styled from 'styled-components'; import get from 'lodash/get'; import selectI18NLocales from '../../selectors/selectI18nLocales'; +import selectCollectionTypesRelatedPermissions from '../../selectors/selectCollectionTypesRelatedPermissions'; import getInitialLocale from '../../utils/getInitialLocale'; const List = styled.ul` @@ -44,7 +46,14 @@ const LocalePicker = () => { const dispatch = useDispatch(); const pluginOptions = useSelector(selectContentManagerListViewPluginOptions); const locales = useSelector(selectI18NLocales); + const colllectionTypesRelatedPermissions = useSelector(selectCollectionTypesRelatedPermissions); const [{ query }, setQuery] = useQueryParams(); + const { + params: { slug }, + } = useRouteMatch('/plugins/content-manager/collectionType/:slug'); + const currentCTRelatedPermissions = colllectionTypesRelatedPermissions[slug]; + const readPermissions = currentCTRelatedPermissions['plugins::content-manager.explorer.read']; + const createPermissions = currentCTRelatedPermissions['plugins::content-manager.explorer.create']; const initialLocale = getInitialLocale(query, locales); const [selected, setSelected] = useState(initialLocale); @@ -59,6 +68,17 @@ const LocalePicker = () => { return null; } + const displayedLocales = locales.filter(locale => { + const canCreate = createPermissions.find(({ properties }) => { + return get(properties, 'locales', []).includes(locale.code); + }); + const canRead = readPermissions.find(({ properties }) => + get(properties, 'locales', []).includes(locale.code) + ); + + return canCreate || canRead; + }); + return ( { onToggle(); }; - const hasMultipleLocales = locales.length > 1; + const hasMultipleLocales = displayedLocales.length > 1; return hasMultipleLocales ? ( - {locales.map(locale => { + {displayedLocales.map(locale => { if (locale.id === selected.id) { return null; } diff --git a/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/selectors.js b/packages/strapi-plugin-i18n/admin/src/selectors/selectCollectionTypesRelatedPermissions.js similarity index 100% rename from packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/selectors.js rename to packages/strapi-plugin-i18n/admin/src/selectors/selectCollectionTypesRelatedPermissions.js From 5ce16e280da149ab0d63199f950fbc3cb7a76af0 Mon Sep 17 00:00:00 2001 From: soupette Date: Wed, 31 Mar 2021 12:53:34 +0200 Subject: [PATCH 2/4] Fix Pr feedback Signed-off-by: soupette --- .../InjectionZone/InjectionZoneList.js | 18 +++++++++++++----- .../CMEditViewInjectedComponents/index.js | 8 ++------ .../DeleteModalAdditionalInfos/index.js | 7 +++++++ .../admin/src/components/LocalePicker/index.js | 15 ++++----------- .../useGetContentTypePermissions/index.js | 14 ++++++++++++++ .../admin/src/hooks/useHasI18n/index.js | 13 +++++++++++++ 6 files changed, 53 insertions(+), 22 deletions(-) create mode 100644 packages/strapi-plugin-i18n/admin/src/hooks/useGetContentTypePermissions/index.js create mode 100644 packages/strapi-plugin-i18n/admin/src/hooks/useHasI18n/index.js diff --git a/packages/strapi-helper-plugin/lib/src/components/InjectionZone/InjectionZoneList.js b/packages/strapi-helper-plugin/lib/src/components/InjectionZone/InjectionZoneList.js index addb12f035..fa622161e5 100644 --- a/packages/strapi-helper-plugin/lib/src/components/InjectionZone/InjectionZoneList.js +++ b/packages/strapi-helper-plugin/lib/src/components/InjectionZone/InjectionZoneList.js @@ -33,11 +33,19 @@ const InjectionZoneList = ({ area, ...props }) => { return ( - {compos.map(compo => ( - - - - ))} + {compos.map(compo => { + const component = compo.Component(props); + + if (component) { + return ( + + + + ); + } + + return null; + })} ); }; diff --git a/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js b/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js index 1168419b39..cce5c93dda 100644 --- a/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js +++ b/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js @@ -4,12 +4,12 @@ import { useSelector } from 'react-redux'; import { useParams } from 'react-router-dom'; import { useContentManagerEditViewDataManager, useQueryParams } from 'strapi-helper-plugin'; import selectI18NLocales from '../../selectors/selectI18nLocales'; -import selectCollectionTypesRelatedPermissions from '../../selectors/selectCollectionTypesRelatedPermissions'; +import useGetContentTypePermissions from '../../hooks/useGetContentTypePermissions'; import CMEditViewLocalePicker from '../CMEditViewLocalePicker'; const CMEditViewInjectedComponents = () => { const { layout, modifiedData, slug, isSingleType } = useContentManagerEditViewDataManager(); - const colllectionTypesRelatedPermissions = useSelector(selectCollectionTypesRelatedPermissions); + const { createPermissions, readPermissions } = useGetContentTypePermissions(slug); const locales = useSelector(selectI18NLocales); const params = useParams(); const [{ query }, setQuery] = useQueryParams(); @@ -37,10 +37,6 @@ const CMEditViewInjectedComponents = () => { return null; } - const currentCTRelatedPermissions = colllectionTypesRelatedPermissions[slug]; - const readPermissions = currentCTRelatedPermissions['plugins::content-manager.explorer.read']; - const createPermissions = currentCTRelatedPermissions['plugins::content-manager.explorer.create']; - const localizations = get(modifiedData, 'localizations', []); return ( diff --git a/packages/strapi-plugin-i18n/admin/src/components/DeleteModalAdditionalInfos/index.js b/packages/strapi-plugin-i18n/admin/src/components/DeleteModalAdditionalInfos/index.js index 88472fdbdb..1a4e2e5753 100644 --- a/packages/strapi-plugin-i18n/admin/src/components/DeleteModalAdditionalInfos/index.js +++ b/packages/strapi-plugin-i18n/admin/src/components/DeleteModalAdditionalInfos/index.js @@ -1,8 +1,15 @@ import * as React from 'react'; import { FormattedMessage } from 'react-intl'; import { getTrad } from '../../utils'; +import useHasI18n from '../../hooks/useHasI18n'; const DeleteModalAdditionalInfos = () => { + const hasI18nEnabled = useHasI18n(); + + if (!hasI18nEnabled) { + return null; + } + return ( - state.get('content-manager_listView').contentType.pluginOptions; - const LocalePicker = () => { const dispatch = useDispatch(); - const pluginOptions = useSelector(selectContentManagerListViewPluginOptions); const locales = useSelector(selectI18NLocales); - const colllectionTypesRelatedPermissions = useSelector(selectCollectionTypesRelatedPermissions); const [{ query }, setQuery] = useQueryParams(); const { params: { slug }, } = useRouteMatch('/plugins/content-manager/collectionType/:slug'); - const currentCTRelatedPermissions = colllectionTypesRelatedPermissions[slug]; - const readPermissions = currentCTRelatedPermissions['plugins::content-manager.explorer.read']; - const createPermissions = currentCTRelatedPermissions['plugins::content-manager.explorer.create']; + const isFieldLocalized = useHasI18n(); + const { createPermissions, readPermissions } = useGetContentTypePermissions(slug); const initialLocale = getInitialLocale(query, locales); const [selected, setSelected] = useState(initialLocale); - const isFieldLocalized = get(pluginOptions, 'i18n.localized', false); - if (!isFieldLocalized) { return null; } diff --git a/packages/strapi-plugin-i18n/admin/src/hooks/useGetContentTypePermissions/index.js b/packages/strapi-plugin-i18n/admin/src/hooks/useGetContentTypePermissions/index.js new file mode 100644 index 0000000000..d97affe30c --- /dev/null +++ b/packages/strapi-plugin-i18n/admin/src/hooks/useGetContentTypePermissions/index.js @@ -0,0 +1,14 @@ +import { useSelector } from 'react-redux'; +import selectCollectionTypesRelatedPermissions from '../../selectors/selectCollectionTypesRelatedPermissions'; + +const useGetContentTypePermissions = slug => { + const collectionTypesRelatedPermissions = useSelector(selectCollectionTypesRelatedPermissions); + + const currentCTRelatedPermissions = collectionTypesRelatedPermissions[slug]; + const readPermissions = currentCTRelatedPermissions['plugins::content-manager.explorer.read']; + const createPermissions = currentCTRelatedPermissions['plugins::content-manager.explorer.create']; + + return { createPermissions, readPermissions }; +}; + +export default useGetContentTypePermissions; diff --git a/packages/strapi-plugin-i18n/admin/src/hooks/useHasI18n/index.js b/packages/strapi-plugin-i18n/admin/src/hooks/useHasI18n/index.js new file mode 100644 index 0000000000..6fd31ba218 --- /dev/null +++ b/packages/strapi-plugin-i18n/admin/src/hooks/useHasI18n/index.js @@ -0,0 +1,13 @@ +import { useSelector } from 'react-redux'; +import get from 'lodash/get'; + +const selectContentManagerListViewPluginOptions = state => + state.get('content-manager_listView').contentType.pluginOptions; + +const useHasI18n = () => { + const pluginOptions = useSelector(selectContentManagerListViewPluginOptions); + + return get(pluginOptions, 'i18n.localized', false); +}; + +export default useHasI18n; From bdc9582b6a951f5d0198165c750de6904507e2da Mon Sep 17 00:00:00 2001 From: soupette Date: Wed, 31 Mar 2021 13:03:59 +0200 Subject: [PATCH 3/4] Fix localizations display Signed-off-by: soupette --- .../admin/src/components/LocaleListCell/LocaleListCell.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/strapi-plugin-i18n/admin/src/components/LocaleListCell/LocaleListCell.js b/packages/strapi-plugin-i18n/admin/src/components/LocaleListCell/LocaleListCell.js index 1f5c7335f9..e8ef24e90d 100644 --- a/packages/strapi-plugin-i18n/admin/src/components/LocaleListCell/LocaleListCell.js +++ b/packages/strapi-plugin-i18n/admin/src/components/LocaleListCell/LocaleListCell.js @@ -1,9 +1,14 @@ import React from 'react'; import PropTypes from 'prop-types'; import { Tooltip } from '@buffetjs/styles'; +import get from 'lodash/get'; const mapToLocaleName = (locales, localeCode) => - locales.find(({ code }) => code === localeCode).name; + get( + locales.find(({ code }) => code === localeCode), + 'name', + localeCode + ); const LocaleListCell = ({ locales, localizations, locale: currentLocaleCode, id }) => { const allLocalizations = [{ locale: currentLocaleCode }, ...localizations]; From 94e48b48724ad34b3701baabd443298081872fe1 Mon Sep 17 00:00:00 2001 From: soupette Date: Wed, 31 Mar 2021 14:25:49 +0200 Subject: [PATCH 4/4] Rename hook Signed-off-by: soupette --- .../src/components/CMEditViewInjectedComponents/index.js | 4 ++-- .../admin/src/components/LocalePicker/index.js | 4 ++-- .../index.js | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) rename packages/strapi-plugin-i18n/admin/src/hooks/{useGetContentTypePermissions => useContentTypePermissions}/index.js (86%) diff --git a/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js b/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js index cce5c93dda..89accea426 100644 --- a/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js +++ b/packages/strapi-plugin-i18n/admin/src/components/CMEditViewInjectedComponents/index.js @@ -4,12 +4,12 @@ import { useSelector } from 'react-redux'; import { useParams } from 'react-router-dom'; import { useContentManagerEditViewDataManager, useQueryParams } from 'strapi-helper-plugin'; import selectI18NLocales from '../../selectors/selectI18nLocales'; -import useGetContentTypePermissions from '../../hooks/useGetContentTypePermissions'; +import useContentTypePermissions from '../../hooks/useContentTypePermissions'; import CMEditViewLocalePicker from '../CMEditViewLocalePicker'; const CMEditViewInjectedComponents = () => { const { layout, modifiedData, slug, isSingleType } = useContentManagerEditViewDataManager(); - const { createPermissions, readPermissions } = useGetContentTypePermissions(slug); + const { createPermissions, readPermissions } = useContentTypePermissions(slug); const locales = useSelector(selectI18NLocales); const params = useParams(); const [{ query }, setQuery] = useQueryParams(); diff --git a/packages/strapi-plugin-i18n/admin/src/components/LocalePicker/index.js b/packages/strapi-plugin-i18n/admin/src/components/LocalePicker/index.js index 4068ab7b5c..87e0825d05 100644 --- a/packages/strapi-plugin-i18n/admin/src/components/LocalePicker/index.js +++ b/packages/strapi-plugin-i18n/admin/src/components/LocalePicker/index.js @@ -5,7 +5,7 @@ import { Carret, useQueryParams } from 'strapi-helper-plugin'; import { useRouteMatch } from 'react-router-dom'; import styled from 'styled-components'; import get from 'lodash/get'; -import useGetContentTypePermissions from '../../hooks/useGetContentTypePermissions'; +import useContentTypePermissions from '../../hooks/useContentTypePermissions'; import useHasI18n from '../../hooks/useHasI18n'; import selectI18NLocales from '../../selectors/selectI18nLocales'; import getInitialLocale from '../../utils/getInitialLocale'; @@ -48,7 +48,7 @@ const LocalePicker = () => { params: { slug }, } = useRouteMatch('/plugins/content-manager/collectionType/:slug'); const isFieldLocalized = useHasI18n(); - const { createPermissions, readPermissions } = useGetContentTypePermissions(slug); + const { createPermissions, readPermissions } = useContentTypePermissions(slug); const initialLocale = getInitialLocale(query, locales); const [selected, setSelected] = useState(initialLocale); diff --git a/packages/strapi-plugin-i18n/admin/src/hooks/useGetContentTypePermissions/index.js b/packages/strapi-plugin-i18n/admin/src/hooks/useContentTypePermissions/index.js similarity index 86% rename from packages/strapi-plugin-i18n/admin/src/hooks/useGetContentTypePermissions/index.js rename to packages/strapi-plugin-i18n/admin/src/hooks/useContentTypePermissions/index.js index d97affe30c..ef710a1c94 100644 --- a/packages/strapi-plugin-i18n/admin/src/hooks/useGetContentTypePermissions/index.js +++ b/packages/strapi-plugin-i18n/admin/src/hooks/useContentTypePermissions/index.js @@ -1,7 +1,7 @@ import { useSelector } from 'react-redux'; import selectCollectionTypesRelatedPermissions from '../../selectors/selectCollectionTypesRelatedPermissions'; -const useGetContentTypePermissions = slug => { +const useContentTypePermissions = slug => { const collectionTypesRelatedPermissions = useSelector(selectCollectionTypesRelatedPermissions); const currentCTRelatedPermissions = collectionTypesRelatedPermissions[slug]; @@ -11,4 +11,4 @@ const useGetContentTypePermissions = slug => { return { createPermissions, readPermissions }; }; -export default useGetContentTypePermissions; +export default useContentTypePermissions;