features/sync (#2)

* chore: version bump

* build: set up github release from gren config

* feat: github base api setup

* feat(wip): setup add update gists service and settings

* feat(wip): load remote gist

Author: lokesh-coder

.gitignore

@@ -4,6 +4,7 @@
 /dist
 /tmp
 /out-tsc
+src/environments/secrets.ts
 
 # dependencies
 /node_modules
@@ -34,6 +35,7 @@ npm-debug.log
 yarn-error.log
 testem.log
 /typings
+.env
 
 # System Files
 .DS_Store

config/env.secrets.ts

@@ -0,0 +1,17 @@
+import { writeFile } from 'fs';
+import { argv } from 'yargs';
+
+require('dotenv').config();
+
+const targetPath = `./src/environments/secrets.ts`;
+const envConfigFile = `
+export const githubClientSecret= '${process.env.GITHUB_CLIENT_SECRET}';
+export const githubClientID= '${process.env.GITHUB_CLIENT_ID}';
+`;
+writeFile(targetPath, envConfigFile, function(err) {
+  if (err) {
+    console.log(err);
+  }
+
+  console.log(`secrets file generated at ${targetPath}`);
+});

config/proxy.conf.json

@@ -0,0 +1,9 @@
+{
+  "/ghtoken/*": {
+    "target": "https://github.com/login/oauth/access_token",
+    "secure": false,
+    "logLevel": "debug",
+    "changeOrigin": true,
+    "pathRewrite": { "^/ghtoken": "" }
+  }
+}

package-lock.json

@@ -4,7 +4,9 @@
   "main": "main.js",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve",
+    "config:secrets": "ts-node ./config/env.secrets.ts",
+    "start":
+      "npm run config:secrets && ng serve --proxy-config config/proxy.conf.json -o --host=0.0.0.0 --disable-host-check",
     "build": "ng build",
     "test": "ng test",
     "lint": "ng lint",
@@ -31,6 +33,8 @@
     "@angular/platform-browser-dynamic": "^6.0.0",
     "@angular/pwa": "^0.6.5",
     "@angular/router": "^6.0.0",
+    "@angular/service-worker": "^6.0.0",
+    "@auth0/angular-jwt": "^2.0.0",
     "@ctrl/tinycolor": "^2.0.0",
     "@ngxs/devtools-plugin": "^3.0.1",
     "@ngxs/store": "^3.0.1",
@@ -41,6 +45,7 @@
     "babel-polyfill": "^6.26.0",
     "bootstrap": "^4.1.1",
     "core-js": "^2.5.4",
+    "deepmerge": "^2.1.1",
     "fuse.js": "^3.2.0",
     "gun": "^0.9.996",
     "keypress.js": "^2.1.5",
@@ -56,8 +61,7 @@
     "relational-pouch": "^3.0.1",
     "rxdb": "^7.6.0",
     "rxjs": "^6.0.0",
-    "zone.js": "^0.8.26",
-    "@angular/service-worker": "^6.0.0"
+    "zone.js": "^0.8.26"
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "~0.6.0",
@@ -72,6 +76,7 @@
     "@types/node": "~8.9.4",
     "@types/pouchdb": "^6.3.2",
     "codelyzer": "~4.2.1",
+    "dotenv": "^5.0.1",
     "electron": "^2.0.2",
     "github-release-notes": "^0.15.0",
     "husky": "^0.14.3",

package.json

@@ -1,6 +1,6 @@
 import { Component, OnInit, NgZone } from '@angular/core';
 import { Store } from '@ngxs/store';
-import { ChangeView, LoadSettings } from './store/actions/settings.action';
+import { LoadSettings } from './store/actions/settings.action';
 import { InkAppView, InkDb } from './models';
 import { DBService } from './services/db.service';
 import { tap } from 'rxjs/operators';
@@ -21,7 +21,9 @@ export class InkApp implements OnInit {
   }
   ngOnInit() {
     this._settingsService.setDefaultSettings().then((doc: any) => {
-      if (doc) { this._store.dispatch(new LoadSettings(doc)); }
+      if (doc) {
+        this._store.dispatch(new LoadSettings(doc));
+      }
     });
   }
 }

src/app/ink.component.ts

@@ -1,7 +1,9 @@
 import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
+import { HttpClientModule } from '@angular/common/http';
 import { BrowserModule } from '@angular/platform-browser';
 import { NgxsModule } from '@ngxs/store';
+import { JwtModule } from '@auth0/angular-jwt';
 import { ClipboardModule } from 'ngx-clipboard';
 import { NgxsReduxDevtoolsPluginModule } from '@ngxs/devtools-plugin';
 import {
@@ -20,21 +22,34 @@ import { RoutingModule } from './ink.routing';
 import { HomePage } from './pages/home/home.component';
 import { SettingsPage } from './pages/settings/settings.component';
 import { ExportPage } from './pages/export/export.component';
+import { RedirectPage } from './pages/redirect/redirect.component';
 import { SettingsState, BucketState, BoardState, InkState } from './store/states';
 import { ColorModule } from './modules/color/color.module';
 
 import { OverlayModule } from '@angular/cdk/overlay';
 import { ServiceWorkerModule } from '@angular/service-worker';
 import { environment } from '../environments/environment';
 
+export function tokenGetter() {
+  return localStorage.getItem('inkapp_access_token');
+}
+
 export const MODULES = [
+  BrowserModule,
   RoutingModule,
+  HttpClientModule,
   FormsModule,
   NgxsModule.forRoot([SettingsState, BucketState, BoardState, InkState]),
   NgxsReduxDevtoolsPluginModule.forRoot(),
   ColorModule,
   ClipboardModule,
-  OverlayModule
+  OverlayModule,
+  JwtModule.forRoot({
+    config: {
+      tokenGetter: tokenGetter,
+      whitelistedDomains: ['github.com']
+    }
+  })
 ];
 export const COMPONENTS = [
   InkApp,
@@ -48,11 +63,11 @@ export const COMPONENTS = [
   MagicTitleComponent,
   SettingsItemComponent
 ];
-export const PAGES = [HomePage, SettingsPage, ExportPage];
+export const PAGES = [HomePage, SettingsPage, ExportPage, RedirectPage];
 
 @NgModule({
   declarations: [...COMPONENTS, ...PAGES, SettingsItemComponent],
-  imports: [BrowserModule, ...MODULES, ServiceWorkerModule.register('/ngsw-worker.js', { enabled: environment.production })],
+  imports: [...MODULES, ServiceWorkerModule.register('/ngsw-worker.js', { enabled: environment.production })],
   providers: [],
   bootstrap: [InkApp]
 })

src/app/ink.module.ts

@@ -4,11 +4,13 @@ import { Routes, RouterModule } from '@angular/router';
 import { HomePage } from './pages/home/home.component';
 import { SettingsPage } from './pages/settings/settings.component';
 import { ExportPage } from './pages/export/export.component';
+import { RedirectPage } from './pages/redirect/redirect.component';
 
 const routes: Routes = [
   { path: '', component: HomePage },
   { path: 'settings', component: SettingsPage },
-  { path: 'export', component: ExportPage }
+  { path: 'export', component: ExportPage },
+  { path: 'redirect', component: RedirectPage }
 ];
 
 @NgModule({

src/app/ink.routing.ts

@@ -0,0 +1,28 @@
+import { Component, OnInit } from '@angular/core';
+import { Router, ActivatedRoute, Params } from '@angular/router';
+import { GithubService } from '../../services/github.service';
+
+@Component({
+  selector: 'inkapp-redirect',
+  template: 'Redirecting...'
+})
+export class RedirectPage implements OnInit {
+  params: Params = {};
+  constructor(private _router: Router, private _route: ActivatedRoute, private _githubService: GithubService) {
+    this.params = this._route.snapshot.queryParams;
+  }
+
+  ngOnInit() {
+    if (this.params.error) {
+      console.error('Error!', this.params.error);
+    }
+    this._githubService.getToken(this.params.code, this.params.state).subscribe((res: any) => {
+      const data = res
+        .split('&')
+        .map(s => s.split('='))
+        .map(d => ({ [d[0]]: d[1] }));
+      localStorage.setItem('inkapp_access_token', data[0].access_token);
+      this._router.navigateByUrl('/settings');
+    });
+  }
+}