Merge pull request #610 from jetstreamapp/feat/553

Added ability to create custom objects from the create fields page

apps/docs/docs/deploy/deploy-object.md

@@ -0,0 +1,50 @@
+---
+id: deploy-object
+title: Create Custom Object
+description: Jetstream makes it easy to quickly create a new Custom Object.
+keywords: [
+    salesforce,
+    salesforce admin,
+    salesforce developer,
+    salesforce automation,
+    salesforce workbench
+    create custom object,
+    update custom object,
+    field level security,
+    page layout,
+  ]
+sidebar_label: Create Custom Object
+slug: /deploy-object
+---
+
+import Success from '../assets/icons/Success.svg';
+
+## Getting Started
+
+You can quickly deploy a new Custom Object in Jetstream from the **Create Object and Fields** page.
+
+Jetstream allows creating one object at a time, usually you would do this prior to creating new custom fields for the object.
+
+From the **Create Object and Fields** page, click the **Create New Object** button to open the modal to guide you through the process.
+
+## Configure Permissions
+
+Choose the profiles and permission sets you would like to assign permissions to, and choose which permissions you would like to apply.
+
+<img src={require('./create-object-permissions.png').default} alt="Create object permissions" />
+
+## Configure Object
+
+Configure your object. Jetstream will automatically populate the object plural label, API name, and Field Name fields for you when you modify the label to make the process simple. You can adjust the automatically populated values as needed.
+
+Refer to Salesforce documentation on specific details for configuring a new custom object.
+
+<img src={require('./create-object-form.png').default} alt="Create object form" />
+
+## Review Results
+
+Once you start the deployment, review the results on the the **Results** tab.
+
+Once you close the modal, the list of objects will be refreshed and the newly created object will be available for selection to create new custom fields.
+
+<img src={require('./create-object-results.png').default} alt="Create object results" />

apps/docs/sidebars.js

@@ -21,7 +21,7 @@ module.exports = {
     {
       type: 'category',
       label: 'Deploy Metadata',
-      items: ['deploy/deploy-metadata', 'deploy/deploy-fields', 'deploy/formula-evaluator'],
+      items: ['deploy/deploy-metadata', 'deploy/deploy-object', 'deploy/deploy-fields', 'deploy/formula-evaluator'],
     },
     {
       type: 'category',

apps/electron/preferences/src/styles.scss

@@ -158,8 +158,11 @@ pre {
   &:not(.read-only) {
     cursor: pointer;
   }
+  &.disabled {
+    cursor: not-allowed;
+  }
   margin: 1px;
-  &:not(.read-only):hover {
+  &:not(.disabled):not(.read-only):hover {
     background-color: $color-background;
   }
   &:not(.read-only).is-active {

apps/jetstream-e2e/src/tests/app/routing.spec.ts

@@ -24,7 +24,7 @@ const testCases = [
     menu: 'Deploy Metadata',
     items: [
       { link: 'Deploy and Compare Metadata', path: '/deploy-metadata' },
-      { link: 'Create Fields', path: '/create-fields' },
+      { link: 'Create Object and Fields', path: '/create-fields' },
       { link: 'Formula Evaluator', path: '/formula-evaluator' },
     ],
   },

apps/jetstream/src/app/components/core/app-routes.ts

@@ -78,7 +78,7 @@ export const APP_ROUTES: RouteMap = {
   CREATE_FIELDS: {
     ROUTE: '/create-fields',
     DOCS: 'https://docs.getjetstream.app/deploy-fields',
-    TITLE: 'Create Fields',
+    TITLE: 'Create Object and Fields',
     DESCRIPTION: 'Create and update fields in bulk',
   },
   FORMULA_EVALUATOR: {

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

@@ -5,6 +5,7 @@ import { SalesforceOrgUi } from '@jetstream/types';
 import {
   AutoFullHeightContainer,
   ConnectedSobjectListMultiSelect,
+  ConnectedSobjectListMultiSelectRef,
   Icon,
   ListWithFilterMultiSelect,
   Page,
@@ -14,20 +15,22 @@ import {
   PageHeaderTitle,
 } from '@jetstream/ui';
 import type { DescribeGlobalSObjectResult } from 'jsforce';
-import { FunctionComponent, useEffect } from 'react';
+import { FunctionComponent, useEffect, useRef } from 'react';
 import { Link } from 'react-router-dom';
 import { useRecoilState, useRecoilValue } from 'recoil';
 import { selectedOrgState } from '../../app-state';
 import { RequireMetadataApiBanner } from '../core/RequireMetadataApiBanner';
 import { filterCreateFieldsSobjects } from '../shared/create-fields/create-fields-utils';
 import * as fromCreateFieldsState from './create-fields.state';
+import CreateNewObject from './create-new-object/CreateNewObject';
 
 const HEIGHT_BUFFER = 170;
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface CreateFieldsSelectionProps {}
 
 export const CreateFieldsSelection: FunctionComponent<CreateFieldsSelectionProps> = () => {
+  const sobjectListRef = useRef<ConnectedSobjectListMultiSelectRef>();
   const selectedOrg = useRecoilValue<SalesforceOrgUi>(selectedOrgState);
 
   const [profiles, setProfiles] = useRecoilState(fromCreateFieldsState.profilesState);
@@ -68,6 +71,14 @@ export const CreateFieldsSelection: FunctionComponent<CreateFieldsSelectionProps
         <PageHeaderRow>
           <PageHeaderTitle icon={{ type: 'standard', icon: 'form' }} label="Create Fields" docsPath="/deploy-fields" />
           <PageHeaderActions colType="actions" buttonType="separate">
+            <CreateNewObject
+              initialSelectedProfiles={selectedProfiles}
+              initialSelectedPermissionSets={selectedPermissionSets}
+              selectedOrg={selectedOrg}
+              onClose={(createdNewObject) => {
+                createdNewObject && sobjectListRef.current?.refresh();
+              }}
+            />
             {hasSelectionsMade && (
               <Link className="slds-button slds-button_brand" to="configurator">
                 Continue
@@ -110,6 +121,7 @@ export const CreateFieldsSelection: FunctionComponent<CreateFieldsSelectionProps
         >
           <div className="slds-p-horizontal_x-small">
             <ConnectedSobjectListMultiSelect
+              ref={sobjectListRef}
               label="Object(s) to create fields on"
               selectedOrg={selectedOrg}
               sobjects={sobjects}

apps/jetstream/src/app/components/create-object-and-fields/create-new-object/CreateNewObject.tsx

@@ -0,0 +1,98 @@
+import { SalesforceOrgUi } from '@jetstream/types';
+import { Fragment, FunctionComponent, useState } from 'react';
+import { useResetRecoilState, useSetRecoilState } from 'recoil';
+import { CreateNewObjectModal } from './CreateNewObjectModal';
+import * as fromCreateObjectState from './create-object-state';
+
+export interface CreateNewObjectProps {
+  selectedOrg: SalesforceOrgUi;
+  initialSelectedProfiles?: string[];
+  initialSelectedPermissionSets?: string[];
+  onClose: (createdNewObject?: boolean) => void;
+}
+
+export const CreateNewObject: FunctionComponent<CreateNewObjectProps> = ({
+  selectedOrg,
+  initialSelectedProfiles = [],
+  initialSelectedPermissionSets = [],
+  onClose,
+}) => {
+  const setSelectedProfiles = useSetRecoilState(fromCreateObjectState.selectedProfilesState);
+  const setSelectedPermissionSets = useSetRecoilState(fromCreateObjectState.selectedPermissionSetsState);
+
+  const resetLabelState = useResetRecoilState(fromCreateObjectState.labelState);
+  const resetPluralLabelState = useResetRecoilState(fromCreateObjectState.pluralLabelState);
+  const resetStartsWithState = useResetRecoilState(fromCreateObjectState.startsWithState);
+  const resetApiNameState = useResetRecoilState(fromCreateObjectState.apiNameState);
+  const resetDescriptionState = useResetRecoilState(fromCreateObjectState.descriptionState);
+  const resetRecordNameState = useResetRecoilState(fromCreateObjectState.recordNameState);
+  const resetDataTypeState = useResetRecoilState(fromCreateObjectState.dataTypeState);
+  const resetDisplayFormatState = useResetRecoilState(fromCreateObjectState.displayFormatState);
+  const resetStartingNumberState = useResetRecoilState(fromCreateObjectState.startingNumberState);
+  const resetAllowReportsState = useResetRecoilState(fromCreateObjectState.allowReportsState);
+  const resetAllowActivitiesState = useResetRecoilState(fromCreateObjectState.allowActivitiesState);
+  const resetTrackFieldHistoryState = useResetRecoilState(fromCreateObjectState.trackFieldHistoryState);
+  const resetAllowInChatterGroupsState = useResetRecoilState(fromCreateObjectState.allowInChatterGroupsState);
+  const resetAllowSharingBulkStreamingState = useResetRecoilState(fromCreateObjectState.allowSharingBulkStreamingState);
+  const resetAllowSearchState = useResetRecoilState(fromCreateObjectState.allowSearchState);
+  const resetCreateTabState = useResetRecoilState(fromCreateObjectState.createTabState);
+  const resetSelectedTabIconState = useResetRecoilState(fromCreateObjectState.selectedTabIconState);
+  const resetProfilesState = useResetRecoilState(fromCreateObjectState.profilesState);
+  const resetPermissionSetsState = useResetRecoilState(fromCreateObjectState.permissionSetsState);
+  const resetSelectedProfilesState = useResetRecoilState(fromCreateObjectState.selectedProfilesState);
+  const resetSelectedPermissionSetsState = useResetRecoilState(fromCreateObjectState.selectedPermissionSetsState);
+  const resetObjectPermissionsState = useResetRecoilState(fromCreateObjectState.objectPermissionsState);
+
+  const [modalOpen, setModalOpen] = useState(false);
+
+  const resetAll = () => {
+    resetLabelState();
+    resetPluralLabelState();
+    resetStartsWithState();
+    resetApiNameState();
+    resetDescriptionState();
+    resetRecordNameState();
+    resetDataTypeState();
+    resetDisplayFormatState();
+    resetStartingNumberState();
+    resetAllowReportsState();
+    resetAllowActivitiesState();
+    resetTrackFieldHistoryState();
+    resetAllowInChatterGroupsState();
+    resetAllowSharingBulkStreamingState();
+    resetAllowSearchState();
+    resetCreateTabState();
+    resetSelectedTabIconState();
+    resetProfilesState();
+    resetPermissionSetsState();
+    resetSelectedProfilesState();
+    resetSelectedPermissionSetsState();
+    resetObjectPermissionsState();
+  };
+
+  const handleClose = (createdNewObject?: boolean) => {
+    setModalOpen(false);
+    onClose(createdNewObject);
+    resetAll();
+  };
+
+  return (
+    <Fragment>
+      <button
+        className="slds-button slds-button_neutral"
+        onClick={() => {
+          resetAll();
+          setSelectedProfiles(initialSelectedProfiles);
+          setSelectedPermissionSets(initialSelectedPermissionSets);
+          setModalOpen(true);
+        }}
+      >
+        Create New Object
+      </button>
+
+      {modalOpen && <CreateNewObjectModal onClose={handleClose} selectedOrg={selectedOrg} />}
+    </Fragment>
+  );
+};
+
+export default CreateNewObject;