74 lines
2.4 KiB
TypeScript
74 lines
2.4 KiB
TypeScript
import { User } from "@/interfaces/user";
|
|
import { sessionOptions } from "@/lib/session";
|
|
import { shouldRedirectHome } from "@/utils/navigation.disabled";
|
|
import { checkAccess } from "@/utils/permissions";
|
|
import { getUserPermissions } from "@/utils/permissions.be";
|
|
import { withIronSessionSsr } from "iron-session/next";
|
|
import dynamic from "next/dynamic";
|
|
import { useState, useEffect } from 'react';
|
|
|
|
export const getServerSideProps = withIronSessionSsr(async ({ req, res, query }) => {
|
|
const user = req.session.user;
|
|
if (!user) {
|
|
return {
|
|
redirect: {
|
|
destination: "/login",
|
|
permanent: false,
|
|
},
|
|
};
|
|
}
|
|
if (shouldRedirectHome(user) || !checkAccess(user, ["admin", "developer", "corporate", "teacher", "mastercorporate"])) {
|
|
return {
|
|
redirect: {
|
|
destination: "/",
|
|
permanent: false,
|
|
},
|
|
};
|
|
}
|
|
const permissions = await getUserPermissions(user.id);
|
|
const {type, module} = query;
|
|
return {
|
|
props: { user, permissions, type, module },
|
|
};
|
|
}, sessionOptions);
|
|
|
|
const Popout: React.FC<{ user: User; type: string, module: string }> = ({ user, type, module }) => {
|
|
const [DynamicPopout, setDynamicPopout] = useState<React.ComponentType<any> | null>(null);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
useEffect(() => {
|
|
const loadComponent = async () => {
|
|
try {
|
|
const sanitizedPopout = type.replace(/[^a-zA-Z0-9]/g, '');
|
|
const sanitizedModule = module.replace(/[^a-zA-Z0-9]/g, '');
|
|
const Component = dynamic(() => import(`@/components/Popouts/${sanitizedPopout}`), {
|
|
loading: () => (
|
|
<div className="min-h-screen w-full">
|
|
<div className="absolute left-1/2 top-1/2 flex h-fit w-fit -translate-x-1/2 -translate-y-1/2 animate-pulse flex-col items-center gap-12">
|
|
<span className={`loading loading-infinity w-32 bg-ielts-${sanitizedModule}`} />
|
|
</div>
|
|
</div>
|
|
),
|
|
});
|
|
setDynamicPopout(() => Component);
|
|
} catch (err) {
|
|
console.error("Error loading component:", err);
|
|
setError("Failed to load the requested popout component.");
|
|
}
|
|
};
|
|
|
|
loadComponent();
|
|
}, [type, module]);
|
|
|
|
if (error) {
|
|
return <div className="text-red-500">{error}</div>;
|
|
}
|
|
return (
|
|
<div className="min-h-screen w-full p-10">
|
|
{DynamicPopout ? <DynamicPopout user={user} /> : null}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Popout;
|