Move create fields to feature library

apps/jetstream/src/app/AppRoutes.tsx

@@ -31,9 +31,13 @@ const DeployMetadata = lazy(() => import('./components/deploy/DeployMetadata'));
 const DeployMetadataSelection = lazy(() => import('./components/deploy/DeployMetadataSelection'));
 const DeployMetadataDeployment = lazy(() => import('./components/deploy/DeployMetadataDeployment'));
 
-const CreateObjectAndFields = lazy(() => import('./components/create-object-and-fields/CreateObjectAndFields'));
-const CreateFieldsSelection = lazy(() => import('./components/create-object-and-fields/CreateFieldsSelection'));
-const CreateFields = lazy(() => import('./components/create-object-and-fields/CreateFields'));
+const CreateObjectAndFields = lazy(() =>
+  import('@jetstream/feature/create-object-and-fields').then((module) => ({ default: module.CreateObjectAndFields }))
+);
+const CreateFieldsSelection = lazy(() =>
+  import('@jetstream/feature/create-object-and-fields').then((module) => ({ default: module.CreateFieldsSelection }))
+);
+const CreateFields = lazy(() => import('@jetstream/feature/create-object-and-fields').then((module) => ({ default: module.CreateFields })));
 
 const FormulaEvaluator = lazy(() => import('./components/formula-evaluator/FormulaEvaluator'));
 

apps/jetstream/src/app/components/core/AppStateResetOnOrgChange.tsx

@@ -1,8 +1,7 @@
 import { SalesforceOrgUi } from '@jetstream/types';
-import { fromAppState, fromQueryState } from '@jetstream/ui-core';
+import { fromAppState, fromAutomationControlState, fromQueryState } from '@jetstream/ui-core';
 import { FunctionComponent, useEffect, useState } from 'react';
 import { Resetter, useRecoilValue, useResetRecoilState } from 'recoil';
-import * as fromAutomationControlState from '../automation-control/automation-control.state';
 import * as fromDeployMetadataState from '../deploy/deploy-metadata.state';
 import * as fromFormulaState from '../formula-evaluator/formula-evaluator.state';
 import * as fromLoadState from '../load-records/load-records.state';

apps/jetstream/src/app/components/deploy/utils/DeployMetadataResultsTables.tsx

@@ -1,11 +1,13 @@
 import { orderObjectsBy } from '@jetstream/shared/utils';
 import { DeployResult, UiTabSection } from '@jetstream/types';
 import { CampingRainIllustration, EmptyState, Icon, OpenRoadIllustration, ResearchIllustration, Tabs, TabsRef } from '@jetstream/ui';
+import {
+  DeployMetadataResultsFailureTable,
+  DeployMetadataResultsSuccessTable,
+  DeployMetadataUnitTestCodeCoverageResultsTable,
+  DeployMetadataUnitTestFailuresTable,
+} from '@jetstream/ui-core';
 import { FunctionComponent, useEffect, useRef, useState } from 'react';
-import DeployMetadataResultsFailureTable from './DeployMetadataResultsFailureTable';
-import DeployMetadataResultsSuccessTable from './DeployMetadataResultsSuccessTable';
-import DeployMetadataUnitTestCodeCoverageResultsTable from './DeployMetadataUnitTestCodeCoverageResultsTable';
-import DeployMetadataUnitTestFailuresTable from './DeployMetadataUnitTestFailuresTable';
 
 const SuccessIcon = (
   <Icon

apps/jetstream/src/app/components/deploy/utils/DeployMetadataStatusModal.tsx

@@ -2,11 +2,10 @@ import { css } from '@emotion/react';
 import { ANALYTICS_KEYS, DATE_FORMATS } from '@jetstream/shared/constants';
 import { DeployResult, Maybe, SalesforceOrgUi } from '@jetstream/types';
 import { Grid, GridCol, Icon, Modal, TabsRef } from '@jetstream/ui';
-import { ConfirmPageChange, OrgLabelBadge, useAmplitude } from '@jetstream/ui-core';
+import { ConfirmPageChange, DeployMetadataProgressSummary, OrgLabelBadge, useAmplitude } from '@jetstream/ui-core';
 import { formatDate } from 'date-fns/format';
 import { Fragment, FunctionComponent, useEffect, useRef, useState } from 'react';
 import { DeployMetadataStatus } from '../deploy-metadata.types';
-import DeployMetadataProgressSummary from './DeployMetadataProgressSummary';
 import DeployMetadataResultsTables from './DeployMetadataResultsTables';
 
 export interface DivWithTopMarginProps {

apps/jetstream/src/app/components/formula-evaluator/FormulaEvaluator.tsx

@@ -30,6 +30,7 @@ import {
   FormulaEvaluatorUserSearch,
   applicationCookieState,
   getFormulaData,
+  registerCompletions,
   selectedOrgState,
   useAmplitude,
 } from '@jetstream/ui-core';
@@ -39,7 +40,6 @@ import type { editor } from 'monaco-editor';
 import { FunctionComponent, useCallback, useEffect, useRef, useState } from 'react';
 import { useRecoilState, useRecoilValue } from 'recoil';
 import FormulaEvaluatorDeployModal from './deploy/FormulaEvaluatorDeployModal';
-import { registerCompletions } from './formula-evaluator.editor-utils';
 import * as fromFormulaState from './formula-evaluator.state';
 
 // Lazy import

libs/features/automation-control/tsconfig.lib.json

@@ -15,13 +15,7 @@
     "src/**/*.spec.jsx",
     "src/**/*.test.jsx"
   ],
-  "include": [
-    "src/**/*.js",
-    "src/**/*.jsx",
-    "src/**/*.ts",
-    "src/**/*.tsx",
-    "../../shared/ui-core/src/state-management/automation-control.state.ts"
-  ],
+  "include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"],
   "files": [
     "../../../node_modules/@nx/react/typings/cssmodule.d.ts",
     "../../../node_modules/@nx/react/typings/image.d.ts",

libs/features/create-object-and-fields/.babelrc

@@ -0,0 +1,12 @@
+{
+  "presets": [
+    [
+      "@nx/react/babel",
+      {
+        "runtime": "automatic",
+        "useBuiltIns": "usage"
+      }
+    ]
+  ],
+  "plugins": []
+}

libs/features/create-object-and-fields/.eslintrc.json

@@ -0,0 +1,18 @@
+{
+  "extends": ["plugin:@nx/react", "../../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {}
+    }
+  ]
+}

libs/features/create-object-and-fields/README.md

@@ -0,0 +1,7 @@
+# features-create-object-and-fields
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test features-create-object-and-fields` to execute the unit tests via [Jest](https://jestjs.io).

libs/features/create-object-and-fields/jest.config.ts

@@ -0,0 +1,11 @@
+/* eslint-disable */
+export default {
+  displayName: 'features-create-object-and-fields',
+  preset: '../../../jest.preset.js',
+  transform: {
+    '^(?!.*\\.(js|jsx|ts|tsx|css|json)$)': '@nx/react/plugins/jest',
+    '^.+\\.[tj]sx?$': ['babel-jest', { presets: ['@nx/react/babel'] }],
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
+  coverageDirectory: '../../../coverage/libs/features/create-object-and-fields',
+};

libs/features/create-object-and-fields/project.json

@@ -0,0 +1,16 @@
+{
+  "name": "features-create-object-and-fields",
+  "$schema": "../../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "libs/features/create-object-and-fields/src",
+  "projectType": "library",
+  "tags": [],
+  "targets": {
+    "test": {
+      "executor": "@nx/jest:jest",
+      "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
+      "options": {
+        "jestConfig": "libs/features/create-object-and-fields/jest.config.ts"
+      }
+    }
+  }
+}

apps/jetstream/src/app/components/create-object-and-fields/CreateFieldsFormulaEditor.tsx → libs/features/create-object-and-fields/src/CreateFieldsFormulaEditor.tsx

@@ -2,6 +2,7 @@ import { css } from '@emotion/react';
 import { logger } from '@jetstream/shared/client-logger';
 import { ANALYTICS_KEYS } from '@jetstream/shared/constants';
 import { useNonInitialEffect } from '@jetstream/shared/ui-utils';
+import { getErrorMessage, getErrorMessageAndStackObj } from '@jetstream/shared/utils';
 import { SplitWrapper as Split } from '@jetstream/splitjs';
 import { Field, FieldType, Maybe, NullNumberBehavior, SalesforceOrgUi } from '@jetstream/types';
 import { Grid, KeyboardShortcut, Modal, Spinner, Tabs, Textarea } from '@jetstream/ui';
@@ -16,13 +17,13 @@ import {
   ManualFormulaRecord,
   SalesforceFieldType,
   getFormulaData,
+  registerCompletions,
   useAmplitude,
 } from '@jetstream/ui-core';
 import Editor, { OnMount, useMonaco } from '@monaco-editor/react';
 import * as formulon from 'formulon';
 import type { editor } from 'monaco-editor';
 import { forwardRef, useCallback, useEffect, useRef, useState } from 'react';
-import { registerCompletions } from '../formula-evaluator/formula-evaluator.editor-utils';
 import CreateFieldsFormulaEditorManualField from './CreateFieldsFormulaEditorManualField';
 
 export interface CreateFieldsFormulaEditorProps {
@@ -173,8 +174,8 @@ export const CreateFieldsFormulaEditor = forwardRef<unknown, CreateFieldsFormula
           trackEvent(ANALYTICS_KEYS.sobj_create_field_formula_execute, { success: true, fieldCount: formulaFields.length, testMethod });
         } catch (ex) {
           logger.warn(ex);
-          setFormulaErrorMessage(ex.message);
-          trackEvent(ANALYTICS_KEYS.sobj_create_field_formula_execute, { success: false, message: ex.message, stack: ex.stack });
+          setFormulaErrorMessage(getErrorMessage(ex));
+          trackEvent(ANALYTICS_KEYS.sobj_create_field_formula_execute, { success: false, ...getErrorMessageAndStackObj(ex) });
         } finally {
           setLoading(false);
         }
@@ -205,8 +206,8 @@ export const CreateFieldsFormulaEditor = forwardRef<unknown, CreateFieldsFormula
       }
     }, [handleTestFormula, monaco, selectedOrg]);
 
-    function handleEditorChange(value, event) {
-      setFormulaValue(value);
+    function handleEditorChange(value?: string, event?: unknown) {
+      setFormulaValue(value || '');
     }
 
     const handleApexEditorMount: OnMount = (currEditor, monaco) => {
@@ -319,7 +320,7 @@ export const CreateFieldsFormulaEditor = forwardRef<unknown, CreateFieldsFormula
                     Test Formula
                   </h3>
                   <Tabs
-                    onChange={(value: 'RECORD' | 'MANUAL') => setTestMethod(value)}
+                    onChange={(value) => setTestMethod(value as 'RECORD' | 'MANUAL')}
                     initialActiveId={testMethod}
                     tabs={[
                       {

apps/jetstream/src/app/components/create-object-and-fields/CreateFieldsFormulaEditorManualField.tsx → libs/features/create-object-and-fields/src/CreateFieldsFormulaEditorManualField.tsx

@@ -79,9 +79,9 @@ export const CreateFieldsFormulaEditorManualField = forwardRef<unknown, CreateFi
               disabled,
               className: 'slds-m-right_small',
             }}
-            items={FieldTypeItems}
+            items={FieldTypeItems as ListItem[]}
             selectedItemId={fieldType}
-            onSelected={handleTypeChange}
+            onSelected={(items) => handleTypeChange(items as unknown as ListItem<ManualFormulaFieldType, ManualFormulaFieldType>)}
           />
           {fieldType === 'string' && (
             <Input label="Value" className="w-100">

apps/jetstream/src/app/components/create-object-and-fields/CreateFieldsImportExport.tsx → libs/features/create-object-and-fields/src/CreateFieldsImportExport.tsx

@@ -67,7 +67,7 @@ export const CreateFieldsImportExport: FunctionComponent<CreateFieldsImportExpor
     }
     // ensure all keys are lowercase to match up with expected field names
     data = data.map((row) => {
-      return Object.keys(row).reduce((normalizedRow, key) => {
+      return Object.keys(row).reduce((normalizedRow: Record<string, unknown>, key) => {
         normalizedRow[key.toLowerCase().replace(REGEX.NOT_ALPHA, '')] = row[key];
         return normalizedRow;
       }, {});

apps/jetstream/src/app/components/create-object-and-fields/CreateFieldsSelection.tsx → libs/features/create-object-and-fields/src/CreateFieldsSelection.tsx

@@ -14,11 +14,10 @@ import {
   PageHeaderRow,
   PageHeaderTitle,
 } from '@jetstream/ui';
-import { filterCreateFieldsSobjects, selectedOrgState } from '@jetstream/ui-core';
+import { RequireMetadataApiBanner, filterCreateFieldsSobjects, selectedOrgState } from '@jetstream/ui-core';
 import { FunctionComponent, useEffect, useRef } from 'react';
 import { Link } from 'react-router-dom';
 import { useRecoilState, useRecoilValue } from 'recoil';
-import { RequireMetadataApiBanner } from '../core/RequireMetadataApiBanner';
 import * as fromCreateFieldsState from './create-fields.state';
 import CreateNewObject from './create-new-object/CreateNewObject';
 
@@ -58,7 +57,7 @@ export const CreateFieldsSelection: FunctionComponent<CreateFieldsSelectionProps
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [profilesAndPermSetsData.profiles, profilesAndPermSetsData.permissionSets]);
 
-  function handleSobjectChange(sobjects: DescribeGlobalSObjectResult[]) {
+  function handleSobjectChange(sobjects: DescribeGlobalSObjectResult[] | null) {
     setSobjects(sobjects);
   }
 

apps/jetstream/src/app/components/create-object-and-fields/CreateNewGlobalPicklistModal.tsx → libs/features/create-object-and-fields/src/CreateNewGlobalPicklistModal.tsx

@@ -1,7 +1,7 @@
 import { css } from '@emotion/react';
 import { ANALYTICS_KEYS } from '@jetstream/shared/constants';
 import { useRollbar } from '@jetstream/shared/ui-utils';
-import { REGEX } from '@jetstream/shared/utils';
+import { REGEX, getErrorMessage, getErrorMessageAndStackObj } from '@jetstream/shared/utils';
 import { GlobalValueSetRequest, SalesforceOrgUi } from '@jetstream/types';
 import { Checkbox, Grid, GridCol, Input, Modal, ScopedNotification, Spinner, Textarea } from '@jetstream/ui';
 import { applicationCookieState, createGlobalPicklist, generateApiNameFromLabel, useAmplitude } from '@jetstream/ui-core';
@@ -83,10 +83,9 @@ export const CreateNewGlobalPicklistModal: FunctionComponent<CreateNewGlobalPick
       trackEvent(ANALYTICS_KEYS.sobj_create_field_global_picklist);
       handleCloseModal();
     } catch (ex) {
-      setErrorMessage(`There was a problem creating the picklist. ${ex.message}`);
+      setErrorMessage(`There was a problem creating the picklist. ${getErrorMessage(ex)}`);
       rollbar.error('Create Fields: Global Picklist creation failed', {
-        message: ex.message,
-        stack: ex.stack,
+        ...getErrorMessageAndStackObj(ex),
         picklistData,
         payload: getPayload(picklistData),
       });

apps/jetstream/src/app/components/create-object-and-fields/create-new-object/CreateNewObjectModal.tsx → libs/features/create-object-and-fields/src/create-new-object/CreateNewObjectModal.tsx

@@ -3,11 +3,16 @@ import { ANALYTICS_KEYS } from '@jetstream/shared/constants';
 import { formatNumber } from '@jetstream/shared/ui-utils';
 import { SalesforceOrgUi } from '@jetstream/types';
 import { EmptyState, Grid, GridCol, Icon, Modal, PreviewIllustration, SalesforceLogin, Spinner, Tabs, TabsRef } from '@jetstream/ui';
-import { ConfirmPageChange, applicationCookieState, selectSkipFrontdoorAuth, useAmplitude } from '@jetstream/ui-core';
+import {
+  ConfirmPageChange,
+  DeployMetadataProgressSummary,
+  DeployMetadataResultsTables,
+  applicationCookieState,
+  selectSkipFrontdoorAuth,
+  useAmplitude,
+} from '@jetstream/ui-core';
 import { FunctionComponent, useRef } from 'react';
 import { useRecoilState, useRecoilValue } from 'recoil';
-import DeployMetadataProgressSummary from '../../deploy/utils/DeployMetadataProgressSummary';
-import DeployMetadataResultsTables from '../../deploy/utils/DeployMetadataResultsTables';
 import { CreateNewObjectForm } from './CreateNewObjectForm';
 import CreateNewObjectPermissions from './CreateNewObjectPermissions';
 import CreateNewObjectPermissionsResult from './CreateNewObjectPermissionsResult';

libs/features/create-object-and-fields/src/index.ts

@@ -0,0 +1,3 @@
+export * from './CreateFields';
+export * from './CreateFieldsSelection';
+export * from './CreateObjectAndFields';

libs/features/create-object-and-fields/tsconfig.json

@@ -0,0 +1,22 @@
+{
+  "extends": "../../../tsconfig.base.json",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "jsxImportSource": "@emotion/react",
+    "allowJs": false,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "lib": ["DOM", "DOM.Iterable", "ESNext"],
+    "strict": true
+  },
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}

libs/features/create-object-and-fields/tsconfig.lib.json

@@ -0,0 +1,24 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../../dist/out-tsc",
+    "types": ["node"]
+  },
+  "exclude": [
+    "jest.config.ts",
+    "src/**/*.spec.ts",
+    "src/**/*.test.ts",
+    "src/**/*.spec.tsx",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.js",
+    "src/**/*.test.js",
+    "src/**/*.spec.jsx",
+    "src/**/*.test.jsx"
+  ],
+  "include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"],
+  "files": [
+    "../../../node_modules/@nx/react/typings/cssmodule.d.ts",
+    "../../../node_modules/@nx/react/typings/image.d.ts",
+    "../../../custom-typings/index.d.ts"
+  ]
+}

libs/features/create-object-and-fields/tsconfig.spec.json

@@ -0,0 +1,20 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../../dist/out-tsc",
+    "module": "commonjs",
+    "types": ["jest", "node"]
+  },
+  "include": [
+    "jest.config.ts",
+    "src/**/*.test.ts",
+    "src/**/*.spec.ts",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.tsx",
+    "src/**/*.test.js",
+    "src/**/*.spec.js",
+    "src/**/*.test.jsx",
+    "src/**/*.spec.jsx",
+    "src/**/*.d.ts"
+  ]
+}

libs/shared/ui-core/src/create-fields/create-fields-utils.tsx

@@ -35,8 +35,9 @@ const READ_ONLY_TYPES = new Set<SalesforceFieldType>(['AutoNumber', 'Formula']);
 const NUMBER_TYPES = new Set<SalesforceFieldType>(['Number', 'Currency', 'Percent']);
 const MAX_OBJ_IN_QUERY = 100;
 
-export function filterCreateFieldsSobjects(sobject: DescribeGlobalSObjectResult) {
+export function filterCreateFieldsSobjects(sobject: DescribeGlobalSObjectResult | null) {
   return (
+    !!sobject &&
     sobject.createable &&
     sobject.updateable &&
     !sobject.name.endsWith('__History') &&