@akinon/projectzero 2.0.0-beta.20 → 2.0.0-beta.21

package/app-template/src/widgets/footer-social.tsx

@@ -1,11 +1,7 @@
 import 'server-only';
 
+import { Link, Icon } from '@theme/components';
 import { getWidgetData } from '@akinon/next/data/server';
-import FooterSocialClient from './footer-social-client';
-
-type ThemeConfig = {
-  theme_settings: string | object;
-};
 
 type TargetBlank = {
   value: string;
@@ -35,50 +31,23 @@ type FooterSocialType = {
 };
 
 export default async function FooterSocial() {
-  const themeConfig = await getWidgetData<ThemeConfig>({
-    slug: 'theme-config'
-  });
-
-  let socialNetworks = {};
-  try {
-    if (themeConfig?.attributes?.theme_settings) {
-      const settingsRaw = themeConfig.attributes.theme_settings;
-      let settings;
-
-      if (typeof settingsRaw === 'string') {
-        settings = JSON.parse(settingsRaw);
-      } else if (
-        typeof settingsRaw === 'object' &&
-        settingsRaw !== null &&
-        'value' in settingsRaw
-      ) {
-        const value = (settingsRaw as any).value;
-        settings = typeof value === 'string' ? JSON.parse(value) : value;
-      } else {
-        settings = settingsRaw;
-      }
-
-      socialNetworks = settings.socialNetworks || {};
-    }
-  } catch (e) {
-    console.error('Error parsing theme settings:', e);
-  }
-
-  const activeNetworks = Object.entries(socialNetworks)
-    .filter(([_, value]: [string, any]) => value.icon)
-    .map(([key, value]: [string, any]) => ({
-      key,
-      url: value.url || '#',
-      icon: value.icon
-    }));
-
   const data = await getWidgetData<FooterSocialType>({ slug: 'footer-social' });
-  const socialItems = data?.attributes?.social_items || [];
 
   return (
-    <FooterSocialClient
-      activeNetworks={activeNetworks}
-      socialItems={socialItems}
-    />
+    <div className="flex flex-wrap items-center justify-around py-4 border-t border-gray md:justify-center">
+      {data?.attributes?.social_items?.map((item, i) => (
+        <Link
+          key={i}
+          href={item?.value?.redirect_url}
+          className="p-2 border rounded-full border-gray md:mr-1 md:last:mr-0"
+          target={item?.value?.is_target_blank === 'true' ? '_blank' : '_self'}
+        >
+          <Icon
+            size={18}
+            name={item?.value?.icon_class?.replace('pz-icon-', '')}
+          />
+        </Link>
+      ))}
+    </div>
   );
 }

package/app-template/src/widgets/footer-subscription/index.tsx

@@ -1,196 +1,30 @@
-'use client';
+import 'server-only';
 
-import type { CSSProperties } from 'react';
-import clsx from 'clsx';
-import { useDesignerFeatures } from '@akinon/next/components/theme-editor/hooks/use-designer-features';
+import { getWidgetData } from '@akinon/next/data/server';
 
 import FooterSubscriptionForm from './footer-subscription-form';
-import {
-  FOOTER_PLACEHOLDER_ID,
-  FOOTER_SUBSCRIPTION_SECTION_ID
-} from '../../views/footer/native-widget-config';
-import {
-  FOOTER_SUBSCRIPTION_BLOCKS,
-  FOOTER_SUBSCRIPTION_DEFAULT_CONTENT
-} from '../../views/footer/subscription-settings';
-import { useFooterSubscriptionDesigner } from '../../views/footer/footer-subscription-context';
 
-type FooterSubscriptionProps = {
-  title?: string;
-  description?: string;
-};
-
-type FooterSubscriptionBlockConfig =
-  typeof FOOTER_SUBSCRIPTION_BLOCKS[keyof typeof FOOTER_SUBSCRIPTION_BLOCKS];
-
-const extractTextValue = (value: unknown): string | undefined => {
-  if (value == null) {
-    return undefined;
-  }
-
-  if (typeof value === 'string' || typeof value === 'number') {
-    return String(value);
-  }
-
-  if (typeof value === 'object') {
-    const record = value as Record<string, unknown>;
-    const candidateKeys = [
-      'content',
-      'value',
-      'text',
-      'label',
-      'default',
-      'desktop',
-      'mobile',
-      'tablet'
-    ];
-
-    for (const key of candidateKeys) {
-      const candidate = record[key];
-      if (typeof candidate === 'string' && candidate.trim().length > 0) {
-        return candidate;
-      }
-    }
-
-    for (const objValue of Object.values(record)) {
-      if (typeof objValue === 'string' && objValue.trim().length > 0) {
-        return objValue;
-      }
-    }
-  }
-
-  return undefined;
-};
-
-const kebabToCamel = (str: string): string =>
-  str.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
-
-const normalizeStyles = (
-  styles: Record<string, unknown> | undefined
-): CSSProperties => {
-  if (!styles) return {};
-
-  const result: Record<string, string | number> = {};
-
-  for (const [key, value] of Object.entries(styles)) {
-    if (value == null) continue;
-
-    const camelKey = kebabToCamel(key);
-    let resolved: unknown = value;
-
-    if (typeof value === 'object' && !Array.isArray(value)) {
-      const responsive = value as Record<string, unknown>;
-      resolved = responsive.desktop ?? responsive.mobile ?? responsive.tablet;
-    }
-
-    if (resolved != null) {
-      if (typeof resolved === 'number') {
-        result[camelKey] = resolved;
-      } else if (typeof resolved === 'string') {
-        result[camelKey] = resolved;
-      }
-    }
-  }
-
-  return result as CSSProperties;
+type FooterSubscriptionType = {
+  description: {
+    value: string;
+  };
+  title: {
+    value: string;
+  };
 };
 
-function useSubscriptionBlock(blockConfig: FooterSubscriptionBlockConfig) {
-  const { isDesigner, selectedBlockId, getBlock, blockVersion } =
-    useFooterSubscriptionDesigner();
-  const blockState = blockVersion >= 0 ? getBlock(blockConfig.id) : undefined;
-  const styles = normalizeStyles(blockState?.styles as Record<string, unknown>);
-  const { handleClick } = useDesignerFeatures({
-    blockId: blockConfig.id,
-    placeholderId: FOOTER_PLACEHOLDER_ID,
-    sectionId: FOOTER_SUBSCRIPTION_SECTION_ID,
-    isDesigner,
-    blockInfo: {
-      id: blockConfig.id,
-      type: blockConfig.type,
-      label: blockConfig.label
-    }
+export default async function FooterSubscription() {
+  const data = await getWidgetData<FooterSubscriptionType>({
+    slug: 'footer-subscription'
   });
 
-  return {
-    styles,
-    isDesigner,
-    isSelected: selectedBlockId === blockConfig.id,
-    onClick: isDesigner ? handleClick : undefined,
-    content: extractTextValue(blockState?.value)
-  };
-}
-
-export default function FooterSubscription({
-  title,
-  description
-}: FooterSubscriptionProps) {
-  const titleBlock = useSubscriptionBlock(FOOTER_SUBSCRIPTION_BLOCKS.TITLE);
-  const descriptionBlock = useSubscriptionBlock(
-    FOOTER_SUBSCRIPTION_BLOCKS.DESCRIPTION
-  );
-  const formBlock = useSubscriptionBlock(FOOTER_SUBSCRIPTION_BLOCKS.FORM);
-  const displayTitle =
-    titleBlock.content || title || FOOTER_SUBSCRIPTION_DEFAULT_CONTENT.title;
-  const displayDescription =
-    descriptionBlock.content ||
-    description ||
-    FOOTER_SUBSCRIPTION_DEFAULT_CONTENT.description;
-  const shouldRenderDescription =
-    descriptionBlock.isDesigner || Boolean(displayDescription);
-
   return (
-    <div className="w-full max-w-[331px]">
-      <h3
-        style={titleBlock.styles}
-        data-block-id={
-          titleBlock.isDesigner
-            ? FOOTER_SUBSCRIPTION_BLOCKS.TITLE.id
-            : undefined
-        }
-        onClick={titleBlock.onClick}
-        className={clsx(
-          'mb-4 text-lg text-[#121212]',
-          titleBlock.isDesigner && 'cursor-pointer',
-          titleBlock.isSelected && 'ring-2 ring-blue-500 ring-offset-2 rounded'
-        )}
-      >
-        {displayTitle}
+    <div className="py-4 border-t md:border-t-0 lg:pl-7">
+      <h3 className="mb-1 text-xs font-medium">
+        {data?.attributes?.title?.value}
       </h3>
-
-      {shouldRenderDescription && (
-        <p
-          style={descriptionBlock.styles}
-          data-block-id={
-            descriptionBlock.isDesigner
-              ? FOOTER_SUBSCRIPTION_BLOCKS.DESCRIPTION.id
-              : undefined
-          }
-          onClick={descriptionBlock.onClick}
-          className={clsx(
-            'text-sm text-[#121212] text-opacity-75 mb-6 leading-relaxed',
-            descriptionBlock.isDesigner && 'cursor-pointer',
-            descriptionBlock.isSelected &&
-              'ring-2 ring-blue-500 ring-offset-2 rounded'
-          )}
-        >
-          {displayDescription}
-        </p>
-      )}
-
-      <div
-        style={formBlock.styles}
-        data-block-id={
-          formBlock.isDesigner ? FOOTER_SUBSCRIPTION_BLOCKS.FORM.id : undefined
-        }
-        onClick={formBlock.onClick}
-        className={clsx(
-          formBlock.isDesigner && 'cursor-pointer inline-block',
-          formBlock.isSelected && 'ring-2 ring-blue-500 ring-offset-2 rounded'
-        )}
-      >
-        <FooterSubscriptionForm />
-      </div>
+      <p className="mb-2 text-xs">{data?.attributes?.description?.value}</p>
+      <FooterSubscriptionForm />
     </div>
   );
 }

package/dist/commands/plugins.js

@@ -60,7 +60,10 @@ function checkVersion(pkg) {
             const pkgInfo = (yield response.json());
             const latestVersion = pkgInfo['dist-tags'].latest;
             if (!semver_1.default.satisfies(pkg.dependencies['@akinon/next'], latestVersion)) {
-                console.warn(`\x1b[43mWarning: The "${packageName}" package is currently at version ${pkg.dependencies['@akinon/next']}. Please upgrade it to the latest version (${latestVersion}) to ensure plugin compatibility.`, '\x1b[0m\n');
+                console.warn(`\x1b[43m Warning: The "${packageName}" package is currently at`, `\x1b[41m version ${pkg.dependencies['@akinon/next']}`, `\x1b[43m Please upgrade it to the latest version (${latestVersion}) to ensure plugin compatibility.`, '\x1b[0m\n');
+            }
+            else {
+                console.log(`\x1b[42m Info: The package "${packageName}" is currently in the current version (${latestVersion}).`, '\x1b[0m\n');
             }
         }
         catch (error) {
@@ -82,7 +85,25 @@ exports.default = () => __awaiter(void 0, void 0, void 0, function* () {
             throw new Error('plugins.js was not found in either of the expected locations.');
         }
     }
-    const pkg = require(path_1.default.resolve(rootDir, './package.json'));
+    function findPackageJson() {
+        const packageJsonPaths = [
+            path_1.default.resolve(rootDir, './package.json'),
+            path_1.default.resolve(rootDir, './apps/projectzeronext/package.json')
+        ];
+        for (const packageJsonPath of packageJsonPaths) {
+            try {
+                const pkg = require(packageJsonPath);
+                if (pkg.dependencies['@akinon/next']) {
+                    return pkg;
+                }
+            }
+            catch (error) {
+                continue;
+            }
+        }
+        throw new Error('Could not find package.json with @akinon/next dependency');
+    }
+    const pkg = findPackageJson();
     yield checkVersion(pkg);
     const pluginsFilePath = findPluginsFilePath();
     let installedPlugins = [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@akinon/projectzero",
-  "version": "2.0.0-beta.20",
+  "version": "2.0.0-beta.21",
   "private": false,
   "description": "CLI tool to manage your Project Zero Next project",
   "bin": {

package/app-template/src/app/[commerce]/[locale]/[currency]/pages/[slug]/page.tsx

@@ -1,15 +0,0 @@
-import ThemePlaceholder from '@akinon/next/components/theme-editor/theme-placeholder';
-import { withSegmentDefaults } from '@akinon/next/hocs/server';
-import { PageProps } from '@akinon/next/types';
-
-export const dynamic = 'force-dynamic';
-
-async function Page({ params }: PageProps<{ slug: string }>) {
-  return (
-    <div className="min-h-screen">
-      <ThemePlaceholder slug={`page-${params.slug}`} />
-    </div>
-  );
-}
-
-export default withSegmentDefaults(Page, { segmentType: 'page' });