この子コンポーネントに渡されたpropsはオブジェクトであるため、中括弧が必要という解釈でよろしいのでしょうか?
中括弧で囲むのは JSX が変数を認識する方法ということで、そうしなければダメということだと思いますが。。
変数と props
https://developer.mozilla.org/ja/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started#variables_and_props
【追記】
Reactで、親コンポーネントから子コンポーネントへのpropsの渡し方を学習しています。
そこに対して、こうしてはいかがという例を書いておきます。
子コンポーネント City.js は以下のように引数を props にし、渡されるプロパティの中の subject という項目を表示するとします。
import React from 'react';
function City(props) {
return (
<p>Hello {props.subject} from City</p>
);
}
export default City;
親は、上の回答で紹介した記事の App.js を使ってその中に City を subject="Clarice" というプロパティ設定と共に組み入れます。
import logo from './logo.svg';
import './App.css';
import City from './City';
function App() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
<City subject="Clarice" />
</header>
</div>
);
}
export default App;
npm start で以下のようになります。 上の App.js のコードの <City subject="Clarice" /> の部分が期待通りに表示されているのが分かるでしょうか?

【追記2】
下のコメント欄で、
質問されている内容が「function City ({videos})」の中括弧で、JSXの書き方とは別件だったので評価を下げました。
・・・というコメントがあったので、以下追記しておきます。
上の【追記】に書いた City.js を、質問者さんが書いた「こちらの表記では上手くいくのですが」のように即ち以下のようにしても、上の【追記】の画像と同じ結果になります。
import React from 'react';
function City({subject}) {
return (
<p>Hello {subject} from City</p>
);
}
export default City;
という訳で、文法的に正しいのかどうかは分かりませんが、最初の回答で書いた「中括弧で囲むのは JSX が変数を認識する方法」ではあると思います。
ちなみに、引数の { } を外すと、npm start で Complied Successfully! とは出るものの、ブラウザには何も表示されない(空白になる)という結果になりました。