1 files changed, 34 insertions, 0 deletions
diff --git a/apps/Player/components/Buttons.js b/apps/Player/components/Buttons.js
new file mode 100644
index 0000000..14452a0
--- /dev/null
+++ b/apps/Player/components/Buttons.js
@@ -0,0 +1,34 @@
+import { faStepForward, faStepBackward, faPlay, faStop } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+
+const Buttons = ({ current, setCurrent, playlist }) => (
+  <>
+    <span />
+    <div
+      className={current !== null && current > 0 ? '' : 'iconOff'}
+      onClick={() => { current !== null && current > 0 && setCurrent(c => c - 1) }}
+    >
+      <FontAwesomeIcon icon={faStepBackward} />
+    </div>
+    <div
+      className={current === null ? 'iconOff' : ''}
+      onClick={() => { current !== null && setCurrent(null) }}
+    >
+      <FontAwesomeIcon icon={faStop} />
+    </div>
+    <div
+      className={current === null ? '' : 'iconOff'}
+      onClick={() => { current === null && setCurrent(0) }}
+    >
+      <FontAwesomeIcon icon={faPlay} />
+    </div>
+    <div
+      className={current !== null && current < playlist.length - 1 ? '' : 'iconOff'}
+      onClick={() => { current !== null && current < playlist.length - 1 && setCurrent(c => c + 1) }}
+    >
+      <FontAwesomeIcon icon={faStepForward} />
+    </div>
+  </>
+)
+
+export default Buttons