Merge branch 'develop' into signup-flow

.github/workflows/continuous-integration.yml

@@ -5,28 +5,27 @@ name: Continuous Integration
 
 on:
   push:
-    branches: 
+    branches:
       - '**'
-      
+
   pull_request:
-    branches: 
+    branches:
       - '**'
 
 jobs:
   build:
-
     runs-on: ubuntu-latest
 
     strategy:
       matrix:
         node-version: [14.x]
 
     steps:
-    - uses: actions/checkout@v2
-    - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
-      with:
-        node-version: ${{ matrix.node-version }}
-    - run: npm ci
-    - run: npm run build 
-    - run: npm test
+      - uses: actions/checkout@v2
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v1
+        with:
+          node-version: ${{ matrix.node-version }}
+      - run: yarn install --frozen-lockfile
+      - run: yarn build
+      - run: yarn test

.gitignore

@@ -24,3 +24,7 @@
 /.node_modules.ember-try/
 /bower.json.ember-try
 /package.json.ember-try
+
+
+
+/package-lock.json

.husky/post-checkout

@@ -4,7 +4,7 @@ if [[ "$NODE_ENV" != "production" ]]; then
 
     echo "\n 🚧 Dependencies are being installed, please wait for a while. ⏳\n"
 
-    npm install
+    yarn
 
     echo "\nCongratulations, you are good to go! ⚡⚡⚡\n"
 fi

.husky/pre-commit

@@ -3,4 +3,4 @@
 
 echo "Checking for linting problems, please wait⏳\n"
 
-npm run lint
+yarn lint

.travis.yml

@@ -22,4 +22,4 @@ branches:
     - master
 
 script:
-  - npm test
+  - yarn test

README.md

@@ -6,59 +6,61 @@ A personal dashboard website where you can do profile related stuff!
 
 You will need the following things properly installed on your computer.
 
-* [Git](https://git-scm.com/)
-* [Node.js](https://nodejs.org/) (with npm)
-* [Ember CLI](https://ember-cli.com/)
-* [Google Chrome](https://google.com/chrome/)
+- [Git](https://git-scm.com/)
+- [Node.js](https://nodejs.org/) (with npm)
+- [Ember CLI](https://ember-cli.com/)
+- [Google Chrome](https://google.com/chrome/)
 
 ## Installation
 
-* `git clone <repository-url>` this repository
-* `cd website-my`
-* `npm install`
+We are moving to yarn, to ensure that we use yarn , we are moving ahead with [Volta](https://docs.volta.sh/guide/#why-volta)
+To install Volta, please follow the [process](https://docs.volta.sh/guide/getting-started)
+
+- `git clone <repository-url>` this repository
+- `cd website-my`
+- `yarn`
 
 ## Running / Development
 
-* `npm run dev`
-* (or `ember s`)
-* Visit your app at [http://localhost](http://localhost).
-* Visit your tests at [http://localhost/tests](http://localhost/tests).
+- `yarn dev`
+- (or `ember s`)
+- Visit your app at [http://localhost](http://localhost).
+- Visit your tests at [http://localhost/tests](http://localhost/tests).
 
 ### Code Generators
 
 Make use of the many generators for code, try `ember help generate` for more details
 
 ### Running Tests
 
-* `npm run test`
-* `npm run test:ember`
-* `npm run test:ember:server`
-* (or `ember test` and `ember test --server`)
-* You can also visit the `/tests` route when running dev server
+- `yarn test`
+- `yarn test:ember`
+- `yarn test:ember:server`
+- (or `ember test` and `ember test --server`)
+- You can also visit the `/tests` route when running dev server
 
 ### Available run commands
 
-* `npx ntl`
-* (or `npm run` to see the list)
+- `npx ntl`
+- (or `yarn run` to see the list)
 
 ### Linting
 
-* `npm run lint`: To allow the linter to check for problems
-* `npm run lint:fix`: To allow linter to fix the auto-fixable problems
+- `yarn lint`: To allow the linter to check for problems
+- `yarn lint:fix`: To allow linter to fix the auto-fixable problems
 
 ### Note: For solving CORS errors while making API calls during development, please make sure to follow step 1 from [this](https://github.com/Real-Dev-Squad/website-code-docs/tree/main/docs/dev/https-dev-url-cors) documentation . This project has taken care of step 2 in itself.
 
 ### Building
 
-* `npm run build` (production)
-* (or `ember build --environment production`)
-* `ember build` (development)
-
+- `yarn build` (production)
+- (or `ember build --environment production`)
+- `ember build` (development)
 
 ## Further Reading / Useful Links
 
-* [ember.js](https://emberjs.com/)
-* [ember-cli](https://ember-cli.com/)
-* Development Browser Extensions
-  * [ember inspector for chrome](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi)
-  * [ember inspector for firefox](https://addons.mozilla.org/en-US/firefox/addon/ember-inspector/)
+- [ember.js](https://emberjs.com/)
+- [ember-cli](https://ember-cli.com/)
+- Development Browser Extensions
+  - [ember inspector for chrome](https://chrome.google.com/webstore/detail/ember-inspector/bmdblncegkenkacieihfhpjfppoconhi)
+  - [ember inspector for firefox](https://addons.mozilla.org/en-US/firefox/addon/ember-inspector/)

app/components/sign-up/button.js

@@ -1,26 +1,38 @@
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
+import { inject as service } from '@ember/service';
+import { NEW_SIGNUP_FLOW } from '../../constants/analytics';
 
 export default class ButtonComponent extends Component {
+  @service analytics;
+
   @action
   buttonClickHandler() {
     const { state, clickHandler, disabled } = this.args;
+    let event;
 
     switch (state) {
       case 'get-started':
+        event = NEW_SIGNUP_FLOW.USER_GETTING_STARTED;
         !disabled ? clickHandler('firstName') : '';
         break;
       case 'firstName':
+        event = NEW_SIGNUP_FLOW.USER_FIRST_NAME;
         !disabled ? clickHandler('lastName') : '';
         break;
       case 'lastName':
+        event = NEW_SIGNUP_FLOW.USER_LAST_NAME;
         !disabled ? clickHandler('username') : '';
         break;
       case 'username':
+        event = NEW_SIGNUP_FLOW.USER_USERNAME;
         !disabled ? clickHandler() : '';
         break;
       default:
+        event = NEW_SIGNUP_FLOW.SOMETHING_WENT_WRONG;
         return;
     }
+
+    this.analytics.trackEvent(event);
   }
 }

app/constants/analytics.js

@@ -0,0 +1,24 @@
+// New SignUp Flow
+export const NEW_SIGNUP_FLOW = {
+  USER_GETTING_STARTED: 'User Getting-Started - New SignUp Flow',
+  USER_FIRST_NAME: 'User entered First Name - New SignUp Flow',
+  USER_LAST_NAME: 'User entered Last Name - New SignUp Flow',
+  USER_USERNAME: 'User entered Username - New SignUp Flow',
+  SOMETHING_WENT_WRONG: 'Something went wrong - New SignUp Flow',
+  USER_REGISTERED: 'User Registered - New SignUp Flow',
+  UNABLE_TO_SIGNUP: 'Unable to Sign Up - New SignUp Flow Breaks',
+  UNABLE_TO_REGISTER: 'Unable to Register - New SignUp Flow Breaks',
+};
+
+// Old SignUp Flow
+export const OLD_SIGNUP_FLOW = {
+  SUBMIT_CLICKED: 'Submit Button Clicked - Old SignUp Flow',
+  USER_REGISTERED: 'User Registered - Old SignUp Flow',
+  UNABLE_TO_SIGNUP: 'Unable to Sign Up - Old SignUp Flow Breaks',
+  UNABLE_TO_REGISTER: 'User unable to register - Old SignUp Flow Breaks',
+};
+
+export const SIGNUP = {
+  PAGE_LOADED: 'Signup Page Loaded Successfully',
+  USER_ALREADY_REGISTERED: 'User Already Registered',
+};

app/constants/signup.js

@@ -10,3 +10,5 @@ export const GET_STARTED_SUB_HEADING =
 
 export const THANK_YOU_MAIN_HEADING = 'Congratulations!';
 export const THANK_YOU_SUB_HEADING = 'Lets get you started on your journey';
+
+export const GOTO_URL = 'https://realdevsquad.com/goto';

app/controllers/identity.js

@@ -2,6 +2,7 @@ import Controller from '@ember/controller';
 import { action } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
 import ENV from 'website-my/config/environment';
+import isValidUrl from '../utils/checkURL';
 
 const BASE_URL = ENV.BASE_API_URL;
 
@@ -14,16 +15,33 @@ export default class IdentityController extends Controller {
   @tracked isCopyClicked = false;
   @tracked isVerifyClicked = false;
   @tracked profileURL = this.model.profileURL || '';
+  @tracked saveDisabled = true;
+  @tracked generateChainCodeDisabled = this.model.profileURL === undefined;
+  @tracked checkboxDisabled =
+    this.generateChainCodeDisabled || this.model.chaincode === undefined;
 
   @action async handleRefresh() {
     window.location.reload();
   }
 
+  @action changeSaveDisabled() {
+    if (
+      this.profileURL === '' ||
+      this.profileURL === (this.model.profileURL || '') ||
+      !isValidUrl(this.profileURL)
+    ) {
+      this.saveDisabled = true;
+    } else {
+      this.saveDisabled = false;
+    }
+  }
+
   @action handleCopy() {
     navigator.clipboard.writeText(this.Chaincode);
     this.isCopyClicked = true;
     if (this.isCopyClicked === true) {
       alert('Copied');
+      this.checkboxDisabled = false;
     }
   }
 
@@ -44,6 +62,7 @@ export default class IdentityController extends Controller {
         });
         if (response.ok) {
           alert('Updated profile URL!!');
+          this.generateChainCodeDisabled = false;
         } else {
           alert('Something went wrong. Please check console errors.');
         }

app/controllers/profile.js

@@ -160,7 +160,8 @@ export default class ProfileController extends Controller {
   @action emailValidator(email) {
     if (typeof email !== 'string') return false;
 
-    const pattern = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
+    const pattern =
+      /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
     const index = this.fields.findIndex((field) => field.type === 'email');
 
     if (pattern.test(email)) {

app/controllers/signup.js

@@ -1,12 +1,17 @@
 import Controller from '@ember/controller';
 import { action, set } from '@ember/object';
+import { inject as service } from '@ember/service';
 import { tracked } from '@glimmer/tracking';
 import registerUser from '../utils/register-api';
+import { GOTO_URL } from '../constants/signup';
+import { NEW_SIGNUP_FLOW, OLD_SIGNUP_FLOW } from '../constants/analytics';
 import ENV from 'website-my/config/environment'; // remove this when new flow goes live
 
 const BASE_URL = ENV.BASE_API_URL; // remove this when new flow goes live
 
 export default class SignupController extends Controller {
+  @service analytics;
+
   queryParams = ['state', 'dev'];
 
   @tracked isSubmitClicked = false;
@@ -254,7 +259,8 @@ export default class SignupController extends Controller {
   @action emailValidator(email) {
     if (typeof email !== 'string') return false;
 
-    const pattern = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
+    const pattern =
+      /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
     const index = this.fields.findIndex((field) => field.type === 'email');
 
     if (pattern.test(email)) {
@@ -282,6 +288,7 @@ export default class SignupController extends Controller {
     // submit
     // https://github.com/Real-Dev-Squad/website-api-contracts/tree/main/users#patch-usersself
     e.preventDefault();
+    this.analytics.trackEvent(OLD_SIGNUP_FLOW.SUBMIT_CLICKED);
     const cleanReqObject = this.sanitizeRequestObject(this.formData);
     this.isSubmitClicked = true;
 
@@ -297,11 +304,15 @@ export default class SignupController extends Controller {
 
       const { status } = response;
       if (status === 204) {
-        window.open('https://realdevsquad.com/goto', '_self');
+        this.analytics.identifyUser();
+        this.analytics.trackEvent(OLD_SIGNUP_FLOW.USER_REGISTERED);
+        window.open(GOTO_URL, '_self');
       } else {
+        this.analytics.trackEvent(OLD_SIGNUP_FLOW.UNABLE_TO_SIGNUP);
         alert('Something went wrong. Please check console errors.');
       }
     } catch (error) {
+      this.analytics.trackEvent(OLD_SIGNUP_FLOW.UNABLE_TO_REGISTER);
       console.error('Error : ', error);
     } finally {
       this.isSubmitClicked = false;
@@ -335,14 +346,21 @@ export default class SignupController extends Controller {
     registerUser(user)
       .then((res) => {
         if (res.status === 204) {
-          window.open('https://realdevsquad.com/goto', '_self');
+          this.analytics.identifyUser();
+          this.analytics.trackEvent(NEW_SIGNUP_FLOW.USER_REGISTERED);
+          window.open(GOTO_URL, '_self');
         } else {
+          this.analytics.trackEvent(NEW_SIGNUP_FLOW.UNABLE_TO_SIGNUP);
           res.json().then((res) => {
-            this.errorMessage = res.errors[0].title;
+            const error = res.errors[0];
+            this.errorMessage = error.title;
           });
         }
       })
-      .catch((err) => (this.errorMessage = err))
+      .catch((err) => {
+        this.errorMessage = err;
+        this.analytics.trackEvent(NEW_SIGNUP_FLOW.UNABLE_TO_REGISTER);
+      })
       .finally(() => {
         this.isSubmitClicked = false;
       });

app/routes/signup.js

@@ -1,8 +1,13 @@
 import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
 import ENV from 'website-my/config/environment';
+import { SIGNUP } from '../constants/analytics';
 
 export default class SignupRoute extends Route {
+  @service analytics;
+
   async model() {
+    this.analytics.trackEvent(SIGNUP.PAGE_LOADED);
     const response = await fetch(`${ENV.BASE_API_URL}/users/self`, {
       credentials: 'include',
     });
@@ -15,6 +20,7 @@ export default class SignupRoute extends Route {
       );
     }
     if (response.status === 200 && !userData.incompleteUserDetails) {
+      this.analytics.trackEvent(SIGNUP.USER_ALREADY_REGISTERED);
       alert("You already have filled the up form. You'll now be redirected.");
       window.open('https://realdevsquad.com/goto', '_self');
     }