fix: restore original text content and styling

Author: talissoncosta

frontend/web/components/pages/organisation-settings/OrganisationSettingsPage.tsx

@@ -121,7 +121,7 @@ const OrganisationSettingsPage: FC = () => {
   return (
     <div className='app-container container'>
       <PageTitle title='Organisation Settings' />
-      <Tabs urlParam='tab' className='mt-0' uncontrolled>
+      <Tabs urlParam='tab' className='mt-0' uncontrolled hideNavOnSingleTab>
         {tabs.map(({ component, key, label }) => (
           <TabItem key={key} tabLabel={label} data-test={key}>
             {component}

frontend/web/components/pages/organisation-settings/hooks/useUpdateOrganisationWithToast.ts

@@ -22,7 +22,7 @@ export const useUpdateOrganisationWithToast = () => {
           body,
           id: String(organisationId),
         }).unwrap()
-        toast(options?.successMessage || 'Organisation updated')
+        toast(options?.successMessage || 'Saved organisation')
         // Refresh AccountStore to update navbar and other components
         // that rely on the legacy store
         AppActions.refreshOrganisation()

frontend/web/components/pages/organisation-settings/tabs/general-tab/sections/OrganisationInformation.tsx

@@ -20,41 +20,43 @@ export const OrganisationInformation = ({
 
     await updateOrganisationWithToast({ name }, organisation.id, {
       errorMessage: 'Failed to save organisation. Please try again.',
-      successMessage: 'Organisation Saved',
+      successMessage: 'Saved organisation',
     })
   }
 
   return (
     <FormGroup>
       <form onSubmit={handleSubmit} className='d-flex flex-column gap-2 m-0'>
-        <Row className='align-items-start'>
-          <Flex className='ml-0'>
-            <Input
+        <Row>
+          <Flex>
+            <InputGroup
+              title='Organisation Name'
               value={name}
-              inputClassName='full-width'
-              name='org-name'
+              inputClassName='input--wide'
+              name='organisation-name'
               data-test='organisation-name'
               onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
                 setName(Utils.safeParseEventValue(e))
               }
               isValid={!!name && name.length > 0}
               type='text'
-              placeholder='My Organisation Name'
+              placeholder='My Organisation'
+              inputProps={{
+                className: 'full-width',
+              }}
             />
           </Flex>
-        </Row>
 
-        <div className='text-right'>
           <Button
             type='submit'
             id='save-org-btn'
             data-test='save-org-btn'
             disabled={isSaving || !name}
             className='ml-3'
           >
-            {isSaving ? 'Updating' : 'Update'}
+            {isSaving ? 'Updating' : 'Update Name'}
           </Button>
-        </div>
+        </Row>
       </form>
     </FormGroup>
   )