From e8ad261de2a8f9912e2955710e382621bc53bb80 Mon Sep 17 00:00:00 2001 From: Dhruv Sharma <56362412+dhruv036@users.noreply.github.com> Date: Tue, 7 Nov 2023 23:28:52 +0530 Subject: [PATCH 01/13] Added Open RDS app from my-site (#506) * Added Open RDS app from my-site * Removed service and added Test case to verify dialog * Added Feature flag, Refactored code * Refactored test cases * Resolved style and test case * Refactored style --- app/components/mobile-dialog.hbs | 12 +++++ app/components/mobile-dialog.js | 52 +++++++++++++++++++ app/controllers/application.js | 20 +++++++ app/styles/app.css | 3 +- app/styles/components/mobile-dialog.css | 30 +++++++++++ app/styles/variables.css | 3 ++ app/templates/application.hbs | 12 +++-- .../components/mobile-dialog-test.js | 31 +++++++++++ 8 files changed, 158 insertions(+), 5 deletions(-) create mode 100644 app/components/mobile-dialog.hbs create mode 100644 app/components/mobile-dialog.js create mode 100644 app/styles/components/mobile-dialog.css create mode 100644 tests/integration/components/mobile-dialog-test.js diff --git a/app/components/mobile-dialog.hbs b/app/components/mobile-dialog.hbs new file mode 100644 index 00000000..96ef3046 --- /dev/null +++ b/app/components/mobile-dialog.hbs @@ -0,0 +1,12 @@ +{{#if @dev}} + {{#if @deviceType}} + {{#if this.toShow}} + + Open RDS in app +
+ + +
+ {{/if}} + {{/if}} +{{/if}} diff --git a/app/components/mobile-dialog.js b/app/components/mobile-dialog.js new file mode 100644 index 00000000..87a44996 --- /dev/null +++ b/app/components/mobile-dialog.js @@ -0,0 +1,52 @@ +import Component from '@glimmer/component'; +import { action } from '@ember/object'; +import { tracked } from '@glimmer/tracking'; + +export default class MobileDialogComponent extends Component { + @tracked toShow = true; + + @action + closeDialog() { + this.toShow = false; + } + + @action + openRDSApp() { + this.openApp(); + } + + openApp() { + let isAppInstalled = false; + const appScheme = 'app://realdevsquad.com'; + const fallbackURL = + 'https://play.google.com/store/apps/details?id=com.github.android'; + const userAgent = navigator.userAgent || navigator.vendor || window.opera; + const MAXTIME = 1000; + + if (/android/i.test(userAgent)) { + const startTime = Date.now(); + const iframe = document.createElement('iframe'); + iframe.style.display = 'none'; + iframe.src = appScheme; + document.body.appendChild(iframe); + this.toShow = false; + + window.addEventListener('blur', function () { + document.body.removeChild(iframe); + + const timeTaken = Date.now() - startTime; + if (timeTaken <= MAXTIME) { + isAppInstalled = true; + } + }); + + setTimeout(function () { + if (!isAppInstalled) { + document.body.removeChild(iframe); + window.location.href = fallbackURL; + } + this.toShow = false; + }, 1000); + } + } +} diff --git a/app/controllers/application.js b/app/controllers/application.js index fbde4ec2..83e0ce1c 100644 --- a/app/controllers/application.js +++ b/app/controllers/application.js @@ -1,5 +1,6 @@ import Controller from '@ember/controller'; import { inject as service } from '@ember/service'; +import { tracked } from '@glimmer/tracking'; import { MAIN_SITE_URL } from '../constants/url'; import { action } from '@ember/object'; import { GITHUB_URL } from '../constants/url'; @@ -7,12 +8,19 @@ import ENV from 'website-my/config/environment'; export default class ApplicationController extends Controller { @service router; + @service featureFlag; + @tracked toVisible = this.checkDeviceType(); + GITHUB_URL = GITHUB_URL; BASE_API_URL = ENV.BASE_API_URL; get canShowNavBar() { return this.router.currentRouteName != 'signup'; } + get isDevMode() { + return this.featureFlag.isDevMode; + } + @action async signOutHandler() { try { const response = await fetch(`${this.BASE_API_URL}/auth/signout`, { @@ -27,4 +35,16 @@ export default class ApplicationController extends Controller { console.error('Error: ', err); } } + + checkDeviceType() { + let regexp = /android|iphone|kindle|ipad/i; + let details = navigator.userAgent; + let isMobileDevice = regexp.test(details); + + if (isMobileDevice) { + return true; + } else { + return false; + } + } } diff --git a/app/styles/app.css b/app/styles/app.css index d5bdce8b..6c77772c 100644 --- a/app/styles/app.css +++ b/app/styles/app.css @@ -19,6 +19,7 @@ @import 'qrcode.css'; @import 'progress-bar.css'; @import 'mobile.css'; +@import 'components/mobile-dialog.css'; html, body { @@ -40,7 +41,7 @@ body { .main-container { margin: 0; padding: 0; - flex: 100%; + flex: 100%; display: flex; flex-direction: column; } diff --git a/app/styles/components/mobile-dialog.css b/app/styles/components/mobile-dialog.css new file mode 100644 index 00000000..3f5d3d3d --- /dev/null +++ b/app/styles/components/mobile-dialog.css @@ -0,0 +1,30 @@ +.mobile-dialog { + display: block; + border-radius: 3px; + padding: 0.5rem 1rem; + font-weight: 900; + margin: 0 auto; + font-size:large; + text-align: center; + background-color: var(--form--bg); + border: none; + box-shadow: 4px 8px 8px var(--mobile-dialog-box-shadow); + & button { + padding: 0.5rem 1rem; + margin: 1rem; + font-size:medium; + border: none; + border-radius: 3px; + color: var(--body-bg-color); + font-weight: 600; + } + } + + #mobile-dialog__open-button { + background-color: var(--mobile-dialog--open-button); + } + + #mobile-dialog__close-button { + background-color: var(--body-bg-color); + color: var(--landing-page--main-heading); + } \ No newline at end of file diff --git a/app/styles/variables.css b/app/styles/variables.css index 189a8b96..d6032861 100644 --- a/app/styles/variables.css +++ b/app/styles/variables.css @@ -181,4 +181,7 @@ --profile-edit-btn-clr: #1e429f; --profile-disabled-btn-bg-clr: #e5efeb; --profile-disabled-btn-text-clr: #9ca3af; + + --mobile-dialog-box-shadow: hsl(0deg 0% 0% / 0.38); + --mobile-dialog--open-button: #1d1283; } diff --git a/app/templates/application.hbs b/app/templates/application.hbs index 2701d40d..ff91e959 100644 --- a/app/templates/application.hbs +++ b/app/templates/application.hbs @@ -1,5 +1,9 @@ {{page-title "My | Real Dev Squad"}} +
- {{outlet}} + {{outlet}}
\ No newline at end of file diff --git a/tests/integration/components/mobile-dialog-test.js b/tests/integration/components/mobile-dialog-test.js new file mode 100644 index 00000000..a6d05943 --- /dev/null +++ b/tests/integration/components/mobile-dialog-test.js @@ -0,0 +1,31 @@ +import { module, test } from 'qunit'; +import { setupRenderingTest } from 'ember-qunit'; +import { render } from '@ember/test-helpers'; +import { hbs } from 'ember-cli-htmlbars'; + +module('Integration | Component | mobile-dialog', function (hooks) { + setupRenderingTest(hooks); + + test('Mobile-Dialog does not renders', async function (assert) { + this.setProperties({ + dev: false, + deviceType: false, + }); + await render(hbs``); + + assert.dom('[data-test-mobile-dialog]').doesNotExist(); + }); + + test('Mobile-Dialog should renders', async function (assert) { + this.setProperties({ + dev: true, + deviceType: true, + }); + + await render( + hbs`` + ); + + assert.dom('[data-test-mobile-dialog]').exists(); + }); +}); From 86b2c5bd400b609e573bf1260269c16233fba8e8 Mon Sep 17 00:00:00 2001 From: Shubham Kumar Singh <107163260+shubhamsigdar1@users.noreply.github.com> Date: Wed, 22 Nov 2023 22:53:00 +0530 Subject: [PATCH 02/13] remove feature flag (#522) --- app/components/task/holder.js | 10 +---- app/constants/tasks.js | 6 --- app/controllers/tasks.js | 9 +---- .../components/tasks/holder-test.js | 37 ------------------- 4 files changed, 3 insertions(+), 59 deletions(-) diff --git a/app/components/task/holder.js b/app/components/task/holder.js index 8fbac86a..3a6984ca 100644 --- a/app/components/task/holder.js +++ b/app/components/task/holder.js @@ -16,20 +16,14 @@ export default class TasksHolderComponent extends Component { get taskStatusList() { const statusToDisplay = this.availabletaskStatusList.filter( - (taskStatus) => { - if (this.args.dev === true) { - return taskStatus.key !== 'ALL' && taskStatus.key !== 'COMPLETED'; - } else { - return taskStatus.key !== 'ALL' && taskStatus.key !== 'DONE'; - } - } + (taskStatus) => taskStatus.key !== 'ALL' ); return statusToDisplay; } get taskStyleClass() { const statusNotOverDueList = [ - this.args.dev === true ? TASK_KEYS.DONE : TASK_KEYS.COMPLETED, + TASK_KEYS.DONE, TASK_KEYS.VERIFIED, TASK_KEYS.AVAILABLE, ]; diff --git a/app/constants/tasks.js b/app/constants/tasks.js index c9e1d843..27ad7102 100644 --- a/app/constants/tasks.js +++ b/app/constants/tasks.js @@ -5,7 +5,6 @@ const TASK_KEYS = { IN_PROGRESS: 'IN_PROGRESS', BLOCKED: 'BLOCKED', SMOKE_TESTING: 'SMOKE_TESTING', - COMPLETED: 'COMPLETED', DONE: 'DONE', NEEDS_REVIEW: 'NEEDS_REVIEW', IN_REVIEW: 'IN_REVIEW', @@ -24,7 +23,6 @@ const { IN_PROGRESS, BLOCKED, SMOKE_TESTING, - COMPLETED, DONE, NEEDS_REVIEW, IN_REVIEW, @@ -61,10 +59,6 @@ const TASK_STATUS_LIST = [ displayLabel: 'Smoke Testing', key: SMOKE_TESTING, }, - { - displayLabel: 'Completed', - key: COMPLETED, - }, { displayLabel: 'Done', key: DONE, diff --git a/app/controllers/tasks.js b/app/controllers/tasks.js index bdcfbe04..94333d56 100644 --- a/app/controllers/tasks.js +++ b/app/controllers/tasks.js @@ -16,7 +16,6 @@ const API_BASE_URL = ENV.BASE_API_URL; export default class TasksController extends Controller { queryParams = ['dev']; @service toast; - @service featureFlag; TASK_KEYS = TASK_KEYS; taskStatusList = TASK_STATUS_LIST; tabsTaskStatusList = TABS_TASK_STATUS_LIST; @@ -43,10 +42,6 @@ export default class TasksController extends Controller { @tracked showFetchButton = this.isShowFetchButton() && !this.alreadyFetched; alreadyFetched = localStorage.getItem('already-fetched'); - get isDevMode() { - return this.featureFlag.isDevMode; - } - @action toggleDropDown() { this.showDropDown = !this.showDropDown; } @@ -98,9 +93,7 @@ export default class TasksController extends Controller { const taskCompletionPercentage = object.percentCompleted; if (taskCompletionPercentage) { if (taskCompletionPercentage === TASK_PERCENTAGE.completedPercentage) { - this.isDevMode === true - ? (requestBody.status = 'DONE') - : (requestBody.status = 'COMPLETED'); + requestBody.status = 'DONE'; } requestBody.percentCompleted = parseInt(taskCompletionPercentage); } diff --git a/tests/integration/components/tasks/holder-test.js b/tests/integration/components/tasks/holder-test.js index 836fad05..46ad28cd 100644 --- a/tests/integration/components/tasks/holder-test.js +++ b/tests/integration/components/tasks/holder-test.js @@ -199,41 +199,6 @@ module('Integration | Component | Tasks Holder', function (hooks) { @disabled={{this.disabled}} />`); - assert - .dom('[data-test-task-status-select]') - .hasValue(TASK_KEYS.IN_PROGRESS); - - await select('[data-test-task-status-select]', TASK_KEYS.COMPLETED); - - assert - .dom('[data-test-task-status-select]') - .hasValue(TASK_KEYS.IN_PROGRESS); - }); - - test('Verify values of task status upon api failures under feature flag', async function (assert) { - const testTask = tasksData[3]; - testTask.status = TASK_KEYS.IN_PROGRESS; - - this.set('task', testTask); - this.set('mock', () => {}); - this.set('onTaskUpdate', (taskId, error) => { - error(); - }); - this.set('isLoading', false); - this.set('disabled', false); - this.set('defaultType', DEFAULT_TASK_TYPE); - this.set('dev', true); - - await render(hbs``); - assert .dom('[data-test-task-status-select]') .hasValue(TASK_KEYS.IN_PROGRESS); @@ -284,7 +249,6 @@ module('Integration | Component | Tasks Holder', function (hooks) { this.set('isLoading', false); this.set('disabled', false); this.set('defaultType', DEFAULT_TASK_TYPE); - this.set('dev', true); await render(hbs``); assert.dom('[data-test-task-status-select]').exists(); From 2e0b5986d00b7b416931cdc2c379a777b3c249f5 Mon Sep 17 00:00:00 2001 From: Yash Raj <56453897+yesyash@users.noreply.github.com> Date: Thu, 23 Nov 2023 02:01:53 +0530 Subject: [PATCH 03/13] Show a toast on Error in `SignOutHandler` (#526) * Sho a toast on Error in SignOutHandler * style: fix prettier issues --------- Co-authored-by: Prakash --- app/controllers/application.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/app/controllers/application.js b/app/controllers/application.js index 83e0ce1c..93b6b412 100644 --- a/app/controllers/application.js +++ b/app/controllers/application.js @@ -9,6 +9,7 @@ import ENV from 'website-my/config/environment'; export default class ApplicationController extends Controller { @service router; @service featureFlag; + @service toast; @tracked toVisible = this.checkDeviceType(); GITHUB_URL = GITHUB_URL; @@ -33,6 +34,9 @@ export default class ApplicationController extends Controller { } } catch (err) { console.error('Error: ', err); + this.toast.error( + 'Unable to sign out. Something went wrong. Please try again.' + ); } } From e1916f828225f3fdb3c147a03f15cb72f6055232 Mon Sep 17 00:00:00 2001 From: Dhruv Sharma <56362412+dhruv036@users.noreply.github.com> Date: Thu, 23 Nov 2023 04:05:39 +0530 Subject: [PATCH 04/13] naming convention resolved (#528) * naming convention resolved * naming convention changes * naming resolved --- app/components/mobile-dialog.hbs | 10 +++++----- app/components/mobile-dialog.js | 14 +++++++------- app/controllers/application.js | 4 ++-- app/styles/components/mobile-dialog.css | 4 ++-- app/templates/application.hbs | 4 ++-- config/environment.js | 3 +++ tests/integration/components/mobile-dialog-test.js | 10 +++++----- 7 files changed, 26 insertions(+), 23 deletions(-) diff --git a/app/components/mobile-dialog.hbs b/app/components/mobile-dialog.hbs index 96ef3046..e8145324 100644 --- a/app/components/mobile-dialog.hbs +++ b/app/components/mobile-dialog.hbs @@ -1,10 +1,10 @@ -{{#if @dev}} - {{#if @deviceType}} - {{#if this.toShow}} +{{#if @isDevEnv}} + {{#if @isMobileDevice}} + {{#if this.isDialogVisible}} - Open RDS in app + Redirect to RDS App
- +
{{/if}} diff --git a/app/components/mobile-dialog.js b/app/components/mobile-dialog.js index 87a44996..23f968c4 100644 --- a/app/components/mobile-dialog.js +++ b/app/components/mobile-dialog.js @@ -1,13 +1,14 @@ import Component from '@glimmer/component'; import { action } from '@ember/object'; +import ENV from 'website-my/config/environment'; import { tracked } from '@glimmer/tracking'; export default class MobileDialogComponent extends Component { - @tracked toShow = true; + @tracked isDialogVisible = true; @action closeDialog() { - this.toShow = false; + this.isDialogVisible = false; } @action @@ -17,9 +18,8 @@ export default class MobileDialogComponent extends Component { openApp() { let isAppInstalled = false; - const appScheme = 'app://realdevsquad.com'; - const fallbackURL = - 'https://play.google.com/store/apps/details?id=com.github.android'; + const appScheme = ENV.RDS_ANDROID_SCHEME; + const fallbackURL = ENV.ANDROID_GITHUB_URL; const userAgent = navigator.userAgent || navigator.vendor || window.opera; const MAXTIME = 1000; @@ -29,7 +29,7 @@ export default class MobileDialogComponent extends Component { iframe.style.display = 'none'; iframe.src = appScheme; document.body.appendChild(iframe); - this.toShow = false; + this.isDialogVisible = false; window.addEventListener('blur', function () { document.body.removeChild(iframe); @@ -45,7 +45,7 @@ export default class MobileDialogComponent extends Component { document.body.removeChild(iframe); window.location.href = fallbackURL; } - this.toShow = false; + this.isDialogVisible = false; }, 1000); } } diff --git a/app/controllers/application.js b/app/controllers/application.js index 93b6b412..a6d408b5 100644 --- a/app/controllers/application.js +++ b/app/controllers/application.js @@ -10,7 +10,7 @@ export default class ApplicationController extends Controller { @service router; @service featureFlag; @service toast; - @tracked toVisible = this.checkDeviceType(); + @tracked isMobileDevice = this.detectMobileDevice(); GITHUB_URL = GITHUB_URL; BASE_API_URL = ENV.BASE_API_URL; @@ -40,7 +40,7 @@ export default class ApplicationController extends Controller { } } - checkDeviceType() { + detectMobileDevice() { let regexp = /android|iphone|kindle|ipad/i; let details = navigator.userAgent; let isMobileDevice = regexp.test(details); diff --git a/app/styles/components/mobile-dialog.css b/app/styles/components/mobile-dialog.css index 3f5d3d3d..901d7483 100644 --- a/app/styles/components/mobile-dialog.css +++ b/app/styles/components/mobile-dialog.css @@ -1,6 +1,6 @@ .mobile-dialog { display: block; - border-radius: 3px; + border-radius: 4px; padding: 0.5rem 1rem; font-weight: 900; margin: 0 auto; @@ -14,7 +14,7 @@ margin: 1rem; font-size:medium; border: none; - border-radius: 3px; + border-radius: 4px; color: var(--body-bg-color); font-weight: 600; } diff --git a/app/templates/application.hbs b/app/templates/application.hbs index ff91e959..1d062460 100644 --- a/app/templates/application.hbs +++ b/app/templates/application.hbs @@ -1,8 +1,8 @@ {{page-title "My | Real Dev Squad"}} `); @@ -18,12 +18,12 @@ module('Integration | Component | mobile-dialog', function (hooks) { test('Mobile-Dialog should renders', async function (assert) { this.setProperties({ - dev: true, - deviceType: true, + isDevEnv: true, + isMobileDevice: true, }); await render( - hbs`` + hbs`` ); assert.dom('[data-test-mobile-dialog]').exists(); From 08af8879d5513acf33ff3c42ef06e6d2614549c2 Mon Sep 17 00:00:00 2001 From: Shubham Kumar Singh <107163260+shubhamsigdar1@users.noreply.github.com> Date: Thu, 23 Nov 2023 23:03:56 +0530 Subject: [PATCH 05/13] Revert "remove feature flag (#522)" (#529) This reverts commit 86b2c5bd400b609e573bf1260269c16233fba8e8. --- app/components/task/holder.js | 10 ++++- app/constants/tasks.js | 6 +++ app/controllers/tasks.js | 9 ++++- .../components/tasks/holder-test.js | 37 +++++++++++++++++++ 4 files changed, 59 insertions(+), 3 deletions(-) diff --git a/app/components/task/holder.js b/app/components/task/holder.js index 3a6984ca..8fbac86a 100644 --- a/app/components/task/holder.js +++ b/app/components/task/holder.js @@ -16,14 +16,20 @@ export default class TasksHolderComponent extends Component { get taskStatusList() { const statusToDisplay = this.availabletaskStatusList.filter( - (taskStatus) => taskStatus.key !== 'ALL' + (taskStatus) => { + if (this.args.dev === true) { + return taskStatus.key !== 'ALL' && taskStatus.key !== 'COMPLETED'; + } else { + return taskStatus.key !== 'ALL' && taskStatus.key !== 'DONE'; + } + } ); return statusToDisplay; } get taskStyleClass() { const statusNotOverDueList = [ - TASK_KEYS.DONE, + this.args.dev === true ? TASK_KEYS.DONE : TASK_KEYS.COMPLETED, TASK_KEYS.VERIFIED, TASK_KEYS.AVAILABLE, ]; diff --git a/app/constants/tasks.js b/app/constants/tasks.js index 27ad7102..c9e1d843 100644 --- a/app/constants/tasks.js +++ b/app/constants/tasks.js @@ -5,6 +5,7 @@ const TASK_KEYS = { IN_PROGRESS: 'IN_PROGRESS', BLOCKED: 'BLOCKED', SMOKE_TESTING: 'SMOKE_TESTING', + COMPLETED: 'COMPLETED', DONE: 'DONE', NEEDS_REVIEW: 'NEEDS_REVIEW', IN_REVIEW: 'IN_REVIEW', @@ -23,6 +24,7 @@ const { IN_PROGRESS, BLOCKED, SMOKE_TESTING, + COMPLETED, DONE, NEEDS_REVIEW, IN_REVIEW, @@ -59,6 +61,10 @@ const TASK_STATUS_LIST = [ displayLabel: 'Smoke Testing', key: SMOKE_TESTING, }, + { + displayLabel: 'Completed', + key: COMPLETED, + }, { displayLabel: 'Done', key: DONE, diff --git a/app/controllers/tasks.js b/app/controllers/tasks.js index 94333d56..bdcfbe04 100644 --- a/app/controllers/tasks.js +++ b/app/controllers/tasks.js @@ -16,6 +16,7 @@ const API_BASE_URL = ENV.BASE_API_URL; export default class TasksController extends Controller { queryParams = ['dev']; @service toast; + @service featureFlag; TASK_KEYS = TASK_KEYS; taskStatusList = TASK_STATUS_LIST; tabsTaskStatusList = TABS_TASK_STATUS_LIST; @@ -42,6 +43,10 @@ export default class TasksController extends Controller { @tracked showFetchButton = this.isShowFetchButton() && !this.alreadyFetched; alreadyFetched = localStorage.getItem('already-fetched'); + get isDevMode() { + return this.featureFlag.isDevMode; + } + @action toggleDropDown() { this.showDropDown = !this.showDropDown; } @@ -93,7 +98,9 @@ export default class TasksController extends Controller { const taskCompletionPercentage = object.percentCompleted; if (taskCompletionPercentage) { if (taskCompletionPercentage === TASK_PERCENTAGE.completedPercentage) { - requestBody.status = 'DONE'; + this.isDevMode === true + ? (requestBody.status = 'DONE') + : (requestBody.status = 'COMPLETED'); } requestBody.percentCompleted = parseInt(taskCompletionPercentage); } diff --git a/tests/integration/components/tasks/holder-test.js b/tests/integration/components/tasks/holder-test.js index 46ad28cd..836fad05 100644 --- a/tests/integration/components/tasks/holder-test.js +++ b/tests/integration/components/tasks/holder-test.js @@ -199,6 +199,41 @@ module('Integration | Component | Tasks Holder', function (hooks) { @disabled={{this.disabled}} />`); + assert + .dom('[data-test-task-status-select]') + .hasValue(TASK_KEYS.IN_PROGRESS); + + await select('[data-test-task-status-select]', TASK_KEYS.COMPLETED); + + assert + .dom('[data-test-task-status-select]') + .hasValue(TASK_KEYS.IN_PROGRESS); + }); + + test('Verify values of task status upon api failures under feature flag', async function (assert) { + const testTask = tasksData[3]; + testTask.status = TASK_KEYS.IN_PROGRESS; + + this.set('task', testTask); + this.set('mock', () => {}); + this.set('onTaskUpdate', (taskId, error) => { + error(); + }); + this.set('isLoading', false); + this.set('disabled', false); + this.set('defaultType', DEFAULT_TASK_TYPE); + this.set('dev', true); + + await render(hbs``); + assert .dom('[data-test-task-status-select]') .hasValue(TASK_KEYS.IN_PROGRESS); @@ -249,6 +284,7 @@ module('Integration | Component | Tasks Holder', function (hooks) { this.set('isLoading', false); this.set('disabled', false); this.set('defaultType', DEFAULT_TASK_TYPE); + this.set('dev', true); await render(hbs``); assert.dom('[data-test-task-status-select]').exists(); From a5c4beb3f0724f06b5e5f7b99d0a6a91ea692bfd Mon Sep 17 00:00:00 2001 From: sumitd94 Date: Fri, 24 Nov 2023 14:35:06 +0530 Subject: [PATCH 06/13] feat: UI for purging members cache --- app/components/self-clear-cache.hbs | 18 +++++++++++++ app/constants/self-clear-cache.js | 1 + app/controllers/index.js | 39 +++++++++++++++++++++++++++++ app/styles/app.css | 3 ++- app/styles/self-clear-cache.css | 35 ++++++++++++++++++++++++++ app/templates/index.hbs | 12 ++++++--- 6 files changed, 104 insertions(+), 4 deletions(-) create mode 100644 app/components/self-clear-cache.hbs create mode 100644 app/constants/self-clear-cache.js create mode 100644 app/styles/self-clear-cache.css diff --git a/app/components/self-clear-cache.hbs b/app/components/self-clear-cache.hbs new file mode 100644 index 00000000..b5afb958 --- /dev/null +++ b/app/components/self-clear-cache.hbs @@ -0,0 +1,18 @@ +{{#if @dev}} +
+ +
+ {{@totalTimes}} + / 3 requests remaining for today +
+
+{{/if}} \ No newline at end of file diff --git a/app/constants/self-clear-cache.js b/app/constants/self-clear-cache.js new file mode 100644 index 00000000..a92dc682 --- /dev/null +++ b/app/constants/self-clear-cache.js @@ -0,0 +1 @@ +export const MAX_CACHE_PURGE_COUNT = 3; diff --git a/app/controllers/index.js b/app/controllers/index.js index 42ef5e5e..364b1dd6 100644 --- a/app/controllers/index.js +++ b/app/controllers/index.js @@ -5,20 +5,29 @@ import ENV from 'website-my/config/environment'; import { inject as service } from '@ember/service'; import { toastNotificationTimeoutOptions } from '../constants/toast-notification'; import { USER_STATES } from '../constants/user-status'; +import { MAX_CACHE_PURGE_COUNT } from '../constants/self-clear-cache'; const BASE_URL = ENV.BASE_API_URL; export default class IndexController extends Controller { + queryParams = ['dev']; + @service featureFlag; @service toast; @tracked status = this.model; @tracked isStatusUpdating = false; @tracked showUserStateModal = false; @tracked newStatus; + @tracked isPurgingCache = false; + @tracked cacheTriggeredPending = MAX_CACHE_PURGE_COUNT; @action toggleUserStateModal() { this.showUserStateModal = !this.showUserStateModal; } + get isDevMode() { + return this.featureFlag.isDevMode; + } + @action async updateStatus(newStatus) { this.isStatusUpdating = true; if (!('cancelOoo' in newStatus)) { @@ -68,4 +77,34 @@ export default class IndexController extends Controller { this.newStatus = status; this.toggleUserStateModal(); } + + @action async purgeCache() { + this.isPurgingCache = true; + try { + const response = await fetch(`${BASE_URL}/cache`, { + method: 'POST', + headers: { + 'Content-Type': 'application/json', + }, + credentials: 'include', + }); + console.log(response); + if (response.ok) { + const data = await response.json(); + this.cacheTriggeredPending--; + alert(data.message); + } else { + this.toast.error( + 'Something went wrong.', + '', + toastNotificationTimeoutOptions + ); + } + } catch (error) { + console.error('Error : ', error); + alert('Something went wrong!'); + } finally { + this.isPurgingCache = false; + } + } } diff --git a/app/styles/app.css b/app/styles/app.css index 6c77772c..0772d1f0 100644 --- a/app/styles/app.css +++ b/app/styles/app.css @@ -20,6 +20,7 @@ @import 'progress-bar.css'; @import 'mobile.css'; @import 'components/mobile-dialog.css'; +@import 'self-clear-cache.css'; html, body { @@ -41,7 +42,7 @@ body { .main-container { margin: 0; padding: 0; - flex: 100%; + flex: 100%; display: flex; flex-direction: column; } diff --git a/app/styles/self-clear-cache.css b/app/styles/self-clear-cache.css new file mode 100644 index 00000000..ec190bc3 --- /dev/null +++ b/app/styles/self-clear-cache.css @@ -0,0 +1,35 @@ +.cache { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + margin: auto; + box-shadow: 5px 10px 15px #09113344; + border-radius: 10px; + padding: 30px; + font-weight: 700; +} + +.cache__last-request { + padding: 40px 4px 20px; + color: #1d1283; + font-size: 2rem; + text-align: center; +} + +.cache__clear-btn { + border-radius: 10px; + padding: 16px 60px; + border: 3px solid #e49504; + color: #e49504; + background-color: white; + font-weight: 700; + font-size: 1.25rem; + cursor: pointer; +} + +.cache__remaining-requests { + padding-top: 30px; + color: #1d1283; + font-size: 1.25rem; +} diff --git a/app/templates/index.hbs b/app/templates/index.hbs index c377e590..f1476549 100644 --- a/app/templates/index.hbs +++ b/app/templates/index.hbs @@ -1,8 +1,14 @@ -
+

Welcome to my site!

- + Date: Fri, 24 Nov 2023 14:44:26 +0530 Subject: [PATCH 07/13] Remove console log --- app/controllers/index.js | 1 - 1 file changed, 1 deletion(-) diff --git a/app/controllers/index.js b/app/controllers/index.js index 364b1dd6..b4c0e2f6 100644 --- a/app/controllers/index.js +++ b/app/controllers/index.js @@ -88,7 +88,6 @@ export default class IndexController extends Controller { }, credentials: 'include', }); - console.log(response); if (response.ok) { const data = await response.json(); this.cacheTriggeredPending--; From 87e88783db94c0f84a8e34dc8ae62173d812b9af Mon Sep 17 00:00:00 2001 From: sumitd94 Date: Fri, 24 Nov 2023 15:08:05 +0530 Subject: [PATCH 08/13] update unit tests --- app/components/self-clear-cache.hbs | 5 +++ .../components/self-clear-cache-test.js | 32 +++++++++++++++++++ 2 files changed, 37 insertions(+) create mode 100644 tests/integration/components/self-clear-cache-test.js diff --git a/app/components/self-clear-cache.hbs b/app/components/self-clear-cache.hbs index b5afb958..11a80ddf 100644 --- a/app/components/self-clear-cache.hbs +++ b/app/components/self-clear-cache.hbs @@ -1,5 +1,10 @@ {{#if @dev}}
+
+ Last Request: +
+ 24 November, 1:23 PM IST +