[Cases] Custom fields MVP UI leftovers (#168327)

## Summary

- Change the `No "My label" added` text to `No value is added` when a
field does not have a value in the case detail page
- Center the header of `Settings/Configure cases` as in the create case
form

### Screenshots

<details>
  <summary>No value is added</summary>
<img width="1715" alt="Screenshot 2023-10-09 at 11 09 31"
src="d9af42a1-a84a-42dd-bb50-9e86b84bfbbf">
</details>

<details>
  <summary>Settings header 1</summary>
<img width="1734" alt="Screenshot 2023-10-09 at 11 08 34"
src="2852d544-d85b-4f82-a8b7-9ac3591ce2da">
</details>

<details>
  <summary>Settings header 2</summary>
<img width="1731" alt="Screenshot 2023-10-09 at 11 09 12"
src="cdedf5a6-0d1f-4b7e-92a2-b6c4f62c2f10">
</details>

<details>
  <summary>Settings header 3</summary>
<img width="1735" alt="Screenshot 2023-10-09 at 11 07 29"
src="a1428c0a-3fb6-4424-ad74-ea4711d52c26">
</details>

x-pack/plugins/cases/public/components/configure_cases/index.tsx

@@ -9,7 +9,7 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import styled, { css } from 'styled-components';
 
 import { FormattedMessage } from '@kbn/i18n-react';
-import { EuiCallOut, EuiFlexItem, EuiLink, EuiPageBody } from '@elastic/eui';
+import { EuiCallOut, EuiFlexItem, EuiLink, EuiPageBody, EuiPageSection } from '@elastic/eui';
 
 import type { ActionConnectorTableItem } from '@kbn/triggers-actions-ui-plugin/public/types';
 import { CasesConnectorFeatureId } from '@kbn/actions-plugin/common';
@@ -328,19 +328,18 @@ export const ConfigureCases: React.FC = React.memo(() => {
   ) : null;
 
   return (
-    <>
+    <EuiPageSection restrictWidth={true}>
       <HeaderPage
-        border={true}
         showBackButton={true}
         data-test-subj="case-configure-title"
         title={i18n.CONFIGURE_CASES_PAGE_TITLE}
       />
       <EuiPageBody restrictWidth={true}>
-        <FormWrapper>
+        <FormWrapper style={{ paddingTop: 0 }}>
           {hasMinimumLicensePermissions && (
             <>
               {!connectorIsValid && (
-                <SectionWrapper style={{ marginTop: 0 }}>
+                <SectionWrapper>
                   <EuiCallOut
                     title={i18n.WARNING_NO_CONNECTOR_TITLE}
                     color="warning"
@@ -400,7 +399,7 @@ export const ConfigureCases: React.FC = React.memo(() => {
           {CustomFieldAddFlyout}
         </FormWrapper>
       </EuiPageBody>
-    </>
+    </EuiPageSection>
   );
 });
 

x-pack/plugins/cases/public/components/custom_fields/text/edit.test.tsx

@@ -108,7 +108,7 @@ describe('Edit ', () => {
       </FormTestComponent>
     );
 
-    expect(screen.getByText('No "My test label 1" added')).toBeInTheDocument();
+    expect(screen.getByText('No value is added')).toBeInTheDocument();
   });
 
   it('shows the no value text if the the value is null', async () => {
@@ -124,7 +124,7 @@ describe('Edit ', () => {
       </FormTestComponent>
     );
 
-    expect(screen.getByText('No "My test label 1" added')).toBeInTheDocument();
+    expect(screen.getByText('No value is added')).toBeInTheDocument();
   });
 
   it('does not show the value when the custom field is undefined', async () => {

x-pack/plugins/cases/public/components/custom_fields/text/edit.tsx

@@ -162,7 +162,7 @@ const EditComponent: CustomFieldType<CaseCustomFieldText>['Edit'] = ({
         direction="column"
       >
         {!isCustomFieldValueDefined && !isEdit && (
-          <p data-test-subj="no-tags">{NO_CUSTOM_FIELD_SET(customFieldConfiguration.label)}</p>
+          <p data-test-subj="no-custom-field-value">{NO_CUSTOM_FIELD_SET}</p>
         )}
         {!isEdit && isCustomFieldValueDefined && (
           <EuiFlexItem>

x-pack/plugins/cases/public/components/custom_fields/translations.ts

@@ -78,11 +78,9 @@ export const EDIT_CUSTOM_FIELDS_ARIA_LABEL = (customFieldLabel: string) =>
     defaultMessage: 'click to edit {customFieldLabel}',
   });
 
-export const NO_CUSTOM_FIELD_SET = (customFieldLabel: string) =>
+export const NO_CUSTOM_FIELD_SET = i18n.translate('xpack.cases.caseView.noCustomFieldSet', {
-  i18n.translate('xpack.cases.caseView.noCustomFieldSet', {
+  defaultMessage: 'No value is added',
-    values: { customFieldLabel },
+});
-    defaultMessage: 'No "{customFieldLabel}" added',
-  });
 
 export const DELETE_FIELD_TITLE = (fieldName: string) =>
   i18n.translate('xpack.cases.customFields.deleteField', {

x-pack/plugins/cases/public/components/wrappers/index.tsx

@@ -9,7 +9,6 @@ import styled from 'styled-components';
 
 export const SectionWrapper = styled.div`
   box-sizing: content-box;
-  margin: 0 auto;
   max-width: 1175px;
   width: 100%;
 `;