1
0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-22 19:07:54 +01:00

chore: fix react errors (#6637)

Fix hook usage react error (console)

---------

Signed-off-by: andreas-unleash <andreas@getunleash.ai>
This commit is contained in:
andreas-unleash 2024-03-20 17:11:50 +02:00 committed by GitHub
parent b7232d0397
commit 33ec7e1894
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 40 additions and 31 deletions

View File

@ -11,16 +11,16 @@ import { DashboardHeader } from './components/DashboardHeader/DashboardHeader';
import { useDashboardData } from './hooks/useDashboardData';
import { Charts } from './Charts';
const StickyWrapper = styled(Box)<{ scrolled?: boolean }>(
({ theme, scrolled }) => ({
position: 'sticky',
top: 0,
zIndex: 1000,
padding: scrolled ? theme.spacing(2, 0) : theme.spacing(0, 0, 2),
background: theme.palette.background.application,
transition: 'padding 0.3s ease',
}),
);
const StickyWrapper = styled(Box, {
shouldForwardProp: (prop) => prop !== 'scrolled',
})<{ scrolled?: boolean }>(({ theme, scrolled }) => ({
position: 'sticky',
top: 0,
zIndex: 1000,
padding: scrolled ? theme.spacing(2, 0) : theme.spacing(0, 0, 2),
background: theme.palette.background.application,
transition: 'padding 0.3s ease',
}));
export const ExecutiveDashboard: VFC = () => {
const [scrolled, setScrolled] = useState(false);

View File

@ -8,36 +8,45 @@ import { useAvgTimeToProduction } from './useAvgTimeToProduction';
export const useDashboardData = (
executiveDashboardData: ExecutiveSummarySchema,
projects: string[],
) =>
useMemo(() => {
const projectsData = useFilteredTrends(
executiveDashboardData.projectFlagTrends,
projects,
);
) => {
const projectsData = useFilteredTrends(
executiveDashboardData.projectFlagTrends,
projects,
);
const groupedProjectsData = useGroupedProjectTrends(projectsData);
const groupedProjectsData = useGroupedProjectTrends(projectsData);
const metricsData = useFilteredTrends(
executiveDashboardData.metricsSummaryTrends,
projects,
);
const groupedMetricsData = useGroupedProjectTrends(metricsData);
const metricsData = useFilteredTrends(
executiveDashboardData.metricsSummaryTrends,
projects,
);
const groupedMetricsData = useGroupedProjectTrends(metricsData);
const { users, environmentTypeTrends } = executiveDashboardData;
const summary = useFilteredFlagsSummary(projectsData);
const summary = useFilteredFlagsSummary(projectsData);
const avgDaysToProduction = useAvgTimeToProduction(groupedProjectsData);
const avgDaysToProduction = useAvgTimeToProduction(groupedProjectsData);
return {
return useMemo(
() => ({
...executiveDashboardData,
projectsData,
groupedProjectsData,
metricsData,
groupedMetricsData,
users,
environmentTypeTrends,
users: executiveDashboardData.users,
environmentTypeTrends: executiveDashboardData.environmentTypeTrends,
summary,
avgDaysToProduction,
};
}, [executiveDashboardData, projects]);
}),
[
executiveDashboardData,
projects,
projectsData,
groupedProjectsData,
metricsData,
groupedMetricsData,
summary,
avgDaysToProduction,
],
);
};