Fix: address whiteout issue (#123)

* update-create-modal

* update-modal

* fix-lint-issues

* refactor: whiteout issue

Co-authored-by: Laurent Thiebault <[email protected]>

Author: Fernando B

package-lock.json

@@ -11,7 +11,8 @@ <h2 class="text-red" v-if="displayDupError">Oh sorry, you can't have duplicated
           type="text"
           ref="noteName"
           v-model="note.name"
-          placeholder="Your note name">
+          placeholder="Your note name"
+          required>
         </b-input>
       </b-field>
 
@@ -20,7 +21,8 @@ <h2 class="text-red" v-if="displayDupError">Oh sorry, you can't have duplicated
           type="text"
           ref="noteDescription"
           v-model="note.description"
-          placeholder="Your description">
+          placeholder="Your description"
+          required>
         </b-input>
       </b-field>
 
@@ -44,7 +46,8 @@ <h2 class="text-red" v-if="displayDupError">Oh sorry, you can't have duplicated
             style="width: 186px"
             type="text"
             v-model="file.name"
-            placeholder="Your file name">
+            placeholder="Your file name"
+            required>
           </b-input>
           <p class="control is-pulled-right" v-if="files.length > 1">
             <button class="button is-danger" @click="deleteFile(file)">
@@ -55,7 +58,7 @@ <h2 class="text-red" v-if="displayDupError">Oh sorry, you can't have duplicated
 
         <b-field horizontal label="Language">
           <v-select style="width: 186px" label="name" :options="sortedLanguagesByUse" placeholder="Select a language"
-             v-model="file.language" :reduce="selectedLanguage => selectedLanguage.name">
+             v-model="file.language" :reduce="selectedLanguage => selectedLanguage.name" :clearable="false">
              <template v-slot:option="option">
                {{ option.name | capitalize }}
              </template>

src/renderer/components/modals/create-note-modal/CreateNoteModal.html

@@ -111,7 +111,18 @@ export default {
   computed: {
     ...mapGetters(['gistsSelected', 'notes']),
     isDisabled() {
-      return this.files.some(file => !/\S/.test(file.content));
+      const isGistDisabled = () => (
+        !/\S/.test(this.note.description) ||
+        this.files.some(file => !/\S/.test(file.name)) ||
+        this.files.some(file => !/\S/.test(file.language)) ||
+        this.files.some(file => !/\S/.test(file.content))
+      );
+
+      const isNoteDisabled = () => (
+        isGistDisabled() || !/\S/.test(this.note.name)
+      );
+
+      return this.gistsSelected ? isGistDisabled() : isNoteDisabled();
     },
     sortedLanguagesByUse() {
       this.languages.forEach((language) => { language.frequency = 0; });

src/renderer/components/modals/create-note-modal/CreateNoteModal.vue

@@ -21,7 +21,8 @@ <h2 class="text-red" v-if="displayDupError">Oh sorry, you can't have duplicated
           type="text"
           ref="noteDescription"
           v-model="noteUpdated.description"
-          placeholder="Your description">
+          placeholder="Your description"
+          required>
         </b-input>
       </b-field>
 
@@ -38,7 +39,8 @@ <h2 class="text-red" v-if="displayDupError">Oh sorry, you can't have duplicated
             style="width: 186px"
             type="text"
             v-model="file.name"
-            placeholder="Your file name">
+            placeholder="Your file name"
+            required>
           </b-input>
           <p class="control is-pulled-right" v-if="files.length > 1">
             <button class="button is-danger" @click="deleteFile(file)">
@@ -48,7 +50,7 @@ <h2 class="text-red" v-if="displayDupError">Oh sorry, you can't have duplicated
         </b-field>
 
         <b-field horizontal label="Language">
-          <b-select placeholder="Select a language" v-model="file.language">
+          <b-select placeholder="Select a language" v-model="file.language" :clearable="false">
             <option
               v-for="language in languages"
               :value="language.name">

src/renderer/components/modals/update-note-modal/UpdateNoteModal.html

@@ -135,7 +135,18 @@ export default {
   computed: {
     ...mapGetters(['gistsSelected']),
     isDisabled() {
-      return this.files.some(file => !/\S/.test(file.content));
+      const isGistDisabled = () => (
+        !/\S/.test(this.noteUpdated.description) ||
+        this.files.some(file => !/\S/.test(file.name)) ||
+        this.files.some(file => !/\S/.test(file.language)) ||
+        this.files.some(file => !/\S/.test(file.content))
+      );
+
+      const isNoteDisabled = () => (
+        isGistDisabled() || !/\S/.test(this.noteUpdated.name)
+      );
+
+      return this.gistsSelected ? isGistDisabled() : isNoteDisabled();
     },
   },
 };