Changed to the new rich-text-field

src/Admin/Components/Components/Inputs/EditCollection.js

@@ -35,7 +35,8 @@ import LoadingSpinner from '../../../../Components/LoadingSpinner';
 import { EditFilter, GetAData } from '../../../Filters';
 //routers
 import { Link } from 'react-router-dom';
-import ReactRichEditor from "react-rich-text-editor";
+import ClassicEditor from "@ckeditor/ckeditor5-build-classic"
+import { CKEditor } from '@ckeditor/ckeditor5-react';
 
 const EditCollection = ({ match }) => {
     const { state, dispatch } = useContext(Store);
@@ -263,12 +264,13 @@ const EditCollection = ({ match }) => {
                                 </MenuItem>
                             ))}
                         </TextField>
-                        <ReactRichEditor
-                            height={200}
-                            onCodeChange={(word) => {
-                                setDescription(word)
+                        <CKEditor
+                            editor={ClassicEditor}
+                            data={description}
+                            onBlur={(event, editor) => {
+                                const data = editor.getData();
+                                setDescription(data)
                             }}
-                            showAll={true}
                         />
                     </form>
                 </CardContent>

src/Admin/Components/Components/Inputs/EditEducationalObect.js

@@ -46,7 +46,8 @@ import {
 import { EditFilter } from "../../../Filters";
 //routers
 import { Link } from "react-router-dom";
-import ReactRichEditor from "react-rich-text-editor";
+import ClassicEditor from "@ckeditor/ckeditor5-build-classic"
+import { CKEditor } from '@ckeditor/ckeditor5-react';
 
 const useStyles = makeStyles((theme) => ({
     root: {
@@ -583,13 +584,13 @@ const EditEducationalObject = ({ match }) => {
                         </TabPanel>
 
                         <TabPanel value={value} index={1} dir={theme.direction}>
-                            <ReactRichEditor
-                                height={200}
-                                onCodeChange={(word) => {
-                                    text = word
+                            <CKEditor
+                                editor={ClassicEditor}
+                                data={description}
+                                onBlur={(event, editor) => {
+                                    const data = editor.getData();
+                                    setDescription(data)
                                 }}
-                                showAll={true}
-
                             />
                         </TabPanel>
 

src/Admin/Components/Components/Inputs/EmailInputs.js

@@ -31,7 +31,8 @@ import Chip from '@material-ui/core/Chip';
 //imports from local files
 import SnackBar from "../../../../Components/SnackbarComponent";
 import { postRequest } from '../../../../Components/HelperFunctions/getAxiosConfig'
-import ReactRichEditor from "react-rich-text-editor";
+import ClassicEditor from "@ckeditor/ckeditor5-build-classic"
+import { CKEditor } from '@ckeditor/ckeditor5-react';
 
 let sendToAll = false;
 
@@ -407,12 +408,13 @@ const EmailInputs = (props) => {
             <div style={{ height: "1em" }} />
 
             <div style={{ flex: 1 }}>
-                <ReactRichEditor
-                    height={200}
-                    onCodeChange={(word) => {
-                        setMessage(word)
+                <CKEditor
+                    editor={ClassicEditor}
+                    data={message}
+                    onBlur={(event, editor) => {
+                        const data = editor.getData();
+                        setMessage(data)
                     }}
-                    showAll={true}
                 />
             </div>