@integration-app/react 2.0.1 → 2.0.2

package/src/hooks/useElement.tsx

@@ -1,199 +0,0 @@
-import { IntegrationAppClient } from '@integration-app/sdk'
-import AwesomeDebouncePromise from '_modules/awesome-debounce-promise'
-import { useIntegrationApp } from 'contexts/integration-app-context'
-import useSWR from 'swr'
-
-interface ElementState {
-  debouncedPut: (data) => Promise<void>
-  updatedLocally: boolean
-  currentPutRequests: number[]
-  savingToServer: boolean
-}
-
-const elementStateCache = new Map<string, ElementState>()
-
-export interface BaseElementAccessor<Element, UpdateRequest, CreateRequest> {
-  getUniqueIdentifier?(): string
-
-  get(): Promise<Element>
-
-  patch?(data: Partial<UpdateRequest>): Promise<Element>
-
-  put?(data: UpdateRequest): Promise<Element>
-
-  archive?(): Promise<void>
-
-  create?(data: CreateRequest): Promise<Element>
-}
-
-export function useElement<
-  Element,
-  UpdateRequest,
-  CreateRequest,
-  ElementAccessor extends BaseElementAccessor<
-    Element,
-    UpdateRequest,
-    CreateRequest
-  >,
->(
-  selector: any,
-  accessorGenerator: (
-    integrationAppClient: IntegrationAppClient,
-  ) => ElementAccessor | undefined,
-) {
-  const integrationApp = useIntegrationApp()
-
-  // To make sure all instances of useElement with the same IntegrationAppClient and selector
-  // are synchronized, we cache them using selector and token as a key
-  const elementKeyData: any = {
-    token: integrationApp?.token,
-    selector,
-  }
-  const elementKey = JSON.stringify(elementKeyData)
-
-  const elementState: ElementState = elementStateCache.get(elementKey) ?? {
-    updatedLocally: false,
-    savingToServer: false,
-    currentPutRequests: [], // Save current put requests to not update local state until all of them are done
-    debouncedPut: AwesomeDebouncePromise(async (data) => {
-      const requestId = Math.random()
-      elementState.currentPutRequests.push(requestId)
-      elementState.updatedLocally = false
-      elementState.savingToServer = true
-
-      try {
-        /* FIXME: strictNullCheck temporary fix */
-        // @ts-expect-error TS(2722): Cannot invoke an object which is possibly 'undefin... Remove this comment to see the full error message
-        const result = await accessor?.put(data)
-
-        elementState.currentPutRequests =
-          elementState.currentPutRequests.filter((id) => id !== requestId)
-
-        if (
-          !elementState.updatedLocally &&
-          elementState.currentPutRequests.length === 0
-        ) {
-          // Update savingToSever so that cached versions in each hook are updated when they react to 'mutate' below
-          // Yes, this duplicates the one in `finally`, but by the time that one is called it's too late since `mutate` already did its job.
-          elementState.savingToServer = false
-          // When we received updated state of the element,
-          // apply it to the context as long as we didn't make any other changes locally
-          // meanwhile.
-          await mutate(result, false)
-        }
-      } catch (e) {
-        elementState.updatedLocally = true
-        throw e
-      } finally {
-        elementState.savingToServer = false
-      }
-    }, 500),
-  }
-
-  if (!elementStateCache.has(elementKey)) {
-    elementStateCache.set(elementKey, elementState)
-  }
-
-  const accessor = integrationApp
-    ? accessorGenerator(integrationApp)
-    : undefined
-
-  const swrKey = accessor && selector ? `element:${elementKey}` : undefined // do not fetch anything if selector or accessor is not defined
-
-  const {
-    data: item,
-    mutate,
-    error,
-    isLoading,
-    isValidating,
-  } = useSWR(swrKey, () => accessor?.get(), {
-    // pause revalidation if update is in progress to not overwrite local changes
-    isPaused: () => elementState.updatedLocally || elementState.savingToServer,
-  })
-
-  const loading = isLoading
-  const refreshing = isValidating
-
-  async function refresh(): Promise<Element> {
-    /* FIXME: strictNullCheck temporary fix */
-    // @ts-expect-error TS(2322): Type 'Awaited<Element> | undefined' is not assigna... Remove this comment to see the full error message
-    return await mutate()
-  }
-
-  async function put(data: UpdateRequest) {
-    if (!accessor?.put) {
-      throw new Error(
-        /* FIXME: strictNullCheck temporary fix */
-        // @ts-expect-error TS(2531): Object is possibly 'null'.
-        `"put method is not supported for accessor ${accessor.constructor.name}`,
-      )
-    }
-
-    elementState.updatedLocally = true
-
-    // We don't know which fields are "innate" for the element and should stay
-    // and which should be removed by put, so we'll do a simple patch.
-    // We'll update data with actual value from the server after put is done.
-    const newLocalData: any = {
-      ...item,
-      ...data,
-    }
-
-    await mutate(newLocalData, false)
-
-    await elementState.debouncedPut(data)
-  }
-
-  async function patch(data: Partial<UpdateRequest>) {
-    const newData = {
-      ...item,
-      ...data,
-    } as UpdateRequest
-
-    return put(newData)
-  }
-
-  async function archive() {
-    if (!accessor?.archive) {
-      return
-    }
-
-    /* FIXME: strictNullCheck temporary fix */
-    // @ts-expect-error TS(2345): Argument of type '{ archivedAt: string; }' is not ... Remove this comment to see the full error message
-    await mutate({ ...item, archivedAt: new Date().toISOString() }, false)
-    await accessor?.archive()
-    await mutate()
-  }
-
-  async function create(data: CreateRequest) {
-    if (!accessor?.create) {
-      throw new Error(
-        `"create method is not supported for accessor ${accessor?.constructor.name}`,
-      )
-    }
-
-    const result = await accessor?.create(data)
-
-    return await mutate(result)
-  }
-
-  return {
-    accessor,
-
-    item,
-
-    loading,
-
-    saving: elementState.updatedLocally || elementState.savingToServer,
-
-    error,
-
-    refresh,
-    refreshing,
-
-    create,
-    patch,
-    put,
-    archive,
-  }
-}

package/src/hooks/useElements.tsx

@@ -1,108 +0,0 @@
-import { useIntegrationApp } from '../contexts/integration-app-context'
-import { useState } from 'react'
-import { PaginationResponse } from '@integration-app/sdk'
-import useSWRInfinite from 'swr/infinite'
-import qs from 'query-string'
-
-export function useElements<Item>(route: string, query: any = {}) {
-  const integrationApp = useIntegrationApp()
-
-  const limit = query.limit ?? 25
-
-  // Add token hash to keys to make sure that the cache is invalidated when the token changes
-  const tokenHash = hashCode(integrationApp.token)
-
-  function getKey(
-    page: number,
-    previousPageData: PaginationResponse<Item> | null,
-  ) {
-    // first page, we don't have `previousPageData`
-    if (page === 0)
-      return `/${route}?${qs.stringify({
-        ...query,
-        limit,
-        hash: tokenHash,
-      })}`
-
-    // reached the end
-    /* FIXME: strictNullCheck temporary fix */
-    // @ts-expect-error TS(2531): Object is possibly 'null'.
-    if (previousPageData.items?.length < limit) return null
-
-    return `/${route}?${qs.stringify({
-      ...query,
-      limit,
-      /* FIXME: strictNullCheck temporary fix */
-      // @ts-expect-error TS(2531): Object is possibly 'null'.
-      cursor: previousPageData.cursor,
-      hash: tokenHash,
-    })}`
-  }
-
-  const [loadingMore, setIsLoadingMore] = useState(false)
-
-  const { data, size, setSize, isLoading, error, mutate, isValidating } =
-    useSWRInfinite<PaginationResponse<Item>>(getKey, (url) =>
-      integrationApp.get(url),
-    )
-
-  const items = data ? data.map((page) => page.items).flat() : []
-
-  const loading = isLoading
-  const refreshing = isValidating
-
-  async function loadMore() {
-    /* FIXME: strictNullCheck temporary fix */
-    // @ts-expect-error TS(2532): Object is possibly 'undefined'.
-    const hasMoreToLoad = data[size - 1]?.items?.length === limit
-
-    if (hasMoreToLoad) {
-      setIsLoadingMore(true)
-      await setSize(size + 1)
-      setIsLoadingMore(false)
-    }
-  }
-
-  async function refresh() {
-    await mutate()
-  }
-
-  return {
-    items,
-
-    refresh,
-    refreshing,
-
-    loadMore,
-    loadingMore,
-
-    loading,
-
-    error,
-  }
-}
-
-/**
- * Returns a hash code for a string.
- * (Compatible to Java's String.hashCode())
- *
- * The hash code for a string object is computed as
- *     s[0]*31^(n-1) + s[1]*31^(n-2) + ... + s[n-1]
- * using number arithmetic, where s[i] is the i th character
- * of the given string, n is the length of the string,
- * and ^ indicates exponentiation.
- * (The hash value of the empty string is zero.)
- *
- * @param {string} s a string
- * @return {number} a hash code value for the given string.
- */
-function hashCode(s: string | undefined) {
-  if (!s) {
-    return 0
-  }
-  const l = s.length
-  let h = 0,
-    i = 0
-  if (l > 0) while (i < l) h = ((h << 5) - h + s.charCodeAt(i++)) | 0
-  return h
-}

package/src/hooks/useIntegrationAppSWR.tsx

@@ -1,13 +0,0 @@
-import useSWR from 'swr'
-import { useIntegrationApp } from '../contexts/integration-app-context'
-
-export function useIntegrationAppSWR(path: string, options?: any) {
-  const client = useIntegrationApp()
-
-  const fetcher = async () => {
-    const response = await client.get(path, options)
-    return response
-  }
-
-  return useSWR(client ? path : undefined, fetcher, options)
-}

package/src/hooks/useIntegrationElement.tsx

@@ -1,19 +0,0 @@
-import { BaseElementAccessor, useElement } from './useElement'
-
-export function useIntegrationElement<
-  Element,
-  UpdateRequest,
-  CreateRequest,
-  T extends BaseElementAccessor<Element, UpdateRequest, CreateRequest>,
->(accessor: T) {
-  if (!accessor.getUniqueIdentifier) {
-    throw new Error(
-      'This accessor can not be used for with `useIntegrationElement` hook. Method `getUniqueIdentifier` is missing.',
-    )
-  }
-
-  return useElement<Element, UpdateRequest, CreateRequest, T>(
-    accessor.getUniqueIdentifier(),
-    () => accessor,
-  )
-}

package/src/index.tsx

@@ -1,70 +0,0 @@
-/* Re-export everything from @integration-app/sdk */
-export * from '@integration-app/sdk'
-
-export * from './contexts/index.js'
-
-export { useIntegrationAppSWR } from './hooks/useIntegrationAppSWR.js'
-
-export { useConnection } from './hooks/integrations/useConnection.js'
-export { useConnections } from './hooks/integrations/useConnections.js'
-export { useConnectorSpec } from './hooks/integrations/useConnectorSpec.js'
-export { useIntegration } from './hooks/integrations/useIntegration.js'
-export { useIntegrations } from './hooks/integrations/useIntegrations.js'
-
-export { useFieldMapping } from './hooks/field-mappings/useFieldMapping.js'
-export { useFieldMappingInstance } from './hooks/field-mappings/useFieldMappingInstance.js'
-export { useFieldMappingInstances } from './hooks/field-mappings/useFieldMappingInstances.js'
-export { useFieldMappings } from './hooks/field-mappings/useFieldMappings.js'
-
-export { useDataSource } from './hooks/data-sources/useDataSource.js'
-export { useDataSourceInstance } from './hooks/data-sources/useDataSourceInstance.js'
-export { useDataSourceInstanceCollection } from './hooks/data-sources/useDataSourceInstanceCollection.js'
-export { useDataSourceInstances } from './hooks/data-sources/useDataSourceInstances.js'
-export { useDataSources } from './hooks/data-sources/useDataSources.js'
-
-export { useAppEventSubscription } from './hooks/app-events/useAppEventSubscription.js'
-export { useAppEventSubscriptions } from './hooks/app-events/useAppEventSubscriptions.js'
-export { useAppEventType } from './hooks/app-events/useAppEventType.js'
-export { useAppEventTypes } from './hooks/app-events/useAppEventTypes.js'
-export { useAppEvents } from './hooks/app-events/useAppEvents.js'
-
-export { useAppDataSchema } from './hooks/app-data-schemas/useAppDataSchema.js'
-export { useAppDataSchemas } from './hooks/app-data-schemas/useAppDataSchemas.js'
-export { useAppDataSchemaInstance } from './hooks/app-data-schemas/useAppDataSchemaInstance.js'
-export { useAppDataSchemaInstances } from './hooks/app-data-schemas/useAppDataSchemaInstances.js'
-
-export { useFlow } from './hooks/flows/useFlow.js'
-export { useFlows } from './hooks/flows/useFlows.js'
-
-export { useFlowInstance } from './hooks/flows/useFlowInstance.js'
-export { useFlowInstances } from './hooks/flows/useFlowInstances.js'
-
-export { useFlowRun } from './hooks/flows/useFlowRun.js'
-export { useFlowRuns } from './hooks/flows/useFlowRuns.js'
-
-export { useDataLinkTable } from './hooks/data-links/useDataLinkTable.js'
-export { useDataLinkTableInstance } from './hooks/data-links/useDataLinkTableInstance.js'
-export { useDataLinkTableInstances } from './hooks/data-links/useDataLinkTableInstances.js'
-export { useDataLinkTables } from './hooks/data-links/useDataLinkTables.js'
-
-export { useAction } from './hooks/actions/useAction.js'
-export { useActionInstance } from './hooks/actions/useActionInstance.js'
-export { useActionInstances } from './hooks/actions/useActionInstances.js'
-export { useActions } from './hooks/actions/useActions.js'
-
-export { useScreen } from './hooks/screens/useScreen.js'
-
-export { useCustomer } from './hooks/customers/useCustomer.js'
-export { useCustomers } from './hooks/customers/useCustomers.js'
-
-export { useScenario } from './hooks/scenarios/useScenario.js'
-export { useScenarios } from './hooks/scenarios/useScenarios.js'
-
-export { useDataCollectionSpec } from './hooks/data-collections/useDataCollectionSpec.js'
-
-export { useExternalEventSubscriptions } from './hooks/external-events/useExternalEventSubscriptions.js'
-export { useExternalEventSubscription } from './hooks/external-events/useExternalEventSubscription.js'
-
-export { DataForm } from '@integration-app/sdk'
-
-export { useIntegrationElement } from './hooks/useIntegrationElement.js'

package/tsconfig.json

@@ -1,40 +0,0 @@
-{
-  "extends": "../tsconfig.json",
-  "compilerOptions": {
-    "target": "es2018",
-    "lib": ["es2019", "dom", "dom.iterable"],
-    "strict": true,
-    "strictNullChecks": true,
-    "outDir": "./dist",
-    "baseUrl": "./src",
-    "jsx": "react-jsx",
-    "declaration": true,
-    "declarationDir": "./dist/dts"
-  },
-  "include": [
-    "./src/**/*.ts",
-    "./src/**/*.tsx",
-  ],
-  "exclude": [
-    "node_modules",
-  ],
-  "typedocOptions": {
-    "entryPointStrategy": "resolve",
-    "entryPoints": ["src/index.tsx"],
-    "basePath": "src",
-    "readme": "none",
-    "out": "_docs",
-    "exclude": "**/*+(.test|.d).ts",
-    "sort": ["source-order"],
-    "name": "Integration App React",
-    "customCss": "../typedocStyles.css",
-    "includeVersion": true,
-    "githubPages": false,
-    "navigationLinks": {
-      "Console": "http://console.integration.app",
-      "SDK": "http://console.integration.app/ref/sdk",
-      "REST API": "https://api-reference.integration.app"
-    },
-    "internalModule": "@integration-app/react"
-  }
-}