Angular-Python-Salesforce Integrations

One more interesting use case for SLDS UI Module I want to describe is Global Spinner. I'm not sure is closing of the whole page under the Spinner on requests is good practice, but my practice shows it looks nice and is clear for users that something happens in background and they should wait. As Global Spinner should be the singleton we need to provide some interface to interact with this component from any place in our application. First generate component (like described here - Custom SLDS-UI Angular Module ) ng g c slds-global-spinner --module=slds-ui.module.ts --prefix="" --export=true and service ng g s slds-global-spinner   (move slds-global-spinner service to the component folder to make it looks better) Add  SldsGlobalSpinnerService to "providers" list in slds-iu.module.ts slds-global-spinner.service.ts import { Injectable } from '@angular/core'; import { Observable, Subject } from 'rxjs'; @Injectable({ prov

One of the important and big steps in custom UI elements developent is Custom Form Component . We should be able to create our own UI components that must behave as standard component from Angular  FormModule . In this case we need to implement  ControlValueAccessor interface with few some additional hacks. I want to start with simple input that I will wrap with SLDS input form-element styles . slds-input.component.html <div class="slds-form-element"> <label class="slds-form-element__label" [for]="idPrefix+'_input-id-1'"> <abbr *ngIf="required" class="slds-required" title="required">* </abbr>{{label}}</label> <div class="slds-form-element__control"> <input [type]="type" [ngModel]="value" (ngModelChange)="onValueChange($event)" [id]="idPrefix+'_input-id-1

In this article I will continue to develop Task CRUD related logic. Last time ( https://angular-python-salesforce.blogspot.com/2020/04/tasks-ui.html ) we created List and Details view components for Tasks. This time let's create modal for new Task. But this time it should be a little bit complex solution - I want to start with reusable UI components. I will create Modal and Input components based on SLDS ( https://www.lightningdesignsystem.com/ ) we use in our project. First we need to create separate Angular module to join all UI elements we plan to create. cd ./frontent ng g m slds-ui cd ./src/app/slds-ui/ ng g c slds-input --module=slds-ui.module.ts --prefix="" --export=true If all works fine you should see this folders structure. " --prefix" here disables default " app-" prefix that angular append to all new components, so you can see " selector: 'slds-modal' " One more small hack to prevent tslint warnin

As we have started with backend for Tasks let's focus on Frontend side too. We need to create lists/create/edit/delete component for Tasks in our Angular app. Create template for tasks angular component cd ./frontent && ng g c tasks Before we start to work on component itself let's add global navigation to the Angular app and bind our task component to the /tasks endpoint. ./frontent/src/app/app.component.html <div> <div class="slds-tabs_default"> <ul class="slds-tabs_default__nav" style="background-color: #F3F3F4;"> <li class="slds-tabs_default__item" [ngClass]="{'slds-is-active': url=='tasks'}"> <a class="slds-tabs_default__link" routerLink="/tasks">Tasks</a> </li> </ul> <div class="slds-tabs_default__content"> <router-out

The foundation of our service is scheduled jobs that we plan to use for regular Salesforce backup. There are multiple ways how to implement it like Celery, RQ, APScheduler, but all these methods demand additional background service, that can be too expensive solution for our prototype. I found maybe the best solution for Heroku based on free Heroku Scheduler described in this article -  Create a Background Worker on a Flask App (on Heroku) without Redis In this case the only think we need is to turn our app to script that can be run with app context. We did it already when added scrip for user creation in one of last posts ( https://angular-python-salesforce.blogspot.com/2020/03/user-authentification-with-flask-login.html ). To store scheduler jobs configuration and results we need to create few models in DB. It will be Task and TaskRun models. task.py from models import db, OutputMixin from flask_login import UserMixin from sqlalchemy.dialects.postgresql import JSONB