From d419be9889b10489948f9a046736ecce71817446 Mon Sep 17 00:00:00 2001
From: Tom J Nowell <contact@tomjn.com>
Date: Sun, 9 Nov 2025 15:42:40 +0000
Subject: [PATCH 1/2] 303: Add the useMediaSrc hook

---
 README.md                           |  1 +
 src/hooks/useMediaSrc/README.md     | 45 +++++++++++++++++++++++++++++
 src/hooks/useMediaSrc/index.js      | 21 ++++++++++++++
 src/hooks/usePostThumbnail/index.js |  2 +-
 src/index.js                        |  1 +
 5 files changed, 69 insertions(+), 1 deletion(-)
 create mode 100644 src/hooks/useMediaSrc/README.md
 create mode 100644 src/hooks/useMediaSrc/index.js

diff --git a/README.md b/README.md
index 86eb1e6..fd3ee02 100644
--- a/README.md
+++ b/README.md
@@ -61,6 +61,7 @@ One way to ensure all dependencies are loaded is to use the [`@wordpress/depende
 - [`useActiveBlockStyle`](src/hooks/useActiveBlockStyle)
 - [`useBlockStyles`](src/hooks/useBlockStyles)
 - [`useDisallowedBlocks`](src/hooks/useDisallowedBlocks)
+- [`useMediaSrc`](src/hooks/useMediaSrc)
 - [`useMeta`](src/hooks/useMeta)
 - [`useRenderAppenderWithBlockLimit`](src/hooks/useRenderAppenderWithBlockLimit)
 - [`useSelectBlock`](src/hooks/useSelectBlock)
diff --git a/src/hooks/useMediaSrc/README.md b/src/hooks/useMediaSrc/README.md
new file mode 100644
index 0000000..b97f3e9
--- /dev/null
+++ b/src/hooks/useMediaSrc/README.md
@@ -0,0 +1,45 @@
+# useMediaSrc
+
+The `useMediaSrc` hook allows for the easy retrieval of source media URLs from an ID.
+
+## Usage
+
+The `useMediaSrc` hook takes an ID and returns a URL or undefined.
+
+```js
+import { useMediaSrc } from '@humanmade/block-editor-components';
+
+function BlockEdit( { attributes, setAttributes } ) {
+	const {
+		videoId
+	} = attributes;
+	const videoUrl = useMediaSrc( videoId );
+
+	return (
+		<>
+			<MediaUploadCheck>
+				<MediaUpload
+					onSelect={ ( media ) =>
+						setAttributes( { videoId: media.id } )
+					}
+					value={ videoId }
+					render={ ( { open } ) => (
+						<Button onClick={ open }>Open Media Library</Button>
+					) }
+				/>
+			</MediaUploadCheck>
+			<video src={ videoUrl } />
+		<>
+	);
+}
+```
+
+## Return
+
+The `useMediaSrc` hook returns either a URL string or undefined.
+
+## Dependencies
+
+The `useMediaSrc` hook requires the following dependencies, which are expected to be available:
+
+- `@wordpress/data`
diff --git a/src/hooks/useMediaSrc/index.js b/src/hooks/useMediaSrc/index.js
new file mode 100644
index 0000000..7dcb4c6
--- /dev/null
+++ b/src/hooks/useMediaSrc/index.js
@@ -0,0 +1,21 @@
+import { useSelect } from "@wordpress/data";
+
+/**
+ * Returns the original source URL of media if available, or undefined, given an ID.
+ *
+ * @param {number} id attachment ID.
+ * @returns {string|undefined} Media source URL or undefined.
+ */
+export default function useMediaSrc( id ) {
+	const url = useSelect(
+		( select ) => {
+			const media = select( 'core' ).getMedia( id, { context: 'view' } );
+			if ( ! media ) {
+				return undefined;
+			}
+			return media.source_url;
+		},
+		[ id ]
+	);
+	return url;
+}
diff --git a/src/hooks/usePostThumbnail/index.js b/src/hooks/usePostThumbnail/index.js
index d6ef416..c4e1452 100644
--- a/src/hooks/usePostThumbnail/index.js
+++ b/src/hooks/usePostThumbnail/index.js
@@ -36,7 +36,7 @@ export default function usePostThumbnail() {
 
 	const setPostThumbnail = useCallback(
 		( mediaId ) => {
-		// If the image has been removed, we can remove the post thumbnail.
+			// If the image has been removed, we can remove the post thumbnail.
 			editPost( { featured_media: mediaId } );
 		},
 		[ editPost ]
diff --git a/src/index.js b/src/index.js
index 4f9abd8..474a994 100644
--- a/src/index.js
+++ b/src/index.js
@@ -23,6 +23,7 @@ export {
 export { default as useActiveBlockStyle } from './hooks/useActiveBlockStyle';
 export { default as useBlockStyles } from './hooks/useBlockStyles';
 export { default as useDisallowedBlocks } from './hooks/useDisallowedBlocks';
+export { default as useMediaSrc } from './hooks/useMediaSrc';
 export { default as useMeta } from './hooks/useMeta';
 export { default as usePostThumbnail } from './hooks/usePostThumbnail';
 export { default as useRenderAppenderWithBlockLimit } from './hooks/useRenderAppenderWithBlockLimit';

From 103ffdce665dea8053cad397d73fead1304b7643 Mon Sep 17 00:00:00 2001
From: Tom J Nowell <contact@tomjn.com>
Date: Sun, 9 Nov 2025 15:46:06 +0000
Subject: [PATCH 2/2] 303: Linter fixes

---
 src/hooks/useMediaSrc/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/hooks/useMediaSrc/index.js b/src/hooks/useMediaSrc/index.js
index 7dcb4c6..6d52e6f 100644
--- a/src/hooks/useMediaSrc/index.js
+++ b/src/hooks/useMediaSrc/index.js
@@ -1,4 +1,4 @@
-import { useSelect } from "@wordpress/data";
+import { useSelect } from '@wordpress/data';
 
 /**
  * Returns the original source URL of media if available, or undefined, given an ID.