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

package/app-template/src/views/footer/native-widget-config.ts

@@ -1,262 +0,0 @@
-export const FOOTER_PLACEHOLDER_ID = 'footer';
-export const FOOTER_MENU_SECTION_ID = 'footer-menu';
-export const FOOTER_SUBSCRIPTION_SECTION_ID = 'footer-subscription';
-export const FOOTER_SOCIAL_SECTION_ID = 'footer-social';
-export const FOOTER_BOTTOM_SECTION_ID = 'footer-bottom';
-export const FOOTER_APP_BANNER_SECTION_ID = 'footer-app-banner';
-export const FOOTER_VALUE_PROPS_SECTION_ID = 'footer-value-props';
-
-export const FOOTER_MENU_WIDGET_SLUG = 'footer-menu-settings-2';
-export const FOOTER_SUBSCRIPTION_WIDGET_SLUG = 'footer-subscription-settings-2';
-export const FOOTER_SOCIAL_WIDGET_SLUG = 'footer-social-settings-2';
-export const FOOTER_BOTTOM_WIDGET_SLUG = 'footer-bottom-settings-2';
-export const FOOTER_APP_BANNER_WIDGET_SLUG = 'footer-app-banner-settings-2';
-export const FOOTER_VALUE_PROPS_WIDGET_SLUG = 'footer-value-props-settings-2';
-
-export const FOOTER_MENU_LOGO_BLOCK_ID = 'footer-menu-logo';
-export const FOOTER_MENU_HEADING_BLOCK_ID = 'footer-menu-heading';
-export const FOOTER_MENU_LINK_BLOCK_ID = 'footer-menu-link';
-export const FOOTER_SUBSCRIPTION_TITLE_BLOCK_ID = 'footer-subscription-title';
-export const FOOTER_SUBSCRIPTION_DESCRIPTION_BLOCK_ID =
-  'footer-subscription-description';
-export const FOOTER_SUBSCRIPTION_FORM_BLOCK_ID = 'footer-subscription-form';
-export const FOOTER_SOCIAL_ICONS_BLOCK_ID = 'footer-social-icons';
-export const FOOTER_BOTTOM_LABELS_BLOCK_ID = 'footer-bottom-labels';
-export const FOOTER_BOTTOM_SELECTORS_BLOCK_ID = 'footer-bottom-selectors';
-export const FOOTER_BOTTOM_PAYMENTS_BLOCK_ID = 'footer-bottom-payment-icons';
-
-export const FOOTER_APP_BANNER_IMAGE_BLOCK_ID = 'footer-app-banner-image';
-export const FOOTER_APP_BANNER_TITLE_BLOCK_ID = 'footer-app-banner-title';
-export const FOOTER_APP_BANNER_DESCRIPTION_BLOCK_ID =
-  'footer-app-banner-description';
-export const FOOTER_APP_BANNER_BUTTONS_BLOCK_ID = 'footer-app-banner-buttons';
-export const FOOTER_APP_BANNER_APPSTORE_BLOCK_ID = 'footer-app-banner-appstore';
-export const FOOTER_APP_BANNER_PLAYSTORE_BLOCK_ID =
-  'footer-app-banner-playstore';
-
-export const FOOTER_VALUE_PROPS_LIST_BLOCK_ID = 'footer-value-props-list';
-
-export interface FooterNativeWidgetBlockConfig {
-  id: string;
-  type: string;
-  label: string;
-  blocks?: FooterNativeWidgetBlockConfig[];
-}
-
-export interface FooterNativeWidgetSectionConfig {
-  placeholderId: string;
-  sectionId: string;
-  label: string;
-  widgetSlug: string;
-  blocks: FooterNativeWidgetBlockConfig[];
-}
-
-export interface FooterNativeWidgetBlock extends FooterNativeWidgetBlockConfig {
-  styles?: Record<string, unknown>;
-  properties?: Record<string, unknown>;
-  value?: unknown;
-  blocks?: FooterNativeWidgetBlock[];
-}
-
-export interface FooterNativeWidgetSection
-  extends FooterNativeWidgetSectionConfig {
-  blocks: FooterNativeWidgetBlock[];
-  sectionProperties?: Record<string, unknown>;
-  sectionStyles?: Record<string, unknown>;
-}
-
-export const FOOTER_NATIVE_SECTIONS: FooterNativeWidgetSectionConfig[] = [
-  {
-    placeholderId: FOOTER_PLACEHOLDER_ID,
-    sectionId: FOOTER_MENU_SECTION_ID,
-    label: 'Footer Menu',
-    widgetSlug: FOOTER_MENU_WIDGET_SLUG,
-    blocks: [
-      {
-        id: 'footer-menu-heading',
-        type: 'text',
-        label: 'Menu Headings'
-      },
-      {
-        id: 'footer-menu-link',
-        type: 'text',
-        label: 'Menu Links'
-      },
-      {
-        id: FOOTER_MENU_LOGO_BLOCK_ID,
-        type: 'image',
-        label: 'Footer Logo'
-      }
-    ]
-  },
-  {
-    placeholderId: FOOTER_PLACEHOLDER_ID,
-    sectionId: FOOTER_SUBSCRIPTION_SECTION_ID,
-    label: 'Footer Subscription',
-    widgetSlug: FOOTER_SUBSCRIPTION_WIDGET_SLUG,
-    blocks: [
-      {
-        id: FOOTER_SUBSCRIPTION_TITLE_BLOCK_ID,
-        type: 'text',
-        label: 'Subscription Title'
-      },
-      {
-        id: FOOTER_SUBSCRIPTION_DESCRIPTION_BLOCK_ID,
-        type: 'text',
-        label: 'Subscription Description'
-      },
-      {
-        id: FOOTER_SUBSCRIPTION_FORM_BLOCK_ID,
-        type: 'group',
-        label: 'Subscription Form'
-      }
-    ]
-  },
-  {
-    placeholderId: FOOTER_PLACEHOLDER_ID,
-    sectionId: FOOTER_SOCIAL_SECTION_ID,
-    label: 'Footer Social Icons',
-    widgetSlug: FOOTER_SOCIAL_WIDGET_SLUG,
-    blocks: [
-      {
-        id: FOOTER_SOCIAL_ICONS_BLOCK_ID,
-        type: 'social-icons-list',
-        label: 'Social Icons'
-      }
-    ]
-  },
-  {
-    placeholderId: FOOTER_PLACEHOLDER_ID,
-    sectionId: FOOTER_BOTTOM_SECTION_ID,
-    label: 'Footer Bottom',
-    widgetSlug: FOOTER_BOTTOM_WIDGET_SLUG,
-    blocks: [
-      {
-        id: FOOTER_BOTTOM_PAYMENTS_BLOCK_ID,
-        type: 'icon-group',
-        label: 'Payment Icons'
-      }
-    ]
-  },
-  {
-    placeholderId: FOOTER_PLACEHOLDER_ID,
-    sectionId: FOOTER_APP_BANNER_SECTION_ID,
-    label: 'App Banner',
-    widgetSlug: FOOTER_APP_BANNER_WIDGET_SLUG,
-    blocks: [
-      {
-        id: FOOTER_APP_BANNER_IMAGE_BLOCK_ID,
-        type: 'image',
-        label: 'App Image'
-      },
-      {
-        id: FOOTER_APP_BANNER_TITLE_BLOCK_ID,
-        type: 'text',
-        label: 'Banner Title'
-      },
-      {
-        id: FOOTER_APP_BANNER_DESCRIPTION_BLOCK_ID,
-        type: 'text',
-        label: 'Banner Description'
-      },
-      {
-        id: FOOTER_APP_BANNER_BUTTONS_BLOCK_ID,
-        type: 'group',
-        label: 'Store Buttons',
-        blocks: [
-          {
-            id: FOOTER_APP_BANNER_APPSTORE_BLOCK_ID,
-            type: 'image',
-            label: 'App Store Button'
-          },
-          {
-            id: FOOTER_APP_BANNER_PLAYSTORE_BLOCK_ID,
-            type: 'image',
-            label: 'Google Play Button'
-          }
-        ]
-      }
-    ]
-  },
-  {
-    placeholderId: FOOTER_PLACEHOLDER_ID,
-    sectionId: FOOTER_VALUE_PROPS_SECTION_ID,
-    label: 'Value Propositions',
-    widgetSlug: FOOTER_VALUE_PROPS_WIDGET_SLUG,
-    blocks: [
-      {
-        id: FOOTER_VALUE_PROPS_LIST_BLOCK_ID,
-        type: 'value-props-list',
-        label: 'Value Props'
-      }
-    ]
-  }
-];
-
-type WidgetAttributes = Record<string, unknown>;
-
-type WidgetData = {
-  attributes?: WidgetAttributes;
-} | null;
-
-type ParsedBlockPayload = {
-  styles?: Record<string, unknown>;
-  properties?: Record<string, unknown>;
-  value?: unknown;
-  [key: string]: unknown;
-};
-
-export function parseWidgetBlockAttributes(
-  widgetData: WidgetData,
-  blockId: string
-): Pick<FooterNativeWidgetBlock, 'styles' | 'properties' | 'value'> {
-  const attributes = widgetData?.attributes;
-  if (!attributes || !(blockId in attributes)) {
-    return {};
-  }
-
-  const attrData = attributes[blockId];
-  let parsed: unknown = attrData;
-
-  if (typeof attrData === 'string') {
-    try {
-      parsed = JSON.parse(attrData);
-    } catch {
-      return { value: attrData };
-    }
-  } else if (
-    typeof attrData === 'object' &&
-    attrData !== null &&
-    'value' in (attrData as Record<string, unknown>)
-  ) {
-    const value = (attrData as { value?: unknown }).value;
-    if (typeof value === 'string') {
-      try {
-        parsed = JSON.parse(value);
-      } catch {
-        return { value };
-      }
-    } else {
-      parsed = value;
-    }
-  }
-
-  if (typeof parsed !== 'object' || parsed === null) {
-    if (typeof parsed === 'string') {
-      return { value: parsed };
-    }
-    return {};
-  }
-
-  const payload = parsed as ParsedBlockPayload;
-  const styles =
-    payload.styles ||
-    // Legacy format where style props live at root
-    (!payload.properties && !('value' in payload) ? payload : undefined);
-
-  return {
-    styles,
-    properties: payload.properties,
-    value: payload.value
-  };
-}

package/app-template/src/views/footer/subscription-settings.ts

@@ -1,122 +0,0 @@
-import {
-  FOOTER_SUBSCRIPTION_SECTION_ID,
-  FOOTER_SUBSCRIPTION_TITLE_BLOCK_ID,
-  FOOTER_SUBSCRIPTION_DESCRIPTION_BLOCK_ID,
-  FOOTER_SUBSCRIPTION_FORM_BLOCK_ID,
-  FOOTER_SUBSCRIPTION_WIDGET_SLUG,
-  type FooterNativeWidgetSection,
-  type FooterNativeWidgetBlock
-} from './native-widget-config';
-
-export type FooterSubscriptionBlockSnapshot = Array<FooterNativeWidgetBlock>;
-
-export const FOOTER_SUBSCRIPTION_DEFAULT_CONTENT = {
-  title: 'Keep up with our latest news',
-  description:
-    'Subscribe to our newsletter to hear about new arrivals before anyone else.'
-} as const;
-
-export const FOOTER_SUBSCRIPTION_BLOCKS = {
-  TITLE: {
-    id: FOOTER_SUBSCRIPTION_TITLE_BLOCK_ID,
-    type: 'text',
-    label: 'Subscription Title'
-  },
-  DESCRIPTION: {
-    id: FOOTER_SUBSCRIPTION_DESCRIPTION_BLOCK_ID,
-    type: 'text',
-    label: 'Subscription Description'
-  },
-  FORM: {
-    id: FOOTER_SUBSCRIPTION_FORM_BLOCK_ID,
-    type: 'group',
-    label: 'Subscription Form'
-  }
-} as const;
-
-const FOOTER_SUBSCRIPTION_BLOCK_LIST = Object.values(
-  FOOTER_SUBSCRIPTION_BLOCKS
-);
-
-const FOOTER_SUBSCRIPTION_BLOCK_ID_SET = new Set<string>(
-  FOOTER_SUBSCRIPTION_BLOCK_LIST.map((block) => block.id)
-);
-
-const createTextValue = (text?: string) => {
-  if (!text) {
-    return undefined;
-  }
-
-  return text;
-};
-
-export function getFooterSubscriptionInitialBlocks(
-  sections: FooterNativeWidgetSection[]
-): FooterSubscriptionBlockSnapshot {
-  const section = sections.find(
-    (item) => item.sectionId === FOOTER_SUBSCRIPTION_SECTION_ID
-  );
-
-  if (!section) {
-    return [];
-  }
-
-  return section.blocks.map((block) => ({
-    id: block.id,
-    type: block.type,
-    label: block.label,
-    styles: block.styles,
-    properties: block.properties,
-    value: block.value
-  }));
-}
-
-type FooterSubscriptionContent = {
-  title?: string;
-  description?: string;
-};
-
-export function mergeFooterSubscriptionContent(
-  blocks: FooterSubscriptionBlockSnapshot,
-  content: FooterSubscriptionContent
-): FooterSubscriptionBlockSnapshot {
-  const blockMap = new Map<string, FooterNativeWidgetBlock>();
-  blocks.forEach((block) => {
-    blockMap.set(block.id, { ...block });
-  });
-
-  const normalizedBlocks = FOOTER_SUBSCRIPTION_BLOCK_LIST.map((config) => {
-    const existing = blockMap.get(config.id) ?? {
-      id: config.id,
-      type: config.type,
-      label: config.label
-    };
-
-    if (existing.value == null) {
-      const fallbackText =
-        config.id === FOOTER_SUBSCRIPTION_TITLE_BLOCK_ID
-          ? content.title
-          : config.id === FOOTER_SUBSCRIPTION_DESCRIPTION_BLOCK_ID
-          ? content.description
-          : undefined;
-
-      const fallbackValue = createTextValue(fallbackText);
-      if (fallbackValue) {
-        return {
-          ...existing,
-          value: fallbackValue
-        };
-      }
-    }
-
-    return existing;
-  });
-
-  const extraBlocks = blocks.filter(
-    (block) => !FOOTER_SUBSCRIPTION_BLOCK_ID_SET.has(block.id)
-  );
-
-  return [...normalizedBlocks, ...extraBlocks];
-}
-
-export { FOOTER_SUBSCRIPTION_WIDGET_SLUG };

package/app-template/src/views/footer/use-footer-logo.ts

@@ -1,162 +0,0 @@
-'use client';
-
-import { useEffect, useRef, useState } from 'react';
-import { useNativeWidgetData } from '@akinon/next/components/theme-editor/hooks/use-native-widget-data';
-import { useGetWidgetQuery } from '@akinon/next/data/client/misc';
-import {
-  defaultFooterLogoSettings,
-  FooterLogoSettings,
-  parseFooterLogoBlockPayload,
-  FOOTER_LOGO_PLACEHOLDER_ID,
-  FOOTER_LOGO_SECTION_ID,
-  FOOTER_LOGO_BLOCK_ID,
-  FOOTER_LOGO_WIDGET_SLUG
-} from './logo-settings';
-
-const THEME_CONFIG_SLUG = 'theme-config';
-
-const BLOCK_META = [
-  { id: FOOTER_LOGO_BLOCK_ID, type: 'image', label: 'Footer Logo' }
-];
-
-type ThemeSettings = {
-  logo?: string;
-};
-
-const parseThemeConfigLogo = (
-  themeSettings?: ThemeSettings
-): Partial<FooterLogoSettings> => {
-  if (!themeSettings?.logo) {
-    return {};
-  }
-  return { src: themeSettings.logo };
-};
-
-export function useFooterLogoSettings(
-  initialSettings?: FooterLogoSettings
-): FooterLogoSettings {
-  const isDesignerRef = useRef(false);
-  const [isDesignerChecked, setIsDesignerChecked] = useState(false);
-
-  useEffect(() => {
-    if (typeof window === 'undefined') return;
-    isDesignerRef.current = window.self !== window.top;
-    setIsDesignerChecked(true);
-  }, []);
-
-  const isDesigner = isDesignerRef.current;
-
-  const { data: themeConfigData } = useGetWidgetQuery(THEME_CONFIG_SLUG, {
-    skip: !isDesignerChecked || isDesigner
-  });
-
-  const widgetData = useNativeWidgetData({
-    widgetSlug: FOOTER_LOGO_WIDGET_SLUG,
-    sectionId: FOOTER_LOGO_SECTION_ID,
-    skip: !isDesignerChecked || isDesigner,
-    blockMeta: BLOCK_META
-  });
-
-  const [settings, setSettings] = useState<FooterLogoSettings>(
-    initialSettings || defaultFooterLogoSettings
-  );
-  const hasInitialSettings = !!initialSettings;
-
-  useEffect(() => {
-    if (!isDesignerChecked) return;
-    if (isDesigner) return;
-    if (hasInitialSettings) return;
-    if (widgetData.isLoading && !themeConfigData) return;
-
-    let nextSettings: FooterLogoSettings = { ...defaultFooterLogoSettings };
-
-    const themeSettingsAttr = themeConfigData?.attributes?.theme_settings;
-    if (themeSettingsAttr) {
-      try {
-        let parsedSettings: ThemeSettings | undefined;
-
-        if (typeof themeSettingsAttr === 'string') {
-          parsedSettings = JSON.parse(themeSettingsAttr) as ThemeSettings;
-        } else if (
-          typeof themeSettingsAttr === 'object' &&
-          'value' in themeSettingsAttr
-        ) {
-          const rawValue = themeSettingsAttr.value;
-          if (typeof rawValue === 'string') {
-            parsedSettings = JSON.parse(rawValue) as ThemeSettings;
-          } else if (rawValue && typeof rawValue === 'object') {
-            parsedSettings = rawValue as ThemeSettings;
-          }
-        } else if (typeof themeSettingsAttr === 'object') {
-          parsedSettings = themeSettingsAttr as ThemeSettings;
-        }
-
-        if (parsedSettings) {
-          nextSettings = {
-            ...nextSettings,
-            ...parseThemeConfigLogo(parsedSettings)
-          };
-        }
-      } catch {
-        // ignore
-      }
-    }
-
-    const block = widgetData.getBlock(FOOTER_LOGO_BLOCK_ID);
-    if (block) {
-      const overrides = parseFooterLogoBlockPayload(block);
-      nextSettings = {
-        ...nextSettings,
-        ...overrides,
-        src: overrides.src ?? nextSettings.src
-      };
-    }
-
-    setSettings(nextSettings);
-  }, [
-    widgetData,
-    themeConfigData,
-    hasInitialSettings,
-    isDesigner,
-    isDesignerChecked
-  ]);
-
-  useEffect(() => {
-    const handleMessage = (event: MessageEvent) => {
-      const { type, data } = event.data || {};
-
-      if (
-        (type === 'UPDATE_THEME' || type === 'LOAD_THEME') &&
-        data?.theme?.placeholders
-      ) {
-        const placeholder = data.theme.placeholders.find(
-          (p: { slug: string }) => p.slug === FOOTER_LOGO_PLACEHOLDER_ID
-        );
-        const section = placeholder?.sections?.find(
-          (s: { id: string }) => s.id === FOOTER_LOGO_SECTION_ID
-        );
-        const block = section?.blocks?.find(
-          (b: { id: string }) => b.id === FOOTER_LOGO_BLOCK_ID
-        );
-
-        if (block) {
-          const overrides = parseFooterLogoBlockPayload(block);
-          if (Object.keys(overrides).length > 0) {
-            setSettings((prev) => ({
-              ...prev,
-              ...overrides,
-              src: overrides.src ?? prev.src
-            }));
-          }
-        }
-      }
-    };
-
-    window.addEventListener('message', handleMessage);
-    return () => window.removeEventListener('message', handleMessage);
-  }, []);
-
-  return settings;
-}
-
-export type { FooterLogoSettings };