@seeka-labs/cli-apps 3.7.0 → 3.8.2

package/dist/ai-context/internal/examples/v2/calendly/app/ui/src/seeka-labs-app-sdk-ui/shared/form/fields/activities/index.tsx

@@ -0,0 +1,188 @@
+import { TrackingActivityNames } from '@seeka-labs-internal/lib-api-app'
+import { forIn, sortBy } from 'lodash-es'
+import { useState } from 'react'
+
+import { Box, Button, Divider, Grid } from '@mui/material'
+
+import { sentenceCaseWithLowercase } from '@/seeka-labs-app-sdk-ui/utils'
+import { getActivityName } from '@seeka-labs/converge'
+import { EventPipelineFilterRow } from '../event-pipeline/filter-row'
+
+export const CustomActivityNameLabelPrefix = 'Custom: '
+export const CustomExactActivityNameLabelPrefix = 'Exact: '
+
+export interface ActivityNameItem {
+    activityName: TrackingActivityNames
+    activityNameCustom?: string
+    label: string
+    key: string
+    activityNameOverride?: string
+}
+export function getActivityNames(
+    excludeActivityNames: TrackingActivityNames[],
+    overrideDefault?: string[],
+    alwaysIncludeDefault = false
+): ActivityNameItem[] {
+    const names: ActivityNameItem[] = []
+    const exclude = [
+        TrackingActivityNames.Undefined,
+        TrackingActivityNames.Custom,
+        TrackingActivityNames.PageViewOrganic,
+        TrackingActivityNames.PageViewUtmAttributed,
+        TrackingActivityNames.FilterItemsByAttribute,
+        TrackingActivityNames.ChangeProductAttribute,
+    ]
+
+    if (overrideDefault && overrideDefault.length > 0) {
+        const excludeAsString = exclude.map((x) => x.toString())
+        const excludeActivityNamesAsString = excludeActivityNames.map((x) => x.toString())
+        for (const value of overrideDefault) {
+            if (
+                excludeAsString.indexOf(value) > -1 ||
+                excludeActivityNamesAsString.indexOf(value) > -1
+            )
+                continue
+
+            const standardActivityName = getActivityName(value);
+            const label = getFriendlyEventName(value);
+
+            names.push({
+                activityName: standardActivityName,
+                activityNameCustom: standardActivityName === TrackingActivityNames.Custom ? value : undefined,
+                key: value,
+                label: standardActivityName === TrackingActivityNames.Custom ? CustomActivityNameLabelPrefix + label : label,
+            })
+        }
+    } else {
+        forIn(overrideDefault || TrackingActivityNames, (value, key) => {
+            if (exclude.indexOf(value) > -1 || excludeActivityNames.indexOf(value) > -1) return
+
+            const standardActivityName = getActivityName(value);
+            const label = getFriendlyEventName(value);
+
+            names.push({
+                activityName: standardActivityName,
+                activityNameCustom: standardActivityName === TrackingActivityNames.Custom ? value : undefined,
+                key: key,
+                label: standardActivityName === TrackingActivityNames.Custom ? CustomActivityNameLabelPrefix + label : label,
+            })
+        })
+    }
+
+    if (alwaysIncludeDefault && overrideDefault) {
+        forIn(TrackingActivityNames, (value, key) => {
+            if (
+                exclude.indexOf(value) > -1 ||
+                excludeActivityNames.indexOf(value) > -1 ||
+                names.find((e) => e.activityName === value)
+            ) {
+                return;
+            }
+
+            const standardActivityName = getActivityName(value);
+            names.push({
+                activityName: standardActivityName,
+                activityNameCustom: standardActivityName === TrackingActivityNames.Custom ? value : undefined,
+                key: key,
+                label: getFriendlyEventName(value),
+            })
+        })
+    }
+
+    return sortBy(names, 'label')
+}
+
+type EventPipelineFilterProps = {
+    excludeActivityNames?: TrackingActivityNames[]
+}
+
+export const EventPipelineFilter = ({
+    excludeActivityNames,
+}: EventPipelineFilterProps) => {
+    const [activityNames, setActivityNames] = useState<ActivityNameItem[]>(
+        getActivityNames(excludeActivityNames || [])
+    )
+    const [sourceDomains, setSourceDomains] = useState<string[]>([
+        'tickets.oztix.com.au',
+    ])
+
+    const [filters, setFilters] = useState<any[]>([{ id: 1 }, { id: 2 }])
+    const [filterCondition, setFilterCondition] = useState<'or' | 'and'>('and')
+
+    const toggleCondition = () => {
+        setFilterCondition(filterCondition === 'and' ? 'or' : 'and')
+    }
+
+    return (
+        <Grid container>
+            {filters.map((filter, index) => (
+                <Box
+                    key={filter.id}>
+                    <EventPipelineFilterRow
+                        activityNames={activityNames}
+                        sourceDomains={sourceDomains}
+                    />
+                    {index < filters.length - 1 && (
+                        <Grid item xs={12}>
+                            <div style={{ textAlign: 'center' }}>
+                                <Divider style={{ marginTop: '20px' }} />
+                                <Button
+                                    variant="text"
+                                    color="primary"
+                                    onClick={toggleCondition}
+                                    style={{ marginTop: '-19px', backgroundColor: 'white' }}
+                                >
+                                    {filterCondition.toUpperCase()}
+                                </Button>{' '}
+                            </div>
+                        </Grid>
+                    )}
+                </Box>
+            ))}
+        </Grid>
+    )
+}
+
+
+export const eventNameMapping = {
+    AddPaymentInfo: 'Add payment info',
+    AddToCart: 'Add to cart',
+    AddToWishlist: 'Add to wishlist',
+    CompleteRegistration: 'Complete registration',
+    Contact: 'Contact',
+    CustomizeProduct: 'Customize product',
+    Donate: 'Donate',
+    FindLocation: 'Find location',
+    InitiateCheckout: 'Initiate checkout',
+    Lead: 'Lead',
+    PageView: 'Page view',
+    Purchase: 'Purchase',
+    Schedule: 'Schedule',
+    Search: 'Search',
+    StartTrial: 'Start trial',
+    SubmitApplication: 'Submit application',
+    Subscribe: 'Subscribe',
+    ViewContent: 'View content',
+    KeywordSearch: 'Keyword search',
+    AddPaymentMethod: 'Add payment method',
+    ViewProduct: 'View product',
+    ViewPage: 'View page',
+    Order: 'Order',
+    ViewContentItem: 'View content item',
+}
+
+export const getFriendlyEventName = (eventName: string, maxLength?: number) => {
+    let mappedEventName =
+        eventName in eventNameMapping
+            ? eventNameMapping[eventName]
+            : sentenceCaseWithLowercase(eventName)
+
+    if (maxLength && maxLength > 0) {
+        const shouldTruncateName = mappedEventName.length >= maxLength
+        mappedEventName = shouldTruncateName
+            ? `${mappedEventName.substring(0, maxLength)}...`
+            : mappedEventName
+    }
+
+    return mappedEventName;
+}

package/dist/ai-context/internal/examples/v2/calendly/app/ui/src/seeka-labs-app-sdk-ui/shared/form/fields/activityNameSelect/index.tsx

@@ -0,0 +1,156 @@
+import { Grid, Typography } from '@mui/material'
+import { TrackingActivityNames } from '@seeka-labs-internal/lib-api-app'
+import { isArray } from 'lodash-es'
+import React from 'react'
+import { ActivityNameItem, getActivityNames } from '../activities'
+import { ActivitySourceActivityNameFilterSelect } from '../activitySourceActivityNameFilterSelect'
+
+export const ActivityNameSelectFieldTypeName = 'activityNameSelect'
+
+const toExclude = [
+    TrackingActivityNames.ViewContentItem,
+    TrackingActivityNames.ViewPage,
+    TrackingActivityNames.ViewProduct,
+    TrackingActivityNames.KeywordSearch,
+]
+
+const loadActivityNameLookupValues = async (
+    existingContext: any,
+    excludeActivityNames: TrackingActivityNames[]
+): Promise<ActivityNameItem[]> => {
+    if (!existingContext.selectedBrand) return getActivityNames(excludeActivityNames)
+
+    const result = await api.general.referenceData.getAllActivityNames(
+        existingContext.selectedBrand.id
+    )
+
+    const names = getActivityNames(
+        excludeActivityNames,
+        result.result && result.result.length > 0 ? result.result : undefined
+    )
+
+    return names
+}
+
+export const LoadActivityNameSelectFieldTypeNameContext = async (
+    existingContext: any,
+    excludeActivityNames: TrackingActivityNames[] = toExclude
+): Promise<any> => {
+    const promises = [loadActivityNameLookupValues(existingContext, excludeActivityNames)]
+    await Promise.all(promises)
+
+    const result = {
+        [ActivityNameSelectFieldTypeName]: {
+            activityNames: await promises[0],
+        },
+    }
+
+    return result
+}
+
+type ActivityNameSelectFieldProps = FieldProps & {
+    overrideId?: string
+}
+
+export class ActivityNameSelectField extends React.Component<ActivityNameSelectFieldProps> {
+    constructor(props: FieldProps) {
+        super(props)
+        const multi =
+            props.uiSchema && props.uiSchema['ui:options']
+                ? props.uiSchema['ui:options']['multiple'] === true || false
+                : false
+
+        this.state = {
+            values: props.formData ? (!multi ? [props.formData] : props.formData) : [],
+        }
+    }
+
+    render() {
+        // console.log('heree this.props.uiSchema', this.props.uiSchema)
+        const prefix =
+            this.props.uiSchema && this.props.uiSchema['ui:options']
+                ? this.props.uiSchema['ui:options']['prefix'] as string || null
+                : null
+        const suffix =
+            this.props.uiSchema && this.props.uiSchema['ui:options']
+                ? this.props.uiSchema['ui:options']['suffix'] as string || null
+                : null
+        const multiple =
+            this.props.uiSchema && this.props.uiSchema['ui:options']
+                ? this.props.uiSchema['ui:options']['multiple'] === true || false
+                : false
+        const label =
+            this.props.schema && this.props.schema.title ? this.props.schema.title : null
+        return (
+            <Grid container={true} alignItems="center" style={{ width: '100%' }}>
+                {prefix && (
+                    <Grid item={true}>
+                        <Typography
+                            variant="body1"
+                            style={{ display: 'inline-block', marginRight: '10px', marginTop: '4px' }}
+                        >
+                            {prefix}
+                        </Typography>
+                    </Grid>
+                )}
+                <Grid item={true}>
+                    <ActivitySourceActivityNameFilterSelect
+                        activityNames={
+                            this.props.formContext.fieldContext[ActivityNameSelectFieldTypeName]
+                                ?.activityNames || []
+                        }
+                        width="600px"
+                        noMargin
+                        label={!prefix && !suffix && label ? label : undefined}
+                        multiple={multiple}
+                        selectedActivityNamesString={(this.state as any).values}
+                        error={Boolean(this.props.rawErrors && this.props.rawErrors.length > 0)}
+                        onChange={(newValue) => {
+                            let newVal: string | null | string[] = null;
+                            if (multiple) {
+                                if (!newValue) {
+                                    newVal = []
+                                }
+                                else if (isArray(newValue)) {
+                                    newVal = [...(newValue as ActivityNameItem[]).map(e => e.key)]
+                                }
+                                else {
+                                    newVal = [(newValue as ActivityNameItem).key];
+                                }
+                            }
+                            else {
+                                if (!newValue) {
+                                    newVal = null
+                                }
+                                else if (isArray(newValue)) {
+                                    newVal = (newValue as ActivityNameItem[])[0].key
+                                }
+                                else {
+                                    newVal = (newValue as ActivityNameItem).key
+                                }
+                            }
+
+                            this.setState({ values: newVal }, () => {
+                                const currentState: string | null | string[] = (this.state as any).values;
+                                // console.log('heree newValue', newValue, currentState, multiple)
+
+                                this.props.onChange(newVal)
+                            })
+                        }}
+                        id={this.props.overrideId || `activityName_${this.props.idSchema.$id}`}
+                    />
+                </Grid>
+                {suffix && (
+                    <Grid item={true}>
+                        <Typography
+                            variant="body1"
+                            style={{ display: 'inline-block', marginLeft: '10px', marginTop: '4px' }}
+                        >
+                            {suffix}
+                        </Typography>
+                    </Grid>
+                )}
+            </Grid>
+        )
+    }
+}

package/dist/ai-context/internal/examples/v2/calendly/app/ui/src/seeka-labs-app-sdk-ui/shared/form/fields/activitySourceActivityNameFilterSelect/index.tsx

@@ -0,0 +1,247 @@
+import { TrackingActivityNames } from '@seeka-labs-internal/lib-api-app';
+import { useMemo, useState } from 'react';
+
+
+import { RhfAutocomplete, RhfAutocompleteOption } from '@seeka-labs-internal/lib-react-common';
+import { getActivityName } from '@seeka-labs/converge';
+import { isArray } from 'lodash-es';
+import { useFormContext } from 'react-hook-form';
+import { ActivityNameItem, CustomActivityNameLabelPrefix, CustomExactActivityNameLabelPrefix } from '../activities';
+type ActivitySourceActivityNameFilterSelectProps = {
+    // error: boolean
+    activityNames: ActivityNameItem[]
+    name: string
+    multiple?: boolean
+    noMargin?: boolean
+    // blurOnSelect?: boolean
+    width?: string
+    label?: string
+    // onChange?: (activityNames: ActivityNameItem[] | ActivityNameItem) => void
+    // selectedActivityNames?: ActivityNameItem[] | ActivityNameItem | null
+    selectedActivityNamesString?: string[] | string | null
+    allowActivityNameOverride?: boolean
+}
+
+const getCustomOption = (inputValue: string, prefix: boolean): ActivityNameItem => ({
+    activityName: TrackingActivityNames.Custom,
+    activityNameCustom: inputValue,
+    key: inputValue,
+    label: `${prefix ? CustomActivityNameLabelPrefix : ''}${inputValue}`,
+})
+
+
+const getCustomActivityOverrideOption = (inputValue: string, prefix: boolean): ActivityNameItem => {
+    const standardActivityName = getActivityName(inputValue);
+    return {
+        activityName: standardActivityName,
+        activityNameCustom: standardActivityName === TrackingActivityNames.Custom ? inputValue : undefined,
+        key: inputValue,
+        activityNameOverride: inputValue,
+        label: `${prefix ? CustomExactActivityNameLabelPrefix : ''}${inputValue}`,
+    }
+}
+
+export const ActivitySourceActivityNameFilterSelect = ({
+    activityNames,
+    // error,
+    // selectedActivityNames,
+    multiple,
+    // label,
+    noMargin,
+    // blurOnSelect,
+    width,
+    label,
+    name,
+    // onChange,
+    allowActivityNameOverride,
+    selectedActivityNamesString,
+}: ActivitySourceActivityNameFilterSelectProps) => {
+
+    const methods = useFormContext();
+    const { control, handleSubmit, watch, formState: { errors, isValid, isDirty } } = methods
+    // const formValueState = watch(name as string)
+
+    const [selectedValueState, setSelectedValueState] = useState<ActivityNameItem[] | ActivityNameItem>(multiple ? [] : null as any)
+        // const [selectedValueState, setSelectedValueState] = useState<ActivityNameItem[] | ActivityNameItem>(multiple ? [] : null as any)
+
+        // const selectedValues = useMemo(() => {
+        //   return enumerateSelected() as ActivityNameItem[] | ActivityNameItem
+        // }, [selectedActivityNames, selectedActivityNamesString, activityNames])
+        ;
+
+    // useEffect(() => {
+    //     setSelectedValueState(formValueState)
+    // }, [formValueState])
+
+    const activityNameOptions: RhfAutocompleteOption[] = useMemo(() => {
+        let selectedState: ActivityNameItem[];
+        if (selectedValueState) {
+            if (isArray(selectedValueState)) {
+                selectedState = selectedValueState
+            }
+            else {
+                selectedState = [selectedValueState]
+            }
+        }
+        else {
+            selectedState = []
+        }
+        // if (!selectedValueState) return activityNames;
+
+        const newActivityNames = [...activityNames];
+
+        selectedState.forEach(e => {
+            if (!newActivityNames.find(a => a.key.toLowerCase() === e.key.toLowerCase())) {
+                newActivityNames.push(e)
+            }
+        })
+
+        // Handle default string values
+        if (selectedActivityNamesString) {
+            if (isArray(selectedActivityNamesString)) {
+                selectedActivityNamesString.forEach(e => {
+                    if (!newActivityNames.find(a => a.key.toLowerCase() === e.toLowerCase())) {
+                        newActivityNames.push(getCustomOption(e, true))
+                    }
+                })
+            }
+            else {
+                // console.log('heree selectedActivityNamesString', selectedActivityNamesString)
+                const toFind = selectedActivityNamesString?.toLowerCase()
+                if (!newActivityNames.find(a => a.key.toLowerCase() === toFind)) {
+                    newActivityNames.push(getCustomOption(selectedActivityNamesString, true))
+                }
+            }
+        }
+        // console.log('heree newActivityNames', newActivityNames)
+
+        return newActivityNames.map(e => ({
+            title: e.label,
+            inputValue: e.key,
+            isCustomInputValue: Boolean(e.activityNameCustom)
+        }));
+    }, [activityNames, selectedValueState, selectedActivityNamesString])
+
+    // const enumerateSelected = (): ActivityNameItem[] | ActivityNameItem | null => {
+    //     if (selectedActivityNames) {
+    //         if (isArray(selectedActivityNames)) {
+    //             if (multiple) {
+    //                 return selectedActivityNames
+    //             }
+    //             else {
+    //                 if (selectedActivityNames.length > 0) {
+    //                     return selectedActivityNames[0]
+    //                 }
+    //                 else {
+    //                     return null
+    //                 }
+    //             }
+    //         }
+    //         else {
+    //             if (multiple) {
+    //                 return [selectedActivityNames]
+    //             }
+    //             else {
+    //                 return selectedActivityNames
+    //             }
+    //         }
+    //     }
+
+    //     if (selectedActivityNamesString) {
+    //         const toFind = (isArray(selectedActivityNamesString) ? selectedActivityNamesString : [selectedActivityNamesString]).map(e => e?.toLowerCase()).filter(Boolean)
+
+    //         const vals = activityNameOptions?.filter(e => toFind.find(a => a === e.key?.toLowerCase() || a === e.activityName?.toString()?.toLowerCase())) || []
+
+    //         // console.log('heree toFind', toFind, activityNameOptions, vals)
+    //         return multiple ? [...vals] : (vals.length > 0 ? { ...vals[0] } : null)
+    //     }
+
+    //     return multiple ? [] : null
+    // }
+
+    // const isOptionEqualToValue = (option: ActivityNameItem, value: ActivityNameItem) => {
+    //     if (!option.activityNameOverride && !value.activityNameOverride) {
+    //         return option.key.toLowerCase() === value.key.toLowerCase()
+    //     }
+    //     return option.key.toLowerCase() === value.key.toLowerCase() && option.activityNameOverride === value.activityNameOverride
+    // }
+
+    // useEffect(() => {
+    //     setSelectedValueState(enumerateSelected() as ActivityNameItem[] | ActivityNameItem)
+    // }, [])
+
+    if (selectedActivityNamesString) {
+        // console.log('heree selectedActivityNamesString', selectedValueState, selectedActivityNamesString, activityNameOptions)
+    }
+    else {
+        // console.log('heree selectedActivityNames', selectedValueState, selectedActivityNames, activityNameOptions)
+    }
+
+    // console.log('heree this.state.value', activityNameOptions, selectedValueState, multiple)
+
+    return (
+        (<>
+            {/* {JSON.stringify({ selectedValueState, val: watch(name as string) })} */}
+            <RhfAutocomplete
+                name={name}
+                disableClearable
+                options={activityNameOptions}
+                // handleHomeEndKeys
+                multiple={multiple}
+                freeSoloOptionPrefix='Custom event'
+                label={label}
+                // autoFocus
+                // blurOnSelect={blurOnSelect}
+                //   freeSolo
+                sx={{
+                    display: 'inline-block',
+                    width: !width ? '220px' : width,
+                    marginLeft: !noMargin ? '10px' : undefined,
+                }}
+                // getOptionLabel={(option) => lookupActivityName(option.key).label}
+                // getOptionLabel={(option) => {
+                //     return (option as ActivityNameItem).label
+                // }}
+                // isOptionEqualToValue={isOptionEqualToValue}
+                freeSolo={allowActivityNameOverride}
+            // filterOptions={(options, params) => {
+            //     const inputValLower = params.inputValue.toLowerCase();
+            //     const filtered = options.filter((e) =>
+            //         e.label.toLowerCase().includes(inputValLower) || e.key.toLowerCase().includes(inputValLower)
+            //     )
+
+            //     // Suggest the creation of a new value
+            //     if (params.inputValue !== '' && getActivityName(params.inputValue) === TrackingActivityNames.Custom) {
+            //         filtered.push(getCustomOption(params.inputValue, true))
+            //     }
+            //     if (params.inputValue !== '' && allowActivityNameOverride) {
+            //         filtered.push(getCustomActivityOverrideOption(params.inputValue, true))
+            //     }
+
+            //     return filtered
+            // }}
+            // value={selectedValueState}
+            // onChange={(_e, value) => {
+            //     // console.log('heree onchange', value)
+            //     setSelectedValueState(value)
+            //     if (onChange) {
+            //         onChange(value)
+            //     }
+            // }}
+            // renderInput={(params) => (
+            //     <TextField
+            //         {...params}
+            //         margin="normal"
+            //         error={error}
+            //         size="small"
+            //         label={label}
+            //         variant="standard"
+            //         slotProps={{
+            //             input: { ...params.InputProps, type: 'text' }
+            //         }}
+            //     />
+            // )}
+            />
+        </>)
+    );
+}