Next.js: How use next hybrid AMP in class components

[Fazlur00]

how to use next/AMP
Hybrid AMP returns Invalid react hook should not use in class components.

[ijjk]

Hi, you can not use a hook in a class component as this is a React limitation so you can create a function component to leverage inside of your class component.

const AmpMode = ({ children, ampOnly }) => {
    const isAmp = useAmp()
    if (ampOnly) {
      return isAmp ? children : null
    } 
    return isAmp ? null : children
}

class MyComp extends React.Component {
  render() {
    return (
      <>
        <AmpMode ampOnly>I'm only shown in AMP mode</AmpMode>
        <AmpMode>I'm only shown in non-AMP mode</AmpMode>
      </>
    )
  }
}

[Fazlur00]

Thanks @ijjk. It helps me☺️