fix issue with Plyr.js and displayName

This commit is contained in:
La macchina desiderante 2024-05-26 12:46:30 +02:00
parent e9365ca27d
commit 84fc8469c0
2 changed files with 8 additions and 2 deletions

2
package-lock.json generated
View File

@ -16,7 +16,7 @@
"next": "14.2.2", "next": "14.2.2",
"next-intl": "3.11.3", "next-intl": "3.11.3",
"next-nprogress-bar": "2.3.11", "next-nprogress-bar": "2.3.11",
"plyr-react": "^5.3.0", "plyr-react": "5.3.0",
"react": "18.3.0", "react": "18.3.0",
"react-cookie": "7.1.4", "react-cookie": "7.1.4",
"react-dom": "18.3.0", "react-dom": "18.3.0",

View File

@ -20,7 +20,7 @@ const PlyrJS: React.FC<Props> = (props) => {
const PlyrComponent = React.useMemo(() => { const PlyrComponent = React.useMemo(() => {
return dynamic(() => import("plyr-react").then(() => { return dynamic(() => import("plyr-react").then(() => {
return React.forwardRef((props, ref) => { const Comp = React.forwardRef((props, ref) => {
//@ts-ignore //@ts-ignore
const { source, options = null, ...rest } = props const { source, options = null, ...rest } = props
//@ts-ignore //@ts-ignore
@ -30,9 +30,15 @@ const PlyrJS: React.FC<Props> = (props) => {
}) })
return <video ref={raptorRef} className="plyr-react plyr" {...rest} /> return <video ref={raptorRef} className="plyr-react plyr" {...rest} />
}) })
Comp.displayName = 'PlyrComponent'
return Comp;
}), { ssr: false }); }), { ssr: false });
}, []); }, []);
PlyrComponent.displayName = 'PlyrComponent'
const { data } = props; const { data } = props;
const plyrProps = { const plyrProps = {