From 09b6c61aa51b7c8c272e8fbf8c1158400607ae28 Mon Sep 17 00:00:00 2001 From: Thibault Guillou Date: Mon, 11 Nov 2024 18:54:40 +0100 Subject: [PATCH] linter mondification --- .../dashboard-statistics/ClassroomStats.tsx | 14 +++--- .../dashboard-statistics/CountryStats.tsx | 46 +++++-------------- .../dashboard-statistics/GlobalStats.tsx | 3 +- .../dashboard-statistics/VillageStats.tsx | 28 +++++------ .../charts/DashboardTable.tsx | 5 +- .../{CountriesDropdown.tsx => Dropdown.tsx} | 30 ++++++------ .../admin/dashboard-statistics/mocks/mocks.ts | 4 +- types/statistics.type.ts | 6 --- 8 files changed, 53 insertions(+), 83 deletions(-) rename src/components/admin/dashboard-statistics/filters/{CountriesDropdown.tsx => Dropdown.tsx} (51%) diff --git a/src/components/admin/dashboard-statistics/ClassroomStats.tsx b/src/components/admin/dashboard-statistics/ClassroomStats.tsx index 068490db6..73bf055c5 100644 --- a/src/components/admin/dashboard-statistics/ClassroomStats.tsx +++ b/src/components/admin/dashboard-statistics/ClassroomStats.tsx @@ -1,14 +1,13 @@ -import React, { useState } from 'react'; - import AccessTimeIcon from '@mui/icons-material/AccessTime'; import VisibilityIcon from '@mui/icons-material/Visibility'; +import React, { useState } from 'react'; import AverageStatsCard from './cards/AverageStatsCard/AverageStatsCard'; import ClassesExchangesCard from './cards/ClassesExchangesCard/ClassesExchangesCard'; import ClassroomDetailsCard from './cards/ClassroomDetailsCard/ClassroomDetailsCard'; import CommentCard from './cards/CommentCard/CommentCard'; import BarCharts from './charts/BarCharts'; -import CountriesDropdown from './filters/CountriesDropdown'; +import Dropdown from './filters/Dropdown'; import PhaseDropdown from './filters/PhaseDropdown'; import PhaseDetails from './menu/PhaseDetails'; import { mockClassroomsStats, mockDataByMonth } from './mocks/mocks'; @@ -16,13 +15,12 @@ import styles from './styles/charts.module.css'; import { useStatisticsClassrooms, useStatisticsSessions } from 'src/services/useStatistics'; import type { ClassroomsStats, SessionsStats } from 'types/statistics.type'; -const barChartData = [{ data: [4, 3, 5] }, { data: [1, 6, 3] }, { data: [2, 5, 6] }]; const BarChartTitle = 'Evolution des connexions'; const ClassroomStats = () => { const [selectedCountry, setSelectedCountry] = useState(''); const statisticsSessions: SessionsStats | Record = useStatisticsSessions(null, null, 1); - const statisticsClassrooms = useStatisticsClassrooms(null, 'FR', null) as ClassroomsStats; + const statisticsClassrooms = useStatisticsClassrooms(null, selectedCountry, null) as ClassroomsStats; const countriesMap = mockClassroomsStats.map((country) => country.classroomCountryCode); const countries = [...new Set(countriesMap)]; // avoid duplicates const handleCountryChange = (country: string) => { @@ -36,13 +34,13 @@ const ClassroomStats = () => {
- +
- +
- +
diff --git a/src/components/admin/dashboard-statistics/CountryStats.tsx b/src/components/admin/dashboard-statistics/CountryStats.tsx index 43b5217f7..c65a959ba 100644 --- a/src/components/admin/dashboard-statistics/CountryStats.tsx +++ b/src/components/admin/dashboard-statistics/CountryStats.tsx @@ -1,8 +1,6 @@ -import React, { useState } from 'react'; - import AccessTimeIcon from '@mui/icons-material/AccessTime'; import VisibilityIcon from '@mui/icons-material/Visibility'; -import Box from '@mui/material/Box'; +import React, { useState } from 'react'; import AverageStatsCard from './cards/AverageStatsCard/AverageStatsCard'; import ClassesExchangesCard from './cards/ClassesExchangesCard/ClassesExchangesCard'; @@ -12,10 +10,10 @@ import BarCharts from './charts/BarCharts'; import DashboardTable from './charts/DashboardTable'; import HorizontalBarsChart from './charts/HorizontalChart'; import PieCharts from './charts/PieCharts'; -import CountriesDropdown from './filters/CountriesDropdown'; +import Dropdown from './filters/Dropdown'; import PhaseDropdown from './filters/PhaseDropdown'; import PhaseDetails from './menu/PhaseDetails'; -import { mockClassroomsStats, mockConnectionsStats, mockDataByMonth } from './mocks/mocks'; +import { mockClassroomsStats, mockDataByMonth } from './mocks/mocks'; import styles from './styles/charts.module.css'; import { useStatisticsClassrooms, useStatisticsSessions } from 'src/services/useStatistics'; import type { ClassroomsStats, SessionsStats } from 'types/statistics.type'; @@ -28,39 +26,19 @@ const pieChartData = { ], }; -const barChartData = [{ data: [4, 3, 5] }, { data: [1, 6, 3] }, { data: [2, 5, 6] }]; const EngagementBarChartTitle = 'Évolution des connexions'; const ContributionBarChartTitle = 'Contribution des classes'; const CountryStats = () => { const [selectedCountry, setSelectedCountry] = useState(''); - const statisticsClassrooms = useStatisticsClassrooms(null, 'FR', null) as ClassroomsStats; + const statisticsClassrooms = useStatisticsClassrooms(null, selectedCountry, null) as ClassroomsStats; const statisticsSessions: SessionsStats | Record = useStatisticsSessions(null, 'FR', null); - // const countriesMap = mockClassroomsStats.map((country) => country.classroomCountryCode); - // const countries = [...new Set(countriesMap)]; // avoid duplicates - // const handleCountryChange = (country: string) => { - // setSelectedCountry(country); - // }; - - // const filteredVillage = mockClassroomsStats.filter((village) => village.classroomCountryCode === selectedCountry); - - // const classStats = mockConnectionsStats.map((classroom) => ({ - // registered: classroom.registeredClassroomsCount, - // connected: classroom.connectedClassroomsCount, - // contributed: classroom.contributedClassroomsCount, - // })); - - // const connectStats = mockConnectionsStats.map((connect) => ({ - // averageConnection: connect.averageConnections, - // averageDuration: connect.averageDuration, - // minDuration: connect.minDuration, - // maxDuration: connect.maxDuration, - // medianDuration: connect.medianDuration, - // minConnections: connect.minConnections, - // maxConnections: connect.maxConnections, - // medianConnections: connect.medianConnections, - // })); + const countriesMap = mockClassroomsStats.map((country) => country.classroomCountryCode); + const countries = [...new Set(countriesMap)]; // avoid duplicates + const handleCountryChange = (country: string) => { + setSelectedCountry(country); + }; return ( <> @@ -68,9 +46,9 @@ const CountryStats = () => {
- {/*
- -
*/} +
+ +
diff --git a/src/components/admin/dashboard-statistics/GlobalStats.tsx b/src/components/admin/dashboard-statistics/GlobalStats.tsx index cf1e06a30..f9003a53a 100644 --- a/src/components/admin/dashboard-statistics/GlobalStats.tsx +++ b/src/components/admin/dashboard-statistics/GlobalStats.tsx @@ -1,8 +1,7 @@ import AccessTimeIcon from '@mui/icons-material/AccessTime'; import VisibilityIcon from '@mui/icons-material/Visibility'; -import React, { useContext } from 'react'; +import React from 'react'; -import type ClassroomStats from './ClassroomStats'; import AverageStatsCard from './cards/AverageStatsCard/AverageStatsCard'; import ClassesContributionCard from './cards/ClassesContributionCard/ClassesContributionCard'; import ClassesExchangesCard from './cards/ClassesExchangesCard/ClassesExchangesCard'; diff --git a/src/components/admin/dashboard-statistics/VillageStats.tsx b/src/components/admin/dashboard-statistics/VillageStats.tsx index cbdffc5b8..8cf9bcb20 100644 --- a/src/components/admin/dashboard-statistics/VillageStats.tsx +++ b/src/components/admin/dashboard-statistics/VillageStats.tsx @@ -1,6 +1,5 @@ import AccessTimeIcon from '@mui/icons-material/AccessTime'; import VisibilityIcon from '@mui/icons-material/Visibility'; -import { stat } from 'fs'; import React, { useContext, useState } from 'react'; import AverageStatsCard from './cards/AverageStatsCard/AverageStatsCard'; @@ -12,7 +11,7 @@ import BarCharts from './charts/BarCharts'; import DashboardTable from './charts/DashboardTable'; import DualBarChart from './charts/DualBarChart/DualBarChart'; import PieCharts from './charts/PieCharts'; -import CountriesDropdown from './filters/CountriesDropdown'; +import Dropdown from './filters/Dropdown'; import PhaseDropdown from './filters/PhaseDropdown'; import PhaseDetails from './menu/PhaseDetails'; import { mockClassroomsStats, mockDataByMonth } from './mocks/mocks'; @@ -23,18 +22,21 @@ import type { ClassroomsStats, SessionsStats } from 'types/statistics.type'; const VillageStats = () => { const data = { data: [{ label: 'test1', id: 1, value: 1 }] }; - const barChartData = [{ data: [4, 3, 5] }, { data: [1, 6, 3] }, { data: [2, 5, 6] }]; const EngagementBarChartTitle = 'Évolution des connexions'; const { user } = useContext(UserContext); const statisticsSessions: SessionsStats | Record = useStatisticsSessions(user?.villageId ?? 0); - const statisticsClassrooms = useStatisticsClassrooms(null, 'FR', null) as ClassroomsStats; - const [selectedCountry, setSelectedCountry] = useState(''); - // const countriesMap = mockClassroomsStats.map((country) => country.classroomCountryCode); - // const countries = [...new Set(countriesMap)]; // avoid duplicates - // const handleCountryChange = (country: string) => { - // setSelectedCountry(country); + const [selectedCountry, setSelectedCountry] = useState('FR'); + // const [selectedVillage, setSelectedVillage] = useState(''); + const statisticsClassrooms = useStatisticsClassrooms(null, selectedCountry, null) as ClassroomsStats; + const countriesMap = mockClassroomsStats.map((country) => country.classroomCountryCode); + const countries = [...new Set(countriesMap)]; // avoid duplicates + const handleCountryChange = (country: string) => { + setSelectedCountry(country); + }; + // const handleVillageChange = (village: string) => { + // setSelectedVillage(village); // }; const firstTable = { @@ -69,12 +71,12 @@ const VillageStats = () => {
- {/*
- +
+
- -
*/} + +
diff --git a/src/components/admin/dashboard-statistics/charts/DashboardTable.tsx b/src/components/admin/dashboard-statistics/charts/DashboardTable.tsx index 42ae77ecb..d29506d72 100644 --- a/src/components/admin/dashboard-statistics/charts/DashboardTable.tsx +++ b/src/components/admin/dashboard-statistics/charts/DashboardTable.tsx @@ -1,5 +1,3 @@ -import React from 'react'; - import { Typography } from '@mui/material'; import Paper from '@mui/material/Paper'; import Table from '@mui/material/Table'; @@ -9,8 +7,9 @@ import TableContainer from '@mui/material/TableContainer'; import TableHead from '@mui/material/TableHead'; import TableRow from '@mui/material/TableRow'; import { Box } from '@mui/system'; +import React from 'react'; -function createData(classroom: string, vm: sting, prof: string, status: string) { +function createData(classroom: string, vm: string, prof: string, status: string) { return { classroom, vm, prof, status }; } diff --git a/src/components/admin/dashboard-statistics/filters/CountriesDropdown.tsx b/src/components/admin/dashboard-statistics/filters/Dropdown.tsx similarity index 51% rename from src/components/admin/dashboard-statistics/filters/CountriesDropdown.tsx rename to src/components/admin/dashboard-statistics/filters/Dropdown.tsx index a7456e0e4..9cc50e779 100644 --- a/src/components/admin/dashboard-statistics/filters/CountriesDropdown.tsx +++ b/src/components/admin/dashboard-statistics/filters/Dropdown.tsx @@ -1,36 +1,36 @@ -import * as React from 'react'; - import Box from '@mui/material/Box'; import FormControl from '@mui/material/FormControl'; import InputLabel from '@mui/material/InputLabel'; import MenuItem from '@mui/material/MenuItem'; import type { SelectChangeEvent } from '@mui/material/Select'; import Select from '@mui/material/Select'; +import * as React from 'react'; -interface CountriesDropdownProps { - countries: string[]; - onCountryChange: (country: string) => void; +interface DropdownProps { + data: string[]; + onItemChange: (item: string) => void; label: string; + title: string; } -export default function CountriesDropdown({ countries, onCountryChange, label }: CountriesDropdownProps) { - const [country, setCountry] = React.useState(''); +export default function Dropdown({ data, onItemChange, label, title }: DropdownProps) { + const [item, setItem] = React.useState(''); const handleChange = (event: SelectChangeEvent) => { - const selectedCountry = event.target.value as string; - setCountry(selectedCountry); - onCountryChange(selectedCountry); + const selectedItem = event.target.value as string; + setItem(selectedItem); + onItemChange(selectedItem); }; return ( - Pays - {label} - {countries.map((country) => ( - - {country} + {data.map((item) => ( + + {item} ))} diff --git a/src/components/admin/dashboard-statistics/mocks/mocks.ts b/src/components/admin/dashboard-statistics/mocks/mocks.ts index f22ff3930..62f8bafa9 100644 --- a/src/components/admin/dashboard-statistics/mocks/mocks.ts +++ b/src/components/admin/dashboard-statistics/mocks/mocks.ts @@ -1,6 +1,6 @@ -import type { ClassroomsStats, SessionsStats } from 'types/statistics.type'; +import type { ClassroomStats, SessionsStats } from 'types/statistics.type'; -export const mockClassroomsStats: ClassroomsStats[] = [ +export const mockClassroomsStats: ClassroomStats[] = [ { classroomId: 1, classroomCountryCode: 'FR', diff --git a/types/statistics.type.ts b/types/statistics.type.ts index 917fce751..d48906da5 100644 --- a/types/statistics.type.ts +++ b/types/statistics.type.ts @@ -15,12 +15,6 @@ export interface Phases { phase: string; } -interface Data { - name: string; - type6?: string; - type2?: string; -} - export interface ClassroomsStats { data: ClassroomStats[]; phases: Phases[];