Refactoring extension-related code to use hooks

app/ui-react/packages/api/src/index.ts

@@ -9,6 +9,7 @@ export * from './Stream';
 export * from './SyndesisFetch';
 export * from './useApiConnector';
 export * from './useApiProvider';
+export * from './useExtensionHelpers';
 export * from './useIntegrationHelpers';
 export * from './WithActionDescriptor';
 export * from './WithActivities';
@@ -25,7 +26,6 @@ export * from './WithConnectors';
 export * from './WithEnvironmentHelpers';
 export * from './WithEnvironments';
 export * from './WithExtension';
-export * from './WithExtensionHelpers';
 export * from './WithExtensionIntegrations';
 export * from './WithExtensions';
 export * from './WithFilterOptions';

app/ui-react/packages/api/src/useExtension.tsx

@@ -0,0 +1,34 @@
+import * as React from 'react';
+import { ApiContext } from './ApiContext';
+import { callFetch } from './callFetch';
+import { ServerEventsContext } from './ServerEventsContext';
+
+export function useExtensionIntegrations(extensionId: string) {
+  const apiContext = React.useContext(ApiContext);
+  const serverEventsContext = React.useContext(ServerEventsContext);
+  const [loading, setLoading] = React.useState(true);
+  const [error, setError] = React.useState<false | Error>(false);
+  const [integrations, setIntegrations] = React.useState([]);
+
+  React.useEffect(() => {
+    const fetchIntegrations = async () => {
+      setLoading(true);
+      try {
+        const response = await callFetch({
+          headers: apiContext.headers,
+          method: 'GET',
+          url: `${apiContext.apiUri}/extensions/${extensionId}/integrations`,
+        });
+        const result = await response.json();
+        setIntegrations(result);
+      } catch (e) {
+        setError(e as Error);
+      } finally {
+        setLoading(false);
+      }
+    };
+    fetchIntegrations();
+  }, [integrations, loading, error]);
+
+  return { integrations, loading, error };
+}

app/ui-react/packages/api/src/useExtensionHelpers.tsx

@@ -0,0 +1,82 @@
+import { Extension } from '@syndesis/models';
+import * as React from 'react';
+import { ApiContext } from './ApiContext';
+import { callFetch } from './callFetch';
+
+export const useExtensionHelpers = () => {
+  const apiContext = React.useContext(ApiContext);
+
+  /**
+   * Deletes the extension with the specified identifier.
+   * @param extensionId the ID of the extension being deleted
+   */
+  const deleteExtension = async (extensionId: string): Promise<void> => {
+    const response = await callFetch({
+      headers: apiContext.headers,
+      method: 'DELETE',
+      url: `${apiContext.apiUri}/extensions/${extensionId}`,
+    });
+
+    if (!response.ok) {
+      throw new Error(response.statusText);
+    }
+
+    return Promise.resolve();
+  };
+
+  /**
+   * Imports the extension with the specified identifier.
+   * @param extensionId the ID of the extension being imported
+   */
+  const importExtension = async (extensionId: string): Promise<void> => {
+    const response = await callFetch({
+      headers: apiContext.headers,
+      method: 'POST',
+      url: `${apiContext.apiUri}/extensions/${extensionId}/install`,
+    });
+
+    if (!response.ok) {
+      throw new Error(response.statusText);
+    }
+
+    return Promise.resolve();
+  };
+
+  /**
+   * Updates the extension with the specified identifier or creates a new extension if there is no identifier.
+   * @param extensionId the ID of the extension being uploaded
+   */
+  const uploadExtension = async (
+    file: File,
+    extensionId?: string
+  ): Promise<Extension> => {
+    const data = new FormData();
+    data.append('file', file, file.name);
+    const url = `${apiContext.apiUri}/extensions`;
+    const {
+      Accept,
+      ['Content-Type']: contentType,
+      ...rest
+    } = apiContext.headers;
+    const response = await callFetch({
+      body: data,
+      headers: { ...rest },
+      includeAccept: false,
+      includeContentType: false,
+      includeReferrerPolicy: false,
+      method: 'POST',
+      url: extensionId ? `${url}?updatedId=${extensionId}` : url,
+    });
+    if (!response.ok) {
+      throw new Error(response.statusText);
+    }
+
+    return (await response.json()) as Extension;
+  };
+
+  return {
+    deleteExtension,
+    importExtension,
+    uploadExtension,
+  };
+};