From d4fa0a4957b444affafa71fd909158088fff192d Mon Sep 17 00:00:00 2001
From: William Marques <wmarques.pro@gmail.com>
Date: Wed, 14 Sep 2022 16:15:57 +0200
Subject: [PATCH] Disable format button without Prettier applied

---
 .../primary/landscape/Landscape.component.ts    |  5 +++++
 .../app/module/primary/landscape/Landscape.html |  7 ++++++-
 .../primary/modules-patch/ModulesPatch.html     |  7 ++++++-
 .../project-actions/ProjectActions.component.ts |  9 +++++++++
 .../primary/project-actions/ProjectActions.html |  2 +-
 .../landscape/LandscapeComponent.spec.ts        |  4 +++-
 .../ProjectActionsComponent.spec.ts             | 17 ++++++++++++++++-
 7 files changed, 46 insertions(+), 5 deletions(-)

diff --git a/src/main/webapp/app/module/primary/landscape/Landscape.component.ts b/src/main/webapp/app/module/primary/landscape/Landscape.component.ts
index 99b66b53bc6..99a199f4584 100644
--- a/src/main/webapp/app/module/primary/landscape/Landscape.component.ts
+++ b/src/main/webapp/app/module/primary/landscape/Landscape.component.ts
@@ -367,6 +367,10 @@ export default defineComponent({
       operationInProgress.value = false;
     };
 
+    const isApplied = (moduleId: string): boolean => {
+      return landscapeValue().isApplied(new ModuleSlug(moduleId));
+    };
+
     return {
       levels,
       isFeature,
@@ -397,6 +401,7 @@ export default defineComponent({
       applyNewModules,
       operationStarted,
       operationEnded,
+      isApplied,
     };
   },
 });
diff --git a/src/main/webapp/app/module/primary/landscape/Landscape.html b/src/main/webapp/app/module/primary/landscape/Landscape.html
index 3e67d0ac8c9..4ff93b278c2 100644
--- a/src/main/webapp/app/module/primary/landscape/Landscape.html
+++ b/src/main/webapp/app/module/primary/landscape/Landscape.html
@@ -33,7 +33,12 @@
       @propertyDeleted="deleteProperty"
     />
 
-    <ProjectActionsVue :folderPath="folderPath" @operationStarted="operationStarted()" @operationEnded="operationEnded()">
+    <ProjectActionsVue
+      :folderPath="folderPath"
+      :isPrettierButtonEnabled="isApplied('prettier')"
+      @operationStarted="operationStarted()"
+      @operationEnded="operationEnded()"
+    >
       <div class="jhlite-vertical-space--slot">
         <button
           class="jhlite-button -block"
diff --git a/src/main/webapp/app/module/primary/modules-patch/ModulesPatch.html b/src/main/webapp/app/module/primary/modules-patch/ModulesPatch.html
index f57bf778596..409ffc0f7d9 100644
--- a/src/main/webapp/app/module/primary/modules-patch/ModulesPatch.html
+++ b/src/main/webapp/app/module/primary/modules-patch/ModulesPatch.html
@@ -12,7 +12,12 @@
       @propertyDeleted="deleteProperty"
     />
 
-    <ProjectActionsVue :folderPath="folderPath" @operationStarted="operationStarted()" @operationEnded="operationEnded()" />
+    <ProjectActionsVue
+      :folderPath="folderPath"
+      :isPrettierButtonEnabled="true"
+      @operationStarted="operationStarted()"
+      @operationEnded="operationEnded()"
+    />
   </aside>
 
   <div class="jhipster-modules-list">
diff --git a/src/main/webapp/app/module/primary/project-actions/ProjectActions.component.ts b/src/main/webapp/app/module/primary/project-actions/ProjectActions.component.ts
index f362033b8c9..03f802d11bf 100644
--- a/src/main/webapp/app/module/primary/project-actions/ProjectActions.component.ts
+++ b/src/main/webapp/app/module/primary/project-actions/ProjectActions.component.ts
@@ -14,6 +14,10 @@ export default defineComponent({
       type: String,
       required: true,
     },
+    isPrettierButtonEnabled: {
+      type: Boolean,
+      required: true,
+    },
   },
   emits: ['operationStarted', 'operationEnded'],
   setup(props, { emit }) {
@@ -27,6 +31,10 @@ export default defineComponent({
       return operationInProgress.value || empty(props.folderPath);
     };
 
+    const disabledPrettier = (): boolean => {
+      return disabledActions() || !props.isPrettierButtonEnabled;
+    };
+
     const formatProject = (): void => {
       startOperation();
 
@@ -85,6 +93,7 @@ export default defineComponent({
 
     return {
       disabledActions,
+      disabledPrettier,
       formatProject,
       downloadProject,
     };
diff --git a/src/main/webapp/app/module/primary/project-actions/ProjectActions.html b/src/main/webapp/app/module/primary/project-actions/ProjectActions.html
index 480b4fb6cb6..7cd0318f99d 100644
--- a/src/main/webapp/app/module/primary/project-actions/ProjectActions.html
+++ b/src/main/webapp/app/module/primary/project-actions/ProjectActions.html
@@ -7,7 +7,7 @@
         tabindex="5"
         class="jhlite-button -block"
         @click="formatProject()"
-        :disabled="disabledActions()"
+        :disabled="disabledPrettier()"
         data-selector="format-button"
       >
         <IconVue name="code" aria-label="Icon code" />
diff --git a/src/test/javascript/spec/module/primary/landscape/LandscapeComponent.spec.ts b/src/test/javascript/spec/module/primary/landscape/LandscapeComponent.spec.ts
index 187abcf186a..f15ffcf661f 100644
--- a/src/test/javascript/spec/module/primary/landscape/LandscapeComponent.spec.ts
+++ b/src/test/javascript/spec/module/primary/landscape/LandscapeComponent.spec.ts
@@ -370,7 +370,9 @@ describe('Landscape', () => {
       const [appliedModules] = modules.applyAll.lastCall.args as ModulesToApply[];
       expect(appliedModules.modules.map(slug => slug.get())).toEqual(['vue']);
       expect(wrapper.find(wrappedElement('modules-apply-new-button')).attributes('disabled')).toBeDefined();
-
+      const component: any = wrapper.vm;
+      expect(component.isApplied('vue')).toBeTruthy();
+      expect(component.isApplied('angular')).toBeFalsy();
       const [message] = alertBus.success.lastCall.args;
       expect(message).toBe('Modules applied');
     });
diff --git a/src/test/javascript/spec/module/primary/project-actions/ProjectActionsComponent.spec.ts b/src/test/javascript/spec/module/primary/project-actions/ProjectActionsComponent.spec.ts
index 1043f37b741..fdba4a10ded 100644
--- a/src/test/javascript/spec/module/primary/project-actions/ProjectActionsComponent.spec.ts
+++ b/src/test/javascript/spec/module/primary/project-actions/ProjectActionsComponent.spec.ts
@@ -9,6 +9,7 @@ import sinon from 'sinon';
 
 interface WrapperOptions {
   folderPath: string;
+  isPrettierButtonEnabled: boolean;
   modules: ModulesRepository;
 }
 
@@ -16,15 +17,17 @@ const alertBus = stubAlertBus();
 const windowStub = stubWindow();
 
 const wrap = (options?: Partial<WrapperOptions>): VueWrapper => {
-  const { modules, folderPath }: WrapperOptions = {
+  const { modules, folderPath, isPrettierButtonEnabled }: WrapperOptions = {
     folderPath: '/dummy',
     modules: stubModulesRepository(),
+    isPrettierButtonEnabled: true,
     ...options,
   };
 
   return shallowMount(ProjectActionsVue, {
     props: {
       folderPath,
+      isPrettierButtonEnabled,
     },
     global: { provide: { modules, alertBus, globalWindow: windowStub } },
   });
@@ -45,6 +48,18 @@ describe('Project actions', () => {
 
       expect(wrapper.find(wrappedElement('format-button')).attributes('disabled')).toBeDefined();
     });
+
+    it('should disable format button according to prop', async () => {
+      const wrapper = wrap({ isPrettierButtonEnabled: false });
+
+      expect(wrapper.find(wrappedElement('format-button')).attributes('disabled')).toBeDefined();
+    });
+
+    it('should enable format button according to prop', async () => {
+      const wrapper = wrap({ isPrettierButtonEnabled: true });
+
+      expect(wrapper.find(wrappedElement('format-button')).attributes('disabled')).toBeUndefined();
+    });
   });
 
   it('Should format file using repository', async () => {