Changed how backingstore is spelled through out the console

frontend/packages/noobaa-storage-plugin/src/components/bucket-class/create-bc.tsx

@@ -106,7 +106,7 @@ const CreateBucketClass: React.FC<CreateBCProps> = ({ match }) => {
     },
     {
       id: CreateStepsBC.BACKINGSTORE,
-      name: 'BackingStore',
+      name: 'Backing Store',
       component: <BackingStorePageWithFirehose state={state} dispatcher={dispatch} />,
       enableNext: backingStoreNextConditions(),
     },

frontend/packages/noobaa-storage-plugin/src/components/bucket-class/wizard-pages/backingstore-page.tsx

@@ -109,8 +109,8 @@ const filterSelectedItems = (items: BackingStoreStateType[], tableId: number): s
 
 const getBsLabel = (policy: string) =>
   policy === 'Mirror'
-    ? 'Select at least 2 Backingstore resources'
-    : 'Select at least 1 Backingstore resource';
+    ? 'Select at least 2 Backing Store resources'
+    : 'Select at least 1 Backing Store resource';
 
 const BackingStorePage: React.FC<BackingStorePageProps> = React.memo(
   ({ backingStores, dispatcher, state }) => {
@@ -161,11 +161,11 @@ const BackingStorePage: React.FC<BackingStorePageProps> = React.memo(
             className="nb-create-bc-step-page__info"
             isInline
             variant="info"
-            title="What is a BackingStore?"
+            title="What is a Backing Store?"
             action={<AlertActionCloseButton onClose={() => setShowHelp(false)} />}
           >
             <p>
-              BackingStore represents a storage target to be used as the underlying storage for the
+              Backing Store represents a storage target to be used as the underlying storage for the
               data in MCG buckets.
             </p>
             <p>
@@ -181,14 +181,14 @@ const BackingStorePage: React.FC<BackingStorePageProps> = React.memo(
         <Form className="nb-bc-step-page-form">
           <Title headingLevel="h3" size="xl" className="nb-bc-step-page-form__title">
             <Flex breakpointMods={[{ modifier: 'justify-content-space-between' }] as any}>
-              <FlexItem>Tier 1 - backingStore ({state.tier1Policy})</FlexItem>
+              <FlexItem>Tier 1 - Backing Store ({state.tier1Policy})</FlexItem>
               <FlexItem>
                 <Button
                   variant="link"
                   onClick={openModal}
                   className="nb-bc-step-page-form__modal-launcher"
                 >
-                  <PlusCircleIcon /> Create BackingStore
+                  <PlusCircleIcon /> Create Backing Store
                 </Button>
               </FlexItem>
             </Flex>
@@ -202,7 +202,7 @@ const BackingStorePage: React.FC<BackingStorePageProps> = React.memo(
           >
             <TextInput
               className="nb-bc-step-page-form__element--short"
-              placeholder="Search BackingStore"
+              placeholder="Search Backing Store"
               onChange={setSearchInput}
               value={searchInput}
               type="text"
@@ -229,7 +229,7 @@ const BackingStorePage: React.FC<BackingStorePageProps> = React.memo(
         {showTier2Table && (
           <Form className="nb-bc-step-page-form">
             <Title headingLevel="h3" size="xl">
-              Tier 2 - backingStore ({state.tier2Policy}){' '}
+              Tier 2 - Backing Store ({state.tier2Policy}){' '}
             </Title>
             <FormGroup
               className="nb-bc-step-page-form__element"
@@ -239,7 +239,7 @@ const BackingStorePage: React.FC<BackingStorePageProps> = React.memo(
             >
               <TextInput
                 className="nb-bc-step-page-form__element--short"
-                placeholder="Search BackingStore"
+                placeholder="Search Backing Store"
                 onChange={(v) => setSearchInput2(v)}
                 value={searchInput2}
                 type="text"

frontend/packages/noobaa-storage-plugin/src/components/bucket-class/wizard-pages/review-page.tsx

@@ -48,14 +48,14 @@ const ReviewPage: React.FC<ReviewPageProps> = ({ state }) => {
           <Title size="md" headingLevel="h5">
             Tier 1: {tier1Policy}
           </Title>
-          <p>Selected BackingStore: {tier1BackingStore.join(', ')}</p>
+          <p>Selected Backing Store: {tier1BackingStore.join(', ')}</p>
         </div>
         {tier2Policy && (
           <>
             <Title size="md" headingLevel="h5">
               Tier 2: {tier2Policy}
             </Title>
-            <p>Selected BackingStore: {tier2BackingStore.join(', ')}</p>
+            <p>Selected Backing Store: {tier2BackingStore.join(', ')}</p>
           </>
         )}
       </div>

frontend/packages/noobaa-storage-plugin/src/components/create-backingstore-page/create-bs-modal.tsx

@@ -11,11 +11,11 @@ import './create-bs.scss';
 const CreateBackingStoreFormModal: React.FC<CreateBackingStoreFormModal> = (props) => {
   return (
     <div className="nb-create-bs__modal">
-      <ModalTitle>Create new BackingStore</ModalTitle>
+      <ModalTitle>Create new Backing Store</ModalTitle>
       <ModalBody>
         <p>
-          BackingStore represents a storage target to be used as the underlying storage for the data
-          in MCG buckets.
+          Backing Store represents a storage target to be used as the underlying storage for the
+          data in MCG buckets.
         </p>
         <CreateBackingStoreForm {...props} />
       </ModalBody>

frontend/packages/noobaa-storage-plugin/src/components/create-backingstore-page/create-bs-page.tsx

@@ -46,7 +46,7 @@ const CreateBackingStoreFormPage: React.FC<CreateBackingStoreFormPageProps> = ({
       </div>
       <div className="nb-bs-page-title">
         <Title size="2xl" headingLevel="h1" className="nb-bs-page-title__main">
-          Create new BackingStore
+          Create new Backing Store
         </Title>
         <p className="nb-bs-page-title__info">
           Storage targets that are used to store chunks of data on MCG buckets.
@@ -56,10 +56,10 @@ const CreateBackingStoreFormPage: React.FC<CreateBackingStoreFormPageProps> = ({
         <Alert
           isInline
           variant="info"
-          title="What is a BackingStore?"
+          title="What is a Backing Store?"
           action={<AlertActionCloseButton onClose={() => setShowHelp(false)} />}
         >
-          BackingStore represent a storage target to be used as the underlying storage for the data
+          Backing Store represent a storage target to be used as the underlying storage for the data
           in MCG buckets.
           <br />
           Multiple types of backing-stores are supported: aws-s3, s3-compataible,

frontend/packages/noobaa-storage-plugin/src/components/create-backingstore-page/create-bs.tsx

@@ -571,7 +571,7 @@ const CreateBackingStoreForm: React.FC<CreateBackingStoreFormProps> = withHandle
       </FormGroup>
 
       <FormGroup
-        label="BackingStore Name"
+        label="Backing Store Name"
         fieldId="backingstore-name"
         className="nb-bs-form-entry"
         helperText="If not provided, a generic name will be generated."
@@ -580,7 +580,7 @@ const CreateBackingStoreForm: React.FC<CreateBackingStoreFormProps> = withHandle
           onChange={setBsName}
           value={bsName}
           placeholder="my-backingstore"
-          aria-label="BackingStore Name"
+          aria-label="Backing Store Name"
         />
       </FormGroup>
 
@@ -606,7 +606,7 @@ const CreateBackingStoreForm: React.FC<CreateBackingStoreFormProps> = withHandle
       <ButtonBar errorMessage={errorMessage} inProgress={inProgress}>
         <ActionGroup>
           <Button type="submit" variant="primary" isDisabled={disabled}>
-            Create BackingStore
+            Create Backing Store
           </Button>
           <Button onClick={cancel} variant="secondary">
             Cancel