Merge branch 'develop' of github.com:Real-Dev-Squad/website-my into t…

…est/user-status

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/post-checkout

@@ -0,0 +1,10 @@
+#!/bin/sh
+if [[ "$NODE_ENV" != "production" ]]; then
+    . "$(dirname "$0")/_/husky.sh"
+
+    echo "\n 🚧 Dependencies are being installed, please wait for a while. ⏳\n"
+
+    npm install
+
+    echo "\nCongratulations, you are good to go! ⚡⚡⚡\n"
+fi

.husky/pre-commit

@@ -0,0 +1,6 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+echo "Checking for linting problems, please wait⏳\n"
+
+npm run lint

.husky/pre-push

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+echo "Pushing your changes to remote repository 🚀✨"

README.md

@@ -46,7 +46,7 @@ Make use of the many generators for code, try `ember help generate` for more det
 * `npm run lint`: To allow the linter to check for problems
 * `npm run lint:fix`: To allow linter to fix the auto-fixable problems
 
-### Note: If you get CORS error for API calls during development, please consider reading [this](https://github.com/Real-Dev-Squad/website-code-docs/tree/main/docs/dev/https-dev-url-cors) documentation.
+### 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
 

app/components/form-input.hbs

@@ -5,6 +5,7 @@
     @type={{@type}}
     @value={{@value}}
     @placeholder={{@placeholder}}
+    @disabled={{@disabled}}
     @class={{if @showError 'input errorBorder' 'input'}}
     {{on 'input' (fn this.inputFieldChanged)}}
   />

app/components/local-navbar.hbs

@@ -0,0 +1,14 @@
+<nav class="local-navbar">
+  <span class="local-navbar__link">
+    <LinkTo @route="index">Home</LinkTo>
+  </span>
+  <span class="local-navbar__link">
+    <LinkTo @route="profile">Profile</LinkTo>
+  </span>
+  <span class="local-navbar__link">
+    <LinkTo @route="tasks">Tasks</LinkTo>
+  </span>
+  <span class="local-navbar__link">
+    <LinkTo @route="notifications">Notifications</LinkTo>
+  </span>
+</nav>

app/components/sign-up/button.hbs

@@ -0,0 +1,12 @@
+<button
+  data-test-signup-button
+  type="button"
+  class="{{if @disabled 'btn-disabled'}}"
+  disabled={{@disabled}}
+  {{on "click" this.buttonClickHandler}}
+>
+  {{#if @isSubmitClicked}}
+    <i class="fa fa-spinner fa-spin" data-test-signup-button-spinner></i>
+  {{/if}}
+  {{yield}}
+</button>

app/components/sign-up/button.js

@@ -0,0 +1,26 @@
+import Component from '@glimmer/component';
+import { action } from '@ember/object';
+
+export default class ButtonComponent extends Component {
+  @action
+  buttonClickHandler() {
+    const { state, clickHandler, disabled } = this.args;
+
+    switch (state) {
+      case 'get-started':
+        !disabled ? clickHandler('firstName') : '';
+        break;
+      case 'firstName':
+        !disabled ? clickHandler('lastName') : '';
+        break;
+      case 'lastName':
+        !disabled ? clickHandler('username') : '';
+        break;
+      case 'username':
+        !disabled ? clickHandler() : '';
+        break;
+      default:
+        return;
+    }
+  }
+}

app/components/sign-up/form.hbs

@@ -0,0 +1,20 @@
+<div class="user-details">
+  <h2 class="user-details__heading" data-test-signup-form-label>
+    {{this.label}}
+  </h2>
+  <div class="user-details__field">
+    <Input @value={{get @userDetails @state}} type="text" placeholder="Darth" {{on 'input' this.inputFieldChanged}} data-test-signup-form-input/>
+  </div>
+
+  <div class="signup-action__btn">
+    <SignUp::Button
+      @clickHandler={{if (eq @state "username")
+      @register @changeRouteParams}}
+      @state={{@state}}
+      @disabled={{@isButtonDisabled}}
+      @isSubmitClicked={{@isSubmitClicked}}
+    >
+      Next
+    </SignUp::Button>
+  </div>
+</div>

app/components/sign-up/form.js

@@ -0,0 +1,16 @@
+import Component from '@glimmer/component';
+import { action } from '@ember/object';
+import { LABEL_TEXT } from '../../constants/signup';
+
+export default class SignupComponent extends Component {
+  get label() {
+    const { state } = this.args;
+
+    return LABEL_TEXT[state];
+  }
+
+  @action inputFieldChanged({ target: { value } }) {
+    const { onChange, state } = this.args;
+    onChange(state, value);
+  }
+}

app/components/sign-up/get-started.hbs

@@ -0,0 +1,25 @@
+
+<div class="landing">
+  <h2 class="landing__main-heading" data-test-mainHeading>
+    {{this.mainHeading}}
+  </h2>
+  <h3 class="landing__sub-heading" data-test-subHeading>
+    {{this.subHeading}}
+  </h3>
+  {{#if (eq @state "get-started")}}
+    <ul class="landing__features-lists">
+      <li class="landing__features-list" data-test-li1>Use Features</li>
+      <li class="landing__features-list" data-test-li2>Display yourself on the (members) page</li>
+    </ul>
+  {{/if}}
+
+  <div class="get-started__btn">
+    <SignUp::Button
+      @clickHandler={{@changeRouteParams}}
+      @state={{@state}}
+      @disabled={{false}}
+    >
+      {{if (eq @state "get-started") "Get Started" "Let's Go"}}
+    </SignUp::Button>
+  </div>
+</div>

app/components/sign-up/get-started.js

@@ -0,0 +1,25 @@
+import Component from '@glimmer/component';
+import {
+  GET_STARTED_MAIN_HEADING,
+  GET_STARTED_SUB_HEADING,
+  THANK_YOU_MAIN_HEADING,
+  THANK_YOU_SUB_HEADING,
+} from '../../constants/signup';
+
+export default class GetStartedComponent extends Component {
+  get mainHeading() {
+    const { state } = this.args;
+
+    return state === 'get-started'
+      ? GET_STARTED_MAIN_HEADING
+      : THANK_YOU_MAIN_HEADING;
+  }
+
+  get subHeading() {
+    const { state } = this.args;
+
+    return state === 'get-started'
+      ? GET_STARTED_SUB_HEADING
+      : THANK_YOU_SUB_HEADING;
+  }
+}

app/components/task-details.hbs

@@ -3,10 +3,10 @@
   <p class="task-details__purpose"><b>Purpose: </b>{{@task.purpose}}</p>
   <div class="dates-info">
     <div class="dates-info__end">
-      <p><b>Ends On: </b>{{@task.endsOn}}</p>
+      <p><b>Deadline: </b>{{convertDate @task.endsOn end_date=1}}</p>
     </div>
     <div class="dates-info__start">
-      <p><b>Started On:</b> {{@task.startedOn}}</p>
+      <p><b>Started: </b> {{convertDate @task.startedOn end_date=0}}</p>
     </div>
   </div>
 </div>

app/components/upload-image.hbs

@@ -9,12 +9,9 @@
     <form class="image-form">
       <p class="image-form__text">
         {{#if this.isImageSelected}}
-          You have selected{{this.imageFileName}}
+          You have selected {{this.imageFileName}}
         {{else}}
-          Drag and drop file here
-          <span>
-            or
-          </span>
+          Drag and drop file here or
         {{/if}}
       </p>
       <label
@@ -58,4 +55,4 @@
       {{this.statusMessage}}
     </p>
   {{/if}}
-</div>
+</div>

app/components/upload-image.js

@@ -66,7 +66,7 @@ export default class UploadImageComponent extends Component {
     this.setImageUploading(true);
     fetch(`${url}`, {
       method: 'POST',
-      credentials: 'same-origin',
+      credentials: 'include',
       body: data,
     })
       .then(async (res) => {

app/constants/signup.js

@@ -0,0 +1,12 @@
+export const LABEL_TEXT = {
+  firstName: 'What is your first name?',
+  lastName: 'And what is your last name?',
+  username: 'Now choose your awesome username!',
+};
+
+export const GET_STARTED_MAIN_HEADING = 'Thank you for connecting your GitHub!';
+export const GET_STARTED_SUB_HEADING =
+  'Please complete the signup in order to:';
+
+export const THANK_YOU_MAIN_HEADING = 'Congratulations!';
+export const THANK_YOU_SUB_HEADING = 'Lets get you started on your journey';