@integry/sdk 4.7.39 → 4.7.40

package/src/components/form/ObjectField/index.ts.test.tsx

@@ -1,213 +0,0 @@
-// ```bash
-// npm install vitest @testing-library/preact @testing-library/user-event --save-dev
-// ```
-
-import { describe, it, expect, vi } from 'vitest';
-import { render, fireEvent, screen } from '@testing-library/preact';
-import userEvent from '@testing-library/user-event';
-import '@testing-library/jest-dom/vitest';
-import { ObjectField } from './index';
-
-// Mock components and styles if necessary
-vi.mock('@/components/Input', () => ({ Input: () => <div>Input</div> }));
-vi.mock('@/components/TextArea', () => ({
-  TextArea: () => <div>TextArea</div>,
-}));
-vi.mock('@/components/CheckboxGroup', () => ({
-  CheckboxGroup: () => <div>CheckboxGroup</div>,
-}));
-vi.mock('@/components/ConfigureFieldWrapper', () => ({
-  default: ({ children }: { children: React.ReactNode }) => (
-    <div>{children}</div>
-  ),
-}));
-vi.mock('@/components/MultipurposeField/Dropdown', () => ({
-  ListBox: () => <div>ListBox</div>,
-}));
-vi.mock('@/components/MultipurposeField', () => ({
-  MultipurposeField: () => <div>MultipurposeField</div>,
-}));
-vi.mock('./styles.module.scss', () => ({
-  objectContainer: 'objectContainer',
-  objectFieldWrap: 'objectFieldWrap',
-  label: 'label',
-  subLabel: 'subLabel',
-  removeButton: 'removeButton',
-}));
-
-describe('ObjectField Component', () => {
-  const mockOnChange = vi.fn();
-  const mockOnChangeInFlow = vi.fn();
-  const mockApiHandler = vi.fn();
-
-  const baseProps = {
-    field: {
-      title: 'Test Field',
-      description: 'Test Description',
-      template_fields: [],
-      type: 'TEXTFIELD',
-      properties: {},
-    },
-    functionArguments: {},
-    connectedAccount: 'test-account',
-    appName: 'Test App',
-    onChange: mockOnChange,
-    onChangeInFlow: mockOnChangeInFlow,
-    apiHandler: mockApiHandler,
-    activityOutputData: {},
-    activityOutputDataRaw: {},
-  };
-
-  it('renders without crashing', () => {
-    const { container } = render(<ObjectField {...baseProps} />);
-    expect(container).toBeInTheDocument();
-  });
-
-  it('calls onChange when input changes', async () => {
-    const user = userEvent.setup();
-    render(<ObjectField {...baseProps} />);
-    const input = screen.getByRole('textbox');
-    await user.type(input, 'New Value');
-    expect(mockOnChange).toHaveBeenCalled();
-  });
-
-  it('conditionally renders add more button based on isArray prop', () => {
-    const { rerender } = render(<ObjectField {...baseProps} isArray={true} />);
-    expect(screen.queryByText('+ Add another Test Field')).toBeInTheDocument();
-
-    rerender(<ObjectField {...baseProps} isArray={false} />);
-    expect(
-      screen.queryByText('+ Add another Test Field'),
-    ).not.toBeInTheDocument();
-  });
-
-  it('handles array of objects and adds more on button click', async () => {
-    const user = userEvent.setup();
-    render(<ObjectField {...baseProps} isArray={true} />);
-    await user.click(screen.getByText('+ Add another Test Field'));
-    expect(screen.getAllByText('Test Field').length).toBe(2);
-  });
-
-  it('removes an item from the list when delete is clicked', async () => {
-    const user = userEvent.setup();
-    render(
-      <ObjectField {...baseProps} isArray={true} objectValue={[{}, {}]} />,
-    );
-    expect(screen.getAllByText('Test Field').length).toBe(2);
-    await user.click(screen.getAllByRole('button')[0]); // Assuming the delete button is the first button
-    expect(screen.getAllByText('Test Field').length).toBe(1);
-  });
-
-  it('validates props and throws if required props are missing', () => {
-    const consoleError = vi.spyOn(console, 'error');
-    consoleError.mockImplementation(() => {});
-
-    expect(() => render(<ObjectField />)).toThrow();
-    expect(consoleError).toHaveBeenCalled();
-
-    consoleError.mockRestore();
-  });
-
-  it('renders with minimal props', () => {
-    const { container } = render(
-      <ObjectField field={{}} onChange={vi.fn()} apiHandler={vi.fn()} />,
-    );
-    expect(container).toMatchSnapshot();
-  });
-
-  it('handles add more fields', async () => {
-    const onChange = vi.fn();
-    render(
-      <ObjectField
-        field={{ title: 'Test Field', isArray: true }}
-        onChange={onChange}
-        apiHandler={vi.fn()}
-      />,
-    );
-    const addButton = screen.getByText('+ Add another Test Field');
-    await fireEvent.click(addButton);
-    expect(screen.getAllByText('Test Field').length).toBe(2);
-  });
-
-  it('handles field changes', async () => {
-    const onChange = vi.fn();
-    const field = {
-      title: 'Number Field',
-      isArray: true,
-      properties: {
-        numberField: {
-          meta: {
-            title: 'Number',
-            ui: { ui_field: { type: 'TEXTFIELD' } },
-            is_required: true,
-          },
-          type: 'number',
-        },
-      },
-    };
-    render(
-      <ObjectField field={field} onChange={onChange} apiHandler={vi.fn()} />,
-    );
-    const input = screen.getByTitle('Number');
-    await fireEvent.change(input, { target: { value: '123' } });
-    expect(onChange).toHaveBeenCalledWith(
-      expect.anything(),
-      '123',
-      expect.anything(),
-      true,
-      expect.anything(),
-      expect.anything(),
-    );
-  });
-
-  it('renders a textarea when no fields are provided', () => {
-    const field = { type: 'TEXTAREA' };
-    const { container } = render(
-      <ObjectField field={field} onChange={vi.fn()} apiHandler={vi.fn()} />,
-    );
-    expect(container.querySelector('textarea')).not.toBeNull();
-  });
-
-  it('renders nested fields correctly', () => {
-    const field = {
-      properties: {
-        nestedField: {
-          meta: {
-            title: 'Nested Field',
-            ui: { ui_field: { type: 'CHECKBOX' } },
-            is_required: false,
-          },
-        },
-      },
-    };
-    render(
-      <ObjectField field={field} onChange={vi.fn()} apiHandler={vi.fn()} />,
-    );
-    expect(screen.getByText('CheckboxGroup')).toBeInTheDocument();
-  });
-  it('handles empty array as objectValue gracefully', () => {
-    render(
-      <ObjectField
-        field={{}}
-        onChange={vi.fn()}
-        apiHandler={vi.fn()}
-        objectValue={[]}
-      />,
-    );
-    expect(screen.getByText('+ Add another')).toBeInTheDocument();
-  });
-
-  it('handles null objectValue without crashing', () => {
-    render(
-      <ObjectField
-        field={{}}
-        onChange={vi.fn()}
-        apiHandler={vi.fn()}
-        objectValue={null}
-      />,
-    );
-    expect(screen.queryByText('TextArea')).toBeNull(); // Assuming TextArea is not rendered by default
-  });
-
-  // Additional tests can be added here to cover more complex interactions and edge cases
-});

package/src/components/form/ObjectField/styles.module.scss

@@ -1,103 +0,0 @@
-.inputGroupWrapper {
-  fieldset {
-    padding: 0;
-    margin: 0;
-    border: none;
-    margin-bottom: 24px;
-  }
-  .readonlyHint {
-    width: 100%;
-    height: -webkit-fill-available;
-    z-index: 99;
-    position: absolute;
-  }
-}
-.objectContainer {
-  margin-bottom: 20px;
-  .objectFieldWrap {
-    border-top: 1px solid #e2e0db;
-    padding-top: 20px;
-  }
-
-  legend {
-    font-size: 12px;
-    padding-left: 0; /* Remove padding on the left */
-    margin-left: 0; /* Remove margin on the left */
-    border-left: none; /* Remove the default left border */
-    width: auto;
-  }
-  hr {
-    border: none;
-    height: 1px;
-    background-color: #e2e0db;
-  }
-  a {
-    color: #007bff;
-    text-decoration: none;
-    font-size: 12px;
-    &:hover {
-      text-decoration: underline;
-      cursor: pointer;
-    }
-  }
-  .label {
-    margin-bottom: 15px;
-    .subLabel {
-      display: block;
-      margin-bottom: 0;
-
-      > div:first-child {
-        color: #000;
-        font-family: Inter;
-        font-size: 12px;
-        font-style: normal;
-        font-weight: 400;
-        line-height: normal;
-        margin-bottom: 3px;
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-
-        .tagSpan {
-          margin-left: 10px;
-        }
-        .refreshIcon {
-          margin-left: 8px;
-          cursor: pointer;
-        }
-      }
-      > div:nth-child(2) {
-        color: var(--black-and-grey-draft-and-tooltip-desc, #999);
-        font-family: Inter;
-        font-size: 12px;
-        font-style: normal;
-        font-weight: 400;
-        line-height: normal;
-        margin-bottom: 8px;
-      }
-    }
-    .required {
-      color: #333;
-      font-size: 16px;
-      margin-left: 2px;
-    }
-    .removeButton {
-      background: none;
-      border: none;
-      color: #999999; /* Red color */
-      cursor: pointer;
-      font-size: 18px; /* Size of the delete icon */
-      padding: 0;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      margin-right: 10px;
-      margin-left: auto;
-      margin-right: 0px;
-    }
-
-    .removeButton:hover {
-      color: #999999; /* Darker red on hover */
-    }
-  }
-}

package/src/components/form/index.ts

@@ -1,4 +0,0 @@
-import { ObjectField, ObjectFieldProps } from './ObjectField';
-import { FunctionField, FunctionFieldProps } from './FunctionField';
-
-export { ObjectField, ObjectFieldProps, FunctionField, FunctionFieldProps };

package/src/contexts/AppContext.ts

@@ -1,12 +0,0 @@
-// eslint-disable-next-line import/no-cycle
-import { IntegryAPI } from '@/modules/api';
-import { EventEmitter } from '@/modules/event-emitter';
-import { IntegrySDKEvents } from '@/types';
-import { createContext } from 'preact';
-
-export default createContext<{
-  apiHandler: IntegryAPI;
-  eventEmitter: EventEmitter<IntegrySDKEvents>;
-  isPreviewMode: boolean;
-  isReadOnly?: boolean;
-} | null>(null);

package/src/declaration.d.ts

@@ -1,7 +0,0 @@
-// declaration.d.ts
-declare module '*.scss' {
-  const content: Record<string, string>;
-  export default content;
-}
-
-declare module 'dompurify';

package/src/extensions/HMAC.ts

@@ -1,25 +0,0 @@
-/**
- *
- * @param key Key to sign hash
- * @param message Message to hash
- * @returns {string}
- */
-export async function HMAC(message: string, key: string): Promise<string> {
-  const g = (str: string) =>
-    new Uint8Array(
-      [...unescape(encodeURIComponent(str))].map((c) => c.charCodeAt(0)),
-    );
-  const k = g(key);
-  const m = g(message);
-  const c = await crypto.subtle.importKey(
-    'raw',
-    k,
-    { name: 'HMAC', hash: 'SHA-256' },
-    true,
-    ['sign'],
-  );
-  const s = await crypto.subtle.sign('HMAC', c, m);
-  return [...new Uint8Array(s)]
-    .map((b) => b.toString(16).padStart(2, '0'))
-    .join('');
-}

package/src/extensions/IntegryAPIError.ts

@@ -1,19 +0,0 @@
-import { UnfetchResponse } from '../types';
-
-/**
- * Extend default Error class
- */
-class IntegryAPIError extends Error {
-  statusCode: number | undefined;
-
-  response: UnfetchResponse | undefined;
-
-  constructor(errorMessage: string, response?: UnfetchResponse) {
-    super(errorMessage);
-    this.name = this.constructor.name;
-    this.statusCode = response?.status;
-    this.response = response;
-  }
-}
-
-export { IntegryAPIError };

package/src/features/common/AccountDropdown/index.ts

@@ -1,291 +0,0 @@
-/* eslint-disable no-use-before-define */
-import { html } from 'htm/preact';
-import { StoreType } from '@/types/store';
-import { useEffect, useContext, useState, useRef } from 'preact/hooks';
-import AppContext from '@/contexts/AppContext';
-import { openPopupWindow } from '@/utils/popup';
-import { LargeLoader } from '@/components/LargeLoader';
-import { Button } from '@/components/Button';
-import { Select } from '@/components/BasicSelect';
-import { Loader } from '@/components/Loader';
-import isBrowser from '@/utils/isBrowser';
-import { AuthData, isAuthMessage } from '@/utils/isAuthMessage';
-import { MarketplaceAppAuthorizationType } from '@/interfaces';
-import { Authorization } from '@/types';
-import { Hint } from '@/components/Tooltip';
-import styles from './styles.module.scss';
-
-
-interface AccountDropdownProps extends StoreType {
-  authorizationType: MarketplaceAppAuthorizationType;
-  isIUAccount?: boolean;
-  showConnectButton?: boolean;
-  onAuthorizationSelected?: (authObj: Authorization | null, authorizationId: number) => void;
-  onAuthorizationDeleted?: (authObj: Authorization | null, authorizationId: number) => void;
-  triggerAddAccount?: boolean;
-  showError?: boolean;
-}
-
-const AccountDropdown = (props: AccountDropdownProps) => {
-  const context = useContext(AppContext);
-  const {
-    authorizationType,
-    onAuthorizationSelected,
-    onAuthorizationDeleted,
-    isIUAccount = false,
-    showConnectButton = false,
-    triggerAddAccount,
-    showError = false,
-  } = props;
-  const [loading, setLoading] = useState<boolean>(false);
-  const [selectedAuthorization, setSelectedAuthorization] = useState<Authorization | null>(null);
-  const [verifyingAuthorization, setVerifyingAuthorization] = useState<boolean>(false);
-  const authorizationTypeRef = useRef<MarketplaceAppAuthorizationType | null>(null); 
-  const verificationFailedErrorRef = useRef('');
-
-  useEffect(() => {
-    if (isBrowser())
-      window.addEventListener('message', onAuthResponseReceived);
-    return () => {
-      if (isBrowser())
-      window.removeEventListener('message', onAuthResponseReceived);
-    }
-  }, [])
-    
-  useEffect(() => {
-    if (authorizationType) {
-      authorizationTypeRef.current = authorizationType;
-    }
-    if (authorizationType && authorizationType.default_authorization) {
-        setSelectedAuthorization(getAuthorizationById(authorizationType.default_authorization))
-    }
-  }, [authorizationType])
-  
-  useEffect(() => {
-    if (triggerAddAccount) {
-      handleClickConnectBtn();
-    }
-  }, [triggerAddAccount])
-
-  const openAuthWindow = (authorizationTypeId: number) => {
-    const url = context?.apiHandler.getAuthUrl(
-      authorizationTypeId,
-    ) || '';
-    openPopupWindow(url, 'Auth Window', window, 800, 600);
-    };
-    
-  const getAuthorizationById = (authorizationId: number): Authorization | null => {
-    let authorizationTypeObj = null;
-    if (authorizationType) {
-      authorizationTypeObj = authorizationType;
-    } else if (authorizationTypeRef.current) {
-      authorizationTypeObj = authorizationTypeRef.current;
-    }
-    if (authorizationTypeObj) {
-      return authorizationTypeObj.authorizations.find((authObj) => authObj.id === authorizationId) || null;
-    }
-    return null;
-  };
-
-  const saveDefaultAuthorization = (authorizationId: number): void => {
-    let authorizationTypeId = null;
-    if (authorizationType && authorizationType.id) {
-      authorizationTypeId = authorizationType.id;
-    } else if (authorizationTypeRef.current && authorizationTypeRef.current.id) {
-      authorizationTypeId = authorizationTypeRef.current.id;
-    }
-    if (authorizationTypeId) {
-      setVerifyingAuthorization(true);
-      context?.apiHandler
-        .setDefaultAuthorization({ authorizationId, authorizationTypeId })
-        .then((data) => {
-          // eslint-disable-next-line no-empty
-          if (data && data.id) {
-              setVerifyingAuthorization(false);
-            const selectedAuthObj = getAuthorizationById(authorizationId);
-            if (selectedAuthObj) {
-              setSelectedAuthorization(selectedAuthObj);
-            }
-            if (onAuthorizationSelected) {
-                onAuthorizationSelected(selectedAuthObj, authorizationId);
-            }
-          } else {
-            setVerifyingAuthorization(false);
-            console.error('Failed to save selected authorization');
-          }
-        })
-    }
-  } 
-
-  const verifyAuthorization = (authorizationId: number): void => {
-    verificationFailedErrorRef.current = '';
-    setVerifyingAuthorization(true);
-    context?.apiHandler
-      .verifyOAuthWithError(authorizationId)
-      .then((data) => {
-        if (data) {
-          if (data.is_valid) {
-            saveDefaultAuthorization(authorizationId);
-          } else {
-            verificationFailedErrorRef.current = `${data.error_message}`;
-            setVerifyingAuthorization(false);
-            // show error message
-          }
-        } else {
-          setVerifyingAuthorization(false);
-          console.error('Failed to verify authorization');
-        }
-      })
-  }
-
-  const deleteAuth = (authorizationId: number) => {
-    setVerifyingAuthorization(true);
-    context?.apiHandler
-      .deleteAuth(authorizationId)
-      .then((res) => {
-        if (res?.status === 200) {
-          const filteredAuthorizations = authorizationType.authorizations.filter((authObj) => authObj.id !== authorizationId) || [];
-            if (filteredAuthorizations?.length > 0) {
-                saveDefaultAuthorization(filteredAuthorizations[0].id)
-            } else {
-                setVerifyingAuthorization(false);
-                const deletedAuthObj = getAuthorizationById(authorizationId);
-                if (onAuthorizationDeleted) {
-                  onAuthorizationDeleted(deletedAuthObj, authorizationId);
-                }
-            }
-        } else {
-          setVerifyingAuthorization(false);
-          console.error('Failed to disconnect app');
-        }
-      })
-  };
-
-   const onAuthResponseReceived = (messageEvent: MessageEvent<AuthData>) => {
-      if (isAuthMessage(messageEvent) && messageEvent.data.activity_name) {
-        if (!messageEvent.data.already_exists) {
-          // eslint-disable-next-line @typescript-eslint/no-unused-vars
-          const newAuthorization = {
-            id: Number(messageEvent.data.authorization_id),
-            authorization_type: messageEvent.data.activity_name,
-            user_identity: messageEvent.data.user_identity,
-          } as Authorization;
-          console.info(messageEvent.data);
-          saveDefaultAuthorization(Number(messageEvent.data.authorization_id));
-        } 
-      }
-    };
-
-  const addAccount = (authorizationTypeId: number): void => {
-    openAuthWindow(authorizationTypeId);
-  }
-
-  const switchAccount = (authorizationId: number): void => {
-    verifyAuthorization(authorizationId);
-  }
-
-  const getAccountOptions = (): { label: string; key: string }[] => {
-    let accountOptions = [];
-    if (authorizationType && authorizationType.authorizations.length > 0) {
-      accountOptions = authorizationType.authorizations.map((authObj) => (
-        { label: authObj.user_identity, key: `${authObj.id}` }
-      )) 
-      if (isIUAccount) {
-        accountOptions.push({ label: 'Add an account', key: 'ADD_ACCOUNT' })
-      } else {
-        accountOptions.push({ label: 'Disconnect account', key: 'DISCONNECT_ACCOUNT' })
-      }
-    } else {
-      accountOptions = [{ label: 'Add an account', key: 'ADD_ACCOUNT' }]
-    }
-    return accountOptions;
-  }
-
-  const handleAccountSelection = (index: number): void => {
-    const tempAccountOptions = getAccountOptions();
-    if (index >= 0 && tempAccountOptions.length > 0 && index < tempAccountOptions.length) {
-      if (tempAccountOptions[index].key === 'ADD_ACCOUNT') {
-        if (authorizationType && authorizationType.id) {
-          addAccount(authorizationType.id);
-        }
-      } else if (tempAccountOptions[index].key === 'DISCONNECT_ACCOUNT') {
-        if (selectedAuthorization && selectedAuthorization.id) {
-          deleteAuth(selectedAuthorization.id);
-        }
-      }
-      else {
-        switchAccount(Number(tempAccountOptions[index].key));
-      }
-    }
-  };
-
-  const shouldShowConnectButton = (): boolean => {
-    if (showConnectButton && authorizationType && authorizationType.authorizations.length === 0) {
-      return true;
-    }
-    return false;
-  };
-
-  const handleClickConnectBtn = (): void => {
-    if (authorizationType && authorizationType.id) {
-      addAccount(authorizationType.id);
-    }
-  };
-
-    return html`${loading ? html`<div class="${styles.appPageLoader}"><${LargeLoader} /></div>` :
-        html`
-            ${html `
-            <${Hint} dismissOnClick=${false} position="bottom-right" deltaY=${0}>
-            <div class="${styles.accountDropdownWrap}">
-                ${shouldShowConnectButton() ? html`
-                  <${Button} label="Connect account" 
-                  width="136px" 
-                  height="40px"  
-                  className="integry-secondary-btn"
-                  onClick=${handleClickConnectBtn} />
-                `
-                : html`
-                <div class="${styles.accountDropdown}">
-                <${Select}
-                    ariaLabel="None"
-                    placeholder="None"
-                    options=${getAccountOptions()}
-                    value=${selectedAuthorization ? `${selectedAuthorization.id}` : undefined}
-                    onChange=${handleAccountSelection}
-                ><//>
-                </div>
-                `}
-                ${verifyingAuthorization && html`
-                <div class="${styles.verifyingLoader}">
-                <${Loader} />
-                </div>
-                `}
-                ${showError && verificationFailedErrorRef.current && html`
-                <span class="${styles.spanHint}" data-hint=${verificationFailedErrorRef.current || ''} />  
-                <svg width="16" height="20" viewBox="0 0 16 22" fill="none" xmlns="http://www.w3.org/2000/svg">
-                  <rect y="0.5" width="16" height="16" rx="8" fill="#E26154"/>
-                  <g filter="url(#filter0_d_398_2637)">
-                  <path fill-rule="evenodd" clip-rule="evenodd" d="M7.30152 6.44613C7.25819 5.97754 7.66442 5.52344 8.12171 5.52344C8.61526 5.52344 9.00706 5.9775 8.97049 6.44613L8.68756 9.94401C8.66602 10.2565 8.39017 10.5022 8.07803 10.4798C7.80247 10.4574 7.59183 10.2193 7.57737 9.94401L7.30152 6.44613ZM7.29834 12.1526C7.29834 11.729 7.6707 11.3842 8.13026 11.3842C8.60094 11.3842 8.97328 11.729 8.97286 12.1526V12.3004C8.97286 12.724 8.58982 13.0588 8.13026 13.0588C7.67026 13.0588 7.29834 12.724 7.29834 12.3004V12.1526Z" fill="white"/>
-                  </g>
-                  <defs>
-                  <filter id="filter0_d_398_2637" x="3.29834" y="5.52344" width="9.67432" height="15.5352" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-                  <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-                  <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-                  <feOffset dy="4"/>
-                  <feGaussianBlur stdDeviation="2"/>
-                  <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
-                  <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_398_2637"/>
-                  <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_398_2637" result="shape"/>
-                  </filter>
-                  </defs>
-                  </svg>
-                `
-                }
-             </div>
-             <//>
-            `}
-        `}`
-     ;
-};
-
-export default AccountDropdown;