@enonic/nextjs-adapter 0.10.0 → 0.11.0

package/ComponentRegistry.d.ts

@@ -14,17 +14,18 @@ export interface ComponentDefinition {
     processor?: DataProcessor;
     view?: React.FunctionComponent<any>;
 }
-export declare type DataProcessor = (data: any, context?: Context) => Promise<Record<string, any>>;
-export declare type VariablesGetter = (path: string, context?: Context, config?: any) => VariablesGetterResult;
-export declare type VariablesGetterResult = {
+export type DataProcessor = (data: any, context?: Context) => Promise<Record<string, any>>;
+export type VariablesGetter = (path: string, context?: Context, config?: any) => VariablesGetterResult;
+export type QueryGetter = (config?: any) => string;
+export type VariablesGetterResult = {
     [variables: string]: any;
     path: string;
 };
-export declare type SelectedQueryMaybeVariablesFunc = string | {
-    query: string;
+export type SelectedQueryMaybeVariablesFunc = string | QueryGetter | {
+    query: string | QueryGetter;
     variables: VariablesGetter;
 } | [
-    string,
+    string | QueryGetter,
     VariablesGetter
 ];
 export declare const CATCH_ALL = "*";
@@ -36,6 +37,9 @@ export declare class ComponentRegistry {
     private static layouts;
     private static macros;
     private static commonQuery;
+    private static getSelector;
+    private static getType;
+    private static addType;
     static getByComponent(component: PageComponent): ComponentDefinition | undefined;
     static setCommonQuery(query: SelectedQueryMaybeVariablesFunc): void;
     static getCommonQuery(): SelectedQueryMaybeVariablesFunc;
@@ -55,7 +59,4 @@ export declare class ComponentRegistry {
     static getLayout(name: string): ComponentDefinition | undefined;
     static addComponent(name: string, obj: ComponentDefinition): void;
     static getComponent(name: string): ComponentDefinition | undefined;
-    private static getSelector;
-    private static getType;
-    private static addType;
 }

package/ComponentRegistry.js

@@ -11,6 +11,41 @@ function toSelectorName(type) {
 }
 export const CATCH_ALL = '*';
 export class ComponentRegistry {
+    static getSelector(name) {
+        switch (name) {
+            case 'contentType':
+                return this.contentTypes;
+            case 'page':
+                return this.pages;
+            case 'component':
+                return this.components;
+            case 'layout':
+                return this.layouts;
+            case 'part':
+                return this.parts;
+            case 'macro':
+                return this.macros;
+        }
+    }
+    static getType(selectorName, typeName, useCatchAll = true) {
+        const selector = ComponentRegistry.getSelector(selectorName);
+        let type = selector[typeName];
+        if (type) {
+            type.catchAll = false;
+        }
+        else if (!type && useCatchAll) {
+            type = selector[CATCH_ALL];
+            if (type) {
+                type.catchAll = true;
+            }
+        }
+        return type;
+    }
+    static addType(selectorName, name, obj) {
+        const selector = ComponentRegistry.getSelector(selectorName);
+        const curr = selector[name];
+        selector[name] = curr ? Object.assign(curr, obj) : obj;
+    }
     static getByComponent(component) {
         const selName = toSelectorName(component.type);
         const cmpData = component[component.type];
@@ -71,41 +106,6 @@ export class ComponentRegistry {
     static getComponent(name) {
         return ComponentRegistry.getType('component', name);
     }
-    static getSelector(name) {
-        switch (name) {
-            case 'contentType':
-                return this.contentTypes;
-            case 'page':
-                return this.pages;
-            case 'component':
-                return this.components;
-            case 'layout':
-                return this.layouts;
-            case 'part':
-                return this.parts;
-            case 'macro':
-                return this.macros;
-        }
-    }
-    static getType(selectorName, typeName, useCatchAll = true) {
-        const selector = ComponentRegistry.getSelector(selectorName);
-        let type = selector[typeName];
-        if (type) {
-            type.catchAll = false;
-        }
-        else if (!type && useCatchAll) {
-            type = selector[CATCH_ALL];
-            if (type) {
-                type.catchAll = true;
-            }
-        }
-        return type;
-    }
-    static addType(selectorName, name, obj) {
-        const selector = ComponentRegistry.getSelector(selectorName);
-        const curr = selector[name];
-        selector[name] = curr ? Object.assign(curr, obj) : obj;
-    }
 }
 ComponentRegistry.contentTypes = {};
 ComponentRegistry.pages = {};

package/guillotine/fetchContent.d.ts

@@ -7,7 +7,7 @@ import { ParsedUrlQuery } from 'node:querystring';
 import { type GetServerSidePropsContext } from 'next';
 import { IncomingMessage } from 'http';
 import { type NextApiRequestCookies } from 'next/dist/server/api-utils';
-export declare type AdapterConstants = {
+export type AdapterConstants = {
     APP_NAME: string;
     APP_NAME_DASHED: string;
     SITE_KEY: string;
@@ -15,22 +15,22 @@ export declare type AdapterConstants = {
     getRenderMode: (context?: Context) => RENDER_MODE;
     getSingleComponentPath: (context?: Context) => string | undefined;
 };
-declare type Result = {
+type Result = {
     error?: {
         code: string;
         message: string;
     } | null;
 };
-declare type GuillotineResult = Result & {
+type GuillotineResult = Result & {
     [dataKey: string]: any;
 };
-export declare type FetchContentResult = Result & {
+export type FetchContentResult = Result & {
     data: Record<string, any> | null;
     common: Record<string, any> | null;
     meta: MetaData;
     page: PageComponent | null;
 };
-declare type FetcherConfig<T extends AdapterConstants> = T & {
+type FetcherConfig<T extends AdapterConstants> = T & {
     componentRegistry: typeof ComponentRegistry;
 };
 export interface ServerSideParams extends ParsedUrlQuery {
@@ -41,7 +41,7 @@ export interface PreviewParams {
     contentPath: string[];
     headers: Record<string, string>;
 }
-export declare type Context = GetServerSidePropsContext<ServerSideParams, PreviewParams>;
+export type Context = GetServerSidePropsContext<ServerSideParams, PreviewParams>;
 export interface MinimalContext {
     req: IncomingMessage & {
         cookies: NextApiRequestCookies;
@@ -52,17 +52,17 @@ export interface MinimalContext {
  * @param contentPath string or string array: pre-split or slash-delimited _path to a content available on the API
  * @returns FetchContentResult object: {data?: T, error?: {code, message}}
  */
-export declare type ContentFetcher = (contentPath: string | string[], context: Context) => Promise<FetchContentResult>;
-export declare type ContentApiBaseBody = {
+export type ContentFetcher = (contentPath: string | string[], context: Context) => Promise<FetchContentResult>;
+export type ContentApiBaseBody = {
     query?: string;
     variables?: {
         path?: string;
     };
 };
 /** Generic fetch */
-export declare const fetchFromApi: (apiUrl: string, body: {}, method?: string) => Promise<any>;
+export declare const fetchFromApi: (apiUrl: string, body: ContentApiBaseBody, headers?: {}, method?: string) => Promise<any>;
 /** Guillotine-specialized fetch, using the generic fetch above */
-export declare const fetchGuillotine: (contentApiUrl: string, body: ContentApiBaseBody, xpContentPath: string) => Promise<GuillotineResult>;
+export declare const fetchGuillotine: (contentApiUrl: string, body: ContentApiBaseBody, xpContentPath: string, headers?: {}) => Promise<GuillotineResult>;
 /**
  * Configures, builds and returns a general fetchContent function.
  * @param adapterConstants Object containing attributes imported from enonic-connecion-config.js: constants and function concerned with connection to the XP backend. Easiest: caller imports enonic-connection-config and just passes that entire object here as adapterConstants.

package/guillotine/fetchContent.js

@@ -7,15 +7,15 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { getMetaQuery, pageFragmentQuery, } from './getMetaData';
-import adapterConstants, { APP_NAME, APP_NAME_DASHED, FRAGMENT_CONTENTTYPE_NAME, FRAGMENT_DEFAULT_REGION_NAME, getContentApiUrl, getXpBaseUrl, IS_DEV_MODE, PAGE_TEMPLATE_CONTENTTYPE_NAME, PAGE_TEMPLATE_FOLDER, RENDER_MODE, sanitizeGraphqlName, SITE_KEY, XP_COMPONENT_TYPE, XP_REQUEST_TYPE, } from '../utils';
+import { getMetaQuery, pageFragmentQuery } from './getMetaData';
+import adapterConstants, { APP_NAME, APP_NAME_DASHED, FRAGMENT_CONTENTTYPE_NAME, FRAGMENT_DEFAULT_REGION_NAME, getContentApiUrl, getXpBaseUrl, IS_DEV_MODE, JSESSIONID_HEADER, PAGE_TEMPLATE_CONTENTTYPE_NAME, PAGE_TEMPLATE_FOLDER, RENDER_MODE, sanitizeGraphqlName, SITE_KEY, XP_COMPONENT_TYPE, XP_REQUEST_TYPE, } from '../utils';
 import { ComponentRegistry } from '../ComponentRegistry';
 const NO_PROPS_PROCESSOR = (props) => __awaiter(void 0, void 0, void 0, function* () { var _a; return (_a = yield props) !== null && _a !== void 0 ? _a : {}; });
 const ALIAS_PREFIX = 'request';
 const GUILLOTINE_QUERY_REGEXP = /^\s*query\s*(?:\((.*)*\))?\s*{\s*guillotine\s*{((?:.|\s)+)}\s*}\s*$/;
 const GRAPHQL_FRAGMENTS_REGEXP = /fragment\s+.+\s+on\s+.+\s*{[\s\w{}().,:"'`]+}/;
 /** Generic fetch */
-export const fetchFromApi = (apiUrl, body, method = 'POST') => __awaiter(void 0, void 0, void 0, function* () {
+export const fetchFromApi = (apiUrl, body, headers, method = 'POST') => __awaiter(void 0, void 0, void 0, function* () {
     const options = {
         method,
         headers: {
@@ -25,6 +25,9 @@ export const fetchFromApi = (apiUrl, body, method = 'POST') => __awaiter(void 0,
         },
         body: JSON.stringify(body),
     };
+    if (headers) {
+        Object.assign(options.headers, headers);
+    }
     let res;
     try {
         res = yield fetch(apiUrl, options);
@@ -61,7 +64,7 @@ export const fetchFromApi = (apiUrl, body, method = 'POST') => __awaiter(void 0,
     return json;
 });
 /** Guillotine-specialized fetch, using the generic fetch above */
-export const fetchGuillotine = (contentApiUrl, body, xpContentPath) => __awaiter(void 0, void 0, void 0, function* () {
+export const fetchGuillotine = (contentApiUrl, body, xpContentPath, headers) => __awaiter(void 0, void 0, void 0, function* () {
     if (typeof body.query !== 'string' || !body.query.trim()) {
         return {
             error: {
@@ -70,7 +73,7 @@ export const fetchGuillotine = (contentApiUrl, body, xpContentPath) => __awaiter
             },
         };
     }
-    const result = yield fetchFromApi(contentApiUrl, body)
+    const result = yield fetchFromApi(contentApiUrl, body, headers)
         .then(json => {
         let errors = (json || {}).errors;
         if (errors) {
@@ -104,7 +107,7 @@ export const fetchGuillotine = (contentApiUrl, body, xpContentPath) => __awaiter
     return result;
 });
 // /////////////////////////////////////////////////////////////////////////////// Specific fetch wrappers:
-const fetchMetaData = (contentApiUrl, xpContentPath) => __awaiter(void 0, void 0, void 0, function* () {
+const fetchMetaData = (contentApiUrl, xpContentPath, headers) => __awaiter(void 0, void 0, void 0, function* () {
     var _b;
     const body = {
         query: getMetaQuery(pageFragmentQuery()),
@@ -112,7 +115,7 @@ const fetchMetaData = (contentApiUrl, xpContentPath) => __awaiter(void 0, void 0
             path: xpContentPath,
         },
     };
-    const metaResult = yield fetchGuillotine(contentApiUrl, body, xpContentPath);
+    const metaResult = yield fetchGuillotine(contentApiUrl, body, xpContentPath, headers);
     if (metaResult.error) {
         return metaResult;
     }
@@ -122,12 +125,12 @@ const fetchMetaData = (contentApiUrl, xpContentPath) => __awaiter(void 0, void 0
         };
     }
 });
-const fetchContentData = (contentApiUrl, xpContentPath, query, variables) => __awaiter(void 0, void 0, void 0, function* () {
+const fetchContentData = (contentApiUrl, xpContentPath, query, variables, headers) => __awaiter(void 0, void 0, void 0, function* () {
     const body = { query };
     if (variables && Object.keys(variables).length > 0) {
         body.variables = variables;
     }
-    const contentResults = yield fetchGuillotine(contentApiUrl, body, xpContentPath);
+    const contentResults = yield fetchGuillotine(contentApiUrl, body, xpContentPath, headers);
     if (contentResults.error) {
         return contentResults;
     }
@@ -406,7 +409,7 @@ function processComponentConfig(myAppName, myAppNameDashed, cmp) {
 }
 function getQueryAndVariables(type, path, selectedQuery, context, config) {
     let query, getVariables;
-    if (typeof selectedQuery === 'string') {
+    if (typeof selectedQuery === 'string' || typeof selectedQuery === 'function') {
         query = selectedQuery;
     }
     else if (Array.isArray(selectedQuery)) {
@@ -420,12 +423,15 @@ function getQueryAndVariables(type, path, selectedQuery, context, config) {
     if (getVariables && typeof getVariables !== 'function') {
         throw Error(`getVariables for content type ${type} should be a function, not: ${typeof getVariables}`);
     }
-    if (query && typeof query !== 'string') {
-        throw Error(`Query for content type ${type} should be a string, not: ${typeof query}`);
+    if (query && typeof query !== 'string' && typeof query !== 'function') {
+        throw Error(`Query for content type ${type} should be a string or function, not: ${typeof query}`);
+    }
+    if (typeof query === 'function') {
+        query = query(config);
     }
     if (query) {
         return {
-            query: query,
+            query,
             variables: getVariables ? getVariables(path, context, config) : { path },
         };
     }
@@ -502,7 +508,14 @@ function errorResponse(code = '500', message = 'Unknown error', requestType, ren
 export const buildContentFetcher = (config) => {
     const { APP_NAME, APP_NAME_DASHED, getXPRequestType, getRenderMode, getSingleComponentPath, componentRegistry, } = config;
     return (contentPathOrArray, context) => __awaiter(void 0, void 0, void 0, function* () {
-        var _a, _b;
+        var _a, _b, _c;
+        let headers;
+        const jsessionid = (_a = context === null || context === void 0 ? void 0 : context.req) === null || _a === void 0 ? void 0 : _a.headers[JSESSIONID_HEADER];
+        if (jsessionid) {
+            headers = {
+                'Cookie': `${JSESSIONID_HEADER}=${jsessionid}`,
+            };
+        }
         const xpBaseUrl = getXpBaseUrl(context);
         const contentApiUrl = getContentApiUrl(context);
         const requestType = getXPRequestType(context);
@@ -515,7 +528,7 @@ export const buildContentFetcher = (config) => {
                 requestedComponentPath = getSingleComponentPath(context);
             }
             // /////////////  FIRST GUILLOTINE CALL FOR METADATA     /////////////////
-            const metaResult = yield fetchMetaData(contentApiUrl, '${site}/' + siteRelativeContentPath);
+            const metaResult = yield fetchMetaData(contentApiUrl, '${site}/' + siteRelativeContentPath, headers);
             // ///////////////////////////////////////////////////////////////////////
             const { type, components, _path } = metaResult.meta || {};
             contentPath = _path || '';
@@ -542,14 +555,14 @@ export const buildContentFetcher = (config) => {
             if (pageCmp) {
                 processComponentConfig(APP_NAME, APP_NAME_DASHED, pageCmp);
             }
-            const contentQueryAndVars = getQueryAndVariables(type, contentPath, contentTypeDef === null || contentTypeDef === void 0 ? void 0 : contentTypeDef.query, context, (_a = pageCmp === null || pageCmp === void 0 ? void 0 : pageCmp.page) === null || _a === void 0 ? void 0 : _a.config);
+            const contentQueryAndVars = getQueryAndVariables(type, contentPath, contentTypeDef === null || contentTypeDef === void 0 ? void 0 : contentTypeDef.query, context, (_b = pageCmp === null || pageCmp === void 0 ? void 0 : pageCmp.page) === null || _b === void 0 ? void 0 : _b.config);
             if (contentQueryAndVars) {
                 allDescriptors.push({
                     type: contentTypeDef,
                     queryAndVariables: contentQueryAndVars,
                 });
             }
-            const commonQueryAndVars = getQueryAndVariables(type, contentPath, componentRegistry.getCommonQuery(), context, (_b = pageCmp === null || pageCmp === void 0 ? void 0 : pageCmp.page) === null || _b === void 0 ? void 0 : _b.config);
+            const commonQueryAndVars = getQueryAndVariables(type, contentPath, componentRegistry.getCommonQuery(), context, (_c = pageCmp === null || pageCmp === void 0 ? void 0 : pageCmp.page) === null || _c === void 0 ? void 0 : _c.config);
             if (commonQueryAndVars) {
                 allDescriptors.push({
                     type: contentTypeDef,
@@ -571,7 +584,7 @@ export const buildContentFetcher = (config) => {
                 return errorResponse('400', `Missing or empty query override for content type ${type}`, requestType, renderMode, contentApiUrl, xpBaseUrl, contentPath);
             }
             // ///////////////    SECOND GUILLOTINE CALL FOR DATA   //////////////////////
-            const contentResults = yield fetchContentData(contentApiUrl, contentPath, query, variables);
+            const contentResults = yield fetchContentData(contentApiUrl, contentPath, query, variables, headers);
             // ///////////////////////////////////////////////////////////////////////////
             // Apply processors to every component
             const datas = yield applyProcessors(allDescriptors, contentResults, context);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@enonic/nextjs-adapter",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "license": "Apache-2.0",
   "main": "index.js",
   "publishConfig": {
@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "html-react-parser": "^3.0.4",
-    "next": "^13.0.3",
+    "next": "^13.0.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "unescape": "^1.0.1"
@@ -23,11 +23,11 @@
     "@enonic/eslint-config": "^0.1.0",
     "@types/node": "^18.11.9",
     "@types/react": "^18.0.25",
-    "@types/react-dom": "^18.0.8",
-    "@typescript-eslint/eslint-plugin": "^5.42.1",
-    "@typescript-eslint/parser": "^5.42.1",
-    "eslint": "^8.27.0",
-    "eslint-plugin-react": "^7.31.10",
-    "typescript": "^4.8.4"
+    "@types/react-dom": "^18.0.9",
+    "@typescript-eslint/eslint-plugin": "^5.43.0",
+    "@typescript-eslint/parser": "^5.44.0",
+    "eslint": "^8.28.0",
+    "eslint-plugin-react": "^7.31.11",
+    "typescript": "^4.9.3"
   }
 }

package/utils.d.ts

@@ -12,6 +12,7 @@ export declare const FROM_XP_PARAM = "__fromxp__";
 export declare const XP_BASE_URL_HEADER = "xpbaseurl";
 export declare const COMPONENT_SUBPATH_HEADER = "xp-component-path";
 export declare const RENDER_MODE_HEADER = "content-studio-mode";
+export declare const JSESSIONID_HEADER = "jsessionid";
 export declare const PORTAL_COMPONENT_ATTRIBUTE = "data-portal-component-type";
 export declare const PORTAL_REGION_ATTRIBUTE = "data-portal-region";
 export declare const FRAGMENT_CONTENTTYPE_NAME = "portal:fragment";

package/utils.js

@@ -16,6 +16,7 @@ export const FROM_XP_PARAM = '__fromxp__';
 export const XP_BASE_URL_HEADER = 'xpbaseurl';
 export const COMPONENT_SUBPATH_HEADER = 'xp-component-path';
 export const RENDER_MODE_HEADER = 'content-studio-mode';
+export const JSESSIONID_HEADER = 'jsessionid';
 export const PORTAL_COMPONENT_ATTRIBUTE = 'data-portal-component-type';
 export const PORTAL_REGION_ATTRIBUTE = 'data-portal-region';
 export const FRAGMENT_CONTENTTYPE_NAME = 'portal:fragment';

package/views/BaseComponent.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { MetaData, PageComponent } from '../guillotine/getMetaData';
-export declare type BaseComponentProps = {
+export type BaseComponentProps = {
     component: PageComponent;
     meta: MetaData;
     common?: any;

package/views/RichTextView.d.ts

@@ -1,15 +1,16 @@
 /// <reference types="react" />
 import { MetaData, RichTextData } from '../guillotine/getMetaData';
 import { DOMNode } from 'html-react-parser';
-export declare type ReplacerResult = JSX.Element | object | void | undefined | null | false;
-export declare type Replacer = (domNode: DOMNode, data: RichTextData, meta: MetaData, renderMacroInEditMode: boolean) => ReplacerResult;
-declare type Props = {
+export type ReplacerResult = JSX.Element | object | void | undefined | null | false;
+export type Replacer = (domNode: DOMNode, data: RichTextData, meta: MetaData, renderMacroInEditMode: boolean) => ReplacerResult;
+type Props = {
     data: RichTextData;
     meta: MetaData;
+    className?: string;
     tag?: string;
     renderMacroInEditMode?: boolean;
     customReplacer?: Replacer;
 };
 export declare function createReplacer(allData: RichTextData, meta: MetaData, renderMacroInEditMode?: boolean, customReplacer?: Replacer): (domNode: DOMNode) => ReplacerResult;
-declare const RichTextView: ({ tag, data, meta, renderMacroInEditMode, customReplacer }: Props) => JSX.Element;
+declare const RichTextView: ({ className, tag, data, meta, renderMacroInEditMode, customReplacer }: Props) => JSX.Element;
 export default RichTextView;

package/views/RichTextView.jsx

@@ -46,9 +46,9 @@ export function createReplacer(allData, meta, renderMacroInEditMode = true, cust
         return el;
     };
 }
-const RichTextView = ({ tag, data, meta, renderMacroInEditMode, customReplacer }) => {
+const RichTextView = ({ className, tag, data, meta, renderMacroInEditMode, customReplacer }) => {
     const CustomTag = tag || 'section';
-    return <CustomTag>
+    return <CustomTag className={className}>
         {data.processedHtml ? HTMLReactParser(data.processedHtml, { replace: createReplacer(data, meta, renderMacroInEditMode, customReplacer) }) : ''}
     </CustomTag>;
 };

package/views/Text.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { MetaData, TextData } from '../guillotine/getMetaData';
-declare type Props = {
+type Props = {
     meta: MetaData;
     component: TextData;
     path: string;