removed connect (redux) usage

Author: rajat1saxena

apps/web/app/(with-contexts)/(with-layout)/home-page-layout.tsx

@@ -8,11 +8,11 @@ import {
     TypefacesContext,
     ThemeContext,
 } from "@components/contexts";
-import { BaseLayout } from "@components/public/base-layout";
+import BaseLayout from "@components/public/base-layout";
 import { Profile } from "@courselit/common-models";
 import { getFullSiteSetup } from "@ui-lib/utils";
 import { useContext } from "react";
-import { CodeInjector } from "@components/public/code-injector";
+import CodeInjector from "@components/public/code-injector";
 
 export default function HomepageLayout({
     children,
@@ -32,9 +32,7 @@ export default function HomepageLayout({
         <BaseLayout
             layout={siteInfo!.page.layout}
             title={siteInfo!.page.title || ""}
-            typefaces={typefaces}
             siteInfo={siteinfo}
-            dispatch={() => {}}
             theme={theme}
             state={{
                 config: config,

apps/web/app/(with-contexts)/(with-layout)/p/[id]/client-side-page.tsx

@@ -7,7 +7,7 @@ import {
     TypefacesContext,
 } from "@components/contexts";
 import { ProfileContext } from "@components/contexts";
-import { BaseLayout } from "@components/public/base-layout";
+import BaseLayout from "@components/public/base-layout";
 import { Profile } from "@courselit/common-models";
 
 export default function ClientSidePage({
@@ -40,16 +40,14 @@ export default function ClientSidePage({
             layout={layoutWithoutHeaderFooter}
             title={page.title || page.pageData?.title}
             pageData={page.pageData}
-            typefaces={typefaces}
             siteInfo={siteinfo}
-            dispatch={() => {}}
             theme={theme}
             state={{
                 config: config,
                 siteinfo,
                 address,
                 profile: profile as Profile,
-                auth: profile.email
+                auth: profile?.email
                     ? {
                           guest: false,
                           checked: true,

apps/web/app/(with-contexts)/course/[slug]/[id]/page.tsx

@@ -5,12 +5,14 @@ import { isEnrolled } from "@ui-lib/utils";
 import { ArrowRight } from "@courselit/icons";
 import { COURSE_PROGRESS_START, ENROLL_BUTTON_TEXT } from "@ui-config/strings";
 import { checkPermission } from "@courselit/utils";
-import { Course, Profile, UIConstants } from "@courselit/common-models";
-import { Article } from "@components/public/article";
+import { Profile, UIConstants } from "@courselit/common-models";
 import {
     Link,
     Button2,
     getSymbolFromCurrency,
+    TextRenderer,
+    TextEditorEmptyDoc,
+    Image,
 } from "@courselit/components-library";
 import {
     AddressContext,
@@ -50,7 +52,6 @@ export default function ProductPage({
     return (
         <div className="flex flex-col pb-[100px] lg:max-w-[40rem] xl:max-w-[48rem] mx-auto">
             <h1 className="text-4xl font-semibold mb-8">{product.title}</h1>
-            {JSON.stringify(profile)}
             {!isEnrolled(product.courseId, profile as Profile) &&
                 checkPermission(profile.permissions ?? [], [
                     permissions.enrollInCourse,
@@ -74,12 +75,28 @@ export default function ProductPage({
                         </div>
                     </div>
                 )}
-            <Article
-                course={product as unknown as Course}
-                options={{ hideTitle: true }}
-                profile={profile as Profile}
-                siteInfo={siteInfo}
-            />
+            {product.featuredImage && (
+                <div className="flex justify-center">
+                    <div className="mt-4 mb-8 w-full md:max-w-screen-md">
+                        <Image
+                            alt={product.featuredImage.caption}
+                            src={product.featuredImage.file!}
+                            loading="eager"
+                            sizes="50vw"
+                        />
+                    </div>
+                </div>
+            )}
+            <div className="overflow-hidden min-h-[360px]">
+                <TextRenderer
+                    json={
+                        product.description
+                            ? JSON.parse(product.description)
+                            : TextEditorEmptyDoc
+                    }
+                    showTableOfContent={true}
+                />
+            </div>
             {isEnrolled(product.courseId, profile as Profile) && (
                 <div className="self-end">
                     <Link

apps/web/app/(with-contexts)/dashboard/(sidebar)/blog/[id]/page.tsx

@@ -1,11 +1,11 @@
 "use client";
 
 import useCourse from "@components/admin/blogs/editor/course-hook";
-import { Details } from "@components/admin/blogs/editor/details";
-import { Publish } from "@components/admin/blogs/editor/publish";
+import Details from "@components/admin/blogs/editor/details";
+import Publish from "@components/admin/blogs/editor/publish";
 import { deleteProduct } from "@components/admin/blogs/helpers";
 import DashboardContent from "@components/admin/dashboard-content";
-import { AddressContext, ProfileContext } from "@components/contexts";
+import { AddressContext } from "@components/contexts";
 import { UIConstants } from "@courselit/common-models";
 import {
     Link,
@@ -26,7 +26,6 @@ import {
     PRODUCT_TABLE_CONTEXT_MENU_DELETE_PRODUCT,
 } from "@ui-config/strings";
 import { truncate } from "@ui-lib/utils";
-import { Profile } from "next-auth";
 import { useRouter, useSearchParams } from "next/navigation";
 import { useContext, useState } from "react";
 
@@ -40,7 +39,6 @@ export default function Page({ params }: { params: { id: string } }) {
     const searchParams = useSearchParams();
     const [tab, setTab] = useState(searchParams?.get("tab") || "Details");
     const address = useContext(AddressContext);
-    const { profile } = useContext(ProfileContext);
     const course = useCourse(id, address);
     const router = useRouter();
     const { toast } = useToast();
@@ -105,18 +103,10 @@ export default function Page({ params }: { params: { id: string } }) {
                         onChange={setTab}
                     >
                         <div className="pt-4">
-                            <Details
-                                id={id as string}
-                                address={address}
-                                profile={profile as Profile}
-                            />
+                            <Details id={id as string} />
                         </div>
                         <div className="pt-4">
-                            <Publish
-                                id={id}
-                                address={address}
-                                loading={false}
-                            />
+                            <Publish id={id} />
                         </div>
                     </Tabbs>
                 </>

apps/web/app/(with-contexts)/dashboard/(sidebar)/blog/new/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { NewBlog } from "@components/admin/blogs/new-blog";
+import NewBlog from "@components/admin/blogs/new-blog";
 import DashboardContent from "@components/admin/dashboard-content";
 import { AddressContext } from "@components/contexts";
 import { UIConstants } from "@courselit/common-models";
@@ -23,7 +23,7 @@ export default function Page() {
                 UIConstants.permissions.manageCourse,
             ]}
         >
-            <NewBlog address={address} networkAction={false} />
+            <NewBlog />
         </DashboardContent>
     );
 }

apps/web/app/(with-contexts)/dashboard/(sidebar)/blogs/page.tsx

@@ -1,12 +1,10 @@
 "use client";
 
-import { Index as Blogs } from "@components/admin/blogs";
+import Blogs from "@components/admin/blogs";
 import DashboardContent from "@components/admin/dashboard-content";
 import LoadingScreen from "@components/admin/loading-screen";
 import {
-    AddressContext,
     ProfileContext,
-    SiteInfoContext,
 } from "@components/contexts";
 import { UIConstants } from "@courselit/common-models";
 import { checkPermission } from "@courselit/utils";
@@ -17,12 +15,11 @@ const { permissions } = UIConstants;
 const breadcrumbs = [{ label: MANAGE_BLOG_PAGE_HEADING, href: "#" }];
 
 export default function Page() {
-    const address = useContext(AddressContext);
     const { profile } = useContext(ProfileContext);
-    const siteinfo = useContext(SiteInfoContext);
 
     if (
-        !checkPermission(profile.permissions!, [
+        !profile ||
+        !checkPermission(profile?.permissions!, [
             permissions.manageAnyCourse,
             permissions.manageCourse,
         ])
@@ -32,7 +29,7 @@ export default function Page() {
 
     return (
         <DashboardContent breadcrumbs={breadcrumbs}>
-            <Blogs address={address} loading={false} siteinfo={siteinfo} />
+            <Blogs />
         </DashboardContent>
     );
 }

apps/web/app/(with-contexts)/dashboard/(sidebar)/overview/page.tsx

@@ -19,7 +19,7 @@ import dynamic from "next/dynamic";
 import DashboardContent from "@components/admin/dashboard-content";
 const Todo = dynamic(() =>
     import("@components/admin/dashboard/to-do").then((mod) => ({
-        default: mod.Todo,
+        default: mod.default,
     })),
 );
 const LoadingScreen = dynamic(() => import("@components/admin/loading-screen"));
@@ -134,7 +134,7 @@ export default function Page() {
                                 ))}
                             </SelectContent>
                         </Select> */}
-            <Todo siteinfo={siteInfo} />
+            <Todo />
             <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-2">
                 <MetricCard
                     title="Sales"

apps/web/app/(with-contexts)/dashboard/(sidebar)/pages/page.tsx

@@ -2,27 +2,31 @@
 
 import DashboardContent from "@components/admin/dashboard-content";
 import LoadingScreen from "@components/admin/loading-screen";
-import { Pages } from "@components/admin/pages";
-import { AddressContext, ProfileContext } from "@components/contexts";
+import { ProfileContext } from "@components/contexts";
 import { UIConstants } from "@courselit/common-models";
 import { checkPermission } from "@courselit/utils";
 import { MANAGE_PAGES_PAGE_HEADING } from "@ui-config/strings";
+import dynamic from "next/dynamic";
 import { useContext } from "react";
 const { permissions } = UIConstants;
 
+const Pages = dynamic(() => import("@components/admin/pages"));
+
 const breadcrumbs = [{ label: MANAGE_PAGES_PAGE_HEADING, href: "#" }];
 
 export default function Page() {
-    const address = useContext(AddressContext);
     const { profile } = useContext(ProfileContext);
 
-    if (!checkPermission(profile.permissions!, [permissions.manageSite])) {
+    if (
+        !profile ||
+        !checkPermission(profile.permissions!, [permissions.manageSite])
+    ) {
         return <LoadingScreen />;
     }
 
     return (
         <DashboardContent breadcrumbs={breadcrumbs}>
-            <Pages address={address} loading={false} dispatch={() => {}} />
+            <Pages />
         </DashboardContent>
     );
 }

apps/web/app/(with-contexts)/dashboard/(sidebar)/product/[id]/content/section/[section]/lesson/page.tsx

@@ -63,7 +63,7 @@ import {
     MIMETYPE_PDF,
 } from "@ui-config/constants";
 import { FetchBuilder } from "@courselit/utils";
-import { QuizBuilder } from "@components/admin/products/editor/content/quiz-builder";
+import { QuizBuilder } from "@components/admin/products/quiz-builder";
 import { isTextEditorNonEmpty, truncate } from "@ui-lib/utils";
 import { Skeleton } from "@/components/ui/skeleton";
 import { Separator } from "@components/ui/separator";

apps/web/app/(with-contexts)/dashboard/(sidebar)/product/[id]/customer/new/page.tsx

@@ -9,14 +9,14 @@ import {
 } from "@ui-config/strings";
 import { truncate } from "@ui-lib/utils";
 import { useContext } from "react";
-import useProduct from "../../../../../../../../hooks/use-product";
+import useProduct from "@/hooks/use-product";
 import { useParams } from "next/navigation";
 
 export default function Page() {
     const params = useParams();
-    const productId = params.id as string;
+    const productId = params?.id as string;
     const address = useContext(AddressContext);
-    const { product } = useProduct(productId, address);
+    const { product } = useProduct(productId);
     const breadcrumbs = [
         { label: MANAGE_COURSES_PAGE_HEADING, href: "/dashboard/products" },
         {