Seeking Guidance on Injecting JavaScript from SuiteCRM 7 into SuiteCRM 8.4.1

In SuiteCRM 7, I had a JavaScript customization for the Contacts module that added icons to the list view. Clicking on these icons would redirect to another page. Given that SuiteCRM 8 only supports Angular, I am seeking guidance on how to inject the JavaScript file from SuiteCRM 7 into version 8.
Specifically, I am looking for the exact locations within the SuiteCRM 8 project directory to create the necessary Angular service, Angular component, and the JavaScript file imported from SuiteCRM 7.
I appreciate any guidance on the file locations and structures and any additional steps needed for injecting the JavaScript file from SuiteCRM 7 into SuiteCRM 8.

Thank you in advance for your assistance!

Hey @Anitha,

What you want to accomplish is something like these links?

image

Hi @anthony.oak.castro ,
yes or like adding a button to the actions menu . I’m looking for ways to inject existing JavaScript into SuiteCRM 8… Can you help me with this?

When working inside a front-end framework like Angular, “injecting javascript” is not the proper way to do things. If you have any existing front-end JS code you would need to adapt it the new framework (basically - rewrite it), not try to inject it.

I understand this can be considerable work but there are also significant advantages - instead of having flaky hacks you can have proper customizations and extensions.

1 Like

@pgr Sure, I’d appreciate your guidance on creating custom views (it seems with version 8 is quite different than previous versions) and handling redirections within the contacts module. Could you provide some tips to get started? Thanks!

You have some developer documentation in the docs site, but it’s not much.

Other than that, it’s better if you place more specific questions, just asking about “redirects” is too vague.

On SuiteCRM v8 I find that copying from solutions already present in core code is often the best way to learn. So maybe try to find a redirect like the one you need in core.

@pgr Thank you for your advice! I’ve managed to add a custom button to the bulk actions in the contact module’s list view. Now, I’m looking to redirect to a custom UI when this button is clicked. I’ve checked the developer documentation on the docs site, but it’s limited.

Do you already have a back end Symfony service that your button calls?

@pgr Yes. I’ve added a custom button configuration in public/legacy/modules/Contacts/metadata/listviewdefs.php . The button is set up to trigger a custom action, and the associated backend logic is handled in core/backend/Process/Service/RecordActions/CustomRecordAction.php.within the backend Symfony service (CustomRecordAction.php), I’ve incorporated code snippets from the existing merge-records functionality to adapt and extend its capabilities for the custom action triggered by the button. Now, I’m seeking guidance on defining a custom route and establishing the frontend.For now, I aim to create a simple custom UI . If you have any insights or recommendations regarding Symfony routing and best practices for integrating custom frontend components with SuiteCRM8, your expertise would be invaluable. Thank you for your continued support!

Ok. I’m still learning this and my knowledge of v8 is very patchy, but here goes…

So in your Symfony back-end service, you are returning a $responseData, where you define a value for a ‘handler’. This seems to be instructions for how the front-end is going to handle the response.

I see several options for it here:

see also the actions sub-directory there. So you have noop which does nothing (when the back-end actions are enough), changelog (?), export (when the action causes a download on the browser, like the PDF letters etc), and… redirect.

If you search the code for those particular redirects with grep -rn redirect core/backend/

core/backend/Process/Service/BulkActions/MergeRecordsBulkAction.php:140:            'handler' => 'redirect',
core/backend/Process/Service/RecordActions/ConvertLeadAction.php:130:            'handler' => 'redirect',
core/backend/Process/Service/RecordActions/DeleteRecordAction.php:147:            'handler' => 'redirect',
core/backend/Process/Service/RecordActions/DuplicateRecordAction.php:129:            'handler' => 'redirect',
core/backend/Process/Service/RecordActions/EditAction.php:158:            'handler' => 'redirect',
core/backend/Process/Service/RecordActions/MergeDuplicateAction.php:136:            'handler' => 'redirect',

You will find plenty of core examples with redirects, you can explore the code surrounding those lines and learn.

I hope this helps. If you find out more new stuff, please come back here and teach us how to do it. Good luck.