diff --git a/app/(subpages)/ie-or-css3/page.tsx b/app/(subpages)/ie-or-css3/page.tsx index 937743a6..e72c4be1 100644 --- a/app/(subpages)/ie-or-css3/page.tsx +++ b/app/(subpages)/ie-or-css3/page.tsx @@ -1,8 +1,9 @@ import supabase from '@lib/supabase/private' import Link from '@components/link' -import IeOrCss, { UselessButton } from '@components/ie-or-css' +import { UselessButton } from '@components/ie-or-css' +import { Metadata } from 'next' -export const metadata = { +export const metadata: Metadata = { title: 'IE or CSS3?', description: 'Test your knowledge on CSS3 and Internet Explorer.', alternates: { @@ -11,7 +12,9 @@ export const metadata = { } const fetchQuestions = async () => { - const { data, error } = await supabase.from('Questions').select('id,question') + const { data, error } = await supabase + .from('Questions') + .select('id,question,isCSS') if (error || !data) { console.error(error) @@ -23,10 +26,14 @@ const fetchQuestions = async () => { } const IeQuiz = async () => { - const questions = await fetchQuestions() + const questions = (await fetchQuestions()) as { + id: string + question: string + isCSS: boolean + }[] + return ( <> - {' '}

Welcome! This quiz is inspired by the{' '} @@ -49,7 +56,10 @@ const IeQuiz = async () => { If you think the feature is Internet Explorer specific or was used to target IE, click

- +

+ This page is currently on pause until I migrate to the latest supabase + Supabase. +

) } diff --git a/app/components/ie-or-css/index.tsx b/app/components/ie-or-css/index.tsx index 50e80274..f657c49b 100644 --- a/app/components/ie-or-css/index.tsx +++ b/app/components/ie-or-css/index.tsx @@ -35,11 +35,11 @@ const IeOrCss = ({ questions }: IEQuizProps) => { QuestionWithVotes[] >([]) + console.log('questions', questions) + // update questionsWithVotes on changes useEffect(() => { - supabase - .from('Votes') - .on('*', (payload) => { + supabase.channel('votes').on('*', (payload) => { const newObj = payload.new setQuestionsWithVotes((questionsWithVotes) => { const newQuestions = questionsWithVotes.map((q) => { @@ -58,7 +58,7 @@ const IeOrCss = ({ questions }: IEQuizProps) => { .subscribe() return () => { - supabase.removeAllSubscriptions() + supabase.removeAllChannels() } }, [])