[AAE-11496] Move 'content-plugin' to projects folder as 'aca-content' (#2817)

* [AAE-11496] Move content-plugin to projects

* Fix unit test

.travis.yml

@@ -90,10 +90,10 @@ jobs:
       cache: false
 
     - stage: Quality and Unit tests
-      name: 'Unit tests: ACA'
+      name: 'Unit tests: aca-content'
       script:
         - npm ci
-        - ng test content-ce $TEST_OPTS
+        - ng test aca-content $TEST_OPTS
       cache: false
 
     - stage: e2e

angular.json

@@ -35,8 +35,7 @@
             ],
             "stylePreprocessorOptions": {
               "includePaths": [
-                "app/src/app/ui",
-                "app/src/app/content-plugin/ui",
+                "projects/aca-content/src/lib/ui",
                 "node_modules"
               ]
             },
@@ -113,6 +112,7 @@
               "app/src/assets/fonts/material-icons/material-icons.css",
               "app/src/assets/fonts/OpenSans/OpenSans.css",
               "node_modules/cropperjs/dist/cropper.min.css",
+              "projects/aca-content/src/lib/ui/application.scss",
               "app/src/styles.scss"
             ],
             "scripts": [
@@ -263,7 +263,7 @@
             "polyfills": "app/src/polyfills.ts",
             "stylePreprocessorOptions": {
               "includePaths": [
-                "app/src/app/content-plugin/ui",
+                "projects/aca-content/src/lib/ui/application.scss",
                 "node_modules"
               ]
             },
@@ -276,7 +276,8 @@
             "styles": [
               "app/src/assets/fonts/material-icons/material-icons.css",
               "app/src/assets/fonts/OpenSans/OpenSans.css",
-              "app/src/styles.scss"
+              "app/src/styles.scss",
+              "projects/aca-content/src/lib/ui/application.scss"
             ],
             "assets": [
               "app/src/assets",
@@ -593,6 +594,40 @@
           }
         }
       }
+    },
+    "aca-content": {
+      "projectType": "library",
+      "root": "projects/aca-content",
+      "sourceRoot": "projects/aca-content/src",
+      "prefix": "lib",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:ng-packagr",
+          "options": {
+            "project": "projects/aca-content/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "projects/aca-content/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "projects/aca-content/tsconfig.lib.json"
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "projects/aca-content/src/test.ts",
+            "tsConfig": "projects/aca-content/tsconfig.spec.json",
+            "karmaConfig": "projects/aca-content/karma.conf.js",
+            "styles": [
+              "projects/aca-content/src/lib/ui/application.scss"
+            ]
+          }
+        }
+      }
     }
   },
   "schematics": {

app/src/app/app.module.ts

@@ -53,14 +53,17 @@ import localeSv from '@angular/common/locales/sv';
 import { TranslateModule } from '@ngx-translate/core';
 import { RouterModule } from '@angular/router';
 import { AppComponent } from './app.components';
-import { CONTENT_LAYOUT_ROUTES } from './content-plugin/content.routes';
-import { ContentServiceExtensionModule } from './content-plugin/content-services-extension.module';
-import { CoreExtensionsModule } from './extensions/core.extensions.module';
-import { INITIAL_APP_STATE } from './content-plugin/store/initial-state';
+import {
+  ContentUrlService,
+  INITIAL_APP_STATE,
+  CONTENT_LAYOUT_ROUTES,
+  ContentServiceExtensionModule,
+  CoreExtensionsModule
+} from '@alfresco/aca-content';
 import { ContentVersionService } from '@alfresco/adf-content-services';
-import { ContentUrlService } from './content-plugin/services/content-url.service';
 import { STORE_INITIAL_APP_DATA } from '@alfresco/aca-shared/store';
 import { ShellModule, SHELL_APP_SERVICE, SHELL_AUTH_TOKEN } from '@alfresco/adf-core/shell';
+import { StoreDevtoolsModule } from '@ngrx/store-devtools';
 
 registerLocaleData(localeFr);
 registerLocaleData(localeDe);
@@ -87,6 +90,7 @@ registerLocaleData(localeSv);
     SharedModule.forRoot(),
     CoreExtensionsModule.forRoot(),
     environment.e2e ? NoopAnimationsModule : BrowserAnimationsModule,
+    !environment.production ? StoreDevtoolsModule.instrument({ maxAge: 25 }) : [],
     RouterModule.forRoot([], {
       useHash: true,
       enableTracing: false, // enable for debug only

app/src/styles.scss

@@ -1,11 +1,7 @@
 /* You can add global styles to this file, and also import other style files */
-@import 'app/content-plugin/ui/application';
-@import 'app/content-plugin/ui/variables/font-family';
-
 body,
 html {
   height: 100%;
-  font-family: $default-font-family;
 }
 
 body {

projects/aca-content/README.md

@@ -0,0 +1,24 @@
+# AcaContent
+
+This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 14.1.0.
+
+## Code scaffolding
+
+Run `ng generate component component-name --project aca-content` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project aca-content`.
+> Note: Don't forget to add `--project aca-content` or else it will be added to the default project in your `angular.json` file. 
+
+## Build
+
+Run `ng build aca-content` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Publishing
+
+After building your library with `ng build aca-content`, go to the dist folder `cd dist/aca-content` and run `npm publish`.
+
+## Running unit tests
+
+Run `ng test aca-content` 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.io/cli) page.

projects/aca-content/karma.conf.js

@@ -0,0 +1,32 @@
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/1.0/config/configuration-file.html
+
+module.exports = function (config) {
+  config.set({
+    basePath: '',
+    frameworks: ['jasmine', '@angular-devkit/build-angular'],
+    plugins: [
+      require('karma-jasmine'),
+      require('karma-chrome-launcher'),
+      require('karma-jasmine-html-reporter'),
+      require('karma-coverage-istanbul-reporter'),
+      require('@angular-devkit/build-angular/plugins/karma')
+    ],
+    client: {
+      clearContext: false // leave Jasmine Spec Runner output visible in browser
+    },
+    coverageIstanbulReporter: {
+      dir: require('path').join(__dirname, '../../coverage/aca-content'),
+      reports: ['html', 'lcovonly', 'text-summary'],
+      fixWebpackSourcePaths: true
+    },
+    reporters: ['progress', 'kjhtml'],
+    port: 9876,
+    colors: true,
+    logLevel: config.LOG_INFO,
+    autoWatch: true,
+    browsers: ['Chrome'],
+    singleRun: true,
+    restartOnFileChange: true
+  });
+};

projects/aca-content/ng-package.json

@@ -0,0 +1,10 @@
+{
+  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "../../dist/aca-content",
+  "lib": {
+    "styleIncludePaths": [
+      "projects/aca-content/src/lib/ui"
+    ],
+    "entryFile": "src/public-api.ts"
+  }
+}

projects/aca-content/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "aca-content",
+  "version": "0.0.1",
+  "peerDependencies": {
+    "@angular/common": "^14.1.0",
+    "@angular/core": "^14.1.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
+}

projects/aca-content/src/lib/aca-content.module.ts

@@ -23,9 +23,8 @@
  * along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { BrowserModule, HammerModule } from '@angular/platform-browser';
+import { HammerModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
-import { BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import {
   TRANSLATION_PROVIDER,
@@ -54,8 +53,8 @@ import { FavoriteLibrariesComponent } from './components/favorite-libraries/favo
 import { ViewProfileModule } from './components/view-profile/view-profile.module';
 
 import { AppStoreModule } from './store/app-store.module';
-import { MaterialModule } from '../material.module';
-import { CoreExtensionsModule } from '../extensions/core.extensions.module';
+import { MaterialModule } from './material.module';
+import { CoreExtensionsModule } from './extensions/core.extensions.module';
 import { AppInfoDrawerModule } from './components/info-drawer/info.drawer.module';
 import { DirectivesModule } from './directives/directives.module';
 import { ContextMenuModule } from './components/context-menu/context-menu.module';
@@ -75,12 +74,11 @@ import { FavoritesComponent } from './components/favorites/favorites.component';
 import { RecentFilesComponent } from './components/recent-files/recent-files.component';
 import { SharedFilesComponent } from './components/shared-files/shared-files.component';
 import { CreateFromTemplateDialogComponent } from './dialogs/node-template/create-from-template.dialog';
-import { environment } from '../../environments/environment';
 import { DetailsComponent } from './components/details/details.component';
 import { ContentUrlService } from './services/content-url.service';
 import { HomeComponent } from './components/home/home.component';
 
-import { registerLocaleData } from '@angular/common';
+import { CommonModule, registerLocaleData } from '@angular/common';
 import localeFr from '@angular/common/locales/fr';
 import localeDe from '@angular/common/locales/de';
 import localeIt from '@angular/common/locales/it';
@@ -115,7 +113,7 @@ import { ToggleInfoDrawerComponent } from './components/toolbar/toggle-info-draw
 import { ToggleJoinLibraryButtonComponent } from './components/toolbar/toggle-join-library/toggle-join-library-button.component';
 import { ToggleJoinLibraryMenuComponent } from './components/toolbar/toggle-join-library/toggle-join-library-menu.component';
 import { ViewNodeComponent } from './components/toolbar/view-node/view-node.component';
-import { CONTENT_ROUTES } from './content.routes';
+import { CONTENT_ROUTES } from './aca-content.routes';
 import { RouterModule } from '@angular/router';
 import { UploadFilesDialogComponent } from './components/upload-files-dialog/upload-files-dialog.component';
 import { SidenavWrapperComponent } from './components/sidenav/sidenav-wrapper/sidenav-wrapper.component';
@@ -140,8 +138,7 @@ registerLocaleData(localeSv);
 
 @NgModule({
   imports: [
-    BrowserModule,
-    environment.e2e ? NoopAnimationsModule : BrowserAnimationsModule,
+    CommonModule,
     FormsModule,
     ReactiveFormsModule,
     ContentModule.forRoot(),

projects/aca-content/src/lib/components/context-menu/context-menu.component.spec.ts

@@ -90,10 +90,10 @@ describe('ContextMenuComponent', () => {
     fixture.detectChanges();
     await fixture.whenStable();
 
-    const contextMenuElements = document.body.querySelector('.aca-context-menu').querySelectorAll('button');
+    const contextMenuElements = document.body.querySelector('.aca-context-menu')?.querySelectorAll('button');
 
-    expect(contextMenuElements.length).toBe(1);
-    expect(contextMenuElements[0].querySelector('span').innerText).toBe(contextItem.title);
+    expect(contextMenuElements?.length).toBe(1);
+    expect(contextMenuElements?.[0].querySelector('span')?.innerText).toBe(contextItem.title);
   });
 
   it('should run action with provided action id and correct payload', () => {

projects/aca-content/src/lib/components/context-menu/context-menu.module.ts

@@ -30,7 +30,7 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { MatListModule } from '@angular/material/list';
 import { MatMenuModule } from '@angular/material/menu';
-import { CoreExtensionsModule } from '../../../extensions/core.extensions.module';
+import { CoreExtensionsModule } from '../../extensions/core.extensions.module';
 import { AppCommonModule } from '../common/common.module';
 import { ContextMenuItemComponent } from './context-menu-item.component';
 import { OutsideEventDirective } from './context-menu-outside-event.directive';

projects/aca-content/src/lib/components/dl-custom-components/document-list-custom-components.module.ts

@@ -28,7 +28,7 @@ import { NgModule } from '@angular/core';
 import { CustomNameColumnComponent } from './name-column/name-column.component';
 import { LockedByModule } from '@alfresco/aca-shared';
 import { ContentModule } from '@alfresco/adf-content-services';
-import { MaterialModule } from '../../../material.module';
+import { MaterialModule } from '../../material.module';
 import { CoreModule } from '@alfresco/adf-core';
 import { ThumbnailColumnComponent } from './thumbnail-column/thumbnail-column.component';
 

projects/aca-content/src/lib/components/info-drawer/info.drawer.module.ts

@@ -29,7 +29,7 @@ import { ExtensionsModule } from '@alfresco/adf-extensions';
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { DirectivesModule } from '../../directives/directives.module';
-import { MaterialModule } from '../../../material.module';
+import { MaterialModule } from '../../material.module';
 import { CommentsTabComponent } from './comments-tab/comments-tab.component';
 import { MetadataTabComponent } from './metadata-tab/metadata-tab.component';
 import { LibraryMetadataTabComponent } from './library-metadata-tab/library-metadata-tab.component';