using Icon and getServerSideProps throws an error

"use client"
import Layout from "@/components/dashboard/Layout";
import { PasienPlusPage } from "@/pages/_app";
import { getServerAuthSession } from "@/server/auth";
import { GetServerSidePropsContext } from "next";
import { ReactElement } from "react";
import { CameraIcon } from "lucide-react";


const accountsManagement: PasienPlusPage = () => {
    return (
        <>
            <CameraIcon />
            <h1>accountsManagement</h1>
        </>
    );
};

accountsManagement.getLayout = function getLayout(page: ReactElement) {
    return <Layout>{page}</Layout>
}

accountsManagement.authRequired = true;
accountsManagement.isSubscriptionRequired = true;

export async function getServerSideProps(ctx: GetServerSidePropsContext) {
    const session = await getServerAuthSession(ctx);

    if (!session) {
        return {
            redirect: {
                destination: "/auth/signin",
                permanent: false,
            },
        };
    }
    // //if user is not admin redirect to dashboard
    if (session?.user?.role === "user") {
        return {
            redirect: {
                destination: "/dashboard/home",
                permanent: false,
            },
        };
    }


    return {
        props: { session },
    };
}

export default accountsManagement;