Access current tab URL from a React-based broswer extension

App.js

/*global browser*/

import React, { useState } from "react";
import "./App.css";

function App() {
	const [currentURL, setCurrentURL] = useState("");

	const grabURL = async () => {
		const tabs = await browser.tabs.query({
			active: true,
			currentWindow: true,
		});
		setCurrentURL(tabs[0].url);
	};

	return (
		<div className="App">
			<h1>Hello, world!</h1>
			<p>
				Just testing that I can render custom content and stuff in my
				browser extension.
			</p>
			<button onClick={grabURL}>Get current URL</button>
			<span>{currentURL}</span>
		</div>
	);
}

export default App;