@strapi/admin 4.0.4 → 4.0.8

package/admin/src/content-manager/pages/EditSettingsView/utils/layout.js

@@ -28,13 +28,7 @@ const formatLayout = arr => {
 
         return acc2;
       }, []);
-      const rowId =
-        acc.length === 0
-          ? 0
-          : Math.max.apply(
-              Math,
-              acc.map(o => o.rowId)
-            ) + 1;
+      const rowId = acc.length === 0 ? 0 : Math.max.apply(Math, acc.map(o => o.rowId)) + 1;
 
       const currentRowSize = getRowSize(currentRow);
 
@@ -75,7 +69,7 @@ const unformatLayout = arr => {
   }, []);
 };
 
-const getInputSize = type => {
+const getDefaultInputSize = type => {
   switch (type) {
     case 'boolean':
     case 'date':
@@ -95,4 +89,41 @@ const getInputSize = type => {
   }
 };
 
-export { createLayout, formatLayout, getInputSize, getRowSize, unformatLayout };
+const getFieldSize = (name, layouts = []) => {
+  return layouts.reduce((acc, { rowContent }) => {
+    const size = rowContent.find(row => row.name === name)?.size ?? null;
+
+    if (size) {
+      acc = size;
+    }
+
+    return acc;
+  }, null);
+};
+
+const setFieldSize = (name, size, layouts = []) => {
+  return layouts.map(row => {
+    row.rowContent = row.rowContent.map(column => {
+      if (column.name === name) {
+        return {
+          ...column,
+          size,
+        };
+      }
+
+      return column;
+    });
+
+    return row;
+  });
+};
+
+export {
+  createLayout,
+  formatLayout,
+  getDefaultInputSize,
+  getFieldSize,
+  setFieldSize,
+  getRowSize,
+  unformatLayout,
+};

package/admin/src/content-manager/pages/EditView/index.js

@@ -309,6 +309,7 @@ const EditView = ({
                       )}
                       <Box as="aside" aria-labelledby="links">
                         <Stack size={2}>
+                          <InjectionZone area="contentManager.editView.right-links" slug={slug} />
                           {slug !== 'strapi::administrator' && (
                             <CheckPermissions permissions={ctbPermissions}>
                               <LinkButton
@@ -343,7 +344,7 @@ const EditView = ({
                               })}
                             </LinkButton>
                           </CheckPermissions>
-                          <InjectionZone area="contentManager.editView.right-links" slug={slug} />
+
                           {allowedActions.canDelete && (
                             <DeleteLink
                               isCreatingEntry={isCreatingEntry}

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

@@ -27,6 +27,7 @@ const MarketplacePage = lazy(() =>
   import(/* webpackChunkName: "Admin_marketplace" */ '../MarketplacePage')
 );
 const NotFoundPage = lazy(() => import('../NotFoundPage'));
+const InternalErrorPage = lazy(() => import('../InternalErrorPage'));
 
 const ProfilePage = lazy(() =>
   import(/* webpackChunkName: "Admin_profilePage" */ '../ProfilePage')
@@ -87,6 +88,7 @@ const Admin = () => {
               <InstalledPluginsPage />
             </Route>
             <Route path="/404" component={NotFoundPage} />
+            <Route path="/500" component={InternalErrorPage} />
             <Route path="" component={NotFoundPage} />
           </Switch>
         </Suspense>

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

@@ -0,0 +1,53 @@
+/**
+ * InternalErrorPage
+ *
+ * This is the page we show when the user gets a 500 error
+ *
+ */
+import React from 'react';
+import { useFocusWhenNavigate } from '@strapi/helper-plugin';
+import { Main } from '@strapi/design-system/Main';
+import { LinkButton } from '@strapi/design-system/LinkButton';
+import { ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
+import { EmptyStateLayout } from '@strapi/design-system/EmptyStateLayout';
+import EmptyPictures from '@strapi/icons/EmptyPictures';
+import ArrowRight from '@strapi/icons/ArrowRight';
+import { useIntl } from 'react-intl';
+
+const InternalErrorPage = () => {
+  const { formatMessage } = useIntl();
+  useFocusWhenNavigate();
+
+  return (
+    <Main labelledBy="title">
+      <HeaderLayout
+        id="title"
+        title={formatMessage({
+          id: 'content-manager.pageNotFound',
+          defaultMessage: 'Page not found',
+        })}
+      />
+      <ContentLayout>
+        <EmptyStateLayout
+          action={
+            <LinkButton variant="secondary" endIcon={<ArrowRight />} to="/">
+              {formatMessage({
+                id: 'app.components.NotFoundPage.back',
+                defaultMessage: 'Back to homepage',
+              })}
+            </LinkButton>
+          }
+          content={formatMessage({
+            id: 'notification.error',
+            defaultMessage: 'An error occured',
+          })}
+          hasRadius
+          icon={<EmptyPictures width="10rem" />}
+          shadow="tableShadow"
+        />
+      </ContentLayout>
+    </Main>
+  );
+};
+
+export default InternalErrorPage;

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

@@ -10,6 +10,7 @@ import { Stack } from '@strapi/design-system/Stack';
 import { LinkButton } from '@strapi/design-system/LinkButton';
 import { Main } from '@strapi/design-system/Main';
 import { Typography } from '@strapi/design-system/Typography';
+import ExternalLink from '@strapi/icons/ExternalLink';
 import adminPermissions from '../../permissions';
 import MarketplacePicture from './assets/marketplace-coming-soon.png';
 
@@ -79,31 +80,30 @@ const MarketPlacePage = () => {
               </Typography>
               <Typography variant="alpha" textColor="primary700">
                 {formatMessage({
-                  id: 'admin.pages.MarketPlacePage.coming-soon.2',
-                  defaultMessage: 'A new way to make Strapi awesome.',
+                  id: 'admin.pages.MarketPlacePage.published',
+                  defaultMessage: 'Finally here.',
                 })}
               </Typography>
-              <Flex maxWidth={pxToRem(580)} paddingTop={3}>
+              <Flex maxWidth={pxToRem(620)} paddingTop={3}>
                 <CenterTypography variant="epsilon" textColor="neutral600">
                   {formatMessage({
-                    id: 'admin.pages.MarketPlacePage.content.subtitle',
+                    id: 'admin.pages.MarketPlacePage.content.subtitle.published',
                     defaultMessage:
-                      'The new marketplace will help you get more out of Strapi. We are working hard to offer the best experience to discover and install plugins.',
+                      'The web marketplace helps you get the most of Strapi. In addition, we are working hard to offer the best experience to discover and install plugins, directly from the app.',
                   })}
                 </CenterTypography>
               </Flex>
               <Stack paddingTop={6} horizontal size={2}>
-                {/* Temporarily hidden until we have the right URL for the link */}
-                {/* <LinkButton href="https://strapi.io/" size="L" variant="secondary">
+                <LinkButton href="https://market.strapi.io" size="L" variant="primary" endIcon={<ExternalLink />}>
                   {formatMessage({
-                    id: 'admin.pages.MarketPlacePage.submit.plugin.link',
-                    defaultMessage: 'Submit your plugin',
+                    id: 'admin.pages.MarketPlacePage.submit.market.link',
+                    defaultMessage: 'Visit the web marketplace',
                   })}
-                </LinkButton> */}
-                <LinkButton href="https://strapi.io/blog/strapi-market-is-coming-soon" size="L">
+                </LinkButton>
+                <LinkButton href="https://market.strapi.io/submit-plugin" size="L" variant="secondary">
                   {formatMessage({
-                    id: 'admin.pages.MarketPlacePage.blog.link',
-                    defaultMessage: 'Read our blog post',
+                    id: 'admin.pages.MarketPlacePage.submit.plugin.link',
+                    defaultMessage: 'Submit your plugin',
                   })}
                 </LinkButton>
               </Stack>

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

@@ -4,7 +4,50 @@
  * This is the page we show when the user visits a url that doesn't have a route
  *
  */
+import React from 'react';
+import { useFocusWhenNavigate } from '@strapi/helper-plugin';
+import { Main } from '@strapi/design-system/Main';
+import { LinkButton } from '@strapi/design-system/LinkButton';
+import { ContentLayout, HeaderLayout } from '@strapi/design-system/Layout';
+import { EmptyStateLayout } from '@strapi/design-system/EmptyStateLayout';
+import EmptyPictures from '@strapi/icons/EmptyPictures';
+import ArrowRight from '@strapi/icons/ArrowRight';
+import { useIntl } from 'react-intl';
 
-const NotFoundPage = () => 'TODO NOT FOUND';
+const NoContentType = () => {
+  const { formatMessage } = useIntl();
+  useFocusWhenNavigate();
 
-export default NotFoundPage;
+  return (
+    <Main labelledBy="title">
+      <HeaderLayout
+        id="title"
+        title={formatMessage({
+          id: 'content-manager.pageNotFound',
+          defaultMessage: 'Page not found',
+        })}
+      />
+      <ContentLayout>
+        <EmptyStateLayout
+          action={
+            <LinkButton variant="secondary" endIcon={<ArrowRight />} to="/">
+              {formatMessage({
+                id: 'app.components.NotFoundPage.back',
+                defaultMessage: 'Back to homepage',
+              })}
+            </LinkButton>
+          }
+          content={formatMessage({
+            id: 'app.page.not.found',
+            defaultMessage: "Oops! We can't seem to find the page you're looging for...",
+          })}
+          hasRadius
+          icon={<EmptyPictures width="10rem" />}
+          shadow="tableShadow"
+        />
+      </ContentLayout>
+    </Main>
+  );
+};
+
+export default NoContentType;

package/admin/src/pages/SettingsPage/pages/ApiTokens/ListView/index.js

@@ -111,7 +111,7 @@ const ApiTokenListView = () => {
             >
               {formatMessage({
                 id: 'Settings.apiTokens.create',
-                defaultMessage: 'Add Entry',
+                defaultMessage: 'Create new API Token',
               })}
             </LinkButton>
           ) : (

package/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/EventInput/index.js

@@ -63,7 +63,7 @@ const EventInput = ({ isDraftAndPublish }) => {
     : displayedData.events.default;
 
   const { formatMessage } = useIntl();
-  const { values, errors, handleChange: onChange } = useFormikContext();
+  const { values, handleChange: onChange } = useFormikContext();
 
   const inputName = 'events';
   const inputValue = values.events;
@@ -100,7 +100,7 @@ const EventInput = ({ isDraftAndPublish }) => {
 
   return (
     <Stack size={1}>
-      <FieldLabel required>
+      <FieldLabel>
         {formatMessage({
           id: 'Settings.webhooks.form.events',
           defaultMessage: 'Events',
@@ -154,14 +154,6 @@ const EventInput = ({ isDraftAndPublish }) => {
           })}
         </tbody>
       </StyledTable>
-      {errors.events && (
-        <Typography variant="pi" textColor="danger600" data-strapi-field-error>
-          {formatMessage({
-            id: 'components.Input.error.validation.required',
-            defaultMessage: 'This value is required',
-          })}
-        </Typography>
-      )}
     </Stack>
   );
 };

package/admin/src/pages/SettingsPage/pages/Webhooks/EditView/components/utils/schema.js

@@ -29,10 +29,7 @@ const schema = yup.object().shape({
       })
     );
   }),
-  events: yup
-    .array()
-    .min(1, translatedErrors.min)
-    .required(translatedErrors.required),
+  events: yup.array(),
 });
 
 export default schema;

package/admin/src/pages/SettingsPage/pages/Webhooks/ListView/index.js

@@ -281,7 +281,10 @@ const ListView = () => {
                   size="L"
                   variant="danger-light"
                 >
-                  Delete
+                  {formatMessage({
+                    id: 'Settings.webhooks.events.delete',
+                    defaultMessage: 'Delete',
+                  })}
                 </Button>
               </>
             }