Angular upgrade: this connects to #83 and this connects to #86

README.md

@@ -91,13 +91,15 @@ To change the default configuration values, create local files that override the
 To use the configuration parameters in your component:
 
 ```bash
-import { GlobalConfig } from "../config";
+import { GLOBAL_CONFIG, GlobalConfig } from '../config';
+
+constructor(@Inject(GLOBAL_CONFIG) public config: GlobalConfig) {}
 ```
 
 Running the app
 ---------------
 
-After you have installed all dependencies you can now run the app. Run `yarn run watch:dev` to start a local server which will watch for changes, rebuild the code, and reload the server for you. You can visit it at `http://localhost:3000`.
+After you have installed all dependencies you can now run the app. Run `yarn run watch` to start a local server which will watch for changes, rebuild the code, and reload the server for you. You can visit it at `http://localhost:3000`.
 
 Running in production mode
 --------------------------
@@ -113,7 +115,7 @@ yarn start
 If you only want to build for production, without starting, run:
 
 ```bash
-yarn run build:prod:ngc:json
+yarn run build:prod
 ```
 
 This will build the application and put the result in the `dist` folder
@@ -155,7 +157,7 @@ If you are going to use a remote test enviroment you need to edit the './protrac
 
 The default browser is Google Chrome.
 
-Protractor needs a functional instance of the DSpace interface to run the E2E tests, so you need to run:`yarn run watch:dev`
+Protractor needs a functional instance of the DSpace interface to run the E2E tests, so you need to run:`yarn run watch`
 
 or any command that bring up the DSpace interface.
 
@@ -171,6 +173,17 @@ To run all the tests (e.g.: to run tests with Continuous Integration software) y
 
 Run:`yarn run docs` to produce the documentation that will be available in the 'doc' folder.
 
+Deploy
+------
+
+```bash
+# deploy production in standalone pm2 container
+yarn run deploy
+
+# remove production from standalone pm2 container
+yarn run undeploy
+```
+
 Other commands
 --------------
 
@@ -204,83 +217,98 @@ File Structure
 ```
 dspace-angular
 ├── README.md                                           * This document
-├── app.json                                            * Application manifest file
+├── app.yaml                                            * Application manifest file
 ├── config                                              * Folder for configuration files
-│   └── environment.default.js                          * Default configuration files
-├── dist                                                * Folder for e2e test files
-├── e2e                                                 *
+│   ├── environment.default.js                          * Default configuration files
+│   └── environment.test.js                             * Test configuration files
+├── e2e                                                 * Folder for e2e test files
 │   ├── app.e2e-spec.ts                                 *
 │   ├── app.po.ts                                       *
 │   ├── pagenotfound                                    *
 │   │   ├── pagenotfound.e2e-spec.ts                    *
 │   │   └── pagenotfound.po.ts                          *
-│   └── tsconfig.json                                   *
-├── empty.js                                            *
-├── helpers.js                                          *
-├── karma.conf.js                                       * Unit Test configuration file
+│   └── tsconfig.json                                   * TypeScript configuration file for e2e tests
+├── karma.conf.js                                       * Karma configuration file for Unit Test
 ├── nodemon.json                                        * Nodemon (https://nodemon.io/) configuration
 ├── package.json                                        * This file describes the npm package for this project, its dependencies, scripts, etc.
-├── postcss.config.json                                 * PostCSS (http://postcss.org/) configuration file
-├── protractor.conf.js                                  * E2E tests configuration file
+├── postcss.config.js                                   * PostCSS (http://postcss.org/) configuration file
+├── protractor.conf.js                                  *
 ├── resources                                           * Folder for static resources
+│   ├── data                                            * Folder for static data
+│   │   └── en                                          * Folder for i18n English data
 │   ├── i18n                                            * Folder for i18n translations
-│   │   └── en.json                                     *
+│   │   └── en.json                                     * i18n translations for English
 │   └── images                                          * Folder for images
-│       └── dspace_logo.png                             *
-├── rollup-client.js                                    * Rollup (http://rollupjs.org/) configuration for the client
-├── rollup-server.js                                    * Rollup (http://rollupjs.org/) configuration for the server
+│       ├── dspace-logo-old.png                         *
+│       ├── dspace-logo.png                             *
+│       └── favicon.ico                                 *
+├── rollup.config.js                                    * Rollup (http://rollupjs.org/) configuration
 ├── spec-bundle.js                                      *
 ├── src                                                 * The source of the application
-│   ├── app                                             * The location of the app module, and root of the application shared by client and server
+│   ├── app                                             *
 │   │   ├── app-routing.module.ts                       *
 │   │   ├── app.component.html                          *
 │   │   ├── app.component.scss                          *
 │   │   ├── app.component.spec.ts                       *
 │   │   ├── app.component.ts                            *
 │   │   ├── app.effects.ts                              *
 │   │   ├── app.module.ts                               *
-│   │   ├── app.reducers.ts                             *
+│   │   ├── app.reducer.ts                              *
+│   │   ├── browser-app.module.ts                       * The root module for the client
+│   │   ├── collection-page                             *
+│   │   ├── community-page                              *
 │   │   ├── core                                        *
 │   │   ├── header                                      *
 │   │   ├── home                                        *
+│   │   ├── item-page                                   *
+│   │   ├── object-list                                 *
 │   │   ├── pagenotfound                                *
+│   │   ├── server-app.module.ts                        * The root module for the server
 │   │   ├── shared                                      *
-│   │   └── store.actions.ts                            *
+│   │   ├── store.actions.ts                            *
+│   │   ├── store.effects.ts                            *
+│   │   ├── thumbnail                                   *
+│   │   └── typings.d.ts                                * File that allows you to add custom typings for libraries without TypeScript support
 │   ├── backend                                         * Folder containing a mock of the REST API, hosted by the express server
 │   │   ├── api.ts                                      *
-│   │   ├── bitstreams.ts                               *
-│   │   ├── bundles.ts                                  *
 │   │   ├── cache.ts                                    *
-│   │   ├── collections.ts                              *
-│   │   ├── db.ts                                       *
-│   │   ├── items.ts                                    *
-│   │   └── metadata.ts                                 *
-│   ├── client.aot.ts                                   * The bootstrap file for the client, in production
-│   ├── client.ts                                       * The bootstrap file for the client, during development
+│   │   ├── data                                        *
+│   │   └── db.ts                                       *
+│   ├── config                                          *
+│   │   ├── cache-config.interface.ts                   *
+│   │   ├── global-config.interface.ts                  *
+│   │   └── server-config.interface.ts                  *
 │   ├── config.ts                                       * File that loads environmental and shareable settings and makes them available to app components
 │   ├── index.html                                      * The index.html file
-│   ├── platform                                        *
-│   │   ├── angular2-meta.ts                            *
-│   │   ├── modules                                     *
-│   │   │   ├── browser.module.ts                       * The root module for the client
-│   │   │   └── node.module.ts                          * The root module for the server
-│   │   └── workarounds                                 *
-│   │       ├── __workaround.browser.ts                 *
-│   │       └── __workaround.node.ts                    *
-│   ├── server.aot.ts                                   * The express (http://expressjs.com/) config and bootstrap file for the server, in production
-│   ├── server.routes.ts                                * The routes file for the server
-│   ├── server.ts                                       * The express (http://expressjs.com/) config and bootstrap file for the server, during development
-│   ├── styles                                          * Folder containing global styles.
-│   │   ├── main.scss                                   * Global scss file
+│   ├── main.browser.ts                                 * The bootstrap file for the client
+│   ├── main.server.aot.ts                              * The express (http://expressjs.com/) config and bootstrap file for the server, in production
+│   ├── main.server.ts                                  * The express (http://expressjs.com/) config and bootstrap file for the server, during development
+│   ├── modules                                         *
+│   │   ├── cookies                                     *
+│   │   ├── data-loader                                 *
+│   │   ├── transfer-http                               *
+│   │   ├── transfer-state                              *
+│   │   ├── transfer-store                              *
+│   │   └── translate-universal-loader.ts               *
+│   ├── routes.ts                                       * The routes file for the server
+│   ├── styles                                          * Folder containing global styles
+│   │   ├── _mixins.scss                                *
 │   │   └── variables.scss                              * Global sass variables file
-│   └── typings.d.ts                                    * File that allows you to add custom typings for libraries without TypeScript support
-├── tsconfig.aot.json                                   * TypeScript config for production builds
-├── tsconfig.json                                       * TypeScript config for development build
+│   ├── tsconfig.browser.json                           * TypeScript config for the client build
+│   ├── tsconfig.server.aot.json                        * TypeScript config for the server build with Ahead of Time
+│   ├── tsconfig.server.json                            * TypeScript config for the server build
+│   └── tsconfig.test.json                              * TypeScript config for the test build
+├── tsconfig.json                                       * TypeScript config
 ├── tslint.json                                         * TSLint (https://palantir.github.io/tslint/) configuration
 ├── typedoc.json                                        * TYPEDOC configuration
-├── webpack.config.ts                                   * Webpack (https://webpack.github.io/) config for development builds
-├── webpack.prod.config.ts                              * Webpack (https://webpack.github.io/) config for production builds
-├── webpack.test.config.js                              * Webpack (https://webpack.github.io/) config for testing
+├── webpack                                             * Webpack (https://webpack.github.io/) config directory
+│   ├── helpers.js                                      *
+│   ├── webpack.client.js                               * Webpack (https://webpack.github.io/) config for client build
+│   ├── webpack.common.js                               *
+│   ├── webpack.prod.js                                 * Webpack (https://webpack.github.io/) config for production build
+│   ├── webpack.server.js                               * Webpack (https://webpack.github.io/) config for server build
+│   └── webpack.test.js                                 * Webpack (https://webpack.github.io/) config for test build
+├── webpack.config.ts                                   *
 └── yarn.lock                                           * Yarn lockfile (https://yarnpkg.com/en/docs/yarn-lock)
 ```
 

app.yaml

@@ -0,0 +1,17 @@
+# Copyright 2015-2016, Google, Inc.
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#    http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+
+# [START app_yaml]
+runtime: nodejs
+env: flex
+# [END app_yaml]

config/environment.default.js

@@ -1,28 +1,38 @@
 module.exports = {
-  // The REST API server settings.
-  "rest": {
-    "ssl": false,
-    "address": "dspace7.4science.it",
-    "port": 80,
+  // Angular Universal server settings.
+  ui: {
+    ssl: false,
+    host: 'localhost',
+    port: 3000,
     // NOTE: Space is capitalized because 'namespace' is a reserved string in TypeScript
-    "nameSpace": "/dspace-spring-rest/api"
+    nameSpace: '/'
   },
-  // Angular2 UI server settings.
-  "ui": {
-    "ssl": false,
-    "address": "localhost",
-    "port": 3000,
+  // The REST API server settings.
+  rest: {
+    ssl: false,
+    host: 'dspace7.4science.it',
+    port: 80,
     // NOTE: Space is capitalized because 'namespace' is a reserved string in TypeScript
-    "nameSpace": "/"
+    nameSpace: '/dspace-spring-rest/api'
+  },
+  // Caching settings
+  cache: {
+    // NOTE: how long should objects be cached for by default
+    msToLive: 15 * 60 * 1000, // 15 minute
+    control: 'max-age=60' // revalidate browser
   },
-  "cache": {
-    // how long should objects be cached for by default
-    "msToLive": 15 * 60 * 1000, // 15 minute
-    "control": "max-age=60" // revalidate browser
+  // Angular Universal settings
+  universal: {
+    preboot: true,
+    async: true,
+    time: false
   },
-  "universal": {
-    // Angular Universal settings
-    "preboot": true,
-    "async": true
-  }
+  // Log directory
+  logDirectory: '.',
+  // NOTE: rehydrate or replay
+  // rehydrate will transfer prerender state to browser state, actions do not need to replay
+  // replay will transfer an array of actions to browser, actions replay automatically
+  prerenderStrategy: 'rehydrate',
+  // NOTE: will log all redux actions and transfers in console
+  debug: false
 };

config/environment.test.js

@@ -0,0 +1,3 @@
+module.exports = {
+
+};

e2e/app.e2e-spec.ts

@@ -1,6 +1,6 @@
 import { ProtractorPage } from './app.po';
 
-describe('protractor App', function() {
+describe('protractor App', () => {
   let page: ProtractorPage;
 
   beforeEach(() => {
@@ -9,11 +9,11 @@ describe('protractor App', function() {
 
   it('should display title "DSpace"', () => {
     page.navigateTo();
-    expect(page.getPageTitleText()).toEqual('DSpace');
+    expect<any>(page.getPageTitleText()).toEqual('DSpace');
   });
 
   it('should display header "Welcome to DSpace"', () => {
     page.navigateTo();
-    expect(page.getFirstHeaderText()).toEqual('Welcome to DSpace');
+    expect<any>(page.getFirstHeaderText()).toEqual('Welcome to DSpace');
   });
 });

e2e/pagenotfound/pagenotfound.e2e-spec.ts

@@ -1,19 +1,19 @@
 import { ProtractorPage } from './pagenotfound.po';
 
-describe('protractor PageNotFound', function() {
+describe('protractor PageNotFound', () => {
   let page: ProtractorPage;
 
   beforeEach(() => {
     page = new ProtractorPage();
   });
 
-  it('should contain element ds-pagenotfound when navigating to page that doesnt exist"', () => {
+  it('should contain element ds-pagenotfound when navigating to page that doesnt exist', () => {
     page.navigateToNonExistingPage();
-    expect(page.elementTagExists("ds-pagenotfound")).toEqual(true);
+    expect<any>(page.elementTagExists('ds-pagenotfound')).toEqual(true);
   });
 
-  it('should not contain element ds-pagenotfound when navigating to existing page"', () => {
+  it('should not contain element ds-pagenotfound when navigating to existing page', () => {
     page.navigateToExistingPage();
-    expect(page.elementTagExists("ds-pagenotfound")).toEqual(false);
+    expect<any>(page.elementTagExists('ds-pagenotfound')).toEqual(false);
   });
 });

e2e/pagenotfound/pagenotfound.po.ts

@@ -1,8 +1,8 @@
 import { browser, element, by } from 'protractor';
 
 export class ProtractorPage {
-  HOMEPAGE : string = "/home";
-  NONEXISTINGPAGE : string = "/e9019a69-d4f1-4773-b6a3-bd362caa46f2";
+  HOMEPAGE = '/home';
+  NONEXISTINGPAGE = '/e9019a69-d4f1-4773-b6a3-bd362caa46f2';
 
   navigateToNonExistingPage() {
     return browser.get(this.NONEXISTINGPAGE);
@@ -11,9 +11,8 @@ export class ProtractorPage {
     return browser.get(this.HOMEPAGE);
   }
 
-  elementTagExists(tag : string) {
+  elementTagExists(tag: string) {
     return element(by.tagName(tag)).isPresent();
   }
 
-
-}
+}