@strapi/admin 4.3.0-beta.1 → 4.3.1

package/admin/src/pages/MarketplacePage/index.js

@@ -1,7 +1,6 @@
 import React, { useEffect, useRef, useState } from 'react';
 import { useIntl } from 'react-intl';
 import { Helmet } from 'react-helmet';
-import { useQuery } from 'react-query';
 import matchSorter from 'match-sorter';
 import {
   AnErrorOccurred,
@@ -23,8 +22,6 @@ import { Tabs, Tab, TabGroup, TabPanels, TabPanel } from '@strapi/design-system/
 
 import EmptyNpmPackageSearch from './components/EmptyNpmPackageSearch';
 import PageHeader from './components/PageHeader';
-import { fetchAppInformation } from './utils/api';
-import useFetchInstalledPlugins from '../../hooks/useFetchInstalledPlugins';
 import useFetchMarketplaceProviders from '../../hooks/useFetchMarketplaceProviders';
 import useFetchMarketplacePlugins from '../../hooks/useFetchMarketplacePlugins';
 import adminPermissions from '../../permissions';
@@ -53,7 +50,7 @@ const MarketPlacePage = () => {
   const toggleNotification = useNotification();
   const [searchQuery, setSearchQuery] = useState('');
   const [npmPackageType, setNpmPackageType] = useState('plugin');
-  const { autoReload: isInDevelopmentMode } = useAppInfos();
+  const { autoReload: isInDevelopmentMode, dependencies, useYarn } = useAppInfos();
   const isOnline = useNavigatorOnLine();
 
   useFocusWhenNavigate();
@@ -85,37 +82,9 @@ const MarketPlacePage = () => {
     data: marketplaceProvidersResponse,
   } = useFetchMarketplaceProviders(notifyMarketplaceLoad);
 
-  const {
-    status: installedPluginsStatus,
-    data: installedPluginsResponse,
-  } = useFetchInstalledPlugins();
-
-  const { data: appInfoResponse, status: appInfoStatus } = useQuery(
-    'app-information',
-    fetchAppInformation,
-    {
-      onError: () => {
-        toggleNotification({
-          type: 'warning',
-          message: { id: 'notification.error', defaultMessage: 'An error occured' },
-        });
-      },
-    }
-  );
-
-  const isLoading = [
-    marketplacePluginsStatus,
-    marketplaceProvidersStatus,
-    installedPluginsStatus,
-    appInfoStatus,
-  ].includes('loading');
+  const isLoading = [marketplacePluginsStatus, marketplaceProvidersStatus].includes('loading');
 
-  const hasFailed = [
-    marketplacePluginsStatus,
-    marketplaceProvidersStatus,
-    installedPluginsStatus,
-    appInfoStatus,
-  ].includes('error');
+  const hasFailed = [marketplacePluginsStatus, marketplaceProvidersStatus].includes('error');
 
   useEffect(() => {
     trackUsageRef.current('didGoToMarketplace');
@@ -208,8 +177,8 @@ const MarketPlacePage = () => {
     setNpmPackageType(packageType);
   };
 
-  // Check if plugins are installed already
-  const installedPluginNames = installedPluginsResponse.plugins.map(plugin => plugin.packageName);
+  // Check if plugins and providers are installed already
+  const installedPackageNames = Object.keys(dependencies);
 
   return (
     <Layout>
@@ -278,8 +247,8 @@ const MarketPlacePage = () => {
                 ) : (
                   <NpmPackagesGrid
                     npmPackages={pluginSearchResults}
-                    installedPackageNames={installedPluginNames}
-                    useYarn={appInfoResponse.data.useYarn}
+                    installedPackageNames={installedPackageNames}
+                    useYarn={useYarn}
                     isInDevelopmentMode={isInDevelopmentMode}
                     npmPackageType="plugin"
                   />
@@ -292,7 +261,8 @@ const MarketPlacePage = () => {
                 ) : (
                   <NpmPackagesGrid
                     npmPackages={providerSearchResults}
-                    useYarn={appInfoResponse.data.useYarn}
+                    installedPackageNames={installedPackageNames}
+                    useYarn={useYarn}
                     isInDevelopmentMode={isInDevelopmentMode}
                     npmPackageType="provider"
                   />

package/admin/src/pages/ProfilePage/index.js

@@ -357,6 +357,7 @@ const ProfilePage = () => {
                               })}
                               name="password"
                               type={passwordShown ? 'text' : 'password'}
+                              autoComplete="new-password"
                               endAction={
                                 <FieldActionWrapper
                                   onClick={e => {
@@ -398,6 +399,7 @@ const ProfilePage = () => {
                               })}
                               name="confirmPassword"
                               type={passwordConfirmShown ? 'text' : 'password'}
+                              autoComplete="new-password"
                               endAction={
                                 <FieldActionWrapper
                                   onClick={e => {
@@ -531,24 +533,23 @@ const ProfilePage = () => {
                                 });
                               }}
                             >
-                              {themesToDisplay.map(theme => {
-                                const label = formatMessage(
-                                  {
-                                    id:
-                                      'Settings.profile.form.section.experience.mode.option-label',
-                                    defaultMessage: '{name} mode',
-                                  },
-                                  {
-                                    name: upperFirst(theme),
-                                  }
-                                );
-
-                                return (
-                                  <Option value={theme} key={theme}>
-                                    {label}
-                                  </Option>
-                                );
-                              })}
+                              {themesToDisplay.map(theme => (
+                                <Option value={theme} key={theme}>
+                                  {formatMessage(
+                                    {
+                                      id:
+                                        'Settings.profile.form.section.experience.mode.option-label',
+                                      defaultMessage: '{name} mode',
+                                    },
+                                    {
+                                      name: formatMessage({
+                                        id: theme,
+                                        defaultMessage: upperFirst(theme),
+                                      }),
+                                    }
+                                  )}
+                                </Option>
+                              ))}
                             </Select>
                           </GridItem>
                         </Grid>

package/admin/src/pages/SettingsPage/pages/Users/EditPage/utils/layout.js

@@ -62,7 +62,7 @@ const layout = [
         id: 'Auth.form.username.placeholder',
         defaultMessage: 'e.g. Kai_Doe',
       },
-      type: 'email',
+      type: 'text',
       size: {
         col: 6,
         xs: 12,
@@ -81,6 +81,7 @@ const layout = [
         col: 6,
         xs: 12,
       },
+      autoComplete: 'new-password',
     },
     {
       intlLabel: {
@@ -93,6 +94,7 @@ const layout = [
         col: 6,
         xs: 12,
       },
+      autoComplete: 'new-password',
     },
   ],
   [

package/admin/src/pages/SettingsPage/pages/Users/ListPage/DynamicTable/TableRows/index.js

@@ -63,7 +63,7 @@ const TableRows = ({
               return (
                 <Td key={key}>
                   {typeof cellFormatter === 'function' ? (
-                    cellFormatter(data, { key, name, ...rest })
+                    cellFormatter(data, { key, name, formatMessage, ...rest })
                   ) : (
                     <Typography textColor="neutral800">{data[name] || '-'}</Typography>
                   )}

package/admin/src/pages/SettingsPage/pages/Users/ListPage/utils/tableHeaders.js

@@ -24,9 +24,18 @@ const tableHeaders = [
     name: 'roles',
     metadatas: { label: 'Roles', sortable: false },
     /* eslint-disable react/prop-types */
-    cellFormatter: ({ roles }) => {
+    cellFormatter: ({ roles }, { formatMessage }) => {
       return (
-        <Typography textColor="neutral800">{roles.map(role => role.name).join(',\n')}</Typography>
+        <Typography textColor="neutral800">
+          {roles
+            .map(role =>
+              formatMessage({
+                id: `global.${role.code}`,
+                defaultMessage: role.name,
+              })
+            )
+            .join(',\n')}
+        </Typography>
       );
     },
     /* eslint-enable react/prop-types */
@@ -41,11 +50,16 @@ const tableHeaders = [
     name: 'isActive',
     metadatas: { label: 'User status', sortable: false },
     // eslint-disable-next-line react/prop-types
-    cellFormatter: ({ isActive }) => {
+    cellFormatter: ({ isActive }, { formatMessage }) => {
       return (
         <Flex>
           <Status isActive={isActive} variant={isActive ? 'success' : 'danger'} />
-          <Typography textColor="neutral800">{isActive ? 'Active' : 'Inactive'}</Typography>
+          <Typography textColor="neutral800">
+            {formatMessage({
+              id: isActive ? 'global.active' : 'global.inactive',
+              defaultMessage: isActive ? 'Active' : 'Inactive',
+            })}
+          </Typography>
         </Flex>
       );
     },

package/admin/src/pages/SettingsPage/pages/Users/components/SelectRoles/index.js

@@ -73,7 +73,10 @@ const SelectRoles = ({ disabled, error, onChange, value }) => {
       {(data || []).map(role => {
         return (
           <Option key={role.id} value={role.id}>
-            {role.name}
+            {formatMessage({
+              id: `global.${role.code}`,
+              defaultMessage: role.name,
+            })}
           </Option>
         );
       })}

package/admin/src/translations/en.json

@@ -3,6 +3,7 @@
   "Auth.components.Oops.text": "Your account has been suspended.",
   "Auth.components.Oops.text.admin": "If this is a mistake, please contact your administrator.",
   "Auth.components.Oops.title": "Oops...",
+  "Auth.form.active.label": "Active",
   "Auth.form.button.forgot-password": "Send Email",
   "Auth.form.button.go-home": "GO BACK HOME",
   "Auth.form.button.login": "Login",
@@ -157,6 +158,8 @@
   "Settings.profile.form.section.experience.mode.label": "Interface mode",
   "Settings.profile.form.section.experience.mode.hint": "Displays your interface in the chosen mode.",
   "Settings.profile.form.section.experience.mode.option-label": "{name} mode",
+  "light": "Light",
+  "dark": "Dark",
   "Settings.profile.form.section.experience.title": "Experience",
   "Settings.profile.form.section.helmet.title": "User profile",
   "Settings.profile.form.section.profile.page.title": "Profile page",
@@ -320,8 +323,10 @@
   "app.components.InstallPluginPage.description": "Extend your app effortlessly.",
   "app.components.LeftMenu.collapse": "Collapse the navbar",
   "app.components.LeftMenu.expand": "Expand the navbar",
+  "app.components.LeftMenu.general": "General",
   "app.components.LeftMenu.logout": "Logout",
   "app.components.LeftMenu.logo.alt": "Application logo",
+  "app.components.LeftMenu.plugins": "Plugins",
   "app.components.LeftMenu.navbrand.title": "Strapi Dashboard",
   "app.components.LeftMenu.navbrand.workplace": "Workplace",
   "app.components.LeftMenuFooter.help": "Help",
@@ -671,6 +676,7 @@
   "content-manager.popUpwarning.warning.has-draft-relations.button-confirm": "Yes, publish",
   "content-manager.popUpwarning.warning.has-draft-relations.message": "<b>{count, plural, =0 { of your content relations is} one { of your content relations is} other { of your content relations are}}</b> not published yet.<br></br>It might engender broken links and errors on your project.",
   "content-manager.popover.display-relations.label": "Display relations",
+  "content-manager.select.currently.selected": "{count} currently selected",
   "content-manager.success.record.delete": "Deleted",
   "content-manager.success.record.publish": "Published",
   "content-manager.success.record.save": "Saved",
@@ -679,8 +685,12 @@
   "content-manager.apiError.This attribute must be unique": "{field} must be unique",
   "form.button.continue": "Continue",
   "form.button.done": "Done",
+  "global.search": "Search",
   "global.actions": "Actions",
+  "global.active": "Active",
+  "global.inactive": "Inactive",
   "global.back": "Back",
+  "global.cancel": "Cancel",
   "global.change-password": "Change password",
   "global.content-manager": "Content Manager",
   "global.continue": "Continue",
@@ -697,6 +707,24 @@
   "global.none": "None",
   "global.password": "Password",
   "global.plugins": "Plugins",
+  "global.plugins.content-manager": "Content Manager",
+  "global.plugins.content-manager.description": "Quick way to see, edit and delete the data in your database.",
+  "global.plugins.content-type-builder": "Content Type Builder",
+  "global.plugins.content-type-builder.description": "Modelize the data structure of your API. Create new fields and relations in just a minute. The files are automatically created and updated in your project.",
+  "global.plugins.email": "Email",
+  "global.plugins.email.description": "Configure your application to send emails.",
+  "global.plugins.upload": "Media Library",
+  "global.plugins.upload.description": "Media file management.",
+  "global.plugins.graphql": "GraphQL",
+  "global.plugins.graphql.description": "Adds GraphQL endpoint with default API methods.",
+  "global.plugins.documentation": "Documentation",
+  "global.plugins.documentation.description": "Create an OpenAPI Document and visualize your API with SWAGGER UI.",
+  "global.plugins.i18n": "Internationalization",
+  "global.plugins.i18n.description": "This plugin enables to create, to read and to update content in different languages, both from the Admin Panel and from the API.",
+  "global.plugins.sentry": "Sentry",
+  "global.plugins.sentry.description": "Send Strapi error events to Sentry.",
+  "global.plugins.users-permissions": "Roles & Permissions",
+  "global.plugins.users-permissions.description": "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.",
   "global.profile": "Profile",
   "global.prompt.unsaved": "Are you sure you want to leave this page? All your modifications will be lost",
   "global.reset-password": "Reset password",
@@ -706,6 +734,15 @@
   "global.select": "Select",
   "global.select-all-entries": "Select all entries",
   "global.settings": "Settings",
+  "global.strapi-super-admin": "Super Admin",
+  "global.strapi-editor": "Editor",
+  "global.strapi-author": "Author",
+  "global.table.header.email": "Email",
+  "global.table.header.firstname": "Firstname",
+  "global.table.header.isActive": "User status",
+  "global.table.header.lastname": "Lastname",
+  "global.table.header.roles": "Roles",
+  "global.table.header.username": "Username",
   "global.type": "Type",
   "global.users": "Users",
   "notification.contentType.relations.conflict": "Content type has conflicting relations",
@@ -721,6 +758,7 @@
   "notification.success.title": "Success:",
   "notification.version.update.message": "A new version of Strapi is available!",
   "notification.warning.title": "Warning:",
+  "notification.warning.404": "404 - Not found",
   "or": "OR",
   "request.error.model.unknown": "This model doesn't exist",
   "skipToContent": "Skip to content",