Merge pull request #130 from pluginpal/feature/update-to-rc

Update strapi to 5.0.0-rc.2

admin/src/components/ConfigDiff/index.jsx

@@ -3,11 +3,8 @@ import ReactDiffViewer, { DiffMethod } from 'react-diff-viewer-continued';
 import { useIntl } from 'react-intl';
 
 import {
-  ModalLayout,
+  Modal,
-  ModalBody,
-  ModalHeader,
   Grid,
-  GridItem,
   Typography,
 } from '@strapi/design-system';
 
@@ -16,32 +13,32 @@ const ConfigDiff = ({ isOpen, onClose, oldValue, newValue, configName }) => {
   if (!isOpen) return null;
 
   return (
-    <ModalLayout
+    <Modal.Root
       onClose={onClose}
       labelledBy="title"
     >
-      <ModalHeader>
+      <Modal.Header>
         <Typography variant="omega" fontWeight="bold" textColor="neutral800">
           {formatMessage({ id: 'config-sync.ConfigDiff.Title' })} {configName}
         </Typography>
-      </ModalHeader>
+      </Modal.Header>
-      <ModalBody>
+      <Modal.Body>
-        <Grid paddingBottom={4} style={{ textAlign: 'center' }}>
+        <Grid.Root paddingBottom={4} style={{ textAlign: 'center' }}>
-          <GridItem col={6}>
+          <Grid.Item col={6}>
             <Typography variant="delta">{formatMessage({ id: 'config-sync.ConfigDiff.SyncDirectory' })}</Typography>
-          </GridItem>
+          </Grid.Item>
-          <GridItem col={6}>
+          <Grid.Item col={6}>
             <Typography variant="delta">{formatMessage({ id: 'config-sync.ConfigDiff.Database' })}</Typography>
-          </GridItem>
+          </Grid.Item>
-        </Grid>
+        </Grid.Root>
         <ReactDiffViewer
           oldValue={JSON.stringify(oldValue, null, 2)}
           newValue={JSON.stringify(newValue, null, 2)}
           splitView
           compareMethod={DiffMethod.WORDS}
         />
-      </ModalBody>
+      </Modal.Body>
-    </ModalLayout>
+    </Modal.Root>
   );
 };
 

admin/src/components/ConfigList/ConfigListRow/index.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Tr, Td, BaseCheckbox } from '@strapi/design-system';
+import { Tr, Td, Checkbox } from '@strapi/design-system';
 
 const CustomRow = ({ row, checked, updateValue }) => {
   const { configName, configType, state, onClick } = row;
@@ -42,7 +42,7 @@ const CustomRow = ({ row, checked, updateValue }) => {
       style={{ cursor: 'pointer' }}
     >
       <Td>
-        <BaseCheckbox
+        <Checkbox
           aria-label={`Select ${configName}`}
           value={checked}
           onValueChange={updateValue}

admin/src/components/ConfigList/index.jsx

@@ -10,7 +10,7 @@ import {
   Tr,
   Th,
   Typography,
-  BaseCheckbox,
+  Checkbox,
   Loader,
 } from '@strapi/design-system';
 
@@ -128,7 +128,7 @@ const ConfigList = ({ diff, isLoading }) => {
         <Thead>
           <Tr>
             <Th>
-              <BaseCheckbox
+              <Checkbox
                 aria-label={formatMessage({ id: 'config-sync.ConfigList.SelectAll' })}
                 indeterminate={isIndeterminate}
                 onValueChange={(value) => setCheckedItems(checkedItems.map(() => value))}

admin/src/components/ConfirmModal/index.jsx

@@ -4,8 +4,6 @@ import { useSelector } from 'react-redux';
 
 import {
   Dialog,
-  DialogBody,
-  DialogFooter,
   Flex,
   Typography,
   Button,
@@ -23,12 +21,12 @@ const ConfirmModal = ({ isOpen, onClose, onSubmit, type }) => {
   if (!isOpen) return null;
 
   return (
-    <Dialog
+    <Dialog.Root
       onClose={onClose}
       title={formatMessage({ id: "config-sync.popUpWarning.Confirmation" })}
       isOpen={isOpen}
     >
-      <DialogBody icon={<WarningCircle />}>
+      <Dialog.Body icon={<WarningCircle />}>
         <Flex size={2}>
           <Flex justifyContent="center">
             <Typography variant="omega" id="confirm-description" style={{ textAlign: 'center' }}>
@@ -37,7 +35,7 @@ const ConfirmModal = ({ isOpen, onClose, onSubmit, type }) => {
             </Typography>
           </Flex>
         </Flex>
-      </DialogBody>
+      </Dialog.Body>
       {(soft && type === 'import') && (
         <React.Fragment>
           <Divider />
@@ -53,7 +51,7 @@ const ConfirmModal = ({ isOpen, onClose, onSubmit, type }) => {
           </Box>
         </React.Fragment>
       )}
-      <DialogFooter
+      <Dialog.Footer
         startAction={(
           <Button
             onClick={() => {
@@ -75,7 +73,7 @@ const ConfirmModal = ({ isOpen, onClose, onSubmit, type }) => {
             {formatMessage({ id: `config-sync.popUpWarning.button.${type}` })}
           </Button>
         )} />
-    </Dialog>
+    </Dialog.Root>
   );
 };
 

package.json

@@ -55,13 +55,13 @@
     "strapi-server.js"
   ],
   "peerDependencies": {
-    "@strapi/strapi": "^5.0.0-beta.8"
+    "@strapi/strapi": "^5.0.0-rc.2"
   },
   "devDependencies": {
-    "@strapi/design-system": "2.0.0-beta.4",
+    "@strapi/design-system": "2.0.0-rc.7",
-    "@strapi/icons": "2.0.0-beta.4",
+    "@strapi/icons": "2.0.0-rc.7",
-    "@strapi/strapi": "5.0.0-beta.8",
+    "@strapi/strapi": "5.0.0-rc.2",
-    "@strapi/utils": "5.0.0-beta.8",
+    "@strapi/utils": "5.0.0-rc.2",
     "babel-eslint": "9.0.0",
     "eslint": "^7.32.0",
     "eslint-config-airbnb": "^18.2.1",

playground/.strapi/client/app.js

@@ -4,11 +4,13 @@
  */
 import usersPermissions from "@strapi/plugin-users-permissions/strapi-admin";
 import strapiCloud from "@strapi/plugin-cloud/strapi-admin";
+import configSync from "strapi-plugin-config-sync/strapi-admin";
 import { renderAdmin } from "@strapi/strapi/admin";
 
 renderAdmin(document.getElementById("strapi"), {
   plugins: {
     "users-permissions": usersPermissions,
     "strapi-cloud": strapiCloud,
+    "config-sync": configSync,
   },
 });

playground/package.json

@@ -16,9 +16,9 @@
     "supertest": "^6.3.3"
   },
   "dependencies": {
-    "@strapi/strapi": "5.0.0-beta.8",
+    "@strapi/strapi": "5.0.0-rc.2",
-    "@strapi/plugin-users-permissions": "5.0.0-beta.8",
+    "@strapi/plugin-users-permissions": "5.0.0-rc.2",
-    "@strapi/plugin-cloud": "5.0.0-beta.8",
+    "@strapi/plugin-cloud": "5.0.0-rc.2",
     "better-sqlite3": "9.4.3",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",