From 67308bd341f94386b26b0fd5e67031f797159049 Mon Sep 17 00:00:00 2001
From: geppy <1264236+geppy@users.noreply.github.com>
Date: Tue, 29 Oct 2024 07:21:35 +0000
Subject: [PATCH] don't use submit buttons

---
 .../components/media-player/src/PlayerControls/index.js     | 6 ++++++
 packages/components/transcript-editor/src/ExportOptions.js  | 1 +
 packages/components/transcript-editor/src/Header.js         | 3 +++
 3 files changed, 10 insertions(+)

diff --git a/packages/components/media-player/src/PlayerControls/index.js b/packages/components/media-player/src/PlayerControls/index.js
index 69da0c62..36611346 100644
--- a/packages/components/media-player/src/PlayerControls/index.js
+++ b/packages/components/media-player/src/PlayerControls/index.js
@@ -47,6 +47,7 @@ class PlayerControls extends React.Component {
   render() {
     
     const pictureInPicture = ('pictureInPictureEnabled' in document) ? ( <button
+      type="button"
       value="Picture-in-picture"
       title="Picture-in-picture"
       className={ `${ style.playerButton } ${ style.pip }` }
@@ -64,6 +65,7 @@ class PlayerControls extends React.Component {
 
         <div className={ style.btnsGroup }>
           <button
+            type="button"
             value="seek backward by a set interval: alt r"
             title="seek backward by a set interval: alt r"
             className={ style.playerButton }
@@ -72,6 +74,7 @@ class PlayerControls extends React.Component {
           </button>
 
           <button
+            type="button"
             value="seek backward: alt j"
             title="seek backward: alt j"
             className={ style.playerButton }
@@ -82,6 +85,7 @@ class PlayerControls extends React.Component {
           </button>
 
           <button
+            type="button"
             value="Play/Pause: alt k"
             title="Play/Pause: alt k"
             className={ style.playerButton }
@@ -92,6 +96,7 @@ class PlayerControls extends React.Component {
           <button
             value="seek forward: alt l"
             title="seek forward: alt l"
+            type="button"
             className={ style.playerButton }
             onMouseDown={ this.setIntervalHelperForward }
             onMouseUp={ this.clearIntervalHelper }
@@ -111,6 +116,7 @@ class PlayerControls extends React.Component {
           {pictureInPicture}
 
           <button
+            type="button"
             value="Toggle Sound"
             title="Toggle Sound"
             className={ style.playerButton }
diff --git a/packages/components/transcript-editor/src/ExportOptions.js b/packages/components/transcript-editor/src/ExportOptions.js
index 1b67f631..e64dd48a 100644
--- a/packages/components/transcript-editor/src/ExportOptions.js
+++ b/packages/components/transcript-editor/src/ExportOptions.js
@@ -10,6 +10,7 @@ class ExportOptions extends React.Component {
   render() {
     const btns = this.props.exportOptionsList.map((opt, index) => {
       return (<><button 
+        type="button"
         key={opt.label+index}
         title={ opt.label }
         className={ style.playerButton }
diff --git a/packages/components/transcript-editor/src/Header.js b/packages/components/transcript-editor/src/Header.js
index cc69ed09..1574349a 100644
--- a/packages/components/transcript-editor/src/Header.js
+++ b/packages/components/transcript-editor/src/Header.js
@@ -32,6 +32,7 @@ class Header extends React.Component {
 
       <div className={ style.settingsContainer }>
         <button
+          type="button"
           className={ style.settingsButton }
           title="Settings"
           onClick={ props.handleSettingsToggle }
@@ -39,6 +40,7 @@ class Header extends React.Component {
           <FontAwesomeIcon icon={ faCog } />
         </button>
         <button
+          type="button"
           className={ `${ style.settingsButton } ${ style.keyboardShortcutsButon }` }
           title="view shortcuts"
           onClick={ props.handleShortcutsToggle }
@@ -46,6 +48,7 @@ class Header extends React.Component {
           <FontAwesomeIcon icon={ faKeyboard } />
         </button>
         <button
+          type="button"
           className={ `${ style.settingsButton }` }
           title="Export"
           onClick={ props.handleExportToggle }