Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Example to Crm Data Components to Demonstrate CrmCardActions & CrmActionButton #75

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

breehall
Copy link

Summary

This PR creates a new example for the CrmCardActions and CrmActionButton components within crm-data-components. This new example is a CrmPropertyList that dynamically changes the properties displayed and actions button based on a given scenario from a dropdown select. Updates the README with images and documentation as well.

crm-actions

@breehall breehall marked this pull request as ready for review April 25, 2024 23:38
@breehall
Copy link
Author

@aanchalHS you were listed as a suggested reviewer for this PR, but please feel free to tag someone else if this recommendation was incorrect!

Copy link
Contributor

@deidrakandra deidrakandra left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me.

Would it be worth showing how to use the onError callback for at least one of the actions? There isn't an explicit example of that in the docs.

Comment on lines +17 to +23
hubspot.extend(({ context, runServerlessFunction, actions }) => (
<Extension
context={context}
runServerless={runServerlessFunction}
sendAlert={actions.addAlert}
/>
));
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Probably don't need these if they aren't being used in your extension?

Suggested change
hubspot.extend(({ context, runServerlessFunction, actions }) => (
<Extension
context={context}
runServerless={runServerlessFunction}
sendAlert={actions.addAlert}
/>
));
hubspot.extend(({ context }) => (
<Extension
context={context}
/>
));

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks like all three props are required for Extension per its type. Even though they're not used, we may still want to leave them to prevent TS errors

];

const Extension = ({ context, runServerless, sendAlert }) => {
const [scenario, setScenario] = useState<any>("engagement");
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should this be a string if using ts?

Suggested change
const [scenario, setScenario] = useState<any>("engagement");
const [scenario, setScenario] = useState<string>("engagement");

const currentObjectId = context.crm.objectId;
const currentObjectTypeId = context.crm.objectTypeId;

const actionsToPropertiesMap = {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Might be worth wrapping this in a useMemo?

</Text>

<Flex direction="row" align="end" gap="small">
<Form>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do you need a Form here?

- Add example of onError for CrmActionsButton
- PR Feedback
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants