@coursebuilder/commerce-next
Version:
Commerce Functionality for Course Builder with Next.js
39 lines (38 loc) • 2.51 kB
JavaScript
'use client';
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from 'react';
import { Slot } from '@radix-ui/react-slot';
import { cn } from '@coursebuilder/ui/utils/cn';
const LoginLinkContext = React.createContext(undefined);
export const LoginLinkProvider = ({ children, ...props }) => {
return (_jsx(LoginLinkContext.Provider, { value: props, children: children }));
};
export const useLoginLink = () => {
const context = React.use(LoginLinkContext);
if (context === undefined) {
throw new Error('useLoginLink must be used within an LoginLinkProvider');
}
return context;
};
const Root = ({ children, className, ...props }) => (_jsx(LoginLinkProvider, { ...props, children: _jsx("section", { className: cn('w-full', className), children: children }) }));
const Title = ({ className, asChild, children = (_jsxs(_Fragment, { children: ["Please check your inbox for a ", _jsx("strong", { children: "login link" }), " that just got sent."] })), }) => {
const Comp = asChild ? Slot : 'h2';
return (_jsx(Comp, { className: cn('w-full text-balance text-lg font-medium sm:text-xl lg:text-2xl', className), children: children }));
};
const CTA = ({ className, asChild, children, }) => {
const { email } = useLoginLink();
const Comp = asChild ? Slot : 'div';
return (_jsx(Comp, { className: cn('w-full text-balance', className), children: children || (_jsx(_Fragment, { children: _jsxs("strong", { children: ["Login link sent to: ", email] }) })) }));
};
const Status = ({ className, children = 'Final step', }) => {
return (_jsx("span", { className: cn('text-primary block pb-4 text-sm uppercase', className), children: children }));
};
const Description = ({ className, children, }) => {
const { email } = useLoginLink();
return (_jsx("p", { className: cn('w-full text-balance pt-5', className), children: children || (_jsxs(_Fragment, { children: ["As a final step to access the course you need to check your inbox (", _jsx("strong", { children: email }), ") where you will find an email from", ' ', _jsx("strong", { children: process.env.NEXT_PUBLIC_SUPPORT_EMAIL }), " with a link to access your purchase and start learning."] })) }));
};
// full component
const LoginLinkComp = ({ email }) => {
return (_jsxs(Root, { email: email, children: [_jsx(Status, {}), _jsx(Title, {}), _jsx(CTA, {}), _jsx(Description, {})] }));
};
export { Root, Title, Description, Status, CTA, LoginLinkComp };