metaforecast/src/pages/dashboards/embed/[id].tsx
2022-04-12 22:21:32 +03:00

70 lines
1.7 KiB
TypeScript

import { GetServerSideProps, NextPage } from "next";
import Error from "next/error";
import { DashboardItem } from "../../../backend/dashboards";
import { DisplayForecasts } from "../../../web/display/DisplayForecasts";
import { FrontendForecast } from "../../../web/platforms";
import { getDashboardForecastsByDashboardId } from "../../../web/worker/getDashboardForecasts";
interface Props {
dashboardForecasts: FrontendForecast[];
dashboardItem: DashboardItem;
numCols?: number;
}
export const getServerSideProps: GetServerSideProps<Props> = async (
context
) => {
const dashboardId = context.query.id as string;
const numCols = Number(context.query.numCols);
const { dashboardItem, dashboardForecasts } =
await getDashboardForecastsByDashboardId({
dashboardId,
});
if (!dashboardItem) {
context.res.statusCode = 404;
}
return {
props: {
dashboardForecasts,
dashboardItem,
numCols: !numCols ? null : numCols < 5 ? numCols : 4,
},
};
};
const EmbedDashboardPage: NextPage<Props> = ({
dashboardForecasts,
dashboardItem,
numCols,
}) => {
if (!dashboardItem) {
return <Error statusCode={404} />;
}
return (
<div className="mb-4 mt-3 flex flex-row justify-left items-center">
<div className="mx-2 place-self-left">
<div
className={`grid grid-cols-${numCols || 1} sm:grid-cols-${
numCols || 1
} md:grid-cols-${numCols || 2} lg:grid-cols-${
numCols || 3
} gap-4 mb-6`}
>
<DisplayForecasts
results={dashboardForecasts}
numDisplay={dashboardForecasts.length}
showIdToggle={false}
/>
</div>
</div>
</div>
);
};
export default EmbedDashboardPage;