Versions Compared

Old Version 1

changes.mady.by.user Potter (Esteban Alvarado)

Saved on

compared with

New Version 2

changes.mady.by.user Potter (Esteban Alvarado)

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Before Start

Get access to our NPM Repository by adding this configuration file into your user folder, just replace the fields insede <>, and remenber all the tokens and passwords are encoded in Base 64

Code Block
languagetext
title.npmrc
collapsetrue
registry=https://repository.searchtechnologies.com/artifactory/api/npm/npm-virtual
_auth=<USERNAME:PASSWORD in base 64>
always-auth=true
email=<EMAIL>

@angular:registry=https://repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:_password=<PASSWORD_BASE64>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:username=<USERNAME>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:email=<EMAIL>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:always-auth=true

@angular-devkit:registry=https://repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:_password=<PASSWORD_BASE64>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:username=<USERNAME>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:email=<EMAIL>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:always-auth=true

@clr:registry=https://repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:_password=<PASSWORD_BASE64>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:username=<USERNAME>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:email=<EMAIL>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:always-auth=true

@material-extended:registry=https://repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:_password=<PASSWORD_BASE64>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:username=<USERNAME>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:email=<EMAIL>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:always-auth=true

@ng-select:registry=https://repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:_password=<PASSWORD_BASE64>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:username=<USERNAME>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:email=<EMAIL>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:always-auth=true

@ngx-translate:registry=https://repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:_password=<PASSWORD_BASE64>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:username=<USERNAME>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:email=<EMAIL>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:always-auth=true

@types:registry=https://repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:_password=<PASSWORD_BASE64>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:username=<USERNAME>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:email=<EMAIL>
//repository.searchtechnologies.com/artifactory/api/npm/npm-virtual/:always-auth=true


Adding the Angular Library Step-by-step guide

  1. Install angular-cli
    1. Code Block
      languagetext
      themeFadeToGrey
      npm i -g @angular/cli
  2. Cd to saga-server/src/main/resources/webapp/projects/saga-plugin/src/lib
    1. Cd to either the processors or the recognizers folder, denpending of the type of component you want to build
      1. Recognizers for tags
      2. Processors for pipelines
  3. Create a component
    1. Code Block
      languagetext
      themeFadeToGrey
      ng generate component --style=scss --skipTests=true --skipImport=true
  4. Cd to <component-name> folder
  5. Create a component (this will be the configuration dialog)
    1. The name must contain config dialog at the end of the name
    2. Code Block
      languagetext
      themeFadeToGrey
      ng generate component --style=scss --skipTests=true --skipImport=true
  6. Next open the file <component-name>-config-dialog.component.ts  
  7. Extend the component with ConfigDialogBase (the implementation is explain further in the document)
    1. Code Block
      languagetext
      themeFadeToGrey
      export class ComponentNameConfigDialogComponent extends ConfigDialogBase implements OnInit {
  8. Next go up one level and open the file <component-name>.component.ts  
  9. Extend the component with the right abstract class (each type implementation is specified further in the document)
    1. PluginComponent
    2. PatternComponent
  10. Open to projects/saga-plugin/src/lib/plugin.module.ts
    1. Import the components
    2. Code Block
      languagejs
      themeEclipse
      import {<component-name>Component} from './<processors or recognizers>/<component-name>/<component-name>.component';
import {<component-name>ConfigDialogComponent} from './<processors or recognizers>/<component-name>/<component-name>-config-dialog/<component-name>-config-dialog.component';
    3. Add the main component into the array called components 
    4. Code Block
      languagejs
      themeEclipse
      const components = [
  RegexComponent,
  .
  .
  .
  <component-name>Component
];
    5. Add the config dialog component into the array called entryComponents 
    6. Code Block
      languagejs
      themeEclipse
      const entryComponents = [
  PatternActionsDialogComponent,
  EntityActionsDialogComponent,
  .
  .
  .
  <component-name>ConfigDialogComponent
];

Content by Label
showLabelsfalse
max5
spacessaga131
showSpacefalse
sortmodified
reversetrue
typepage
cqllabel = "kb-how-to-article" and type = "page" and space = "saga131"
labelskb-how-to-article

Page properties
hiddentrue
Related issues