webstudio 0.129.0 → 0.131.0

package/lib/cli.js

@@ -267,7 +267,9 @@ import {
   generateRemixRoute,
   generateRemixParams,
   generateResourcesLoader,
-  collectionComponent
+  collectionComponent,
+  generatePageMeta,
+  executeExpression
 } from "@webstudio-is/react-sdk";
 import {
   createScope,
@@ -525,7 +527,7 @@ var prebuild = async (options) => {
     },
     {
       assetBaseUrl,
-      atomic: siteData.build.pages.settings?.atomicStyles ?? true
+      atomic: siteData.build.pages.compiler?.atomicStyles ?? true
     }
   );
   await ensureFileInPath(join4(generatedDir, "index.css"), cssText);
@@ -541,6 +543,8 @@ var prebuild = async (options) => {
       "useState",
       "Fragment",
       "useResource",
+      "PageMeta",
+      "createPageMeta",
       "PageData",
       "Asset",
       "fontAssets",
@@ -583,8 +587,7 @@ var prebuild = async (options) => {
     }
     const pageData = siteDataByPage[pageId];
     const renderedPageData = {
-      project: siteData.build.pages.meta,
-      page: pageData.page
+      project: siteData.build.pages.meta
     };
     const rootInstanceId = pageData.page.rootInstanceId;
     const instances = new Map(pageData.build.instances);
@@ -632,6 +635,7 @@ var prebuild = async (options) => {
 import { Fragment, useState } from "react";
 import type { Asset, ImageAsset, ProjectMeta } from "@webstudio-is/sdk";
 import { useResource } from "@webstudio-is/react-sdk";
+import type { PageMeta } from "@webstudio-is/react-sdk";
 ${componentImports}
 import type { PageData } from "~/routes/_index";
 export const fontAssets: Asset[] = ${JSON.stringify(fontAssets)}
@@ -642,6 +646,8 @@ export const user: { email: string | null } | undefined = ${JSON.stringify(
     )};
 export const projectId = "${siteData.build.projectId}";
 
+${generatePageMeta({ scope, page: pageData.page, dataSources })}
+
 ${pageComponent}
 
 export { Page }
@@ -677,7 +683,9 @@ ${utilsExport}
     `
       export const sitemap = ${JSON.stringify(
       {
-        pages: siteData.pages.filter((page) => page.meta.excludePageFromSearch !== true).map((page) => ({
+        pages: siteData.pages.filter(
+          (page) => executeExpression(page.meta.excludePageFromSearch) !== true
+        ).map((page) => ({
           path: page.path,
           lastModified: siteData.build.updatedAt
         }))
@@ -860,7 +868,7 @@ import makeCLI from "yargs";
 // package.json
 var package_default = {
   name: "webstudio",
-  version: "0.129.0",
+  version: "0.131.0",
   description: "Webstudio CLI",
   author: "Webstudio <github@webstudio.is>",
   homepage: "https://webstudio.is",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webstudio",
-  "version": "0.129.0",
+  "version": "0.131.0",
   "description": "Webstudio CLI",
   "author": "Webstudio <github@webstudio.is>",
   "homepage": "https://webstudio.is",
@@ -28,21 +28,21 @@
     "title-case": "^4.1.0",
     "yargs": "^17.7.2",
     "zod": "^3.21.4",
-    "@webstudio-is/http-client": "0.129.0",
-    "@webstudio-is/react-sdk": "0.129.0",
-    "@webstudio-is/sdk": "0.129.0",
-    "@webstudio-is/image": "0.129.0",
-    "@webstudio-is/sdk-components-react": "0.129.0",
-    "@webstudio-is/sdk-components-react-remix": "0.129.0",
-    "@webstudio-is/sdk-components-react-radix": "0.129.0"
+    "@webstudio-is/http-client": "0.131.0",
+    "@webstudio-is/react-sdk": "0.131.0",
+    "@webstudio-is/image": "0.131.0",
+    "@webstudio-is/sdk": "0.131.0",
+    "@webstudio-is/sdk-components-react-remix": "0.131.0",
+    "@webstudio-is/sdk-components-react-radix": "0.131.0",
+    "@webstudio-is/sdk-components-react": "0.131.0"
   },
   "devDependencies": {
     "@types/node": "^18.17.1",
     "@types/prompts": "^2.4.5",
     "tsx": "^3.12.8",
     "typescript": "5.2.2",
-    "@webstudio-is/form-handlers": "0.129.0",
-    "@webstudio-is/tsconfig": "1.0.7"
+    "@webstudio-is/tsconfig": "1.0.7",
+    "@webstudio-is/form-handlers": "0.131.0"
   },
   "scripts": {
     "typecheck": "tsc",

package/templates/defaults/__templates__/route-template.tsx

@@ -8,7 +8,7 @@ import {
   json,
 } from "@remix-run/server-runtime";
 import { useLoaderData } from "@remix-run/react";
-import type { Page as PageType, ProjectMeta } from "@webstudio-is/sdk";
+import type { ProjectMeta } from "@webstudio-is/sdk";
 import { ReactSdkContext } from "@webstudio-is/react-sdk";
 import { n8nHandler, getFormId } from "@webstudio-is/form-handlers";
 import {
@@ -21,6 +21,7 @@ import {
   Page,
   imageAssets,
   getRemixParams,
+  getPageMeta,
 } from "../../../__generated__/_index";
 import { loadResources } from "../../../__generated__/_index.server";
 import css from "../__generated__/index.css";
@@ -28,12 +29,12 @@ import { assetBaseUrl, imageBaseUrl, imageLoader } from "~/constants.mjs";
 
 export type PageData = {
   project?: ProjectMeta;
-  page: PageType;
 };
 
 export const loader = async (arg: LoaderArgs) => {
   const params = getRemixParams(arg.params);
   const resources = await loadResources({ params });
+  const pageMeta = getPageMeta({ params, resources });
 
   const host =
     arg.request.headers.get("x-forwarded-host") ||
@@ -54,6 +55,7 @@ export const loader = async (arg: LoaderArgs) => {
       excludeFromSearch: arg.context.EXCLUDE_FROM_SEARCH,
       params,
       resources,
+      pageMeta,
     },
     // No way for current information to change, so add cache for 10 minutes
     // In case of CRM Data, this should be set to 0
@@ -68,29 +70,32 @@ export const headers = () => {
 };
 
 export const meta: V2_ServerRuntimeMetaFunction<typeof loader> = ({ data }) => {
-  const { page, project } = pageData;
-
   const metas: ReturnType<V2_ServerRuntimeMetaFunction> = [];
+  if (data === undefined) {
+    return metas;
+  }
+  const { pageMeta } = data;
+  const { project } = pageData;
 
-  if (data?.url) {
+  if (data.url) {
     metas.push({
       property: "og:url",
       content: data.url,
     });
   }
 
-  if (page.title) {
-    metas.push({ title: page.title });
+  if (pageMeta.title) {
+    metas.push({ title: pageMeta.title });
 
     metas.push({
       property: "og:title",
-      content: page.title,
+      content: pageMeta.title,
     });
   }
 
   metas.push({ property: "og:type", content: "website" });
 
-  const origin = `https://${data?.host}`;
+  const origin = `https://${data.host}`;
 
   if (project?.siteName) {
     metas.push({
@@ -107,47 +112,47 @@ export const meta: V2_ServerRuntimeMetaFunction<typeof loader> = ({ data }) => {
     });
   }
 
-  if (page.meta.excludePageFromSearch || data?.excludeFromSearch) {
+  if (pageMeta.excludePageFromSearch || data.excludeFromSearch) {
     metas.push({
       name: "robots",
       content: "noindex, nofollow",
     });
   }
 
-  if (page.meta.description) {
+  if (pageMeta.description) {
     metas.push({
       name: "description",
-      content: page.meta.description,
+      content: pageMeta.description,
     });
     metas.push({
       property: "og:description",
-      content: page.meta.description,
+      content: pageMeta.description,
     });
   }
 
-  if (page.meta.socialImageAssetId) {
+  if (pageMeta.socialImageAssetId) {
     const imageAsset = imageAssets.find(
-      (asset) => asset.id === page.meta.socialImageAssetId
+      (asset) => asset.id === pageMeta.socialImageAssetId
     );
 
     if (imageAsset) {
       metas.push({
         property: "og:image",
-        content: `https://${data?.host}${imageLoader({
+        content: `https://${data.host}${imageLoader({
           src: imageAsset.name,
           // Do not transform social image (not enough information do we need to do this)
           format: "raw",
         })}`,
       });
     }
+  } else if (pageMeta.socialImageUrl) {
+    metas.push({
+      property: "og:image",
+      content: pageMeta.socialImageUrl,
+    });
   }
 
-  for (const customMeta of page.meta.custom ?? []) {
-    if (customMeta.property.trim().length === 0) {
-      continue;
-    }
-    metas.push(customMeta);
-  }
+  metas.push(...pageMeta.custom);
 
   return metas;
 };

package/templates/defaults/package.json

@@ -10,13 +10,13 @@
     "@remix-run/react": "^1.19.2",
     "@remix-run/server-runtime": "^1.19.2",
     "@remix-run/node": "^1.19.2",
-    "@webstudio-is/react-sdk": "0.129.0",
-    "@webstudio-is/sdk-components-react-radix": "0.129.0",
-    "@webstudio-is/sdk-components-react-remix": "0.129.0",
-    "@webstudio-is/sdk-components-react": "0.129.0",
-    "@webstudio-is/form-handlers": "0.129.0",
-    "@webstudio-is/image": "0.129.0",
-    "@webstudio-is/sdk": "0.129.0",
+    "@webstudio-is/react-sdk": "0.131.0",
+    "@webstudio-is/sdk-components-react-radix": "0.131.0",
+    "@webstudio-is/sdk-components-react-remix": "0.131.0",
+    "@webstudio-is/sdk-components-react": "0.131.0",
+    "@webstudio-is/form-handlers": "0.131.0",
+    "@webstudio-is/image": "0.131.0",
+    "@webstudio-is/sdk": "0.131.0",
     "isbot": "^3.6.8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"