fix dashboards and add empty state

app/javascript/pages/dashboard/Dashboard.tsx

@@ -1,4 +1,4 @@
-import React, {FC,} from 'react'
+import React from 'react'
 
 import {DashboardProvider} from './DashboardContext'
 import {
@@ -9,7 +9,7 @@ import {
 } from './charts'
 import {Filters} from './Filters'
 
-export const Dashboard: FC = () => (
+export const Dashboard = () => (
   <DashboardProvider>
     <main className="max-h-screen sm:px-8 gap-2 pt-2 sm:pt-4">
       <Filters/>

app/javascript/pages/dashboard/DashboardContext.tsx

@@ -31,7 +31,11 @@ export const whereDefaultState = (userContext: UserContext) => (
   userContext.isOnlyTeacher ? {userId: userContext.user?.id} : {}
 )
 
-export const DashboardProvider: FC = ({children}) => {
+type DashboardProviderProps = {
+  children: React.ReactNode
+}
+
+export const DashboardProvider = ({children}: DashboardProviderProps) => {
   const userContext = useCurrentUser()
   const [where, setWhere] = useState<QuestionWhereInput>(whereDefaultState(userContext))
   const providerValue = useMemo(() => ({where, setWhere}), [

app/javascript/pages/dashboard/components/charts/Pie.tsx

@@ -17,6 +17,7 @@ export const Pie: FC<Props> = ({title, data}) => {
       style={{ height: '36rem', width: '36rem' }}
     >
       <h3 className="text-lg leading-6 font-medium text-gray-900">{title}</h3>
+      {data.length ? (
         <ResponsivePie
           data={data}
           margin={{top: 40, right: 80, bottom: 80, left: 80}}
@@ -33,6 +34,9 @@ export const Pie: FC<Props> = ({title, data}) => {
           arcLabelsSkipAngle={10}
           arcLabelsTextColor={{from: 'color', modifiers: [['darker', 2]]}}
         />
+      ) : (
+        <div className='grid items-center text-center h-full'>Não existem dados disponíveis.</div>
+      )}
     </div>
   )
 }

app/models/subject.rb

@@ -24,5 +24,7 @@ class Subject < ApplicationRecord
   belongs_to :category
   belongs_to :axis
 
+  has_many :questions
+
   validates :name, presence: true, uniqueness: true
 end