From 16e5ae4d23fd827a491aeacbc931dac549a137c1 Mon Sep 17 00:00:00 2001
From: jfraile <jfraile@ebay.com>
Date: Wed, 8 Mar 2023 14:13:33 +0100
Subject: [PATCH 1/2] add git ignore file

---
 .gitignore | 2 ++
 1 file changed, 2 insertions(+)
 create mode 100644 .gitignore

diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..d5f19d8
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,2 @@
+node_modules
+package-lock.json

From 2dd120843e1d3e7bbc8bd2c1456d7a185888379c Mon Sep 17 00:00:00 2001
From: jfraile <jfraile@ebay.com>
Date: Wed, 8 Mar 2023 14:18:13 +0100
Subject: [PATCH 2/2] fix: :bug: play does not exist on type HTMLElement

I explicitly cast the document.getElementById('voice-preview') expression to the HTMLMediaElement type, which includes the play method.
---
 src/components/settings-screen.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/settings-screen.tsx b/src/components/settings-screen.tsx
index 100a799..d3dc080 100644
--- a/src/components/settings-screen.tsx
+++ b/src/components/settings-screen.tsx
@@ -222,7 +222,7 @@ export default function SettingsScreen(props: SettingsScreenProps) {
                                     <audio controls style={{ display: 'none' }} id="voice-preview" key={context.voice.id}>
                                         <source src={voices.find(v => v.voice_id === context.voice.id)?.preview_url} type="audio/mpeg" />
                                     </audio>
-                                    <Button onClick={() => document.getElementById('voice-preview')?.play()} variant='light' compact style={{ marginTop: '1rem' }}>
+                                    <Button onClick={() => (document.getElementById('voice-preview') as HTMLMediaElement)?.play()} variant='light' compact style={{ marginTop: '1rem' }}>
                                         <i className='fa fa-headphones' />
                                         <span>Preview voice</span>
                                     </Button>