@designcrowd/library.brand-page 5.17.6 → 5.17.7

package/src/metadata-builder/parsers/section-tool-arguments.ts

@@ -0,0 +1,417 @@
+/**
+ * Typed interfaces for website builder section tool arguments.
+ *
+ * Canonical reference: service.ai-pipelines/src/agents/website/section_schemas.py
+ * Every field defined there has a corresponding TS field here.
+ */
+
+import type { ContentType } from '../../brand-page/models';
+
+// ---------------------------------------------------------------------------
+// Section type — the subset of ContentType the AI builder supports
+// ---------------------------------------------------------------------------
+
+/** Content types not supported by the AI builder. */
+type UnsupportedContentType =
+  | 'logo'
+  | 'video'
+  | 'map'
+  | 'request-payment'
+  | 'support-me'
+  | 'shop-section'
+  | 'booking-section';
+
+export type SectionType = Exclude<ContentType, UnsupportedContentType>;
+
+// ---------------------------------------------------------------------------
+// Shared style type (matches TEXT_STYLE_SCHEMA in section_schemas.py)
+// ---------------------------------------------------------------------------
+
+export interface TextStyleArguments {
+  fontSize?: string | null;
+  color?: string | null;
+  fontWeight?: string | null;
+  fontStyle?: string | null;
+  textAlign?: string | null;
+  textDecoration?: string | null;
+  backgroundColor?: string | null;
+  letterSpacing?: number | null;
+  lineHeight?: number | null;
+  fontFamily?: string | null;
+}
+
+export interface BackgroundStyleArguments {
+  backgroundColor?: string | null;
+}
+
+export interface CardStyleArguments {
+  backgroundColor?: string | null;
+  borderRadius?: string | null;
+  borderColor?: string | null;
+}
+
+// ---------------------------------------------------------------------------
+// Per-section argument interfaces
+// ---------------------------------------------------------------------------
+
+export interface ProfileSectionArguments {
+  name?: string;
+  title?: string;
+  description?: string;
+  avatar_image_url?: string;
+}
+
+export interface TextSectionItem {
+  /** 0-based index of existing item to update in-place */
+  item_index?: number;
+  /** 0-based position to insert a new item at */
+  insert_at?: number;
+  text?: string;
+  text_style?: TextStyleArguments;
+}
+
+export interface TextSectionArguments {
+  /** Single text field (BrandPage/BrandContact or shorthand for first item) */
+  text?: string;
+  text_style?: TextStyleArguments;
+  /** Multiple text items (BrandSite) */
+  items?: TextSectionItem[];
+  _replace_items?: boolean;
+  /** 0-based indices of items to remove */
+  _remove_item_indices?: number[];
+  /** New order as array of current 0-based indices */
+  _reorder_items?: number[];
+}
+
+export interface ImageSectionArguments {
+  image_url?: string;
+  image_title?: string;
+}
+
+export interface ImageGalleryItem {
+  /** 0-based index of existing item to update in-place */
+  item_index?: number;
+  /** 0-based position to insert a new item at */
+  insert_at?: number;
+  image_url?: string;
+  caption?: string;
+}
+
+export interface ImageGallerySectionArguments {
+  images?: ImageGalleryItem[];
+  gallery_type?: 'grid' | 'carousel' | 'masonry';
+  _replace_items?: boolean;
+  /** 0-based indices of items to remove */
+  _remove_item_indices?: number[];
+  /** New order as array of current 0-based indices */
+  _reorder_items?: number[];
+}
+
+export interface GeneralLinkSectionArguments {
+  title?: string;
+  url?: string;
+  icon_image_url?: string;
+}
+
+export interface WebsiteSectionArguments {
+  title?: string;
+  url?: string;
+  icon_image_url?: string;
+}
+
+export interface EmailSectionArguments {
+  title?: string;
+  email?: string;
+  icon_image_url?: string;
+}
+
+export interface PhoneSectionArguments {
+  title?: string;
+  phone_number?: string;
+  icon_image_url?: string;
+}
+
+export interface FacebookSectionArguments {
+  title?: string;
+  url?: string;
+}
+
+export interface XSectionArguments {
+  title?: string;
+  url?: string;
+}
+
+export interface InstagramSectionArguments {
+  title?: string;
+  url?: string;
+}
+
+export interface YoutubeSectionArguments {
+  title?: string;
+  url?: string;
+}
+
+export interface LinkedinSectionArguments {
+  title?: string;
+  url?: string;
+}
+
+export interface PinterestSectionArguments {
+  title?: string;
+  url?: string;
+}
+
+export interface TwitchSectionArguments {
+  title?: string;
+  url?: string;
+}
+
+export interface TiktokSectionArguments {
+  title?: string;
+  url?: string;
+}
+
+export interface SocialLink {
+  /** 0-based index of existing item to update in-place */
+  item_index?: number;
+  /** 0-based position to insert a new item at */
+  insert_at?: number;
+  platform?:
+    | 'facebook'
+    | 'x'
+    | 'instagram'
+    | 'youtube'
+    | 'linkedin'
+    | 'pinterest'
+    | 'twitch'
+    | 'tiktok';
+  url?: string;
+}
+
+export interface SocialLinksSectionArguments {
+  links?: SocialLink[];
+  icon_style?: 'none' | 'square' | 'circle';
+  _replace_items?: boolean;
+  /** 0-based indices of items to remove */
+  _remove_item_indices?: number[];
+  /** New order as array of current 0-based indices */
+  _reorder_items?: number[];
+}
+
+export interface MailingListSectionArguments {
+  title?: string;
+  button_text?: string;
+}
+
+export interface ContactFormFieldToggle {
+  /** Field ID matching FORM_FIELD_IDS (e.g., 'firstName', 'lastName', 'phoneNumber', 'message') */
+  field_id: string;
+  /** Whether the field is shown on the form */
+  enabled: boolean;
+}
+
+export interface ContactFormSectionArguments {
+  title?: string;
+  description?: string;
+  button_text?: string;
+  success_message?: string;
+  response_email?: string;
+  header_image_url?: string;
+  display_style?: 'preview' | 'collapsed';
+  layout_style?:
+    | 'center-card-aligned'
+    | 'centered'
+    | 'text-only'
+    | 'center-card-aligned-image'
+    | 'left-aligned-full-image'
+    | 'right-aligned-full-image';
+  title_style?: TextStyleArguments;
+  description_style?: TextStyleArguments;
+  button_text_style?: TextStyleArguments;
+  /** Toggle visibility of form fields */
+  fields?: ContactFormFieldToggle[];
+}
+
+export interface BannerSectionArguments {
+  title?: string;
+  description?: string;
+  button_text?: string;
+  button_url?: string;
+  background_image_url?: string;
+  display_style?:
+    | 'left-aligned'
+    | 'right-aligned'
+    | 'centered'
+    | 'big-image'
+    | 'left-aligned-big-image'
+    | 'right-aligned-full-image'
+    | 'left-aligned-full-image'
+    | 'center-card-aligned-image'
+    | 'left-card-aligned-image';
+  title_style?: TextStyleArguments;
+  description_style?: TextStyleArguments;
+  button_text_style?: TextStyleArguments;
+}
+
+export interface AboutSectionArguments {
+  title?: string;
+  paragraph?: string;
+  about_image_url?: string;
+  display_style?:
+    | 'left-aligned'
+    | 'right-aligned'
+    | 'centered'
+    | 'text-only'
+    | 'left-aligned-full-image'
+    | 'right-aligned-full-image';
+  title_style?: TextStyleArguments;
+  paragraph_style?: TextStyleArguments;
+}
+
+export interface ImagesSectionItem {
+  /** 0-based index of existing item to update in-place */
+  item_index?: number;
+  /** 0-based position to insert a new item at */
+  insert_at?: number;
+  image_url?: string;
+  heading?: string;
+  text?: string;
+}
+
+export interface ImagesSectionArguments {
+  title?: string;
+  description?: string;
+  items?: ImagesSectionItem[];
+  display_style?:
+    | 'left-aligned'
+    | 'right-aligned'
+    | 'centered'
+    | 'media-only'
+    | 'center-card-aligned-image'
+    | 'alternate-image';
+  _replace_items?: boolean;
+  /** 0-based indices of items to remove */
+  _remove_item_indices?: number[];
+  /** New order as array of current 0-based indices */
+  _reorder_items?: number[];
+  title_style?: TextStyleArguments;
+  description_style?: TextStyleArguments;
+  heading_style?: TextStyleArguments;
+  paragraph_style?: TextStyleArguments;
+  aspect_ratio?: string;
+  are_images_full_width?: boolean;
+  background_style?: BackgroundStyleArguments;
+  card_style?: CardStyleArguments;
+}
+
+export interface TestimonialItem {
+  /** 0-based index of existing item to update in-place */
+  item_index?: number;
+  /** 0-based position to insert a new item at */
+  insert_at?: number;
+  testimonial?: string;
+  name?: string;
+  position?: string;
+  avatar_image_url?: string;
+}
+
+export interface TestimonialSectionArguments {
+  title?: string;
+  items?: TestimonialItem[];
+  display_style?: 'centered' | 'big-image' | 'columns';
+  _replace_items?: boolean;
+  /** 0-based indices of items to remove */
+  _remove_item_indices?: number[];
+  /** New order as array of current 0-based indices */
+  _reorder_items?: number[];
+  title_style?: TextStyleArguments;
+  testimonial_style?: TextStyleArguments;
+  name_style?: TextStyleArguments;
+  position_style?: TextStyleArguments;
+  background_style?: BackgroundStyleArguments;
+  card_style?: CardStyleArguments;
+}
+
+export interface ShapesSectionItem {
+  /** 0-based index of existing item to update in-place */
+  item_index?: number;
+  /** 0-based position to insert a new item at */
+  insert_at?: number;
+  icon_image_url?: string;
+  shape_url?: string;
+  keep_color?: boolean;
+  heading?: string;
+  text?: string;
+}
+
+export interface ShapesSectionArguments {
+  title?: string;
+  description?: string;
+  items?: ShapesSectionItem[];
+  display_style?:
+    | 'left-aligned'
+    | 'right-aligned'
+    | 'centered'
+    | 'media-only'
+    | 'center-card-aligned-image'
+    | 'alternate-image';
+  _replace_items?: boolean;
+  /** 0-based indices of items to remove */
+  _remove_item_indices?: number[];
+  /** New order as array of current 0-based indices */
+  _reorder_items?: number[];
+  title_style?: TextStyleArguments;
+  description_style?: TextStyleArguments;
+  heading_style?: TextStyleArguments;
+  paragraph_style?: TextStyleArguments;
+  size?: string;
+  background_style?: BackgroundStyleArguments;
+  card_style?: CardStyleArguments;
+}
+
+export interface DividerSectionArguments {
+  divider_style?: 'none' | 'thin' | 'thick';
+}
+
+// ---------------------------------------------------------------------------
+// Discriminated union of all per-section argument types (content fields only)
+// ---------------------------------------------------------------------------
+
+export type SectionToolArguments =
+  | ProfileSectionArguments
+  | TextSectionArguments
+  | ImageSectionArguments
+  | ImageGallerySectionArguments
+  | GeneralLinkSectionArguments
+  | WebsiteSectionArguments
+  | EmailSectionArguments
+  | PhoneSectionArguments
+  | FacebookSectionArguments
+  | XSectionArguments
+  | InstagramSectionArguments
+  | YoutubeSectionArguments
+  | LinkedinSectionArguments
+  | PinterestSectionArguments
+  | TwitchSectionArguments
+  | TiktokSectionArguments
+  | SocialLinksSectionArguments
+  | MailingListSectionArguments
+  | ContactFormSectionArguments
+  | BannerSectionArguments
+  | AboutSectionArguments
+  | ImagesSectionArguments
+  | TestimonialSectionArguments
+  | ShapesSectionArguments
+  | DividerSectionArguments;
+
+// ---------------------------------------------------------------------------
+// Outer tool call shape — common routing fields + nested section arguments
+// ---------------------------------------------------------------------------
+
+export interface SectionToolCallShape {
+  mode: 'create' | 'update';
+  type: string;
+  content_id?: string;
+  page_id?: string;
+  arguments: SectionToolArguments;
+}

package/src/shared/side-bar/components/SideBar.mixin.ts

@@ -9,6 +9,7 @@ import {
 } from '@brand-page-maker/stores';
 import { SIDE_BAR_CONTENT_ID } from '../../content-settings/constants';
 import { useUiContentSettingsStore } from '../../content-settings/store';
+import { SIDE_BAR_TAB_NAMES } from '@src/brand-page-maker/constants/sidebar-constant';
 
 export default defineComponent({
   props: {
@@ -47,6 +48,11 @@ export default defineComponent({
       'side-bar-content': ref(null),
       isPrepurchase: computed(() => brandPageContainerStore.isPrePurchase),
       isBrandPageLoaded: computed(() => brandPageMakerStore.isBrandPageLoaded),
+      isAiWebsiteAssistantVisible: computed(
+        () =>
+          brandPageContainerStore.abTests.bp_5245_ai_website_assistant
+            ?.isVariation,
+      ),
     };
   },
   data: () => ({ SIDE_BAR_CONTENT_ID, sideBarContentRef: 'side-bar-content' }),
@@ -101,6 +107,10 @@ export default defineComponent({
         return false;
       }
 
+      if (tab.name === SIDE_BAR_TAB_NAMES.AI_WEBSITE_BUILDER) {
+        return this.isAiWebsiteAssistantVisible;
+      }
+
       return tab.isVisible;
     },
     contentScrollToTop() {