From a30d5c1ed150fb857246cb672ee88e7c389bb4c5 Mon Sep 17 00:00:00 2001 From: yaroslav Date: Sun, 21 Jan 2024 21:41:38 +0200 Subject: [PATCH] Fix statuses filter bug and hide statistic --- public/locales/en/translation.json | 6 +-- public/locales/ua/translation.json | 6 +-- .../CustomCheckbox/CustomCheckbox.tsx | 4 +- .../hooks/useGetStatusesFullInfo.ts | 4 +- .../GeneralActions/GeneralActions.tsx | 8 +-- src/pages/Queue/Queue.tsx | 2 +- src/pages/Statistic/Statistic.tsx | 10 ++-- .../ActivitySummary/ActivitySummary.tsx | 2 +- .../components/ActivityTile/ActivityTile.tsx | 33 ++++++++---- .../CalendarStatistic/CalendarStatistic.tsx | 36 ------------- .../components/TicketsCount/TicketsCount.tsx | 50 ------------------- .../components/TicketsCount/index.ts | 1 - .../components/CalendarStatistic/index.ts | 1 - .../ScopesStatistic/ScopesStatistic.tsx | 50 +++++-------------- .../components/ScopeTile/ScopeTile.tsx | 27 +++------- .../components/ScopeTile/index.ts | 0 .../components => }/ScopesStatistic/index.ts | 0 .../StatusesStatistic/StatusesStatistic.tsx | 4 +- 18 files changed, 67 insertions(+), 177 deletions(-) delete mode 100644 src/pages/Statistic/components/CalendarStatistic/CalendarStatistic.tsx delete mode 100644 src/pages/Statistic/components/CalendarStatistic/components/TicketsCount/TicketsCount.tsx delete mode 100644 src/pages/Statistic/components/CalendarStatistic/components/TicketsCount/index.ts delete mode 100644 src/pages/Statistic/components/CalendarStatistic/index.ts rename src/pages/Statistic/components/{CalendarStatistic/components => }/ScopesStatistic/ScopesStatistic.tsx (54%) rename src/pages/Statistic/components/{CalendarStatistic/components => }/ScopesStatistic/components/ScopeTile/ScopeTile.tsx (60%) rename src/pages/Statistic/components/{CalendarStatistic/components => }/ScopesStatistic/components/ScopeTile/index.ts (100%) rename src/pages/Statistic/components/{CalendarStatistic/components => }/ScopesStatistic/index.ts (100%) diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 17224db..fbdbdda 100644 --- a/public/locales/en/translation.json +++ b/public/locales/en/translation.json @@ -256,14 +256,14 @@ "activitySummary": { "heading": "Activity summary" }, - "calendarStatistic": { - "heading": "Calendar" + "scopeStatistic": { + "heading": "Tickets processed" }, "mentionedFaculties": { "heading": "Mentioned faculties" }, "systemStatus": { - "heading": "Current system status" + "heading": "Last 30 day" } }, "privacyPolicy": { diff --git a/public/locales/ua/translation.json b/public/locales/ua/translation.json index be67186..45c3f11 100644 --- a/public/locales/ua/translation.json +++ b/public/locales/ua/translation.json @@ -256,14 +256,14 @@ "activitySummary": { "heading": "Підсумок діяльності" }, - "calendarStatistic": { - "heading": "Календар" + "scopeStatistic": { + "heading": "Звернень оброблено" }, "mentionedFaculties": { "heading": "Згадані факультети" }, "systemStatus": { - "heading": "Поточний стан системи" + "heading": "Останні 30 днів" } }, "privacyPolicy": { diff --git a/src/components/FilterPanel/components/StatusCheckboxGroup/components/CustomCheckbox/CustomCheckbox.tsx b/src/components/FilterPanel/components/StatusCheckboxGroup/components/CustomCheckbox/CustomCheckbox.tsx index f433424..047827f 100644 --- a/src/components/FilterPanel/components/StatusCheckboxGroup/components/CustomCheckbox/CustomCheckbox.tsx +++ b/src/components/FilterPanel/components/StatusCheckboxGroup/components/CustomCheckbox/CustomCheckbox.tsx @@ -1,4 +1,5 @@ import { FC } from "react"; +import { useTranslation } from "react-i18next"; import Box from "@mui/material/Box"; import Checkbox from "@mui/material/Checkbox"; @@ -13,11 +14,12 @@ interface CustomCheckboxProps { } const CustomCheckbox: FC = ({ status }) => { + const { t } = useTranslation(); const { palette }: IPalette = useTheme(); return ( { - const { t } = useTranslation(); const { palette }: IPalette = useTheme(); const [searchParams] = useSearchParams(); @@ -32,7 +30,7 @@ export const useGetStatusesFullInfo = ( checked: boolean ): IStatus => ({ id, - name: t(`statusesFilter.${name}`), + name: name, color: palette.semantic[color], checked, onChange: handleChange(id), diff --git a/src/layouts/MainLayout/components/Sidebar/components/SidebarActions/components/GeneralActions/GeneralActions.tsx b/src/layouts/MainLayout/components/Sidebar/components/SidebarActions/components/GeneralActions/GeneralActions.tsx index 6e9cdde..0e17793 100644 --- a/src/layouts/MainLayout/components/Sidebar/components/SidebarActions/components/GeneralActions/GeneralActions.tsx +++ b/src/layouts/MainLayout/components/Sidebar/components/SidebarActions/components/GeneralActions/GeneralActions.tsx @@ -19,8 +19,8 @@ import GridViewIcon from "@mui/icons-material/GridView"; import GridViewSharpIcon from "@mui/icons-material/GridViewSharp"; import ExpandLess from "@mui/icons-material/ExpandLess"; import ExpandMore from "@mui/icons-material/ExpandMore"; -import InsertChartIcon from "@mui/icons-material/InsertChart"; -import InsertChartOutlinedIcon from "@mui/icons-material/InsertChartOutlined"; +// import InsertChartIcon from "@mui/icons-material/InsertChart"; +// import InsertChartOutlinedIcon from "@mui/icons-material/InsertChartOutlined"; import { NavbarListItem } from "./components/NavbarListItem"; @@ -115,7 +115,7 @@ const GeneralActions: FC = ({ activeIcon={} disableIcon={} /> - = ({ handleListItemClick={handleListItemClick} activeIcon={} disableIcon={} - /> + /> */} )} { const { t, i18n } = useTranslation(); diff --git a/src/pages/Statistic/Statistic.tsx b/src/pages/Statistic/Statistic.tsx index cf2835f..83e8e29 100644 --- a/src/pages/Statistic/Statistic.tsx +++ b/src/pages/Statistic/Statistic.tsx @@ -7,7 +7,7 @@ import Typography from "@mui/material/Typography"; import { StatusesStatistic } from "./components/StatusesStatistic"; import { ActivitySummary } from "./components/ActivitySummary"; -import { CalendarStatistic } from "./components/CalendarStatistic"; +import { ScopesStatistic } from "./components/ScopesStatistic"; import { FacultiesStatistic } from "./components/FacultiesStatistic"; import { @@ -44,8 +44,9 @@ const Statistic: FC = () => { sx={{ display: "grid", gap: "20px", - gridTemplateAreas: `"statuses calendar faculties faculties" - "statuses activities activities none"`, + gridTemplateAreas: `"statuses activities faculties" + "statuses scopes faculties" + "statuses none none"`, pt: "100px !important", }} > @@ -53,7 +54,7 @@ const Statistic: FC = () => { )} {generalStatistic && ( - + )} {facultiesStatistic && ( { {summaryActivity && ( )} +
); diff --git a/src/pages/Statistic/components/ActivitySummary/ActivitySummary.tsx b/src/pages/Statistic/components/ActivitySummary/ActivitySummary.tsx index b839ad4..0ca96b7 100644 --- a/src/pages/Statistic/components/ActivitySummary/ActivitySummary.tsx +++ b/src/pages/Statistic/components/ActivitySummary/ActivitySummary.tsx @@ -53,7 +53,7 @@ const ActivitySummary: FC = ({ summaryActivity }) => { return ( = ({ - icon, - stat, - title, - percent, - color, -}) => { +const ActivityTile: FC = ({ icon, stat, title }) => { return ( - - {title} -
+ + {title} +
{stat}
{title}
-
{percent}
 ); diff --git a/src/pages/Statistic/components/CalendarStatistic/CalendarStatistic.tsx b/src/pages/Statistic/components/CalendarStatistic/CalendarStatistic.tsx deleted file mode 100644 index 7098962..0000000 --- a/src/pages/Statistic/components/CalendarStatistic/CalendarStatistic.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import { FC } from "react"; - -import { StatisticCard } from "components/StatisticCard"; -import { TicketsCount } from "./components/TicketsCount"; -import { ScopesStatistic } from "./components/ScopesStatistic"; - -export interface IScope { - date: string; - scope: string; - tickets_count: number; -} - -interface CalendarStatisticProps { - calendarStatistic: IScope[]; -} - -const CalendarStatistic: FC = ({ - calendarStatistic, -}) => { - const ticketsCount = 25; - - return ( - - <> - - - - - ); -}; - -export { CalendarStatistic }; diff --git a/src/pages/Statistic/components/CalendarStatistic/components/TicketsCount/TicketsCount.tsx b/src/pages/Statistic/components/CalendarStatistic/components/TicketsCount/TicketsCount.tsx deleted file mode 100644 index cca77be..0000000 --- a/src/pages/Statistic/components/CalendarStatistic/components/TicketsCount/TicketsCount.tsx +++ /dev/null @@ -1,50 +0,0 @@ -import { FC } from "react"; - -import Box from "@mui/material/Box"; -import useTheme from "@mui/material/styles/useTheme"; - -import IPalette from "theme/IPalette.interface"; - -interface TicketsCountProps { - ticketsCount: number; -} - -const TicketsCount: FC = ({ ticketsCount }) => { - const { palette }: IPalette = useTheme(); - - return ( - - - {ticketsCount} - - - Tickets - - - ); -}; - -export { TicketsCount }; diff --git a/src/pages/Statistic/components/CalendarStatistic/components/TicketsCount/index.ts b/src/pages/Statistic/components/CalendarStatistic/components/TicketsCount/index.ts deleted file mode 100644 index 7e2b8bb..0000000 --- a/src/pages/Statistic/components/CalendarStatistic/components/TicketsCount/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { TicketsCount } from "./TicketsCount"; diff --git a/src/pages/Statistic/components/CalendarStatistic/index.ts b/src/pages/Statistic/components/CalendarStatistic/index.ts deleted file mode 100644 index 3224720..0000000 --- a/src/pages/Statistic/components/CalendarStatistic/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { CalendarStatistic } from "./CalendarStatistic"; diff --git a/src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/ScopesStatistic.tsx b/src/pages/Statistic/components/ScopesStatistic/ScopesStatistic.tsx similarity index 54% rename from src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/ScopesStatistic.tsx rename to src/pages/Statistic/components/ScopesStatistic/ScopesStatistic.tsx index 6c3256b..7c0d59b 100644 --- a/src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/ScopesStatistic.tsx +++ b/src/pages/Statistic/components/ScopesStatistic/ScopesStatistic.tsx @@ -1,25 +1,27 @@ import { FC } from "react"; import Box from "@mui/material/Box"; -import useTheme from "@mui/material/styles/useTheme"; -import { Button, Divider, Typography } from "@mui/material"; import HelpOutlineIcon from "@mui/icons-material/HelpOutline"; import FlagOutlinedIcon from "@mui/icons-material/FlagOutlined"; import HandshakeOutlinedIcon from "@mui/icons-material/HandshakeOutlined"; -import IPalette from "theme/IPalette.interface"; -import { IScope } from "../../CalendarStatistic"; +import { StatisticCard } from "components/StatisticCard"; + import { scopes } from "constants/scopes"; import { ScopeTile } from "./components/ScopeTile"; +interface IScope { + date: string; + scope: string; + tickets_count: number; +} + interface ScopesStatisticProps { calendarStatistic: IScope[]; } const ScopesStatistic: FC = ({ calendarStatistic }) => { - const { palette }: IPalette = useTheme(); - const icons = { [scopes.QA]: , [scopes.REPORTS]: , @@ -27,37 +29,11 @@ const ScopesStatistic: FC = ({ calendarStatistic }) => { }; return ( - - - - - Tickets processed - - - {calendarStatistic.map(scopeStat => { const { scope, tickets_count } = scopeStat; @@ -72,7 +48,7 @@ const ScopesStatistic: FC = ({ calendarStatistic }) => { ); })} - + ); }; diff --git a/src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/components/ScopeTile/ScopeTile.tsx b/src/pages/Statistic/components/ScopesStatistic/components/ScopeTile/ScopeTile.tsx similarity index 60% rename from src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/components/ScopeTile/ScopeTile.tsx rename to src/pages/Statistic/components/ScopesStatistic/components/ScopeTile/ScopeTile.tsx index d99b9c1..5c4f186 100644 --- a/src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/components/ScopeTile/ScopeTile.tsx +++ b/src/pages/Statistic/components/ScopesStatistic/components/ScopeTile/ScopeTile.tsx @@ -1,11 +1,8 @@ import { FC } from "react"; import Box from "@mui/material/Box"; -import IconButton from "@mui/material/IconButton"; import useTheme from "@mui/material/styles/useTheme"; -import MoreHorizIcon from "@mui/icons-material/MoreHoriz"; - import IPalette from "theme/IPalette.interface"; interface ScopeTileProps { @@ -28,7 +25,7 @@ const ScopeTile: FC = ({ icon, title, ticketsCount }) => {
@@ -41,22 +38,14 @@ const ScopeTile: FC = ({ icon, title, ticketsCount }) => { > {icon}
-
-
{title}
-
- {ticketsCount}{" "} - - tickets - -
-
+
{title}
+
+
+ {ticketsCount}{" "} + + tickets +
- - - ); }; diff --git a/src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/components/ScopeTile/index.ts b/src/pages/Statistic/components/ScopesStatistic/components/ScopeTile/index.ts similarity index 100% rename from src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/components/ScopeTile/index.ts rename to src/pages/Statistic/components/ScopesStatistic/components/ScopeTile/index.ts diff --git a/src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/index.ts b/src/pages/Statistic/components/ScopesStatistic/index.ts similarity index 100% rename from src/pages/Statistic/components/CalendarStatistic/components/ScopesStatistic/index.ts rename to src/pages/Statistic/components/ScopesStatistic/index.ts diff --git a/src/pages/Statistic/components/StatusesStatistic/StatusesStatistic.tsx b/src/pages/Statistic/components/StatusesStatistic/StatusesStatistic.tsx index 979d6e6..7fa6bf7 100644 --- a/src/pages/Statistic/components/StatusesStatistic/StatusesStatistic.tsx +++ b/src/pages/Statistic/components/StatusesStatistic/StatusesStatistic.tsx @@ -60,13 +60,13 @@ const StatusesStatistic: FC = ({ ctx.save(); const xCoord = chart.getDatasetMeta(0).data[0].x; const yCoord = chart.getDatasetMeta(0).data[0].y; - ctx.font = "600 56px san-serif"; + ctx.font = "600 56px Inter"; ctx.fillStyle = "rgba(255, 255, 255, 0.48)"; ctx.textAlign = "center"; ctx.textBaseline = "middle"; ctx.fillText(ticketsCount, xCoord, yCoord - 10); - ctx.font = "500 20px san-serif"; + ctx.font = "500 20px Inter"; ctx.fillStyle = "rgba(255, 255, 255, 0.80)"; ctx.fillText("Tickets", xCoord, yCoord + 30); },