Merge branch 'pages' into 'feature/angular'

Create a successful deployment

Once the deployment successfully shows up at https://natoboram.gitlab.io/public-gateway-cacher, I'll be ready to merge this pull request and move forward with the IPFS integration.

Closes #1.

See merge request NatoBoram/public-gateway-cacher!1

.gitlab-ci.yml

@@ -4,6 +4,10 @@ before_script:
   - yarn
 
 cache:
+  key:
+    files:
+      - package.json
+      - yarn.lock
   paths:
     - node_modules
 
@@ -28,7 +32,7 @@ pages:
     - cp public/index.html public/404.html
   artifacts:
     paths:
-      - dist/public
+      - public
   only:
     - master
     - pages

angular.json

@@ -47,12 +47,70 @@
               ],
               "optimization": true,
               "outputHashing": "all",
-              "sourceMap": false,
+              "sourceMap": true,
               "extractCss": true,
-              "namedChunks": false,
+              "namedChunks": true,
               "aot": true,
               "extractLicenses": true,
-              "vendorChunk": false,
+              "vendorChunk": true,
+              "buildOptimizer": true,
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb",
+                  "maximumError": "10kb"
+                }
+              ]
+            },
+            "gitlab": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.gitlab.ts"
+                }
+              ],
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": true,
+              "extractCss": true,
+              "namedChunks": true,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": true,
+              "buildOptimizer": true,
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "2mb",
+                  "maximumError": "5mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb",
+                  "maximumError": "10kb"
+                }
+              ]
+            },
+            "ipfs": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.ipfs.ts"
+                }
+              ],
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": true,
+              "extractCss": true,
+              "namedChunks": true,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": true,
               "buildOptimizer": true,
               "budgets": [
                 {

package.json

@@ -4,9 +4,10 @@
   "scripts": {
     "ng": "ng",
     "start": "ng serve --ssl",
-    "build": "ng build",
+    "build": "ng build --base-href /",
-    "build:prod": "ng build --prod",
+    "build:prod": "ng build --configuration=production --base-href /",
-    "build:gitlab": "ng build --prod --base-href /public-gateway-cacher/",
+    "build:gitlab": "ng build --configuration=gitlab --base-href /public-gateway-cacher/",
+    "build:ipfs": "ng build --configuration=ipfs",
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e",

src/app/app-routing.module.ts

@@ -1,5 +1,6 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
+import { environment } from '../environments/environment';
 
 const routes: Routes = [{
   path: '',
@@ -7,7 +8,7 @@ const routes: Routes = [{
 }];
 
 @NgModule({
-  imports: [RouterModule.forRoot(routes, { useHash: true })],
+  imports: [RouterModule.forRoot(routes, { useHash: environment.useHash })],
   exports: [RouterModule]
 })
 export class AppRoutingModule { }

src/app/interfaces/environment.ts

@@ -0,0 +1,5 @@
+export interface Environment {
+  production: boolean;
+  base_href?: string;
+  useHash: boolean;
+}

src/app/pages/pages.component.html

@@ -3,7 +3,7 @@
   <h1>Public IPFS Cacher</h1>
 
   <!-- IPFS -->
-  <form fxLayout="row" fxLayoutAlign="space-evenly center" fxLayoutGap="1em" (submit)="cacheIPFS()">
+  <form fxLayout="row" fxLayoutAlign="space-evenly center" fxLayoutGap="1em">
 
     <!-- Hash -->
     <mat-form-field>
@@ -12,12 +12,12 @@
     </mat-form-field>
 
     <!-- Cache -->
-    <button mat-flat-button color="primary" type="submit">Cache</button>
+    <button mat-flat-button color="primary" type="button" (click)="cacheIPFS()">Cache</button>
 
   </form>
 
   <!-- IPNS -->
-  <form fxLayout="row" fxLayoutAlign="space-evenly center" fxLayoutGap="1em" (submit)="cacheIPNS()">
+  <form fxLayout="row" fxLayoutAlign="space-evenly center" fxLayoutGap="1em">
 
     <!-- Hash -->
     <mat-form-field>
@@ -26,7 +26,7 @@
     </mat-form-field>
 
     <!-- Cache -->
-    <button mat-flat-button color="primary" type="submit">Cache</button>
+    <button mat-flat-button color="primary" type="button" (click)="cacheIPNS()">Cache</button>
 
   </form>
 

src/app/services/gateway.service.ts

@@ -1,6 +1,7 @@
 import { HttpClient } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { Observable } from 'rxjs';
+import { environment } from '../../environments/environment';
 
 @Injectable({
   providedIn: 'root'
@@ -12,7 +13,11 @@ export class GatewayService {
   ) { }
 
   list(): Observable<string[]> {
-    return this.http.get<string[]>('/assets/json/gateways.json');
+    return this.http.get<string[]>(
+      environment.base_href && environment.base_href !== '/'
+        ? `${environment.base_href}/assets/json/gateways.json`
+        : '/assets/json/gateways.json'
+    );
   }
 
   get(gateway: string, type: string, hash: string): Observable<Blob> {

src/environments/environment.gitlab.ts

@@ -0,0 +1,7 @@
+import { Environment } from '../app/interfaces/environment';
+
+export const environment: Environment = {
+  production: true,
+  base_href: '/public-gateway-cacher',
+  useHash: false,
+};

src/environments/environment.ipfs.ts

@@ -0,0 +1,6 @@
+import { Environment } from '../app/interfaces/environment';
+
+export const environment: Environment = {
+  production: true,
+  useHash: true,
+};

src/environments/environment.prod.ts

@@ -1,3 +1,7 @@
-export const environment = {
+import { Environment } from '../app/interfaces/environment';
-  production: true
+
+export const environment: Environment = {
+  production: true,
+  base_href: '/',
+  useHash: false,
 };

src/environments/environment.ts

@@ -1,9 +1,13 @@
+import { Environment } from '../app/interfaces/environment';
+
 // This file can be replaced during build by using the `fileReplacements` array.
 // `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
 // The list of file replacements can be found in `angular.json`.
 
-export const environment = {
+export const environment: Environment = {
-  production: false
+  production: false,
+  base_href: '/',
+  useHash: false,
 };
 
 /*