[MM-57720] Convert save_button.tsx to function component (#27912)

* Convert save_button.tsx to function component

* single quote

* make saving optional

* fix header

* test suite command

* fix lint

* remove space

* Update snapshots

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
Co-authored-by: Daniel Espino García <larkox@gmail.com>

webapp/channels/src/components/__snapshots__/setting_item_max.test.tsx.snap

@@ -27,23 +27,9 @@ exports[`components/SettingItemMax should match snapshot 1`] = `
       >
         <hr />
         <SaveButton
-          btnClass=""
-          defaultMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Save"
-              id="save_button.save"
-            />
-          }
           disabled={false}
-          extraClasses=""
           onClick={[Function]}
           saving={false}
-          savingMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Saving"
-              id="save_button.saving"
-            />
-          }
         />
         <button
           className="btn btn-tertiary"
@@ -98,23 +84,9 @@ exports[`components/SettingItemMax should match snapshot, on clientError 1`] = `
           </label>
         </div>
         <SaveButton
-          btnClass=""
-          defaultMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Save"
-              id="save_button.save"
-            />
-          }
           disabled={false}
-          extraClasses=""
           onClick={[Function]}
           saving={false}
-          savingMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Saving"
-              id="save_button.saving"
-            />
-          }
         />
         <button
           className="btn btn-tertiary"
@@ -169,23 +141,9 @@ exports[`components/SettingItemMax should match snapshot, on serverError 1`] = `
           </label>
         </div>
         <SaveButton
-          btnClass=""
-          defaultMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Save"
-              id="save_button.save"
-            />
-          }
           disabled={false}
-          extraClasses=""
           onClick={[Function]}
           saving={false}
-          savingMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Saving"
-              id="save_button.saving"
-            />
-          }
         />
         <button
           className="btn btn-tertiary"
@@ -230,18 +188,10 @@ exports[`components/SettingItemMax should match snapshot, with new saveTextButto
       >
         <hr />
         <SaveButton
-          btnClass=""
           defaultMessage="CustomText"
           disabled={false}
-          extraClasses=""
           onClick={[Function]}
           saving={false}
-          savingMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Saving"
-              id="save_button.saving"
-            />
-          }
         />
         <button
           className="btn btn-tertiary"

webapp/channels/src/components/admin_console/__snapshots__/bleve_settings.test.tsx.snap

@@ -212,15 +212,7 @@ exports[`components/BleveSettings should match snapshot, disabled 1`] = `
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -463,15 +455,7 @@ exports[`components/BleveSettings should match snapshot, enabled 1`] = `
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/__snapshots__/cluster_settings.test.tsx.snap

@@ -231,15 +231,7 @@ exports[`components/ClusterSettings should match snapshot, compression disabled
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -501,15 +493,7 @@ exports[`components/ClusterSettings should match snapshot, compression enabled 1
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -771,15 +755,7 @@ exports[`components/ClusterSettings should match snapshot, encryption disabled 1
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -1041,15 +1017,7 @@ exports[`components/ClusterSettings should match snapshot, encryption enabled 1`
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/__snapshots__/database_settings.test.tsx.snap

@@ -427,15 +427,7 @@ exports[`components/DatabaseSettings should match snapshot 1`] = `
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/__snapshots__/elasticsearch_settings.test.tsx.snap

@@ -535,15 +535,7 @@ exports[`components/ElasticSearchSettings should match snapshot, disabled 1`] =
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -1108,15 +1100,7 @@ exports[`components/ElasticSearchSettings should match snapshot, enabled 1`] = `
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/__snapshots__/message_export_settings.test.tsx.snap

@@ -141,15 +141,7 @@ exports[`components/MessageExportSettings should match snapshot, disabled, actia
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -435,15 +427,7 @@ exports[`components/MessageExportSettings should match snapshot, disabled, globa
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -615,15 +599,7 @@ exports[`components/MessageExportSettings should match snapshot, enabled, actian
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -909,15 +885,7 @@ exports[`components/MessageExportSettings should match snapshot, enabled, global
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/__snapshots__/push_settings.test.tsx.snap

@@ -161,15 +161,7 @@ exports[`components/PushSettings should match snapshot, licensed 1`] = `
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -305,15 +297,7 @@ exports[`components/PushSettings should match snapshot, unlicensed 1`] = `
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/__snapshots__/schema_admin_settings.test.tsx.snap

@@ -705,15 +705,7 @@ exports[`components/admin_console/SchemaAdminSettings should match snapshot with
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
       savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/custom_plugin_settings/__snapshots__/custom_plugin_settings.test.tsx.snap

@@ -186,15 +186,7 @@ exports[`components/admin_console/CustomPluginSettings should match snapshot wit
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
       savingMessage="Saving Config..."
@@ -255,15 +247,7 @@ exports[`components/admin_console/CustomPluginSettings should match snapshot wit
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
       savingMessage="Saving Config..."
@@ -486,15 +470,7 @@ exports[`components/admin_console/CustomPluginSettings should match snapshot wit
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
       savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/custom_terms_of_service_settings/__snapshots__/custom_terms_of_service_settings.test.tsx.snap

@@ -20,15 +20,7 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -79,15 +71,7 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -138,15 +122,7 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -197,15 +173,7 @@ exports[`components/admin_console/CustomTermsOfServiceSettings should match snap
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/data_retention_settings/custom_policy_form/__snapshots__/custom_policy_form.test.tsx.snap

@@ -229,7 +229,6 @@ exports[`components/admin_console/data_retention_settings/custom_policy_form sho
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
       defaultMessage={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Save"
@@ -237,15 +236,8 @@ exports[`components/admin_console/data_retention_settings/custom_policy_form sho
         />
       }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <Connect(Component)
       className="cancel-button"
@@ -486,7 +478,6 @@ exports[`components/admin_console/data_retention_settings/custom_policy_form sho
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
       defaultMessage={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Save"
@@ -494,15 +485,8 @@ exports[`components/admin_console/data_retention_settings/custom_policy_form sho
         />
       }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <Connect(Component)
       className="cancel-button"

webapp/channels/src/components/admin_console/data_retention_settings/global_policy_form/__snapshots__/global_policy_form.test.tsx.snap

@@ -218,7 +218,6 @@ exports[`components/PluginManagement should match snapshot 1`] = `
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
       defaultMessage={
         <Memo(MemoizedFormattedMessage)
           defaultMessage="Save"
@@ -226,15 +225,8 @@ exports[`components/PluginManagement should match snapshot 1`] = `
         />
       }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <Connect(Component)
       className="cancel-button"

webapp/channels/src/components/admin_console/permission_schemes_settings/permission_system_scheme_settings/__snapshots__/permission_system_scheme_settings.test.tsx.snap

@@ -432,15 +432,7 @@ exports[`components/admin_console/permission_schemes_settings/permission_system_
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
       savingMessage="Saving Config..."
@@ -791,15 +783,7 @@ exports[`components/admin_console/permission_schemes_settings/permission_system_
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
       savingMessage="Saving Config..."
@@ -1150,15 +1134,7 @@ exports[`components/admin_console/permission_schemes_settings/permission_system_
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
       savingMessage="Saving Config..."
@@ -1509,15 +1485,7 @@ exports[`components/admin_console/permission_schemes_settings/permission_system_
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
       savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/permission_schemes_settings/permission_team_scheme_settings/__snapshots__/permission_team_scheme_settings.test.tsx.snap

@@ -320,23 +320,9 @@ exports[`components/admin_console/permission_schemes_settings/permission_team_sc
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <Connect(Component)
       className="cancel-button"
@@ -725,23 +711,9 @@ exports[`components/admin_console/permission_schemes_settings/permission_team_sc
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <Connect(Component)
       className="cancel-button"
@@ -1132,23 +1104,9 @@ exports[`components/admin_console/permission_schemes_settings/permission_team_sc
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <Connect(Component)
       className="cancel-button"
@@ -1605,23 +1563,9 @@ exports[`components/admin_console/permission_schemes_settings/permission_team_sc
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <Connect(Component)
       className="cancel-button"

webapp/channels/src/components/admin_console/plugin_management/__snapshots__/plugin_management.test.tsx.snap

@@ -309,15 +309,7 @@ exports[`components/PluginManagement should match snapshot 1`] = `
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -657,15 +649,7 @@ exports[`components/PluginManagement should match snapshot when \`Enable Marketp
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -753,15 +737,7 @@ exports[`components/PluginManagement should match snapshot when \`Enable Plugins
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -1101,15 +1077,7 @@ exports[`components/PluginManagement should match snapshot when \`Enable Remote
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -1451,15 +1419,7 @@ exports[`components/PluginManagement should match snapshot when \`Require Signat
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -1803,15 +1763,7 @@ exports[`components/PluginManagement should match snapshot, No installed plugins
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -2151,15 +2103,7 @@ exports[`components/PluginManagement should match snapshot, allow insecure URL e
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -2476,15 +2420,7 @@ exports[`components/PluginManagement should match snapshot, disabled 1`] = `
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -2824,15 +2760,7 @@ exports[`components/PluginManagement should match snapshot, text entered into th
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -3179,15 +3107,7 @@ exports[`components/PluginManagement should match snapshot, upload disabled 1`]
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -3590,15 +3510,7 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -3969,15 +3881,7 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -4348,15 +4252,7 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -4727,15 +4623,7 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."
@@ -5138,15 +5026,7 @@ exports[`components/PluginManagement should match snapshot, with installed plugi
       className="admin-console-save"
     >
       <SaveButton
-        btnClass=""
-        defaultMessage={
-          <Memo(MemoizedFormattedMessage)
-            defaultMessage="Save"
-            id="save_button.save"
-          />
-        }
         disabled={true}
-        extraClasses=""
         onClick={[Function]}
         saving={false}
         savingMessage="Saving Config..."

webapp/channels/src/components/admin_console/system_user_detail/__snapshots__/system_user_detail.test.tsx.snap

@@ -131,23 +131,9 @@ exports[`SystemUserDetail should match default snapshot 1`] = `
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <div
       className="error-message"
@@ -337,23 +323,9 @@ exports[`SystemUserDetail should match snapshot if MFA is enabled 1`] = `
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <div
       className="error-message"
@@ -543,23 +515,9 @@ exports[`SystemUserDetail should not show manage user settings button when user
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <div
       className="error-message"
@@ -758,23 +716,9 @@ exports[`SystemUserDetail should show manage user settings button as activated 1
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <div
       className="error-message"
@@ -964,23 +908,9 @@ exports[`SystemUserDetail should show manage user settings button as disabled wh
     className="admin-console-save"
   >
     <SaveButton
-      btnClass=""
-      defaultMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Save"
-          id="save_button.save"
-        />
-      }
       disabled={true}
-      extraClasses=""
       onClick={[Function]}
       saving={false}
-      savingMessage={
-        <Memo(MemoizedFormattedMessage)
-          defaultMessage="Saving"
-          id="save_button.saving"
-        />
-      }
     />
     <div
       className="error-message"

webapp/channels/src/components/login/__snapshots__/login_mfa.test.tsx.snap

@@ -22,7 +22,6 @@ exports[`components/login/LoginMfa should match snapshot 1`] = `
         className="login-mfa-form-button-container"
       >
         <SaveButton
-          btnClass=""
           defaultMessage="Submit"
           disabled={true}
           extraClasses="login-mfa-form-button-submit large"

webapp/channels/src/components/multiselect/__snapshots__/multiselect.test.tsx.snap

@@ -96,24 +96,10 @@ exports[`components/multiselect/multiselect MultiSelectList should match snapsho
           }
         />
         <SaveButton
-          btnClass=""
-          defaultMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Save"
-              id="save_button.save"
-            />
-          }
           disabled={false}
-          extraClasses=""
           id="saveItems"
           onClick={[Function]}
           saving={false}
-          savingMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Saving"
-              id="save_button.saving"
-            />
-          }
         />
       </div>
       <div
@@ -297,24 +283,10 @@ exports[`components/multiselect/multiselect should match snapshot 1`] = `
           }
         />
         <SaveButton
-          btnClass=""
-          defaultMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Save"
-              id="save_button.save"
-            />
-          }
           disabled={false}
-          extraClasses=""
           id="saveItems"
           onClick={[Function]}
           saving={false}
-          savingMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Saving"
-              id="save_button.saving"
-            />
-          }
         />
       </div>
       <div
@@ -489,24 +461,10 @@ exports[`components/multiselect/multiselect should match snapshot for page 2 1`]
           }
         />
         <SaveButton
-          btnClass=""
-          defaultMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Save"
-              id="save_button.save"
-            />
-          }
           disabled={false}
-          extraClasses=""
           id="saveItems"
           onClick={[Function]}
           saving={false}
-          savingMessage={
-            <Memo(MemoizedFormattedMessage)
-              defaultMessage="Saving"
-              id="save_button.saving"
-            />
-          }
         />
       </div>
       <div

webapp/channels/src/components/save_button.test.tsx

@@ -12,35 +12,29 @@ describe('components/SaveButton', () => {
     };
 
     test('should match snapshot, on defaultMessage', () => {
-        const wrapper = shallow(
+        const wrapper = shallow(<SaveButton {...baseProps}/>);
-            <SaveButton {...baseProps}/>,
-        );
 
         expect(wrapper).toMatchSnapshot();
         expect(wrapper.find('button').first().props().disabled).toBe(false);
 
-        wrapper.setProps({defaultMessage: 'Go'} as any);
+        wrapper.setProps({defaultMessage: 'Go'});
         expect(wrapper).toMatchSnapshot();
     });
 
     test('should match snapshot, on savingMessage', () => {
         const props = {...baseProps, saving: true, disabled: true};
-        const wrapper = shallow(
+        const wrapper = shallow(<SaveButton {...props}/>);
-            <SaveButton {...props}/>,
-        );
 
         expect(wrapper).toMatchSnapshot();
         expect(wrapper.find('button').first().props().disabled).toBe(true);
 
-        wrapper.setProps({savingMessage: 'Saving Config...'} as any);
+        wrapper.setProps({savingMessage: 'Saving Config...'});
         expect(wrapper).toMatchSnapshot();
     });
 
     test('should match snapshot, extraClasses', () => {
         const props = {...baseProps, extraClasses: 'some-class'};
-        const wrapper = shallow(
+        const wrapper = shallow(<SaveButton {...props}/>);
-            <SaveButton {...props}/>,
-        );
 
         expect(wrapper).toMatchSnapshot();
     });

webapp/channels/src/components/save_button.tsx

@@ -7,7 +7,7 @@ import {FormattedMessage} from 'react-intl';
 import LoadingWrapper from 'components/widgets/loading/loading_wrapper';
 
 type Props = {
-    saving: boolean;
+    saving?: boolean;
     disabled?: boolean;
     id?: string;
     onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
@@ -15,67 +15,57 @@ type Props = {
     defaultMessage?: React.ReactNode;
     btnClass?: string;
     extraClasses?: string;
-}
+};
 
-export default class SaveButton extends React.PureComponent<Props> {
+const SaveButton: React.FC<Props> = ({
-    public static defaultProps: Partial<Props> = {
+    saving = false,
-        btnClass: '',
+    disabled = false,
-        defaultMessage: (
+    savingMessage = (
-            <FormattedMessage
+        <FormattedMessage
-                id='save_button.save'
+            id='save_button.saving'
-                defaultMessage='Save'
+            defaultMessage='Saving'
-            />
+        />
-        ),
+    ),
-        disabled: false,
+    defaultMessage = (
-        extraClasses: '',
+        <FormattedMessage
-        savingMessage: (
+            id='save_button.save'
-            <FormattedMessage
+            defaultMessage='Save'
-                id='save_button.saving'
+        />
-                defaultMessage='Saving'
+    ),
-            />
+    btnClass = '',
-        ),
+    extraClasses = '',
-    };
+    ...props
-
+}) => {
-    public render() {
+    let className = 'btn';
-        const {
+    if (!btnClass) {
-            saving,
+        className += ' btn-primary';
-            disabled,
-            savingMessage,
-            defaultMessage,
-            btnClass,
-            extraClasses,
-            ...props
-        } = this.props;
-
-        let className = 'btn';
-        if (!btnClass) {
-            className += ' btn-primary';
-        }
-
-        if (!disabled || saving) {
-            className += ' ' + btnClass;
-        }
-
-        if (extraClasses) {
-            className += ' ' + extraClasses;
-        }
-
-        return (
-            <button
-                type='submit'
-                data-testid='saveSetting'
-                id='saveSetting'
-                className={className}
-                disabled={disabled}
-                {...props}
-            >
-                <LoadingWrapper
-                    loading={saving}
-                    text={savingMessage}
-                >
-                    <span>{defaultMessage}</span>
-                </LoadingWrapper>
-            </button>
-        );
     }
-}
+
+    if (!disabled || saving) {
+        className += ' ' + btnClass;
+    }
+
+    if (extraClasses) {
+        className += ' ' + extraClasses;
+    }
+
+    return (
+        <button
+            type='submit'
+            data-testid='saveSetting'
+            id='saveSetting'
+            className={className}
+            disabled={disabled}
+            {...props}
+        >
+            <LoadingWrapper
+                loading={saving}
+                text={savingMessage}
+            >
+                <span>{defaultMessage}</span>
+            </LoadingWrapper>
+        </button>
+    );
+};
+
+export default SaveButton;

webapp/channels/src/components/signup/__snapshots__/signup.test.tsx.snap

@@ -193,7 +193,6 @@ exports[`components/signup/Signup should match snapshot for all signup options e
               </span>
             </div>
             <SaveButton
-              btnClass=""
               defaultMessage="Create account"
               disabled={true}
               extraClasses="signup-body-card-form-button-submit large"
@@ -367,7 +366,6 @@ exports[`components/signup/Signup should match snapshot for all signup options e
               </span>
             </div>
             <SaveButton
-              btnClass=""
               defaultMessage="Create account"
               disabled={true}
               extraClasses="signup-body-card-form-button-submit large"

webapp/channels/src/components/update_user_group_modal/__snapshots__/update_user_group_modal.test.tsx.snap

@@ -110,10 +110,8 @@ exports[`component/update_user_group_modal should match snapshot 1`] = `
           Back
         </button>
         <SaveButton
-          btnClass=""
           defaultMessage="Save Details"
           disabled={true}
-          extraClasses=""
           id="saveItems"
           onClick={[Function]}
           saving={false}

webapp/channels/src/components/user_settings/notifications/email_notification_setting/__snapshots__/email_notification_setting.test.tsx.snap

@@ -208,23 +208,9 @@ exports[`components/user_settings/notifications/EmailNotificationSetting should
           >
             <hr />
             <SaveButton
-              btnClass=""
-              defaultMessage={
-                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Save"
-                  id="save_button.save"
-                />
-              }
               disabled={false}
-              extraClasses=""
               onClick={[Function]}
               saving={false}
-              savingMessage={
-                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Saving"
-                  id="save_button.saving"
-                />
-              }
             >
               <button
                 className="btn btn-primary "
@@ -653,23 +639,9 @@ exports[`components/user_settings/notifications/EmailNotificationSetting should
           >
             <hr />
             <SaveButton
-              btnClass=""
-              defaultMessage={
-                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Save"
-                  id="save_button.save"
-                />
-              }
               disabled={false}
-              extraClasses=""
               onClick={[Function]}
               saving={false}
-              savingMessage={
-                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Saving"
-                  id="save_button.saving"
-                />
-              }
             >
               <button
                 className="btn btn-primary "

webapp/channels/src/components/user_settings/notifications/manage_auto_responder/__snapshots__/manage_auto_responder.test.tsx.snap

@@ -121,23 +121,9 @@ exports[`components/user_settings/notifications/ManageAutoResponder should match
           >
             <hr />
             <SaveButton
-              btnClass=""
-              defaultMessage={
-                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Save"
-                  id="save_button.save"
-                />
-              }
               disabled={false}
-              extraClasses=""
               onClick={[Function]}
               saving={false}
-              savingMessage={
-                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Saving"
-                  id="save_button.saving"
-                />
-              }
             >
               <button
                 className="btn btn-primary "
@@ -357,23 +343,9 @@ exports[`components/user_settings/notifications/ManageAutoResponder should match
           >
             <hr />
             <SaveButton
-              btnClass=""
-              defaultMessage={
-                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Save"
-                  id="save_button.save"
-                />
-              }
               disabled={false}
-              extraClasses=""
               onClick={[Function]}
               saving={false}
-              savingMessage={
-                <Memo(MemoizedFormattedMessage)
-                  defaultMessage="Saving"
-                  id="save_button.saving"
-                />
-              }
             >
               <button
                 className="btn btn-primary "