From 8575995080697696dda074a1551a5b733bca6520 Mon Sep 17 00:00:00 2001
From: soupette <cyril.lpz@gmail.com>
Date: Tue, 4 Aug 2020 14:33:43 +0200
Subject: [PATCH] Add page title to settings

Signed-off-by: soupette <cyril.lpz@gmail.com>
---
 .../src/components/SettingsPageTitle/index.js   | 17 +++++++++++++++++
 packages/strapi-helper-plugin/lib/src/index.js  |  1 +
 packages/strapi-helper-plugin/package.json      |  1 +
 .../src/containers/AdvancedSettings/index.js    | 13 ++++++++++++-
 .../src/containers/EmailTemplates/index.js      | 13 ++++++++++++-
 .../admin/src/containers/Providers/index.js     | 13 ++++++++++++-
 .../admin/src/index.js                          |  4 ++--
 .../admin/src/translations/en.json              | 11 +++++++----
 8 files changed, 64 insertions(+), 9 deletions(-)
 create mode 100644 packages/strapi-helper-plugin/lib/src/components/SettingsPageTitle/index.js

diff --git a/packages/strapi-helper-plugin/lib/src/components/SettingsPageTitle/index.js b/packages/strapi-helper-plugin/lib/src/components/SettingsPageTitle/index.js
new file mode 100644
index 0000000000..c9ec79e6a6
--- /dev/null
+++ b/packages/strapi-helper-plugin/lib/src/components/SettingsPageTitle/index.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import { useIntl } from 'react-intl';
+import PropTypes from 'prop-types';
+import { Helmet } from 'react-helmet';
+
+const SettingsPageTitle = ({ name }) => {
+  const { formatMessage } = useIntl();
+  const text = formatMessage({ id: 'Settings.PageTitle' }, { name });
+
+  return <Helmet title={text} />;
+};
+
+SettingsPageTitle.propTypes = {
+  name: PropTypes.string.isRequired,
+};
+
+export default SettingsPageTitle;
diff --git a/packages/strapi-helper-plugin/lib/src/index.js b/packages/strapi-helper-plugin/lib/src/index.js
index b3280a2f69..6c409ac398 100644
--- a/packages/strapi-helper-plugin/lib/src/index.js
+++ b/packages/strapi-helper-plugin/lib/src/index.js
@@ -81,6 +81,7 @@ export { default as UserProvider } from './components/UserProvider';
 export { default as ViewContainer } from './components/ViewContainer';
 export { default as CheckPagePermissions } from './components/CheckPagePermissions';
 export { default as CheckPermissions } from './components/CheckPermissions';
+export { default as SettingsPageTitle } from './components/SettingsPageTitle';
 
 // Contexts
 export { GlobalContext, GlobalContextProvider, useGlobalContext } from './contexts/GlobalContext';
diff --git a/packages/strapi-helper-plugin/package.json b/packages/strapi-helper-plugin/package.json
index ff5f67eb80..e606703376 100644
--- a/packages/strapi-helper-plugin/package.json
+++ b/packages/strapi-helper-plugin/package.json
@@ -63,6 +63,7 @@
     "moment": "^2.16.0",
     "react": "^16.9.0",
     "react-dom": "^16.9.0",
+    "react-helmet": "^6.0.0",
     "react-intl": "4.5.0",
     "react-router": "^5.0.0",
     "react-router-dom": "^5.0.0",
diff --git a/packages/strapi-plugin-users-permissions/admin/src/containers/AdvancedSettings/index.js b/packages/strapi-plugin-users-permissions/admin/src/containers/AdvancedSettings/index.js
index 2921fc5c28..9d2bb90b7c 100644
--- a/packages/strapi-plugin-users-permissions/admin/src/containers/AdvancedSettings/index.js
+++ b/packages/strapi-plugin-users-permissions/admin/src/containers/AdvancedSettings/index.js
@@ -1,7 +1,18 @@
 import React from 'react';
+import { useIntl } from 'react-intl';
+import { SettingsPageTitle } from 'strapi-helper-plugin';
+import getTrad from '../../utils/getTrad';
 
 const AdvancedSettingsPage = () => {
-  return <div>Advanced settings</div>;
+  const { formatMessage } = useIntl();
+  const pageTitle = formatMessage({ id: getTrad('HeaderNav.link.advancedSettings') });
+
+  return (
+    <>
+      <SettingsPageTitle name={pageTitle} />
+      <div>Advanced settings</div>
+    </>
+  );
 };
 
 export default AdvancedSettingsPage;
diff --git a/packages/strapi-plugin-users-permissions/admin/src/containers/EmailTemplates/index.js b/packages/strapi-plugin-users-permissions/admin/src/containers/EmailTemplates/index.js
index 580f271e56..e0f5c5cc2b 100644
--- a/packages/strapi-plugin-users-permissions/admin/src/containers/EmailTemplates/index.js
+++ b/packages/strapi-plugin-users-permissions/admin/src/containers/EmailTemplates/index.js
@@ -1,7 +1,18 @@
 import React from 'react';
+import { useIntl } from 'react-intl';
+import { SettingsPageTitle } from 'strapi-helper-plugin';
+import getTrad from '../../utils/getTrad';
 
 const EmailTemplatesPage = () => {
-  return <div>Email templates</div>;
+  const { formatMessage } = useIntl();
+  const pageTitle = formatMessage({ id: getTrad('HeaderNav.link.emailTemplates') });
+
+  return (
+    <>
+      <SettingsPageTitle name={pageTitle} />
+      <div>Email</div>
+    </>
+  );
 };
 
 export default EmailTemplatesPage;
diff --git a/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/index.js b/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/index.js
index b2871bae9c..4d38d62ad4 100644
--- a/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/index.js
+++ b/packages/strapi-plugin-users-permissions/admin/src/containers/Providers/index.js
@@ -1,7 +1,18 @@
 import React from 'react';
+import { useIntl } from 'react-intl';
+import { SettingsPageTitle } from 'strapi-helper-plugin';
+import getTrad from '../../utils/getTrad';
 
 const ProvidersPage = () => {
-  return <div>Providers</div>;
+  const { formatMessage } = useIntl();
+  const pageTitle = formatMessage({ id: getTrad('HeaderNav.link.providers') });
+
+  return (
+    <>
+      <SettingsPageTitle name={pageTitle} />
+      <div>Providers</div>
+    </>
+  );
 };
 
 export default ProvidersPage;
diff --git a/packages/strapi-plugin-users-permissions/admin/src/index.js b/packages/strapi-plugin-users-permissions/admin/src/index.js
index a8390cb286..d294ec13dc 100644
--- a/packages/strapi-plugin-users-permissions/admin/src/index.js
+++ b/packages/strapi-plugin-users-permissions/admin/src/index.js
@@ -72,7 +72,7 @@ export default strapi => {
           },
           {
             title: {
-              id: getTrad('HeaderNav.link.email-templates'),
+              id: getTrad('HeaderNav.link.emailTemplates'),
               defaultMessage: 'Email templates',
             },
             name: 'email-templates',
@@ -86,7 +86,7 @@ export default strapi => {
           },
           {
             title: {
-              id: getTrad('HeaderNav.link.advanced-settings'),
+              id: getTrad('HeaderNav.link.advancedSettings'),
               defaultMessage: 'Advanced Settings',
             },
             name: 'advanced-settings',
diff --git a/packages/strapi-plugin-users-permissions/admin/src/translations/en.json b/packages/strapi-plugin-users-permissions/admin/src/translations/en.json
index 64ef1992b3..02e9befcac 100644
--- a/packages/strapi-plugin-users-permissions/admin/src/translations/en.json
+++ b/packages/strapi-plugin-users-permissions/admin/src/translations/en.json
@@ -36,10 +36,7 @@
   "Email.template.email_confirmation": "Email address confirmation",
   "Email.template.reset_password": "Reset password",
   "Email.template.success_register": "Registration successful",
-  "HeaderNav.link.advancedSettings": "Advanced settings",
-  "HeaderNav.link.emailTemplates": "Email templates",
-  "HeaderNav.link.providers": "Providers",
-  "HeaderNav.link.roles": "Roles",
+
   "HomePage.header.description": "Define the roles and permissions for your users.",
   "HomePage.header.title": "Roles & Permissions",
   "InputSearch.placeholder": "Search for a user",
@@ -110,6 +107,12 @@
   "notification.info.emailSent": "The email has been sent",
   "notification.success.delete": "The item has been deleted",
   "notification.success.submit": "Settings have been updated",
+
+  "TRANSLATIONS-TO-KEEP": "TRANSLATIONS TO KEEP",
+  "HeaderNav.link.advancedSettings": "Advanced settings",
+  "HeaderNav.link.emailTemplates": "Email templates",
+  "HeaderNav.link.providers": "Providers",
+  "HeaderNav.link.roles": "Roles",
   "plugin.description.long": "Protect your API with a full authentication process based on JWT. This plugin comes also with an ACL strategy that allows you to manage the permissions between the groups of users.",
   "plugin.description.short": "Protect your API with a full authentication process based on JWT",
   "plugin.name": "Users & Permissions Plugin"