@amp-labs/react 1.0.1 → 1.0.2

package/build/src/context/InstallIntegrationContext.js

@@ -7,7 +7,7 @@ const LoadingIcon_1 = require("../assets/LoadingIcon");
 const ErrorTextBox_1 = require("../components/Configure/ErrorTextBox");
 const api_1 = require("../services/api");
 const utils_1 = require("../utils");
-const ApiKeyContext_1 = require("./ApiKeyContext");
+const ApiKeyProvider_1 = require("./ApiKeyProvider");
 const ErrorContextProvider_1 = require("./ErrorContextProvider");
 const IntegrationListContext_1 = require("./IntegrationListContext");
 const ProjectContext_1 = require("./ProjectContext");
@@ -22,6 +22,7 @@ const InstallIntegrationContext = (0, react_1.createContext)({
     groupName: '',
     installation: undefined,
     setInstallation: () => { },
+    resetInstallations: () => { },
 });
 // Create a custom hook to access the props
 function useInstallIntegrationProps() {
@@ -34,14 +35,14 @@ function useInstallIntegrationProps() {
 exports.useInstallIntegrationProps = useInstallIntegrationProps;
 // Wrap your parent component with the context provider
 function InstallIntegrationProvider({ children, integration, consumerRef, consumerName, groupRef, groupName, }) {
+    const apiKey = (0, ApiKeyProvider_1.useApiKey)();
     const { projectId } = (0, ProjectContext_1.useProject)();
-    const [installations, setInstallations] = (0, react_1.useState)([]);
-    const installation = (installations === null || installations === void 0 ? void 0 : installations[0]) || null; // there should only be one installation for mvp
-    const apiKey = (0, react_1.useContext)(ApiKeyContext_1.ApiKeyContext);
     const { integrations } = (0, IntegrationListContext_1.useIntegrationList)();
-    const integrationObj = (0, react_1.useMemo)(() => (0, utils_1.findIntegrationFromList)(integration, integrations || []), [integration, integrations]);
+    const [installations, setInstallations] = (0, react_1.useState)([]);
     const [isLoading, setLoadingState] = (0, react_1.useState)(true);
     const { setError, isError } = (0, ErrorContextProvider_1.useErrorState)();
+    const installation = (installations === null || installations === void 0 ? void 0 : installations[0]) || null; // there should only be one installation for mvp
+    const integrationObj = (0, react_1.useMemo)(() => (0, utils_1.findIntegrationFromList)(integration, integrations || []), [integration, integrations]);
     (0, react_1.useEffect)(() => {
         if (integrationObj === null && (integrations === null || integrations === void 0 ? void 0 : integrations.length)) {
             console.error(`Integration "${integration}" not found in integration list`);
@@ -52,9 +53,7 @@ function InstallIntegrationProvider({ children, integration, consumerRef, consum
     const setInstallation = (0, react_1.useCallback)((installationObj) => {
         setInstallations([installationObj]);
     }, [setInstallations]);
-    const integrationErrorKey = (integrationObj === null || integrationObj === void 0 ? void 0 : integrationObj.id) || '';
-    // check if integration has been installed in AmpersandProvider
-    (0, react_1.useEffect)(() => {
+    const resetInstallations = (0, react_1.useCallback)(() => {
         if (integrationObj === null || integrationObj === void 0 ? void 0 : integrationObj.id) {
             // check if installation exists on selected integration
             (0, api_1.api)().listInstallations({ projectId, integrationId: integrationObj.id, groupRef }, {
@@ -72,7 +71,12 @@ function InstallIntegrationProvider({ children, integration, consumerRef, consum
                 console.error('Error retrieving installation information: ', err);
             });
         }
-    }, [projectId, integrationObj === null || integrationObj === void 0 ? void 0 : integrationObj.id, apiKey, groupRef, setError]);
+    }, [integrationObj, projectId, apiKey, setError, groupRef]);
+    const integrationErrorKey = (integrationObj === null || integrationObj === void 0 ? void 0 : integrationObj.id) || '';
+    // check if integration has been installed in AmpersandProvider
+    (0, react_1.useEffect)(() => {
+        resetInstallations();
+    }, [resetInstallations]);
     const props = (0, react_1.useMemo)(() => ({
         integrationId: (integrationObj === null || integrationObj === void 0 ? void 0 : integrationObj.id) || '',
         provider: (integrationObj === null || integrationObj === void 0 ? void 0 : integrationObj.provider) || '',
@@ -83,8 +87,9 @@ function InstallIntegrationProvider({ children, integration, consumerRef, consum
         groupName,
         installation,
         setInstallation,
+        resetInstallations,
     }), [integrationObj, consumerRef, consumerName, groupRef,
-        groupName, installation, setInstallation]);
+        groupName, installation, setInstallation, resetInstallations]);
     return (isError(ErrorContextProvider_1.ErrorBoundary.INSTALLATION_LIST, integrationErrorKey)) ? (0, jsx_runtime_1.jsx)(ErrorTextBox_1.ErrorTextBox, { message: `Error retrieving installation information for integration "${(integrationObj === null || integrationObj === void 0 ? void 0 : integrationObj.name) || 'unknown'}"` }) : ((0, jsx_runtime_1.jsx)(InstallIntegrationContext.Provider, { value: props, children: isLoading ? (0, jsx_runtime_1.jsx)(LoadingIcon_1.LoadingIcon, {}) : children }));
 }
 exports.InstallIntegrationProvider = InstallIntegrationProvider;

package/build/src/context/IntegrationListContext.js

@@ -6,7 +6,7 @@ const react_1 = require("react");
 const LoadingIcon_1 = require("../assets/LoadingIcon");
 const ErrorTextBox_1 = require("../components/Configure/ErrorTextBox");
 const api_1 = require("../services/api");
-const ApiKeyContext_1 = require("./ApiKeyContext");
+const ApiKeyProvider_1 = require("./ApiKeyProvider");
 const ErrorContextProvider_1 = require("./ErrorContextProvider");
 exports.IntegrationListContext = (0, react_1.createContext)({
     integrations: null,
@@ -20,9 +20,9 @@ const useIntegrationList = () => {
 };
 exports.useIntegrationList = useIntegrationList;
 function IntegrationListProvider({ projectId, children }) {
-    const [integrations, setIntegrations] = (0, react_1.useState)(null);
-    const apiKey = (0, react_1.useContext)(ApiKeyContext_1.ApiKeyContext);
+    const apiKey = (0, ApiKeyProvider_1.useApiKey)();
     const { setError, isError } = (0, ErrorContextProvider_1.useErrorState)();
+    const [integrations, setIntegrations] = (0, react_1.useState)(null);
     const [isLoading, setLoadingState] = (0, react_1.useState)(true);
     (0, react_1.useEffect)(() => {
         (0, api_1.api)().listIntegrations({ projectId }, {

package/build/src/context/ProjectContext.js

@@ -6,7 +6,7 @@ const react_1 = require("react");
 const LoadingIcon_1 = require("../assets/LoadingIcon");
 const ErrorTextBox_1 = require("../components/Configure/ErrorTextBox");
 const api_1 = require("../services/api");
-const ApiKeyContext_1 = require("./ApiKeyContext");
+const ApiKeyProvider_1 = require("./ApiKeyProvider");
 const ErrorContextProvider_1 = require("./ErrorContextProvider");
 exports.ProjectContext = (0, react_1.createContext)({
     project: null,
@@ -22,10 +22,10 @@ const useProject = () => {
 };
 exports.useProject = useProject;
 function ProjectProvider({ projectId, children }) {
+    const apiKey = (0, ApiKeyProvider_1.useApiKey)();
+    const { isError, setError } = (0, ErrorContextProvider_1.useErrorState)();
     const [project, setProject] = (0, react_1.useState)(null);
-    const apiKey = (0, react_1.useContext)(ApiKeyContext_1.ApiKeyContext);
     const [isLoading, setLoadingState] = (0, react_1.useState)(true);
-    const { isError, setError } = (0, ErrorContextProvider_1.useErrorState)();
     (0, react_1.useEffect)(() => {
         (0, api_1.api)().getProject({ projectId }, {
             headers: {

package/build/src/hooks/useIsIntegrationInstalled.js

@@ -2,12 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useIsIntegrationInstalled = void 0;
 const react_1 = require("react");
-const ApiKeyContext_1 = require("../context/ApiKeyContext");
+const ApiKeyProvider_1 = require("../context/ApiKeyProvider");
 const IntegrationListContext_1 = require("../context/IntegrationListContext");
 const ProjectContext_1 = require("../context/ProjectContext");
 const api_1 = require("../services/api");
 const useIsIntegrationInstalled = (integration, groupRef) => {
-    const apiKey = (0, react_1.useContext)(ApiKeyContext_1.ApiKeyContext);
+    const apiKey = (0, ApiKeyProvider_1.useApiKey)();
     const { projectId } = (0, ProjectContext_1.useProject)();
     const { integrations } = (0, IntegrationListContext_1.useIntegrationList)();
     const [isLoaded, setIsLoaded] = (0, react_1.useState)(false);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@amp-labs/react",
-  "version": "1.0.1",
-  "description": "Ampersand React library.",
+  "version": "1.0.2",
+  "description": "Ampersand React library",
   "author": {
     "name": "Ampersand Labs",
     "url": "http://withampersand.com"
@@ -56,7 +56,7 @@
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-typescript": "^17.1.0",
     "eslint-plugin-import": "^2.29.0",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
     "eslint-plugin-n": "^16.2.0",
     "eslint-plugin-promise": "^6.1.1",
     "eslint-plugin-react": "^7.33.2",
@@ -75,6 +75,7 @@
   },
   "dependencies": {
     "@chakra-ui/icons": "^2.1.1",
+    "immer": "^10.0.3",
     "lodash.isequal": "^4.5.0"
   }
 }

package/build/src/context/ApiKeyContext.js

@@ -1,6 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ApiKeyProvider = exports.ApiKeyContext = void 0;
-const react_1 = require("react");
-exports.ApiKeyContext = (0, react_1.createContext)(null);
-exports.ApiKeyProvider = exports.ApiKeyContext.Provider;