import { MDXProvider } from '@mdx-js/react' import Head from 'next/head' import { FC, useEffect, useState } from 'react' import components from '~/components' import SideBar from '~/components/Navigation/SideBar' import TableOfContents from '~/components/TableOfContents' interface Props { meta: { title: string description?: string hide_table_of_contents?: boolean video?: string tocVideo?: string } children: any toc?: any menuItems: any currentPage: string } const Layout: FC = (props: Props) => { const [active, setActive] = useState(false) useEffect(() => { setTimeout(function () { setActive(true) }, 150) }, []) // const contentString = renderToString(props.children) // const content = serialize(contentString || '') // console.log('contentString', contentString) // const _toc = toc('#hello world', { maxdepth: 1, firsth1: false }) const hasTableOfContents = props.toc !== undefined && props.toc.json.filter((item) => item.lvl !== 1 && item.lvl <= 3).length > 0 return ( <> {props.meta?.title} | Supabase

Tutorials

{props.meta.title}

{hasTableOfContents && !props.meta?.hide_table_of_contents && ( )}

) } export default Layout