I just switched my blog app to typescript, and I'm getting the error below. I'm also using chakraui, if that is of significance
_app.ts :

import '../styles/global.css';
import { ChakraProvider} from '@chakra-ui/react'
import ThemeToggle  from '../components/ThemeToggle.js';
import { AppProps } from 'next/app';

export default function App({ Component, pageProps }:AppProps) {
  return (
    <ChakraProvider>
      <Component {...pageProps} />
      <ThemeToggle  />
    </ChakraProvider>
  )
}

Error:

6 | export default function App({ Component, pageProps }:AppProps) {
  7 |   return (
  8 |     <ChakraProvider>
  9 |       <Component {...pageProps} />
    :                  ^
 10 |       <ThemeToggle  />
 11 |     </ChakraProvider>
 11 |   )
    `----

Caused by:
    Syntax Error