UPDATE Update audio player block to include caption handling and improve description rendering

plugins/carhop-blocks/blocks/audio-player/build/audio-player/index.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n'), 'version' => '522d2588811a43dfc829');
+<?php return array('dependencies' => array('react-jsx-runtime', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n'), 'version' => 'a1bd7238a6891cc75b86');

plugins/carhop-blocks/blocks/audio-player/build/audio-player/index.js

@@ -135,6 +135,7 @@ function Edit({
           mediaURL: audioUrl,
           allowedTypes: ["audio"],
           accept: "audio/*",
+          onSelectURL: onSelectURL,
           onSelect: onSelectAudio
         }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)(_wordpress_components__WEBPACK_IMPORTED_MODULE_2__.ToolbarButton, {
           onClick: onRemoveAudio,
@@ -150,14 +151,17 @@ function Edit({
           children: (0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Votre navigateur ne supporte pas l'élément audio.", "carhop-blocks")
         })
       })]
-    }), (description || caption) && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("p", {
+    }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsxs)("p", {
       className: "audio-player__details",
       children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("span", {
         className: "audio-player__details__label",
         children: "Audio"
+      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("span", {
+        className: "audio-player__details__caption",
+        children: caption ? caption + " — " : ""
       }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_5__.jsx)("span", {
         className: "audio-player__details__description",
-        children: description || caption
+        children: description !== null && description !== void 0 ? description : ""
       })]
     })]
   });
@@ -255,9 +259,12 @@ function save({
       children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
         className: "audio-player__details__label",
         children: "Audio"
+      }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
+        className: "audio-player__details__caption",
+        children: caption ? caption + " — " : ""
       }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("span", {
         className: "audio-player__details__description",
-        children: description || caption
+        children: description !== null && description !== void 0 ? description : ""
       })]
     })]
   });

plugins/carhop-blocks/blocks/audio-player/src/audio-player/edit.js

@@ -107,6 +107,7 @@ export default function Edit({ attributes, setAttributes }) {
 							mediaURL={audioUrl}
 							allowedTypes={["audio"]}
 							accept="audio/*"
+							onSelectURL={onSelectURL}
 							onSelect={onSelectAudio}
 						/>
 						<ToolbarButton onClick={onRemoveAudio}>
@@ -128,14 +129,15 @@ export default function Edit({ attributes, setAttributes }) {
 					</div>
 				</>
 			)}
-			{(description || caption) && (
-				<p className="audio-player__details">
-					<span className="audio-player__details__label">Audio</span>
-					<span className="audio-player__details__description">
-						{description || caption}
-					</span>
-				</p>
-			)}
+			<p className="audio-player__details">
+				<span className="audio-player__details__label">Audio</span>
+				<span className="audio-player__details__caption">
+					{caption ? caption + " — " : ""}
+				</span>
+				<span className="audio-player__details__description">
+					{description ?? ""}
+				</span>
+			</p>
 		</div>
 	);
 }

plugins/carhop-blocks/blocks/audio-player/src/audio-player/save.js

@@ -10,7 +10,11 @@ export default function save({ attributes }) {
 
 	return (
 		<div {...useBlockProps.save({ className: "audio-player" })}>
-			<RichText.Content value={title} className="audio-player__title" tagName="h4" />
+			<RichText.Content
+				value={title}
+				className="audio-player__title"
+				tagName="h4"
+			/>
 			<audio className="js-plyr" src={audioUrl} preload="metadata">
 				Votre navigateur ne supporte pas l'élément audio.
 			</audio>
@@ -18,8 +22,11 @@ export default function save({ attributes }) {
 			{(description || caption) && (
 				<p className="audio-player__details">
 					<span className="audio-player__details__label">Audio</span>
+					<span className="audio-player__details__caption">
+						{caption ? caption + " — " : ""}
+					</span>
 					<span className="audio-player__details__description">
-						{description || caption}
+						{description ?? ""}
 					</span>
 				</p>
 			)}