techlify-inventory-common 0.0.1

package/.editorconfig

@@ -0,0 +1,13 @@
+# Editor configuration, see http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

package/README.md

@@ -0,0 +1,27 @@
+# TechlifyServices
+
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 6.0.7.
+
+## Development server
+
+Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
+
+## Code scaffolding
+
+Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
+
+## Build
+
+Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
+
+## Running unit tests
+
+Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Running end-to-end tests
+
+Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

package/angular.json

@@ -0,0 +1,207 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "techlify-inventory-common": {
+      "root": "",
+      "sourceRoot": "src",
+      "projectType": "application",
+      "prefix": "app",
+      "schematics": {},
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/techlify-inventory-common",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "tsconfig.app.json",
+            "inlineStyleLanguage": "scss",
+            "assets": [
+              "src/favicon.ico",
+              "src/assets",
+              "src/.htaccess"
+            ],
+            "styles": [
+              "src/styles.scss",
+              "node_modules/bootstrap/dist/css/bootstrap.min.css"
+            ],
+            "scripts": [
+              "node_modules/bootstrap/dist/js/bootstrap.min.js"
+            ]
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb",
+                  "maximumError": "10kb"
+                }
+              ],
+              "serviceWorker": false,
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "staging": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb",
+                  "maximumError": "10kb"
+                }
+              ],
+              "serviceWorker": false,
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.staging.ts"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "buildOptimizer": false,
+              "optimization": false,
+              "vendorChunk": true,
+              "extractLicenses": false,
+              "sourceMap": true,
+              "namedChunks": true
+            },
+            "ci": {
+              "progress": false
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "buildTarget": "techlify-inventory-common:build:production"
+            },
+            "development": {
+              "buildTarget": "techlify-inventory-common:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "techlify-inventory-common:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "src/test.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "src/tsconfig.spec.json",
+            "karmaConfig": "src/karma.conf.js",
+            "styles": [
+              "src/styles.css"
+            ],
+            "scripts": [],
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ]
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "src/tsconfig.app.json",
+              "src/tsconfig.spec.json"
+            ],
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    },
+    "techlify-inventory-common-e2e": {
+      "root": "e2e/",
+      "projectType": "application",
+      "architect": {
+        "e2e": {
+          "builder": "@angular-devkit/build-angular:protractor",
+          "options": {
+            "protractorConfig": "e2e/protractor.conf.js",
+            "devServerTarget": "techlify-inventory-common:serve"
+          },
+          "configurations": {
+            "production": {
+              "devServerTarget": "techlify-inventory-common:serve:production"
+            }
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": "e2e/tsconfig.e2e.json",
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    },
+    "inventory-common": {
+      "projectType": "library",
+      "root": "projects/inventory-common",
+      "sourceRoot": "projects/inventory-common/src",
+      "prefix": "lib",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "project": "projects/inventory-common/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "projects/inventory-common/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "projects/inventory-common/tsconfig.lib.json"
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "tsConfig": "projects/inventory-common/tsconfig.spec.json",
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing"
+            ]
+          }
+        }
+      }
+    }
+  },
+  "cli": {
+    "analytics": "7345b177-b652-463a-b3a9-86a94e3dc50a"
+  }
+}

package/e2e/protractor.conf.js

@@ -0,0 +1,28 @@
+// Protractor configuration file, see link for more information
+// https://github.com/angular/protractor/blob/master/lib/config.ts
+
+const { SpecReporter } = require('jasmine-spec-reporter');
+
+exports.config = {
+  allScriptsTimeout: 11000,
+  specs: [
+    './src/**/*.e2e-spec.ts'
+  ],
+  capabilities: {
+    'browserName': 'chrome'
+  },
+  directConnect: true,
+  baseUrl: 'http://localhost:4200/',
+  framework: 'jasmine',
+  jasmineNodeOpts: {
+    showColors: true,
+    defaultTimeoutInterval: 30000,
+    print: function() {}
+  },
+  onPrepare() {
+    require('ts-node').register({
+      project: require('path').join(__dirname, './tsconfig.e2e.json')
+    });
+    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
+  }
+};

package/e2e/src/app.e2e-spec.ts

@@ -0,0 +1,14 @@
+import { AppPage } from './app.po';
+
+describe('workspace-project App', () => {
+  let page: AppPage;
+
+  beforeEach(() => {
+    page = new AppPage();
+  });
+
+  it('should display welcome message', () => {
+    page.navigateTo();
+    expect(page.getParagraphText()).toEqual('Welcome to techlify-services!');
+  });
+});

package/e2e/src/app.po.ts

@@ -0,0 +1,11 @@
+import { browser, by, element } from 'protractor';
+
+export class AppPage {
+  navigateTo() {
+    return browser.get('/');
+  }
+
+  getParagraphText() {
+    return element(by.css('app-root h1')).getText();
+  }
+}

package/e2e/tsconfig.e2e.json

@@ -0,0 +1,13 @@
+{
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../out-tsc/app",
+    "module": "commonjs",
+    "target": "es5",
+    "types": [
+      "jasmine",
+      "jasminewd2",
+      "node"
+    ]
+  }
+}

package/ng-package.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "./node_modules/ng-packagr/ng-package.schema.json",
+  "lib": {
+    "entryFile": "public_api.ts"
+  }
+}

package/package.json

@@ -0,0 +1,92 @@
+{
+  "name": "techlify-inventory-common",
+  "version": "0.0.1",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build:prod": "ng build -c production",
+    "build:staging": "ng build -c staging",
+    "watch": "ng build --watch --configuration development",
+    "lint": "ng lint && stylelint \"src/**/*.scss\"",
+    "test": "ng test",
+    "test:ci": "ng run ap-ui:test:ci",
+    "translations:extract": "ngx-translate-extract --input ./src --output ./src/translations/template.json --format=json --clean --sort",
+    "prettier": "prettier --write \"./src/**/*.{ts,js,html,scss}\"",
+    "prettier:check": "prettier --list-different \"./src/**/*.{ts,js,html,scss}\"",
+    "postinstall": "npm run prettier -s && husky install"
+  },
+  "private": false,
+  "dependencies": {
+    "@angular/animations": "~18.2.13",
+    "@angular/cdk": "~18.2.14",
+    "@angular/common": "~18.2.13",
+    "@angular/compiler": "~18.2.13",
+    "@angular/core": "~18.2.13",
+    "@angular/flex-layout": "^14.0.0-beta.40",
+    "@angular/forms": "~18.2.13",
+    "@angular/localize": "~18.2.13",
+    "@angular/material": "^18.2.14",
+    "@angular/platform-browser": "~18.2.13",
+    "@angular/platform-browser-dynamic": "~18.2.13",
+    "@angular/router": "~18.2.13",
+    "@ngx-translate/core": "^14.0.0",
+    "angular-google-charts": "^16.0.2",
+    "bootstrap": "5.3",
+    "dayjs": "^1.11.7",
+    "install": "^0.13.0",
+    "material-design-icons-iconfont": "^6.1.0",
+    "ngx-avatars": "^1.8.0",
+    "ngx-infinite-scroll": "^19.0.0",
+    "ngx-permissions": "^19.0.0",
+    "ngx-spinner": "^14.0.0",
+    "ngx-techlify-core": "^18.3.2",
+    "npm": "^11.3.0",
+    "rxjs": "^7.5.0",
+    "tslib": "^2.3.0",
+    "zone.js": "~0.14.10"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "~18.2.18",
+    "@angular-devkit/build-ng-packagr": "^0.1002.0",
+    "@angular-eslint/builder": "~14.0.3",
+    "@angular-eslint/eslint-plugin": "~14.0.3",
+    "@angular-eslint/eslint-plugin-template": "~14.0.3",
+    "@angular-eslint/schematics": "~14.0.3",
+    "@angular-eslint/template-parser": "~14.0.3",
+    "@angular/cli": "~18.2.18",
+    "@angular/compiler-cli": "~18.2.13",
+    "@angular/language-service": "~18.2.13",
+    "@biesbjerg/ngx-translate-extract": "^7.0.3",
+    "@biesbjerg/ngx-translate-extract-marker": "^1.0.0",
+    "@ngneat/until-destroy": "^9.0.0",
+    "@types/jasmine": "^4.0.0",
+    "@types/jasminewd2": "^2.0.8",
+    "@types/node": "^14.18.26",
+    "@typescript-eslint/eslint-plugin": "~5.34.0",
+    "@typescript-eslint/parser": "~5.34.0",
+    "eslint": "^8.3.0",
+    "eslint-plugin-import": "latest",
+    "eslint-plugin-jsdoc": "latest",
+    "eslint-plugin-prefer-arrow": "latest",
+    "https-proxy-agent": "^5.0.0",
+    "husky": "^8.0.1",
+    "jasmine-core": "~4.2.0",
+    "jasmine-spec-reporter": "~7.0.0",
+    "karma": "~6.4.0",
+    "karma-chrome-launcher": "~3.1.0",
+    "karma-coverage": "~2.2.0",
+    "karma-jasmine": "~5.1.0",
+    "karma-jasmine-html-reporter": "~2.0.0",
+    "karma-junit-reporter": "^2.0.1",
+    "ng-packagr": "^18.2.1",
+    "postcss": "^8.4.5",
+    "prettier": "^2.2.1",
+    "pretty-quick": "^3.1.0",
+    "stylelint": "~14.11.0",
+    "stylelint-config-prettier": "^9.0.3",
+    "stylelint-config-recommended-scss": "~7.0.0",
+    "stylelint-config-standard": "~28.0.0",
+    "ts-node": "^10.1.0",
+    "typescript": "~5.4.5"
+  }
+}

package/projects/inventory-common/README.md

@@ -0,0 +1,24 @@
+# InventoryCommon
+
+This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 18.2.0.
+
+## Code scaffolding
+
+Run `ng generate component component-name --project inventory-common` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project inventory-common`.
+> Note: Don't forget to add `--project inventory-common` or else it will be added to the default project in your `angular.json` file. 
+
+## Build
+
+Run `ng build inventory-common` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Publishing
+
+After building your library with `ng build inventory-common`, go to the dist folder `cd dist/inventory-common` and run `npm publish`.
+
+## Running unit tests
+
+Run `ng test inventory-common` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.

package/projects/inventory-common/ng-package.json

@@ -0,0 +1,7 @@
+{
+  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "../../dist/inventory-common",
+  "lib": {
+    "entryFile": "src/public-api.ts"
+  }
+}

package/projects/inventory-common/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "techlify-inventory-common",
+  "version": "18.1.8",
+  "peerDependencies": {
+    "@angular/common": "^18.2.0",
+    "@angular/core": "^18.2.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "sideEffects": false
+}

package/projects/inventory-common/src/lib/inventory-common/category/category-form/category-form.component.html

@@ -0,0 +1,41 @@
+<form
+  [formGroup]="form"
+  (submit)="save()"
+  class="d-flex flex-column justify-content-start"
+>
+  <mat-form-field>
+    <mat-label>Title</mat-label>
+    <input type="text" matInput formControlName="title" placeholder="Title" />
+    <mat-error *ngIf="isFieldValid('title')">
+      {{ getErrorMessage("title") }}
+    </mat-error>
+  </mat-form-field>
+
+  <mat-form-field>
+    <mat-label>Description</mat-label>
+    <textarea
+      matInput
+      formControlName="description"
+      placeholder="Description"
+    ></textarea>
+  </mat-form-field>
+
+  <div class="d-flex justify-content-end align-items-center gap-2">
+    <button
+      [disabled]="isSaving"
+      type="submit"
+      mat-raised-button
+      color="primary"
+    >
+      Save
+    </button>
+    <button
+      [disabled]="isSaving"
+      type="button"
+      mat-flat-button
+      (click)="cancelled.emit()"
+    >
+      Cancel
+    </button>
+  </div>
+</form>

package/projects/inventory-common/src/lib/inventory-common/category/category-form/category-form.component.ts

@@ -0,0 +1,75 @@
+import { Component, EventEmitter, Input, OnInit, Output } from "@angular/core";
+import {
+  AlertService,
+  FormValidatorService,
+  TechlifyFormComponentInterface,
+} from "ngx-techlify-core";
+import { FormBuilder, Validators } from "@angular/forms";
+import { CategoryService } from "../category.service";
+import { Observable } from "rxjs";
+
+@Component({
+  selector: "app-category-form",
+  templateUrl: "./category-form.component.html",
+  styleUrls: ["./category-form.component.scss"],
+})
+export class CategoryFormComponent
+  extends TechlifyFormComponentInterface
+  implements OnInit
+{
+  @Input() category: any;
+  @Output() saved: EventEmitter<any> = new EventEmitter<any>();
+  @Output() cancelled: EventEmitter<any> = new EventEmitter<any>();
+
+  isSaving: boolean = false;
+  constructor(
+    formValidatorService: FormValidatorService,
+    private formBuilder: FormBuilder,
+    private categoryService: CategoryService,
+    private alertService: AlertService
+  ) {
+    super(formValidatorService);
+    this.errorMessages = {
+      title: {
+        required: "The title field is required.",
+      },
+    };
+
+    this.form = this.formBuilder.group({
+      id: [""],
+      title: ["", Validators.required],
+      description: [""],
+    });
+  }
+
+  save() {
+    this.form.markAllAsTouched();
+    if (this.form.invalid) {
+      this.alertService.addAlert("Please check the form for errors.", "error");
+      return;
+    }
+
+    this.isSaving = true;
+    const data: any = { ...this.form.value };
+    let request: Observable<any> = this.categoryService.store(data);
+    if (this.category?.id) {
+      request = this.categoryService.update(data);
+    }
+    request.subscribe({
+      next: (response: any) => {
+        this.isSaving = false;
+        this.alertService.addAlert("Category saved successfully!", "success");
+        this.saved.emit(response?.item);
+      },
+      error: () => {
+        this.isSaving = false;
+      },
+    });
+  }
+
+  ngOnInit(): void {
+    if (this.category) {
+      this.form.patchValue({ ...this.category });
+    }
+  }
+}

package/projects/inventory-common/src/lib/inventory-common/category/category-form-button/category-form-button.component.html

@@ -0,0 +1,32 @@
+<mat-icon
+  *ngIf="!category"
+  color="primary"
+  class="cursor-pointer"
+  (click)="showCategoryForm(categoryFormTemplate)"
+>
+  add
+</mat-icon>
+
+<mat-icon
+  *ngIf="category"
+  class="cursor-pointer"
+  (click)="showCategoryForm(categoryFormTemplate)"
+>
+  edit
+</mat-icon>
+
+<ng-template #categoryFormTemplate>
+  <h3 mat-dialog-title class="mb-0">
+    {{ category ? "Edit" : "Create" }} Category
+  </h3>
+  <small class="text-secondary mb-1">
+    Note that category names are unique and cannot be duplicated.
+  </small>
+  <div mat-dialog-content>
+    <app-category-form
+      [category]="category"
+      (saved)="onCategorySaved($event)"
+      (cancelled)="matDialog.closeAll()"
+    ></app-category-form>
+  </div>
+</ng-template>

package/projects/inventory-common/src/lib/inventory-common/category/category-form-button/category-form-button.component.ts

@@ -0,0 +1,29 @@
+import {
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+  TemplateRef,
+} from "@angular/core";
+import { MatDialog } from "@angular/material/dialog";
+
+@Component({
+  selector: "app-category-form-button",
+  templateUrl: "./category-form-button.component.html",
+  styleUrls: ["./category-form-button.component.scss"],
+})
+export class CategoryFormButtonComponent {
+  @Input() category: any;
+  @Output() saved: EventEmitter<any> = new EventEmitter<any>();
+
+  constructor(public matDialog: MatDialog) {}
+
+  showCategoryForm(templateRef: TemplateRef<any>) {
+    this.matDialog.open(templateRef, { width: "400px" });
+  }
+
+  onCategorySaved(category: any) {
+    this.matDialog.closeAll();
+    this.saved.emit(category);
+  }
+}