moving front app to subfolder. add webpack config with watch and dev-server mode. moving deploy things in subfolder

media-store/app-src/src/components/tracks/ManagedTrack.jsx

@@ -0,0 +1,42 @@
+import React, { useState, useRef } from "react";
+import { Card } from "antd";
+import { EditAction } from "./EditAction";
+import { DeleteAction } from "./DeleteAction";
+import { TrackCardBody } from "./TrackCardBody";
+import "./ManagedTrack.css";
+
+const ManagedTrack = ({ initialTrack, onDeleteTrack }) => {
+  const trackElement = useRef();
+  const [track, setTrack] = useState(initialTrack);
+
+  return (
+    <div className="card-element" ref={trackElement}>
+      <Card
+        actions={[
+          <DeleteAction
+            ID={track.ID}
+            onDeleteTrack={() => {
+              trackElement.current.style.opacity = 0;
+              setTimeout(() => onDeleteTrack(track.ID), 500);
+            }}
+          />,
+          <EditAction
+            ID={track.ID}
+            name={track.name}
+            composer={track.composer}
+            album={track.album}
+            genre={track.genre}
+            unitPrice={track.unitPrice}
+            afterTrackUpdate={(value) => setTrack(value)}
+          />,
+        ]}
+        title={track.name}
+        bordered={false}
+      >
+        <TrackCardBody track={track} />
+      </Card>
+    </div>
+  );
+};
+
+export { ManagedTrack };