Skip to content

Commit

Permalink
#223 - Add Related Stripe Sync Records component to setup steps (#1103)
Browse files Browse the repository at this point in the history 
* Add Related Stripe Sync Records to setup steps

* Updated from PR feedback

* Updates from feedback

* and fields...

* Added a sensible rename to trigger ci flows
  • Loading branch information
@jmather-c
jmather-c authored Jun 15, 2023
1 parent 406083e commit ff84565
Show file tree
Hide file tree
Showing 7 changed files with 131 additions and 36 deletions.
52 changes: 51 additions & 1 deletion sfdx/force-app/main/default/lwc/orgSettingsStep/orgSettingsStep.html
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,25 @@
<template>
<div class="slds-p-around_large">
<div class="slds-p-around_large">
<h3 class="slds-text-heading_medium slds-m-bottom_small">
Add Stripe Fields to Page Layouts
</h3>
<div class="slds-m-bottom_small">
Access Page Layouts for
<template iterator:obj={targetedObjects}>
<template lwc:if={obj.first}></template>
<template lwc:else><span key={obj.value}>,</span></template>
<lightning-button
key={obj.value}
class="slds-m-left_xx-small"
icon-name="utility:new_window"
icon-position="right"
variant="base"
data-object={obj.value}
label={obj.value}
onclick={openPageLayouts}
title="Open Page Layouts for this object in Setup"></lightning-button>
</template>
</div>
<div class="stripe-settings__item slds-grid">
<div class="slds-col_bump-right">
<h4 class="slds-text-heading_small slds-m-bottom_xx-small">
Expand All @@ -20,5 +40,35 @@ <h4 class="slds-text-heading_small slds-m-bottom_xx-small">
</p>
</div>
</div>
<h3 class="slds-text-heading_medium slds-m-bottom_small slds-border_top slds-m-top_large slds-p-top_large">
Add Stripe Components to Lightning Record Pages
</h3>
<div class="slds-m-bottom_small">
Access Lightning Record Pages for
<template iterator:obj={targetedObjects}>
<template lwc:if={obj.first}></template>
<template lwc:else><span key={obj.value}>,</span></template>
<lightning-button
key={obj.value}
class="slds-m-left_xx-small"
icon-name="utility:new_window"
icon-position="right"
variant="base"
data-object={obj.value}
label={obj.value}
onclick={openLightningRecordPages}
title="Open Lightning Record Pages for this object in Setup"></lightning-button>
</template>
</div>
<div class="stripe-settings__item slds-grid">
<div class="slds-col_bump-right">
<h4 class="slds-text-heading_small slds-m-bottom_xx-small">
Related Stripe Sync Records
</h4>
<p>
Add this component to your Lightning Record Pages to easily see the latest sync records for an object.
</p>
</div>
</div>
</div>
</template>
32 changes: 31 additions & 1 deletion sfdx/force-app/main/default/lwc/orgSettingsStep/orgSettingsStep.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,34 @@
import { LightningElement } from 'lwc';

export default class OrgSettingsStep extends LightningElement {}
const SUB_PAGES = {
PAGE_LAYOUTS: 'PageLayouts',
LIGHTNING_RECORD_PAGES: 'LightningPages',
};

export default class OrgSettingsStep extends LightningElement {
targetedObjects = [
'Account',
'Order',
'PricebookEntry',
'Product2',
];

openPageLayouts(e) {
this.gotoSetupObjectManagerPage(e.target.dataset.object, SUB_PAGES.PAGE_LAYOUTS);
}

openLightningRecordPages(e) {
this.gotoSetupObjectManagerPage(e.target.dataset.object, SUB_PAGES.LIGHTNING_RECORD_PAGES);
}

/**
* Returns the relative url to a page within Setup.
*
* @param {string} object
* @param {string} subPage
*/
gotoSetupObjectManagerPage(object, subPage) {
window.open(`/lightning/setup/ObjectManager/${object}/${subPage}/view`, '_blank');
}
}

2 changes: 1 addition & 1 deletion sfdx/force-app/main/default/lwc/relatedSyncRecords/relatedSyncRecords.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
</div>
<div class="slds-media__body">
<h2 class="slds-card__header-title">
Related Sync Records
Related Stripe Sync Records
</h2>
</div>
</header>
Expand Down
19 changes: 17 additions & 2 deletions sfdx/force-app/main/default/lwc/relatedSyncRecords/relatedSyncRecords.js-meta.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,24 @@
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>52.0</apiVersion>
<isExposed>true</isExposed>
<masterLabel>Related Sync Records</masterLabel>
<description>Gets related sync records based on the current record Id.</description>
<masterLabel>Related Stripe Sync Records</masterLabel>
<description>Displays related Stripe Sync Records based on the current Record Id.</description>
<targets>
<target>lightning__RecordPage</target>
</targets>
<targetConfigs>
<targetConfig targets="lightning__RecordPage">
<objects>
<object>Account</object>
<object>Order</object>
<object>PricebookEntry</object>
<object>Product2</object>
</objects>
<supportedFormFactors>
<supportedFormFactor type="Large"/>
<supportedFormFactor type="Small"/>
</supportedFormFactors>
</targetConfig>
</targetConfigs>

</LightningComponentBundle>
22 changes: 11 additions & 11 deletions sfdx/force-app/main/default/lwc/setup/setup.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -308,14 +308,7 @@ <h3 class="slds-text-heading_medium">
<div class="slds-col">
<!-- First Time Setup Steps -->
<template if:false={setupComplete}>
<c-step step-name="Update Page Layouts" data-index="0" setup-complete={setupComplete} onnext={next} class="slds-hide" loading={contentLoading} illustration-url={} back-disabled>
<p slot="description">
A few custom fields have been included in the Stripe Billing for Salesforce managed package that can optionally be added to your existing object page layouts. It is recommended you do this now before proceeding to connect Stripe to Salesforce, but these fields can be added at any time.
</p>
<c-org-settings-step>
</c-org-settings-step>
</c-step>
<c-step step-name="Connect Stripe and Salesforce" data-index="1" setup-complete={setupComplete} onnext={next} onback={back} class="slds-hide" next-disabled={nextDisabled} loading={contentLoading} illustration-url={systemConnectionsIllustration} show-intro>
<c-step step-name="Connect Stripe and Salesforce" data-index="0" setup-complete={setupComplete} onnext={next} onback={back} class="slds-hide" next-disabled={nextDisabled} loading={contentLoading} illustration-url={systemConnectionsIllustration} show-intro back-disabled>
<p slot="description">
Allow your Salesforce org and Stripe to communicate. This step will collect the required information to allow your Salesforce org and Stripe to communicate. First, you will be granting Stripe the necessary access to your Salesforce org. Second, you will be asked to log into Stripe to allow Salesforce to access your Stripe instance. Click "Authorize" and follow the provided steps to establish these connections.
</p>
Expand All @@ -330,7 +323,7 @@ <h3 class="slds-text-heading_medium">
onshowtoast={showToast}>
</c-system-connections-step>
</c-step>
<c-step step-name="Define Data Mapping" data-index="2" setup-complete={setupComplete} onnext={next} onback={back} class="slds-hide" loading={contentLoading} illustration-url={dataMappingIllustration} show-intro>
<c-step step-name="Define Data Mapping" data-index="1" setup-complete={setupComplete} onnext={next} onback={back} class="slds-hide" loading={contentLoading} illustration-url={dataMappingIllustration} show-intro>
<p slot="description">
Determine how Stripe data is mapped to your Salesforce org. A set of default field mappings have been provided for each Stripe object. These default values can be overwritten to better represent the structure of your Salesforce org. Field mappings can either be a Salesforce field, which reads Salesforce data on a per-record basis, or a static value, which will apply the same value to all records.
</p>
Expand All @@ -347,7 +340,7 @@ <h3 class="slds-text-heading_medium">
onshowtoast={showToast}>
</c-data-mapping-step>
</c-step>
<c-step step-name="Manage Integration" data-index="3" setup-complete={setupComplete} onnext={next} onback={back} next-label="Next" class="slds-hide" loading={contentLoading} illustration-url={syncPreferencesIllustration} show-intro>
<c-step step-name="Manage Integration" data-index="2" setup-complete={setupComplete} onnext={next} onback={back} next-label="Next" class="slds-hide" loading={contentLoading} illustration-url={syncPreferencesIllustration} show-intro>
<p slot="description">
Determine how and when data is synced between Stripe and Salesforce. A set of default settings has been provided; review and make any adjustments to these settings to suit your org before proceeding.
</p>
Expand All @@ -359,7 +352,7 @@ <h3 class="slds-text-heading_medium">
onshowtoast={showToast}>
</c-sync-preferences-step>
</c-step>
<c-step step-name="Activate Syncing" data-index="4" setup-complete={setupComplete} onnext={next} onback={back} next-label="Finish" class="slds-hide" loading={contentLoading} illustration-url={syncPreferencesIllustration} show-intro>
<c-step step-name="Activate Syncing" data-index="3" setup-complete={setupComplete} onnext={next} onback={back} next-label="Finish" class="slds-hide" loading={contentLoading} illustration-url={syncPreferencesIllustration} show-intro>
<p slot="description">
Activate your integration to begin bringing Salesforce orders over to Stripe in real time.
</p>
Expand All @@ -383,6 +376,13 @@ <h3 class="slds-text-heading_medium">
</div>
</div>
</c-step>
<c-step step-name="Update Salesforce Pages" data-index="4" setup-complete={setupComplete} onback={back} onnext={next} next-label="Finish" class="slds-hide" loading={contentLoading} illustration-url={}>
<p slot="description">
A few custom fields and components have been included in the Stripe Billing for Salesforce managed package that can optionally be added to your existing Page Layouts and Lightning Record Pages. These fields and components will allow you to view Stripe data directly on your Salesforce records.
</p>
<c-org-settings-step>
</c-org-settings-step>
</c-step>
</template>
<!-- /First Time Setup Steps -->

Expand Down
36 changes: 18 additions & 18 deletions sfdx/force-app/main/default/lwc/setup/setup.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,54 +30,54 @@ export default class FirstTimeSetup extends LightningElement {
@track tabToNavTo = '';
@track stepName;
@track steps = [
{
title: 'Update Page Layouts',
name: 'C-ORG-SETTINGS-STEP',
orderIndex: 1,
isComplete: false,
isActive: false,
component: 'c-org-settings-step',
},
{
title: 'Connect Stripe and Salesforce',
name: 'C-SYSTEM-CONNECTIONS-STEP',
orderIndex: 2,
orderIndex: 1,
isComplete: false,
isActive: false,
component: 'c-system-connections-step',
},
{
title: 'Define Data Mapping',
name: 'C-DATA-MAPPING-STEP',
orderIndex: 3,
orderIndex: 2,
isComplete: false,
isActive: false,
component: 'c-data-mapping-step',
},
{
title: 'Manage Integration',
name: 'C-SYNC-PREFERENCES-STEP',
orderIndex: 4,
orderIndex: 3,
isComplete: false,
isActive: false,
component: 'c-sync-preferences-step',
},
{
title: 'Activate Syncing',
name: 'C-POLLING-STEP',
orderIndex: 5,
orderIndex: 4,
isComplete: false,
isActive: false,
component: 'c-polling-step',
}
},
{
title: 'Update Salesforce Pages',
name: 'C-ORG-SETTINGS-STEP',
orderIndex: 5,
isComplete: false,
isActive: false,
component: 'c-org-settings-step',
},
];

setupStepRefs = {
orgSettings: 0,
systemConnections: 1,
dataMapping: 2,
syncPreferences: 3,
polling: 4,
systemConnections: 0,
dataMapping: 1,
syncPreferences: 2,
polling: 3,
orgSettings: 4,
};

generalStepRefs = {
Expand Down
4 changes: 2 additions & 2 deletions sfdx/force-app/main/default/lwc/step/step.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,9 +26,9 @@ <h3 class="slds-text-heading_medium slds-m-bottom_medium">
<div class={stepContentClasslist}>
<!-- Step Description -->
<div class="stipe-settings__description slds-p-around_large slds-border_bottom">
<div if:false={setupComplete} class="slds-text-heading_small slds-m-bottom_small">
<h2 if:false={setupComplete} class="slds-text-heading_large slds-m-bottom_small">
{stepName}
</div>
</h2>
<slot name="description">
</slot>
</div>
Expand Down

0 comments on commit ff84565

Please sign in to comment.