@ai-growth/nextjs
Version:
Seamlessly integrate Sanity CMS with Next.js applications for automated blog routing and rendering
243 lines (242 loc) • 11.9 kB
JavaScript
;
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
var desc = Object.getOwnPropertyDescriptor(m, k);
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
desc = { enumerable: true, get: function() { return m[k]; } };
}
Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
if (k2 === undefined) k2 = k;
o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
o["default"] = v;
});
var __importStar = (this && this.__importStar) || (function () {
var ownKeys = function(o) {
ownKeys = Object.getOwnPropertyNames || function (o) {
var ar = [];
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
return ar;
};
return ownKeys(o);
};
return function (mod) {
if (mod && mod.__esModule) return mod;
var result = {};
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
__setModuleDefault(result, mod);
return result;
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
exports.trackTemplateLoad = exports.isTemplatePreloaded = exports.getTemplateChunkName = exports.ErrorPageWithSuspense = exports.LazyErrorPages = exports.DynamicTemplateLoader = exports.preloadTemplate = exports.preloadAllTemplates = exports.TEMPLATE_MAP_WITH_SUSPENSE = exports.LAZY_TEMPLATE_MAP = exports.PostTemplateWithSuspense = exports.PageTemplateWithSuspense = exports.BlogTemplateWithSuspense = exports.SimpleDefaultTemplateWithSuspense = exports.DefaultTemplateV2WithSuspense = exports.LazyPostTemplate = exports.LazyPageTemplate = exports.LazyBlogTemplate = exports.LazySimpleDefaultTemplate = exports.LazyDefaultTemplateV2 = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
/**
* @fileoverview Lazy-Loaded Template Components
*
* This module provides lazy-loaded versions of template components for code splitting
* and performance optimization. These components load on-demand to reduce initial bundle size.
*/
const react_1 = __importStar(require("react"));
const lazy_loading_1 = require("../utils/lazy-loading");
const LoadingComponents_1 = require("../components/LoadingComponents");
// ============================================================================
// LAZY TEMPLATE COMPONENTS
// ============================================================================
/**
* Lazy-loaded DefaultTemplateV2 component
*/
exports.LazyDefaultTemplateV2 = react_1.default.lazy(() => Promise.resolve().then(() => __importStar(require('./DefaultTemplateV2'))).then(module => ({
default: module.DefaultTemplateV2
})));
/**
* Lazy-loaded SimpleDefaultTemplate component
*/
exports.LazySimpleDefaultTemplate = react_1.default.lazy(() => Promise.resolve().then(() => __importStar(require('./SimpleDefaultTemplate'))).then(module => ({
default: module.SimpleDefaultTemplate
})));
/**
* Lazy-loaded BlogTemplate component
*/
exports.LazyBlogTemplate = react_1.default.lazy(() => Promise.resolve().then(() => __importStar(require('./BlogTemplate'))).then(module => ({
default: module.BlogTemplate
})));
/**
* Lazy-loaded PageTemplate component
*/
exports.LazyPageTemplate = react_1.default.lazy(() => Promise.resolve().then(() => __importStar(require('./PageTemplate'))).then(module => ({
default: module.PageTemplate
})));
/**
* Lazy-loaded PostTemplate component
*/
exports.LazyPostTemplate = react_1.default.lazy(() => Promise.resolve().then(() => __importStar(require('./PostTemplate'))).then(module => ({
default: module.PostTemplate
})));
// ============================================================================
// WRAPPED COMPONENTS WITH SUSPENSE
// ============================================================================
/**
* DefaultTemplateV2 with Suspense wrapper
*/
const DefaultTemplateV2WithSuspense = (props) => ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(LoadingComponents_1.CmsLoadingFallback, { contentType: "article" }), children: (0, jsx_runtime_1.jsx)(exports.LazyDefaultTemplateV2, { ...props }) }));
exports.DefaultTemplateV2WithSuspense = DefaultTemplateV2WithSuspense;
/**
* SimpleDefaultTemplate with Suspense wrapper
*/
const SimpleDefaultTemplateWithSuspense = (props) => ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(LoadingComponents_1.CmsLoadingFallback, { contentType: "page" }), children: (0, jsx_runtime_1.jsx)(exports.LazySimpleDefaultTemplate, { ...props }) }));
exports.SimpleDefaultTemplateWithSuspense = SimpleDefaultTemplateWithSuspense;
/**
* BlogTemplate with Suspense wrapper
*/
const BlogTemplateWithSuspense = (props) => ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(LoadingComponents_1.CmsLoadingFallback, { contentType: "blog" }), children: (0, jsx_runtime_1.jsx)(exports.LazyBlogTemplate, { ...props }) }));
exports.BlogTemplateWithSuspense = BlogTemplateWithSuspense;
/**
* PageTemplate with Suspense wrapper
*/
const PageTemplateWithSuspense = (props) => ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(LoadingComponents_1.CmsLoadingFallback, { contentType: "page" }), children: (0, jsx_runtime_1.jsx)(exports.LazyPageTemplate, { ...props }) }));
exports.PageTemplateWithSuspense = PageTemplateWithSuspense;
/**
* PostTemplate with Suspense wrapper
*/
const PostTemplateWithSuspense = (props) => ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: (0, jsx_runtime_1.jsx)(LoadingComponents_1.CmsLoadingFallback, { contentType: "article" }), children: (0, jsx_runtime_1.jsx)(exports.LazyPostTemplate, { ...props }) }));
exports.PostTemplateWithSuspense = PostTemplateWithSuspense;
// ============================================================================
// TEMPLATE REGISTRY WITH LAZY LOADING
// ============================================================================
/**
* Template mapping for lazy loading
*/
exports.LAZY_TEMPLATE_MAP = {
'default-v2': exports.LazyDefaultTemplateV2,
'simple-default': exports.LazySimpleDefaultTemplate,
'blog': exports.LazyBlogTemplate,
'page': exports.LazyPageTemplate,
'post': exports.LazyPostTemplate,
};
/**
* Template mapping with Suspense wrappers
*/
exports.TEMPLATE_MAP_WITH_SUSPENSE = {
'default-v2': exports.DefaultTemplateV2WithSuspense,
'simple-default': exports.SimpleDefaultTemplateWithSuspense,
'blog': exports.BlogTemplateWithSuspense,
'page': exports.PageTemplateWithSuspense,
'post': exports.PostTemplateWithSuspense,
};
/**
* Preload all templates
*/
const preloadAllTemplates = async () => {
const preloadPromises = [
Promise.resolve().then(() => __importStar(require('./DefaultTemplateV2'))),
Promise.resolve().then(() => __importStar(require('./SimpleDefaultTemplate'))),
Promise.resolve().then(() => __importStar(require('./BlogTemplate'))),
Promise.resolve().then(() => __importStar(require('./PageTemplate'))),
Promise.resolve().then(() => __importStar(require('./PostTemplate'))),
];
await Promise.allSettled(preloadPromises);
};
exports.preloadAllTemplates = preloadAllTemplates;
/**
* Preload specific template
*/
const preloadTemplate = async (templateName) => {
switch (templateName) {
case 'default-v2':
await Promise.resolve().then(() => __importStar(require('./DefaultTemplateV2')));
break;
case 'simple-default':
await Promise.resolve().then(() => __importStar(require('./SimpleDefaultTemplate')));
break;
case 'blog':
await Promise.resolve().then(() => __importStar(require('./BlogTemplate')));
break;
case 'page':
await Promise.resolve().then(() => __importStar(require('./PageTemplate')));
break;
case 'post':
await Promise.resolve().then(() => __importStar(require('./PostTemplate')));
break;
}
};
exports.preloadTemplate = preloadTemplate;
/**
* Dynamic template loader component
*/
const DynamicTemplateLoader = ({ templateName = 'default-v2', showLoading = true, loadingComponent: LoadingComponent, preloadOnHover = false, ...templateProps }) => {
const [isHovered, setIsHovered] = react_1.default.useState(false);
// Preload on hover
react_1.default.useEffect(() => {
if (preloadOnHover && isHovered) {
(0, exports.preloadTemplate)(templateName).catch(() => {
// Ignore preload errors
});
}
}, [preloadOnHover, isHovered, templateName]);
const Template = exports.LAZY_TEMPLATE_MAP[templateName];
const fallback = LoadingComponent ? ((0, jsx_runtime_1.jsx)(LoadingComponent, {})) : showLoading ? ((0, jsx_runtime_1.jsx)(LoadingComponents_1.CmsLoadingFallback, { contentType: "content" })) : null;
const templateElement = ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: fallback, children: (0, jsx_runtime_1.jsx)(Template, { ...templateProps }) }));
if (preloadOnHover) {
return ((0, jsx_runtime_1.jsx)("div", { onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), style: { display: 'contents' }, children: templateElement }));
}
return templateElement;
};
exports.DynamicTemplateLoader = DynamicTemplateLoader;
// ============================================================================
// LAZY ERROR PAGES
// ============================================================================
/**
* Lazy-loaded error pages for better performance
*/
exports.LazyErrorPages = {
NotFoundPage: react_1.default.lazy(() => Promise.resolve().then(() => __importStar(require('../components/ErrorPages'))).then(module => ({
default: module.NotFoundPage
}))),
ServerErrorPage: react_1.default.lazy(() => Promise.resolve().then(() => __importStar(require('../components/ErrorPages'))).then(module => ({
default: module.ServerErrorPage
}))),
};
/**
* Error page with Suspense wrapper
*/
const ErrorPageWithSuspense = ({ type, fallback, ...props }) => {
const ErrorComponent = exports.LazyErrorPages[type];
return ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: fallback || (0, jsx_runtime_1.jsx)(LoadingComponents_1.LoadingFallback, { message: "Loading error page..." }), children: (0, jsx_runtime_1.jsx)(ErrorComponent, { ...props }) }));
};
exports.ErrorPageWithSuspense = ErrorPageWithSuspense;
// ============================================================================
// UTILITY FUNCTIONS
// ============================================================================
/**
* Get chunk name for template
*/
const getTemplateChunkName = (templateName) => {
return (0, lazy_loading_1.createChunkName)(templateName, 'template');
};
exports.getTemplateChunkName = getTemplateChunkName;
/**
* Check if template is preloaded
*/
const isTemplatePreloaded = (_templateName) => {
// This is a simplified check - in a real implementation you'd track loaded modules
return false;
};
exports.isTemplatePreloaded = isTemplatePreloaded;
/**
* Track template loading performance
*/
const trackTemplateLoad = (templateName, startTime) => {
const loadTime = performance.now() - startTime;
return {
templateName,
loadTime,
size: 0, // Would be calculated based on actual bundle size
cached: false, // Would check if template was cached
};
};
exports.trackTemplateLoad = trackTemplateLoad;