fix(plugin-seo): enforce readonly on the client (#9536)

### What?
Plugin-seo fields were not set to disabled when a user did not have
permissions.

### Why?
The `readOnly` property was not being used.

### How?
Uses the `readOnly` property to disable buttons and set inputs to
readOnly.

packages/plugin-seo/src/fields/MetaDescription/MetaDescriptionComponent.tsx

@@ -39,6 +39,7 @@ export const MetaDescriptionComponent: React.FC<MetaDescriptionProps> = (props)
     },
     hasGenerateDescriptionFn,
     path,
+    readOnly,
   } = props
 
   const {
@@ -139,6 +140,7 @@ export const MetaDescriptionComponent: React.FC<MetaDescriptionProps> = (props)
             <React.Fragment>
               &nbsp; &mdash; &nbsp;
               <button
+                disabled={readOnly}
                 onClick={() => {
                   void regenerateDescription()
                 }}
@@ -185,6 +187,7 @@ export const MetaDescriptionComponent: React.FC<MetaDescriptionProps> = (props)
           Error={errorMessage}
           onChange={setValue}
           path={path}
+          readOnly={readOnly}
           required={required}
           showError={showError}
           style={{

packages/plugin-seo/src/fields/MetaImage/MetaImageComponent.tsx

@@ -31,6 +31,7 @@ export const MetaImageComponent: React.FC<MetaImageProps> = (props) => {
     field: { label, localized, relationTo, required },
     hasGenerateImageFn,
     path,
+    readOnly,
   } = props || {}
 
   const {
@@ -133,6 +134,7 @@ export const MetaImageComponent: React.FC<MetaImageProps> = (props) => {
             <React.Fragment>
               &nbsp; &mdash; &nbsp;
               <button
+                disabled={readOnly}
                 onClick={() => {
                   void regenerateImage()
                 }}
@@ -186,6 +188,7 @@ export const MetaImageComponent: React.FC<MetaImageProps> = (props) => {
             }
           }}
           path={path}
+          readOnly={readOnly}
           relationTo={relationTo}
           required={required}
           serverURL={serverURL}

packages/plugin-seo/src/fields/MetaTitle/MetaTitleComponent.tsx

@@ -34,6 +34,7 @@ export const MetaTitleComponent: React.FC<MetaTitleProps> = (props) => {
     field: { label, maxLength: maxLengthFromProps, minLength: minLengthFromProps, required },
     hasGenerateTitleFn,
     path,
+    readOnly,
   } = props || {}
 
   const { t } = useTranslation<PluginSEOTranslations, PluginSEOTranslationKeys>()
@@ -127,6 +128,7 @@ export const MetaTitleComponent: React.FC<MetaTitleProps> = (props) => {
             <React.Fragment>
               &nbsp; &mdash; &nbsp;
               <button
+                disabled={readOnly}
                 onClick={() => {
                   void regenerateTitle()
                 }}
@@ -174,6 +176,7 @@ export const MetaTitleComponent: React.FC<MetaTitleProps> = (props) => {
           Error={errorMessage}
           onChange={setValue}
           path={path}
+          readOnly={readOnly}
           required={required}
           showError={showError}
           style={{