Page blocks improvements (#652)

* Removed commented code and deprecated docs

* Re-arrange FAQ items

* FAQ block new layout switcher, re-arranger

* hero card layout; (untested) hero layouts

* tested: header layout

* header background for existing pages fix

* media block border made configurable

* Fixed links on checkout and links texts

---------

Co-authored-by: Rajat <hi@rajatsaxena.dev>

Author: rajat1saxena

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

@@ -3,11 +3,7 @@
 import DashboardContent from "@components/admin/dashboard-content";
 import LoadingScreen from "@components/admin/loading-screen";
 import Settings from "@components/admin/settings";
-import {
-    AddressContext,
-    ProfileContext,
-    SiteInfoContext,
-} from "@components/contexts";
+import { ProfileContext, SiteInfoContext } from "@components/contexts";
 import { Profile, UIConstants } from "@courselit/common-models";
 import { checkPermission } from "@courselit/utils";
 import { SITE_SETTINGS_PAGE_HEADING } from "@ui-config/strings";
@@ -19,7 +15,6 @@ const breadcrumbs = [{ label: SITE_SETTINGS_PAGE_HEADING, href: "#" }];
 
 export default function Page() {
     const siteinfo = useContext(SiteInfoContext);
-    const address = useContext(AddressContext);
     const { profile } = useContext(ProfileContext);
     const searchParams = useSearchParams();
 
@@ -37,12 +32,9 @@ export default function Page() {
             <Settings
                 key={tab}
                 siteinfo={siteinfo}
-                address={address}
                 profile={profile as Profile}
                 selectedTab={tab as any}
-                dispatch={() => {}}
                 loading={false}
-                networkAction={false}
             />
         </DashboardContent>
     );

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

@@ -44,7 +44,7 @@ export default function Page(props: { params: Promise<{ id: string }> }) {
                 siteinfo: siteInfo,
                 address: address,
                 profile: profile as Profile,
-                auth: profile.email
+                auth: profile!.email
                     ? {
                           guest: false,
                           checked: true,
@@ -72,7 +72,6 @@ export default function Page(props: { params: Promise<{ id: string }> }) {
                     action: null,
                 },
             }}
-            dispatch={() => {}}
         />
     );
 }

apps/web/components/admin/page-editor/index.tsx

@@ -519,52 +519,6 @@ export default function PageEditor({
         [selectedWidget],
     );
 
-    // const saveDraftTypefaces = async (fontName: string) => {
-    //     const newTypefaces: Typeface[] = structuredClone(draftTypefaces);
-    //     const defaultSection = newTypefaces.filter(
-    //         (x) => x.section === "default",
-    //     )[0];
-    //     defaultSection.typeface = fontName;
-
-    //     const query = `
-    //         mutation {
-    //             site: updateDraftTypefaces(
-    //                 typefaces: ${getGraphQLQueryStringFromObject(newTypefaces)}
-    //             ) {
-    //                 draftTypefaces {
-    //                     section,
-    //                     typeface,
-    //                     fontWeights,
-    //                     fontSize,
-    //                     lineHeight,
-    //                     letterSpacing,
-    //                     case
-    //                 },
-    //             }
-    //         }
-    //     `;
-    //     const fetch = new FetchBuilder()
-    //         .setUrl(`${address.backend}/api/graph`)
-    //         .setPayload(query)
-    //         .setIsGraphQLEndpoint(true)
-    //         .build();
-    //     try {
-    //         dispatch && dispatch(networkAction(true));
-    //         const response = await fetch.exec();
-    //         if (response.site) {
-    //             setDraftTypefaces(response.site.draftTypefaces);
-    //         }
-    //     } catch (err: any) {
-    //         toast({
-    //             title: TOAST_TITLE_ERROR,
-    //             description: err.message,
-    //             variant: "destructive",
-    //         });
-    //     } finally {
-    //         dispatch && dispatch(networkAction(false));
-    //     }
-    // };
-
     const onAddWidgetBelow = (index: number) => {
         setSelectedWidgetIndex(index);
         setLeftPaneContent("widgets");
@@ -762,6 +716,7 @@ export default function PageEditor({
                                     onClick={onPublish}
                                     size="sm"
                                     className="gap-2 whitespace-nowrap"
+                                    disabled={loading}
                                 >
                                     <ArrowUpFromLine className="h-4 w-4" />
                                     {EDIT_PAGE_BUTTON_UPDATE}

apps/web/components/admin/settings/index.tsx

@@ -135,35 +135,6 @@ const Settings = (props: SettingsProps) => {
         loadAdminSettings();
     }, []);
 
-    // useEffect(() => {
-    //     props.dispatch(
-    //         newSiteInfoAvailable({
-    //             title: settings.title || "",
-    //             subtitle: settings.subtitle || "",
-    //             logo: settings.logo,
-    //             currencyISOCode: settings.currencyISOCode,
-    //             paymentMethod: settings.paymentMethod,
-    //             stripeKey: settings.stripeKey,
-    //             codeInjectionHead: settings.codeInjectionHead
-    //                 ? encode(settings.codeInjectionHead)
-    //                 : "",
-    //             codeInjectionBody: settings.codeInjectionBody
-    //                 ? encode(settings.codeInjectionBody)
-    //                 : "",
-    //             mailingAddress: settings.mailingAddress || "",
-    //             hideCourseLitBranding: settings.hideCourseLitBranding ?? false,
-    //             razorpayKey: settings.razorpayKey,
-    //             lemonsqueezyStoreId: settings.lemonsqueezyStoreId,
-    //             lemonsqueezyOneTimeVariantId:
-    //                 settings.lemonsqueezyOneTimeVariantId,
-    //             lemonsqueezySubscriptionMonthlyVariantId:
-    //                 settings.lemonsqueezySubscriptionMonthlyVariantId,
-    //             lemonsqueezySubscriptionYearlyVariantId:
-    //                 settings.lemonsqueezySubscriptionYearlyVariantId,
-    //         }),
-    //     );
-    // }, [settings]);
-
     const loadAdminSettings = async () => {
         const query = `
             query {

apps/web/components/public/base-layout/template/index.tsx

@@ -73,7 +73,7 @@ const Template = (props: TemplateProps) => {
     );
 
     return (
-        <div className="flex flex-col courselit-theme">
+        <div className="flex flex-col bg-background courselit-theme">
             {header && (
                 <EditableWidget
                     item={header}

apps/web/components/public/payments/login-form.tsx

@@ -12,7 +12,6 @@ import {
     FormItem,
     FormMessage,
 } from "@/components/ui/form";
-import Link from "next/link";
 import {
     AddressContext,
     ProfileContext,
@@ -168,19 +167,23 @@ export function LoginForm({ onLoginComplete }: LoginFormProps) {
                         />
                         <Text2 className="text-xs" theme={theme.theme}>
                             By signing in, you accept our{" "}
-                            <Link
-                                href="/terms"
+                            <a
+                                href="/p/terms"
                                 className="underline hover:text-primary font-medium"
+                                target="_blank"
+                                rel="noreferrer noopener"
                             >
                                 Terms
-                            </Link>{" "}
+                            </a>{" "}
                             and{" "}
-                            <Link
-                                href="/privacy"
+                            <a
+                                href="/p/privacy"
                                 className="underline hover:text-primary font-medium"
+                                target="_blank"
+                                rel="noreferrer noopener"
                             >
                                 Privacy Policy
-                            </Link>
+                            </a>
                         </Text2>
                         <Button
                             type="button"

apps/web/graphql/pages/helpers.ts

@@ -211,8 +211,8 @@ export async function initSharedWidgets(ctx: GQLContext) {
                     {
                         name: "Legal",
                         links: [
-                            { label: "Terms of use", href: "/p/terms" },
-                            { label: "Privacy policy", href: "/p/privacy" },
+                            { label: "Terms of Use", href: "/p/terms" },
+                            { label: "Privacy Policy", href: "/p/privacy" },
                         ],
                     },
                 ],

docs/widgets.md

@@ -36,8 +36,8 @@ export const leads = ["website", "newsletter", "download", "api"] as const;
 export const mailRequestStatus = ["pending", "approved", "rejected"] as const;
 export const pageNames = {
     home: "Home page",
-    terms: "Terms of Service",
-    privacy: "Privacy policy",
+    terms: "Terms of Use",
+    privacy: "Privacy Policy",
     blog: "Blog",
 };
 export const dripType = ["relative-date", "exact-date"] as const;